diff --git a/src/components/post-desktop/post-desktop.tsx b/src/components/post-desktop/post-desktop.tsx index e0071e3d..f9c1c6b4 100644 --- a/src/components/post-desktop/post-desktop.tsx +++ b/src/components/post-desktop/post-desktop.tsx @@ -65,7 +65,7 @@ const PostInfo = ({ post, postReplyCount = 0, roles, isHidden }: PostProps) => { const { imageUrl: avatarImageUrl } = useAuthorAvatar({ author }); const { hideAvatars } = useAvatarVisibilityStore(); const defaultSubplebbits = useDefaultSubplebbits(); - const boardPath = subplebbitAddress ? getBoardPath(subplebbitAddress, defaultSubplebbits) : ''; + const boardPath = subplebbitAddress ? getBoardPath(subplebbitAddress, defaultSubplebbits) : undefined; const params = useParams(); const location = useLocation(); @@ -166,7 +166,7 @@ const PostInfo = ({ post, postReplyCount = 0, roles, isHidden }: PostProps) => { {isDescription || isRules ? '' : ' '} - {subplebbitAddress && (isInAllView || isInSubscriptionsView) && !isReply && ( + {subplebbitAddress && (isInAllView || isInSubscriptionsView) && !isReply && boardPath && ( {' '} p/{subplebbitAddress && Plebbit.getShortAddress(subplebbitAddress)}{' '} @@ -175,7 +175,12 @@ const PostInfo = ({ post, postReplyCount = 0, roles, isHidden }: PostProps) => { {!(isDescription || isRules) && (cid ? ( - !cid && e.preventDefault()}> + !cid && e.preventDefault()} + > c/ @@ -204,7 +209,13 @@ const PostInfo = ({ post, postReplyCount = 0, roles, isHidden }: PostProps) => { [ !cid && !isDescription && !isRules && e.preventDefault()} > {_.capitalize(t('reply'))} @@ -319,9 +330,11 @@ const Reply = ({ postReplyCount, reply, roles }: PostProps) => { const { author, cid, deleted, link, linkHeight, linkWidth, postCid, reason, removed, spoiler, subplebbitAddress, thumbnailUrl, parentCid } = post || {}; const { isDescription, isRules } = post || {}; // custom properties, not from api const defaultSubplebbits = useDefaultSubplebbits(); - const boardPath = subplebbitAddress ? getBoardPath(subplebbitAddress, defaultSubplebbits) : ''; + const boardPath = subplebbitAddress ? getBoardPath(subplebbitAddress, defaultSubplebbits) : undefined; - const isRouteLinkToReply = useLocation().pathname.startsWith(`/${boardPath}/thread/${cid}`); + const location = useLocation(); + const route = boardPath ? `/${boardPath}/thread/${cid}` : `/thread/${cid}`; + const isRouteLinkToReply = cid ? location.pathname.startsWith(route) : false; const { hidden } = useHide({ cid }); const commentMediaInfo = useCommentMediaInfo(link, thumbnailUrl, linkWidth, linkHeight); @@ -361,7 +374,7 @@ const PostDesktop = ({ post, roles, showAllReplies, showReplies = true }: PostPr const isInPendingPostView = isPendingPostView(location.pathname, params); const isInPostPageView = isPostPageView(location.pathname, params); const defaultSubplebbits = useDefaultSubplebbits(); - const boardPath = subplebbitAddress ? getBoardPath(subplebbitAddress, defaultSubplebbits) : ''; + const boardPath = subplebbitAddress ? getBoardPath(subplebbitAddress, defaultSubplebbits) : undefined; const { hidden, unhide, hide } = useHide({ cid }); const isHidden = hidden && !isInPostPageView; @@ -438,14 +451,14 @@ const PostDesktop = ({ post, roles, showAllReplies, showReplies = true }: PostPr }} + components={{ 1: }} values={{ repliesCount, linksCount }} /> ) : ( }} + components={{ 1: }} values={{ repliesCount }} /> )} diff --git a/src/components/post-mobile/post-mobile.tsx b/src/components/post-mobile/post-mobile.tsx index 2a44f53a..11aa7893 100644 --- a/src/components/post-mobile/post-mobile.tsx +++ b/src/components/post-mobile/post-mobile.tsx @@ -51,7 +51,7 @@ const PostInfoAndMedia = ({ post, postReplyCount = 0, roles }: PostProps) => { timestamp, thumbnailUrl, } = post || {}; - const boardPath = subplebbitAddress ? getBoardPath(subplebbitAddress, defaultSubplebbits) : ''; + const boardPath = subplebbitAddress ? getBoardPath(subplebbitAddress, defaultSubplebbits) : undefined; const isReply = parentCid; const title = post?.title?.trim(); const { isDescription, isRules } = post || {}; // custom properties, not from api @@ -175,7 +175,7 @@ const PostInfoAndMedia = ({ post, postReplyCount = 0, roles }: PostProps) => { )} - {subplebbitAddress && (isInAllView || isInSubscriptionsView) && !isReply && ( + {subplebbitAddress && (isInAllView || isInSubscriptionsView) && !isReply && boardPath && (
{' '} p/{subplebbitAddress && Plebbit.getShortAddress(subplebbitAddress)} @@ -185,7 +185,12 @@ const PostInfoAndMedia = ({ post, postReplyCount = 0, roles }: PostProps) => { {!(isDescription || isRules) && (cid ? ( - !cid && e.preventDefault()}> + !cid && e.preventDefault()} + > c/ @@ -264,8 +269,10 @@ const Reply = ({ postReplyCount, reply, roles }: PostProps) => { } const { author, cid, deleted, postCid, reason, removed, subplebbitAddress } = post || {}; const defaultSubplebbits = useDefaultSubplebbits(); - const boardPath = subplebbitAddress ? getBoardPath(subplebbitAddress, defaultSubplebbits) : ''; - const isRouteLinkToReply = useLocation().pathname.startsWith(`/${boardPath}/thread/${cid}`); + const boardPath = subplebbitAddress ? getBoardPath(subplebbitAddress, defaultSubplebbits) : undefined; + const location = useLocation(); + const route = boardPath ? `/${boardPath}/thread/${cid}` : `/thread/${cid}`; + const isRouteLinkToReply = cid ? location.pathname.startsWith(route) : false; const { hidden } = useHide({ cid }); return ( @@ -296,7 +303,7 @@ const PostMobile = ({ post, roles, showAllReplies, showReplies = true }: PostPro const isInPendingPostView = isPendingPostView(location.pathname, params); const isInPostView = isPostPageView(location.pathname, params); const defaultSubplebbits = useDefaultSubplebbits(); - const boardPath = subplebbitAddress ? getBoardPath(subplebbitAddress, defaultSubplebbits) : ''; + const boardPath = subplebbitAddress ? getBoardPath(subplebbitAddress, defaultSubplebbits) : undefined; const linksCount = useCountLinksInReplies(post); const replies = useReplies(post); @@ -353,7 +360,13 @@ const PostMobile = ({ post, roles, showAllReplies, showReplies = true }: PostPro {linksCount > 0 && ` / ${linksCount} Links`} {t('view_thread')} diff --git a/src/components/reply-quote-preview/reply-quote-preview.tsx b/src/components/reply-quote-preview/reply-quote-preview.tsx index 929dd8e8..c02b4e3b 100644 --- a/src/components/reply-quote-preview/reply-quote-preview.tsx +++ b/src/components/reply-quote-preview/reply-quote-preview.tsx @@ -131,11 +131,14 @@ const DesktopQuotePreview = ({ backlinkReply, quotelinkReply, isBacklinkReply, i setOutOfViewCid(null); }; + const backlinkBoardPath = backlinkReply?.subplebbitAddress ? getBoardPath(backlinkReply.subplebbitAddress, defaultSubplebbits) : undefined; + const backlinkRoute = backlinkReply?.cid ? (backlinkBoardPath ? `/${backlinkBoardPath}/thread/${backlinkReply.cid}` : `/thread/${backlinkReply.cid}`) : '#'; + const replyBacklink = ( <> handleMouseOver(backlinkReply?.cid)} onMouseLeave={() => handleMouseLeave(backlinkReply?.cid)} @@ -159,10 +162,13 @@ const DesktopQuotePreview = ({ backlinkReply, quotelinkReply, isBacklinkReply, i const { getThreadSigner } = useAnonModeStore(); const threadSigner = quotelinkReply?.postCid ? getThreadSigner(quotelinkReply?.postCid) : null; + const quotelinkBoardPath = quotelinkReply?.subplebbitAddress ? getBoardPath(quotelinkReply.subplebbitAddress, defaultSubplebbits) : undefined; + const quotelinkRoute = quotelinkReply?.cid ? (quotelinkBoardPath ? `/${quotelinkBoardPath}/thread/${quotelinkReply.cid}` : `/thread/${quotelinkReply.cid}`) : '#'; + const replyQuotelink = ( <> handleMouseOver(quotelinkReply?.cid)} @@ -250,16 +256,17 @@ const MobileQuotePreview = ({ backlinkReply, quotelinkReply, isBacklinkReply, is > {backlinkReply?.shortCid && `>>${backlinkReply?.shortCid}`} - {backlinkReply?.shortCid && ( - handleClick(e, backlinkReply?.cid, backlinkReply?.subplebbitAddress)} - > - {' '} - # - - )} + {backlinkReply?.shortCid && + (() => { + const backlinkBoardPath = backlinkReply?.subplebbitAddress ? getBoardPath(backlinkReply.subplebbitAddress, defaultSubplebbits) : undefined; + const backlinkRoute = backlinkReply?.cid ? (backlinkBoardPath ? `/${backlinkBoardPath}/thread/${backlinkReply.cid}` : `/thread/${backlinkReply.cid}`) : '#'; + return ( + handleClick(e, backlinkReply?.cid, backlinkReply?.subplebbitAddress)}> + {' '} + # + + ); + })()} {hoveredCid === backlinkReply?.cid && outOfViewCid === backlinkReply?.cid && createPortal( @@ -286,16 +293,21 @@ const MobileQuotePreview = ({ backlinkReply, quotelinkReply, isBacklinkReply, is {quotelinkReply?.shortCid && `>>${quotelinkReply?.shortCid}`} {(quotelinkReply?.author?.address === account?.author?.address || quotelinkReply?.author?.address === threadSigner?.address) && ' (You)'} - {quotelinkReply?.shortCid && ( - handleClick(e, quotelinkReply?.cid, quotelinkReply?.subplebbitAddress)} - > - {' '} - # - - )} + {quotelinkReply?.shortCid && + (() => { + const quotelinkBoardPath = quotelinkReply?.subplebbitAddress ? getBoardPath(quotelinkReply.subplebbitAddress, defaultSubplebbits) : undefined; + const quotelinkRoute = quotelinkReply?.cid + ? quotelinkBoardPath + ? `/${quotelinkBoardPath}/thread/${quotelinkReply.cid}` + : `/thread/${quotelinkReply.cid}` + : '#'; + return ( + handleClick(e, quotelinkReply?.cid, quotelinkReply?.subplebbitAddress)}> + {' '} + # + + ); + })()} {hoveredCid === quotelinkReply?.cid && outOfViewCid === quotelinkReply?.cid && createPortal( diff --git a/src/lib/utils/route-utils.ts b/src/lib/utils/route-utils.ts index 9329682c..265154fa 100644 --- a/src/lib/utils/route-utils.ts +++ b/src/lib/utils/route-utils.ts @@ -8,9 +8,12 @@ export const extractDirectoryFromTitle = (title: string): string | null => { return match ? match[1] : null; }; -// Cache for maps to avoid recreating them on every call -let cachedSubplebbits: MultisubSubplebbit[] | null = null; +// Cache for directory-to-address map +let cachedSubplebbitsForDirectory: MultisubSubplebbit[] | null = null; let cachedDirectoryToAddressMap: Map | null = null; + +// Cache for address-to-directory map +let cachedSubplebbitsForAddress: MultisubSubplebbit[] | null = null; let cachedAddressToDirectoryMap: Map | null = null; /** @@ -19,7 +22,7 @@ let cachedAddressToDirectoryMap: Map | null = null; */ export const getDirectoryToAddressMap = (subplebbits: MultisubSubplebbit[]): Map => { // Check if we can use cached map (same array reference) - if (cachedDirectoryToAddressMap && cachedSubplebbits === subplebbits) { + if (cachedDirectoryToAddressMap && cachedSubplebbitsForDirectory === subplebbits) { return cachedDirectoryToAddressMap; } @@ -35,7 +38,7 @@ export const getDirectoryToAddressMap = (subplebbits: MultisubSubplebbit[]): Map // Cache the map and array reference cachedDirectoryToAddressMap = map; - cachedSubplebbits = subplebbits; + cachedSubplebbitsForDirectory = subplebbits; return map; }; @@ -45,7 +48,7 @@ export const getDirectoryToAddressMap = (subplebbits: MultisubSubplebbit[]): Map */ export const getAddressToDirectoryMap = (subplebbits: MultisubSubplebbit[]): Map => { // Check if we can use cached map (same array reference) - if (cachedAddressToDirectoryMap && cachedSubplebbits === subplebbits) { + if (cachedAddressToDirectoryMap && cachedSubplebbitsForAddress === subplebbits) { return cachedAddressToDirectoryMap; } @@ -61,7 +64,7 @@ export const getAddressToDirectoryMap = (subplebbits: MultisubSubplebbit[]): Map // Cache the map and array reference cachedAddressToDirectoryMap = map; - cachedSubplebbits = subplebbits; + cachedSubplebbitsForAddress = subplebbits; return map; };