From f293a1ed30b0125619275195de161b2a20df7d3b Mon Sep 17 00:00:00 2001 From: Sujal Choudhari Date: Wed, 9 Aug 2023 18:49:57 +0530 Subject: [PATCH 1/4] Fixed #181 --- src/components/OfflineIndicator.jsx | 2 +- .../styled/views/Catalog.styled.jsx | 15 +- src/components/views/AllCatalog.jsx | 8 +- src/components/views/SubscriptionsCatalog.jsx | 463 +++++++++--------- 4 files changed, 255 insertions(+), 233 deletions(-) diff --git a/src/components/OfflineIndicator.jsx b/src/components/OfflineIndicator.jsx index 3630a222..8f3deec2 100644 --- a/src/components/OfflineIndicator.jsx +++ b/src/components/OfflineIndicator.jsx @@ -7,7 +7,7 @@ const OfflineIndicator = ({ address, className, tooltipPlace }) => { return ( <> - {!isOnline && ( + {true && ( <> {" "} { ) : null} ) : null} -
+
{(commentMediaInfo && ( commentMediaInfo.type === 'image' || commentMediaInfo.type === 'video' || @@ -386,7 +390,7 @@ const AllCatalog = () => { commentMediaInfo.thumbnail))) ? ( ) : ( { const [moderatorPermissions, setModeratorPermissions] = useState({}); const [isCreateBoardOpen, setIsCreateBoardOpen] = useState(false); - const { feed, hasMore, loadMore } = useFeed({subplebbitAddresses: account?.subscriptions, sortType: 'active'}); + const { feed, hasMore, loadMore } = useFeed({ subplebbitAddresses: account?.subscriptions, sortType: 'active' }); const [selectedFeed, setSelectedFeed] = useState(feed.sort((a, b) => b.timestamp - a.timestamp)); - const {subplebbits} = useSubplebbits({subplebbitAddresses: account?.subscriptions, sortType: 'active'}); + const { subplebbits } = useSubplebbits({ subplebbitAddresses: account?.subscriptions, sortType: 'active' }); const stateString = useFeedStateString(subplebbits); @@ -87,13 +87,13 @@ const SubscriptionsCatalog = () => { useEffect(() => { let permissions = {}; - + selectedFeed.forEach(thread => { const subplebbit = subplebbits.find(s => s && s.address === thread.subplebbitAddress); - - if (subplebbit && subplebbit.roles) { + + if (subplebbit && subplebbit.roles) { const role = subplebbit.roles[account?.author.address]?.role; - + if (role === 'moderator' || role === 'admin' || role === 'owner') { permissions[thread.subplebbitAddress] = true; } else { @@ -101,9 +101,9 @@ const SubscriptionsCatalog = () => { } } }); - + setModeratorPermissions(permissions); - }, [account?.author.address, selectedFeed, subplebbits]); + }, [account?.author.address, selectedFeed, subplebbits]); // mobile navbar scroll effect @@ -113,17 +113,17 @@ const SubscriptionsCatalog = () => { setVisible(prevScrollPos > currentScrollPos || currentScrollPos < 10); setPrevScrollPos(currentScrollPos); }, 50); - + window.addEventListener('scroll', debouncedHandleScroll); - + return () => window.removeEventListener('scroll', debouncedHandleScroll); }, [prevScrollPos, visible]); const onChallengeVerification = (challengeVerification) => { if (challengeVerification.challengeSuccess === true) { - setNewSuccessMessage('Challenge Success'); - } + setNewSuccessMessage('Challenge Success'); + } else if (challengeVerification.challengeSuccess === false) { setNewErrorMessage(`Challenge Failed, reason: ${challengeVerification.reason}. Errors: ${challengeVerification.errors}`); console.log('challenge failed', challengeVerification); @@ -147,16 +147,16 @@ const SubscriptionsCatalog = () => { const getChallengeAnswersFromUser = async (challenges) => { setChallengesArray(challenges); - + return new Promise((resolve, reject) => { const imageString = challenges?.challenges[0].challenge; const imageSource = `data:image/png;base64,${imageString}`; const challengeImg = new Image(); challengeImg.src = imageSource; - + challengeImg.onload = () => { setIsCaptchaOpen(true); - + const handleKeyDown = async (event) => { if (event.key === 'Enter') { const currentCaptchaResponse = useGeneralStore.getState().captchaResponse; @@ -172,7 +172,7 @@ const SubscriptionsCatalog = () => { setResolveCaptchaPromise(resolve); }; - + challengeImg.onerror = () => { reject(setNewErrorMessage('Could not load challenges')); }; @@ -189,8 +189,8 @@ const SubscriptionsCatalog = () => { setNewErrorMessage(error.message); console.log(error); }, }); - - + + const { publishCommentEdit } = usePublishCommentEdit(publishCommentEditOptions); @@ -209,7 +209,7 @@ const SubscriptionsCatalog = () => { } }, [editedComment, setIsAuthorEdit]); - + useEffect(() => { let isActive = true; if (publishCommentEditOptions && triggerPublishCommentEdit) { @@ -252,13 +252,13 @@ const SubscriptionsCatalog = () => { }; - const CatalogPost = ({post}) => { + const CatalogPost = ({ post }) => { const thread = post; const commentMediaInfo = getCommentMediaInfo(thread); const linkCount = countLinks(thread); const fallbackImgUrl = "assets/filedeleted-res.gif"; const [isHoveringOnThread, setIsHoveringOnThread] = useState(false); - const [menuPosition, setMenuPosition] = useState({top: 0, left: 0}); + const [menuPosition, setMenuPosition] = useState({ top: 0, left: 0 }); const [openMenuCid, setOpenMenuCid] = useState(null); const isModerator = moderatorPermissions[thread.subplebbitAddress]; @@ -271,14 +271,14 @@ const SubscriptionsCatalog = () => { const handleOptionClick = () => { setOpenMenuCid(null); }; - + useEffect(() => { if (openMenuCid !== null) { document.addEventListener('click', handleOutsideClick); } else { document.removeEventListener('click', handleOutsideClick); } - + return () => { document.removeEventListener('click', handleOutsideClick); }; @@ -286,7 +286,7 @@ const SubscriptionsCatalog = () => { const handleAuthorDeleteClick = (comment) => { handleOptionClick(comment.cid); - + confirmAlert({ customUI: ({ onClose }) => { return ( @@ -318,8 +318,8 @@ const SubscriptionsCatalog = () => { } }); }; - - + + const handleAuthorEditClick = (comment) => { handleOptionClick(comment.cid); setIsAuthorEdit(true); @@ -330,63 +330,68 @@ const SubscriptionsCatalog = () => { } return ( -
{setIsHoveringOnThread(thread.cid)}} - onMouseLeave={() => {setIsHoveringOnThread('')}}> +
{ setIsHoveringOnThread(thread.cid) }} + onMouseLeave={() => { setIsHoveringOnThread('') }}> {commentMediaInfo?.url ? ( - setSelectedThread(thread.cid)}> + setSelectedThread(thread.cid)}> {commentMediaInfo?.type === "webpage" ? ( thread.thumbnailUrl ? ( - {commentMediaInfo.type} { - e.target.src = fallbackImgUrl - e.target.onerror = null; - }} /> + {commentMediaInfo.type} { + e.target.src = fallbackImgUrl + e.target.onerror = null; + }} /> ) : null ) : null} {commentMediaInfo?.type === "image" ? ( {commentMediaInfo.type} { - e.target.src = fallbackImgUrl - e.target.onerror = null;}} /> + src={commentMediaInfo.url} alt={commentMediaInfo.type} + onError={(e) => { + e.target.src = fallbackImgUrl + e.target.onerror = null; + }} /> ) : null} {commentMediaInfo?.type === "video" ? ( -
@@ -643,7 +652,7 @@ const SubscriptionsCatalog = () => {
- <> + <>
Subscriptions
{account?.subscriptions.length < 1 ? (
You haven't subscribed to any board yet.
@@ -652,7 +661,7 @@ const SubscriptionsCatalog = () => { You have subscribed to {account?.subscriptions.length} board{account?.subscriptions.length > 1 ? "s" : null}.
)} - + @@ -660,7 +669,7 @@ const SubscriptionsCatalog = () => {
Style: -   + @@ -733,40 +742,40 @@ const SubscriptionsCatalog = () => { - <> - - [ + <> + + [ window.scrollTo(0, 0)}>Subscriptions - ] [ - {defaultSubplebbits.map((subplebbit, index) => ( - - {index === 0 ? null : "\u00a0"} - handleClickTitle(subplebbit.title, subplebbit.address)} - >{subplebbit.title ? subplebbit.title : subplebbit.address} - {index !== defaultSubplebbits.length - 1 ? " /" : null} - - ))} - ] - + ] [ + {defaultSubplebbits.map((subplebbit, index) => ( + + {index === 0 ? null : "\u00a0"} + handleClickTitle(subplebbit.title, subplebbit.address)} + >{subplebbit.title ? subplebbit.title : subplebbit.address} + {index !== defaultSubplebbits.length - 1 ? " /" : null} + + ))} + ] + - [ - { - window.electron && window.electron.isElectron ? ( - setIsCreateBoardOpen(true) - ) : ( - alert( - 'You can create a board with the desktop version of plebchan:\nhttps://github.com/plebbit/plebchan/releases/latest\n\nIf you are comfortable with the command line, use plebbit-cli:\nhttps://github.com/plebbit/plebbit-cli\n\n' - ) - ) - } - }>Create Board - ] + [ + { + window.electron && window.electron.isElectron ? ( + setIsCreateBoardOpen(true) + ) : ( + alert( + 'You can create a board with the desktop version of plebchan:\nhttps://github.com/plebbit/plebchan/releases/latest\n\nIf you are comfortable with the command line, use plebbit-cli:\nhttps://github.com/plebbit/plebbit-cli\n\n' + ) + ) + } + }>Create Board + ] [ setIsSettingsOpen(true)}>Settings ] [ - handleStyleChange({target: {value: "Yotsuba"}} + handleStyleChange({ target: { value: "Yotsuba" } } )}>Home ] @@ -783,13 +792,13 @@ const SubscriptionsCatalog = () => { marginTop: "5px", marginBottom: "15px", }}> - About -  •  - App + About  •  - Twitter -  •  - Telegram + App +  •  + Twitter +  •  + Telegram
From c2e53f03b191675ba352928c8723f791d1ceb082 Mon Sep 17 00:00:00 2001 From: Sujal Choudhari Date: Wed, 9 Aug 2023 18:51:07 +0530 Subject: [PATCH 2/4] Reverted Undesired Changes --- src/components/OfflineIndicator.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/OfflineIndicator.jsx b/src/components/OfflineIndicator.jsx index 8f3deec2..3630a222 100644 --- a/src/components/OfflineIndicator.jsx +++ b/src/components/OfflineIndicator.jsx @@ -7,7 +7,7 @@ const OfflineIndicator = ({ address, className, tooltipPlace }) => { return ( <> - {true && ( + {!isOnline && ( <> {" "} Date: Wed, 9 Aug 2023 19:58:24 +0530 Subject: [PATCH 3/4] Updated as per requirnments --- .../styled/views/Catalog.styled.jsx | 25 +- src/components/views/AllCatalog.jsx | 472 +++++++++--------- src/components/views/SubscriptionsCatalog.jsx | 10 +- 3 files changed, 252 insertions(+), 255 deletions(-) diff --git a/src/components/styled/views/Catalog.styled.jsx b/src/components/styled/views/Catalog.styled.jsx index 1a0d3f01..4d5cfa96 100644 --- a/src/components/styled/views/Catalog.styled.jsx +++ b/src/components/styled/views/Catalog.styled.jsx @@ -32,22 +32,13 @@ export const Threads = styled.div` .thread-icons { display: inline; - width: 100px; height: 16px; - position:absolute; - margin: 6px 60px 0 0px; + margin: 2px 0 0 -101px; + position: absolute; + width: 100px; text-align: right; - top:0; - right:0; - z-index:4; } - .thread-icon-has-display{ - transform: translate(68px, -4px); - scale: 0.8; - } - - .offline-icon { height: 16px; margin: 2px; @@ -60,6 +51,16 @@ export const Threads = styled.div` margin-top: -2px; } + .offline-icon-no-link-shifted { + height: 11px; + position: absolute; + margin-left: 35px; + margin-top: -2px; + } + + .offline-icon-no-link-hovered { + transform: translate(16px,0); + } .sticky-icon { background-image: url(assets/sticky.gif); width: 16px; diff --git a/src/components/views/AllCatalog.jsx b/src/components/views/AllCatalog.jsx index 45a60da0..e47ef8c9 100755 --- a/src/components/views/AllCatalog.jsx +++ b/src/components/views/AllCatalog.jsx @@ -1,7 +1,7 @@ import React, { useCallback, useEffect, useRef, useState } from 'react'; import { createPortal } from 'react-dom'; import { Helmet } from 'react-helmet-async'; -import { Link, useNavigate} from 'react-router-dom'; +import { Link, useNavigate } from 'react-router-dom'; import { confirmAlert } from 'react-confirm-alert'; import { Tooltip } from 'react-tooltip'; import { Virtuoso } from 'react-virtuoso'; @@ -28,7 +28,7 @@ import useSuccess from '../../hooks/useSuccess'; import useWindowWidth from '../../hooks/useWindowWidth'; import useGeneralStore from '../../hooks/stores/useGeneralStore'; import packageJson from '../../../package.json' -const {version} = packageJson +const { version } = packageJson let lastVirtuosoStates = {} @@ -50,7 +50,7 @@ const AllCatalog = () => { setSelectedThread, setSelectedTitle, } = useGeneralStore(state => state); - + const threadMenuRefs = useRef({}); const postMenuRef = useRef(null); @@ -61,7 +61,7 @@ const AllCatalog = () => { const navigate = useNavigate(); const [, setNewErrorMessage] = useError(); const [, setNewSuccessMessage] = useSuccess(); - + const [prevScrollPos, setPrevScrollPos] = useState(0); const [visible, setVisible] = useState(true); @@ -75,8 +75,8 @@ const AllCatalog = () => { const [isCreateBoardOpen, setIsCreateBoardOpen] = useState(false); const addresses = defaultSubplebbits.map(subplebbit => subplebbit.address); - const { feed, hasMore, loadMore } = useFeed({subplebbitAddresses: addresses, sortType: 'active'}); - const {subplebbits} = useSubplebbits({subplebbitAddresses: addresses, sortType: 'active'}); + const { feed, hasMore, loadMore } = useFeed({ subplebbitAddresses: addresses, sortType: 'active' }); + const { subplebbits } = useSubplebbits({ subplebbitAddresses: addresses, sortType: 'active' }); const [selectedFeed, setSelectedFeed] = useState(feed.sort((a, b) => b.timestamp - a.timestamp)); const stateString = useFeedStateString(subplebbits); @@ -89,13 +89,13 @@ const AllCatalog = () => { useEffect(() => { let permissions = {}; - + selectedFeed.forEach(thread => { const subplebbit = subplebbits.find(s => s && s.address === thread.subplebbitAddress); - - if (subplebbit && subplebbit.roles) { + + if (subplebbit && subplebbit.roles) { const role = subplebbit.roles[account?.author.address]?.role; - + if (role === 'moderator' || role === 'admin' || role === 'owner') { permissions[thread.subplebbitAddress] = true; } else { @@ -103,9 +103,9 @@ const AllCatalog = () => { } } }); - + setModeratorPermissions(permissions); - }, [account?.author.address, selectedFeed, subplebbits]); + }, [account?.author.address, selectedFeed, subplebbits]); // mobile navbar scroll effect @@ -115,24 +115,23 @@ const AllCatalog = () => { setVisible(prevScrollPos > currentScrollPos || currentScrollPos < 10); setPrevScrollPos(currentScrollPos); }, 50); - + window.addEventListener('scroll', debouncedHandleScroll); - + return () => window.removeEventListener('scroll', debouncedHandleScroll); }, [prevScrollPos, visible]); const tryLoadMore = async () => { - try {loadMore()} - catch (e) - {await new Promise(resolve => setTimeout(resolve, 1000))} + try { loadMore() } + catch (e) { await new Promise(resolve => setTimeout(resolve, 1000)) } }; const onChallengeVerification = (challengeVerification) => { if (challengeVerification.challengeSuccess === true) { - setNewSuccessMessage('Challenge Success'); - } + setNewSuccessMessage('Challenge Success'); + } else if (challengeVerification.challengeSuccess === false) { setNewErrorMessage(`Challenge Failed, reason: ${challengeVerification.reason}. Errors: ${challengeVerification.errors}`); console.log('challenge failed', challengeVerification); @@ -156,16 +155,16 @@ const AllCatalog = () => { const getChallengeAnswersFromUser = async (challenges) => { setChallengesArray(challenges); - + return new Promise((resolve, reject) => { const imageString = challenges?.challenges[0].challenge; const imageSource = `data:image/png;base64,${imageString}`; const challengeImg = new Image(); challengeImg.src = imageSource; - + challengeImg.onload = () => { setIsCaptchaOpen(true); - + const handleKeyDown = async (event) => { if (event.key === 'Enter') { const currentCaptchaResponse = useGeneralStore.getState().captchaResponse; @@ -181,7 +180,7 @@ const AllCatalog = () => { setResolveCaptchaPromise(resolve); }; - + challengeImg.onerror = () => { reject(setNewErrorMessage('Could not load challenges')); }; @@ -198,11 +197,11 @@ const AllCatalog = () => { setNewErrorMessage(error.message); console.log(error); }, }); - - + + const { publishCommentEdit } = usePublishCommentEdit(publishCommentEditOptions); - + useEffect(() => { setPublishCommentEditOptions((prevOptions) => ({ ...prevOptions, @@ -218,7 +217,7 @@ const AllCatalog = () => { } }, [editedComment, setIsAuthorEdit]); - + useEffect(() => { let isActive = true; if (publishCommentEditOptions && triggerPublishCommentEdit) { @@ -262,13 +261,13 @@ const AllCatalog = () => { }; - const CatalogPost = ({post}) => { + const CatalogPost = ({ post }) => { const thread = post; const commentMediaInfo = getCommentMediaInfo(thread); const linkCount = countLinks(thread); const fallbackImgUrl = "assets/filedeleted-res.gif"; const [isHoveringOnThread, setIsHoveringOnThread] = useState(false); - const [menuPosition, setMenuPosition] = useState({top: 0, left: 0}); + const [menuPosition, setMenuPosition] = useState({ top: 0, left: 0 }); const [openMenuCid, setOpenMenuCid] = useState(null); const isModerator = moderatorPermissions[thread.subplebbitAddress]; @@ -281,14 +280,14 @@ const AllCatalog = () => { const handleOptionClick = () => { setOpenMenuCid(null); }; - + useEffect(() => { if (openMenuCid !== null) { document.addEventListener('click', handleOutsideClick); } else { document.removeEventListener('click', handleOutsideClick); } - + return () => { document.removeEventListener('click', handleOutsideClick); }; @@ -296,7 +295,7 @@ const AllCatalog = () => { const handleAuthorDeleteClick = (comment) => { handleOptionClick(comment.cid); - + confirmAlert({ customUI: ({ onClose }) => { return ( @@ -328,8 +327,8 @@ const AllCatalog = () => { } }); }; - - + + const handleAuthorEditClick = (comment) => { handleOptionClick(comment.cid); setIsAuthorEdit(true); @@ -340,67 +339,64 @@ const AllCatalog = () => { } return ( -
{setIsHoveringOnThread(thread.cid)}} - onMouseLeave={() => {setIsHoveringOnThread('')}}> +
{ setIsHoveringOnThread(thread.cid) }} + onMouseLeave={() => { setIsHoveringOnThread('') }}> {commentMediaInfo?.url ? ( - setSelectedThread(thread.cid)}> + setSelectedThread(thread.cid)}> {commentMediaInfo?.type === "webpage" ? ( thread.thumbnailUrl ? ( - {commentMediaInfo.type} { - e.target.src = fallbackImgUrl - e.target.onerror = null; - }} /> + {commentMediaInfo.type} { + e.target.src = fallbackImgUrl + e.target.onerror = null; + }} /> ) : null ) : null} {commentMediaInfo?.type === "image" ? ( {commentMediaInfo.type} { - e.target.src = fallbackImgUrl - e.target.onerror = null;}} /> + src={commentMediaInfo.url} alt={commentMediaInfo.type} + onError={(e) => { + e.target.src = fallbackImgUrl + e.target.onerror = null; + }} /> ) : null} {commentMediaInfo?.type === "video" ? ( -
@@ -666,7 +666,7 @@ const AllCatalog = () => {
Style: -   + @@ -739,42 +739,42 @@ const AllCatalog = () => { - <> - - [ + <> + + [ window.scrollTo(0, 0)}>All -  /  + / window.scrollTo(0, 0)}>Subscriptions - ] [ - {defaultSubplebbits.map((subplebbit, index) => ( - - {index === 0 ? null : "\u00a0"} - handleClickTitle(subplebbit.title, subplebbit.address)} - >{subplebbit.title ? subplebbit.title : subplebbit.address} - {index !== defaultSubplebbits.length - 1 ? " /" : null} - - ))} - ] - + ] [ + {defaultSubplebbits.map((subplebbit, index) => ( + + {index === 0 ? null : "\u00a0"} + handleClickTitle(subplebbit.title, subplebbit.address)} + >{subplebbit.title ? subplebbit.title : subplebbit.address} + {index !== defaultSubplebbits.length - 1 ? " /" : null} + + ))} + ] + - [ - { - window.electron && window.electron.isElectron ? ( - setIsCreateBoardOpen(true) - ) : ( - alert( - 'You can create a board with the desktop version of plebchan:\nhttps://github.com/plebbit/plebchan/releases/latest\n\nIf you are comfortable with the command line, use plebbit-cli:\nhttps://github.com/plebbit/plebbit-cli\n\n' - ) - ) - } - }>Create Board - ] + [ + { + window.electron && window.electron.isElectron ? ( + setIsCreateBoardOpen(true) + ) : ( + alert( + 'You can create a board with the desktop version of plebchan:\nhttps://github.com/plebbit/plebchan/releases/latest\n\nIf you are comfortable with the command line, use plebbit-cli:\nhttps://github.com/plebbit/plebbit-cli\n\n' + ) + ) + } + }>Create Board + ] [ setIsSettingsOpen(true)}>Settings ] [ - handleStyleChange({target: {value: "Yotsuba"}} + handleStyleChange({ target: { value: "Yotsuba" } } )}>Home ] @@ -791,13 +791,13 @@ const AllCatalog = () => { marginTop: "5px", marginBottom: "15px", }}> - About -  •  - App + About  •  - Twitter -  •  - Telegram + App +  •  + Twitter +  •  + Telegram
diff --git a/src/components/views/SubscriptionsCatalog.jsx b/src/components/views/SubscriptionsCatalog.jsx index 5b6a805e..0ed1316a 100755 --- a/src/components/views/SubscriptionsCatalog.jsx +++ b/src/components/views/SubscriptionsCatalog.jsx @@ -369,11 +369,7 @@ const SubscriptionsCatalog = () => { ) : null} ) : null} -
+
{(commentMediaInfo && ( commentMediaInfo.type === 'image' || commentMediaInfo.type === 'video' || @@ -381,12 +377,12 @@ const SubscriptionsCatalog = () => { commentMediaInfo.thumbnail))) ? ( ) : ( 0?"offline-icon-no-link-shifted": "offline-icon-no-link"} ${isHoveringOnThread === thread.cid ? 'offline-icon-no-link-hovered' : ''}`} tooltipPlace="top" /> )}
From 96fc945257e8b739047622e7fcc181ce04ba69fe Mon Sep 17 00:00:00 2001 From: "plebeius.eth" Date: Wed, 9 Aug 2023 20:53:53 +0200 Subject: [PATCH 4/4] add changes --- src/components/views/AllCatalog.jsx | 2 +- src/components/views/SubscriptionsCatalog.jsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/views/AllCatalog.jsx b/src/components/views/AllCatalog.jsx index 8cace4a8..526eb6f3 100755 --- a/src/components/views/AllCatalog.jsx +++ b/src/components/views/AllCatalog.jsx @@ -317,7 +317,7 @@ const CatalogPost = ({post}) => { ) : ( 0 ? "offline-icon-no-link-shifted" : "offline-icon-no-link"} ${isHoveringOnThread === thread.cid ? 'offline-icon-no-link-hovered' : ''}`} tooltipPlace="top" /> )}
diff --git a/src/components/views/SubscriptionsCatalog.jsx b/src/components/views/SubscriptionsCatalog.jsx index ca8b70dc..85bef845 100755 --- a/src/components/views/SubscriptionsCatalog.jsx +++ b/src/components/views/SubscriptionsCatalog.jsx @@ -317,7 +317,7 @@ const CatalogPost = ({post}) => { ) : ( 0?"offline-icon-no-link-shifted": "offline-icon-no-link"} ${isHoveringOnThread === thread.cid ? 'offline-icon-no-link-hovered' : ''}`} tooltipPlace="top" /> )}