fix routing in subscriptions view

This commit is contained in:
Tom
2023-05-03 17:23:33 +02:00
parent 9f9064fbf4
commit cec0a8a3c9
+15 -30
View File
@@ -35,7 +35,7 @@ const Subscriptions = () => {
setSelectedShortCid, setSelectedShortCid,
selectedStyle, selectedStyle,
setSelectedThread, setSelectedThread,
selectedTitle, setSelectedTitle, setSelectedTitle,
} = useGeneralStore(state => state); } = useGeneralStore(state => state);
const account = useAccount(); const account = useAccount();
@@ -104,21 +104,6 @@ const Subscriptions = () => {
}, {}); }, {});
}, [flattenedRepliesByThread, accountComments, selectedFeed]); }, [flattenedRepliesByThread, accountComments, selectedFeed]);
// temporary title from JSON, gets subplebbitAddress from URL
useEffect(() => {
setSelectedAddress(subplebbitAddress);
const selectedSubplebbit = defaultSubplebbits.find((subplebbit) => subplebbit.address === subplebbitAddress);
if (selectedSubplebbit) {
setSelectedTitle(selectedSubplebbit.title);
}
}, [subplebbitAddress, setSelectedAddress, setSelectedTitle, defaultSubplebbits]);
// sets useFeed to address from URL
useEffect(() => {
setSelectedFeed(feed);
}, [feed]);
// mobile navbar scroll effect // mobile navbar scroll effect
useEffect(() => { useEffect(() => {
const debouncedHandleScroll = debounce(() => { const debouncedHandleScroll = debounce(() => {
@@ -165,7 +150,7 @@ const Subscriptions = () => {
return ( return (
<> <>
<Helmet> <Helmet>
<title>{((selectedTitle ? selectedTitle : selectedAddress) + " - plebchan")}</title> <title>Subscriptions - plebchan</title>
</Helmet> </Helmet>
<Container> <Container>
<ReplyModal <ReplyModal
@@ -201,7 +186,7 @@ const Subscriptions = () => {
}>Create Board</button> }>Create Board</button>
] ]
[ [
<Link to={`/p/${selectedAddress}/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link> <Link to={`/profile/p/subscriptions/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>
] ]
[ [
<Link to="/" onClick={() => handleStyleChange({target: {value: "Yotsuba"}} <Link to="/" onClick={() => handleStyleChange({target: {value: "Yotsuba"}}
@@ -226,7 +211,7 @@ const Subscriptions = () => {
}>Create Board</button> }>Create Board</button>
</div> </div>
<div className="page-jump"> <div className="page-jump">
<Link to={`/p/${selectedAddress}/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link> <Link to={`/profile/p/subscriptions/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>
&nbsp; &nbsp;
<Link to="/" onClick={() => handleStyleChange({target: {value: "Yotsuba"}} <Link to="/" onClick={() => handleStyleChange({target: {value: "Yotsuba"}}
)}>Home</Link> )}>Home</Link>
@@ -383,7 +368,7 @@ const Subscriptions = () => {
&nbsp; &nbsp;
<span key={`pn-${index}`} className="post-number post-number-desktop"> <span key={`pn-${index}`} className="post-number post-number-desktop">
<span key={`pl1-${index}`}>c/</span> <span key={`pl1-${index}`}>c/</span>
<Link to={`/p/${selectedAddress}/c/${thread.cid}`} id="reply-button" key={`pl2-${index}`} <Link to={`/p/${thread.subplebbitAddress}/c/${thread.cid}`} id="reply-button" key={`pl2-${index}`}
onClick={(e) => { onClick={(e) => {
if (e.button === 2) return; if (e.button === 2) return;
e.preventDefault(); e.preventDefault();
@@ -404,7 +389,7 @@ const Subscriptions = () => {
</Link> </Link>
<span key={`rl1-${index}`}>&nbsp;&nbsp; <span key={`rl1-${index}`}>&nbsp;&nbsp;
[ [
<Link key={`rl2-${index}`} to={`/p/${selectedAddress}/c/${thread.cid}`} onClick={() => setSelectedThread(thread.cid)} className="reply-link" >Reply</Link> <Link key={`rl2-${index}`} to={`/p/${thread.subplebbitAddress}/c/${thread.cid}`} onClick={() => setSelectedThread(thread.cid)} className="reply-link" >Reply</Link>
] ]
</span> </span>
</span>&nbsp; </span>&nbsp;
@@ -432,7 +417,7 @@ const Subscriptions = () => {
<span key={`ttl-s-${index}`} className="ttl"> (...) <span key={`ttl-s-${index}`} className="ttl"> (...)
<br key={`ttl-s-br1-${index}`} /><br key={`ttl-s-br2${thread.cid}`} /> <br key={`ttl-s-br1-${index}`} /><br key={`ttl-s-br2${thread.cid}`} />
Post too long.&nbsp; Post too long.&nbsp;
<Link key={`ttl-l-${index}`} to={`/p/${selectedAddress}/c/${thread.cid}`} onClick={() => setSelectedThread(thread.cid)} className="ttl-link">Click here</Link> <Link key={`ttl-l-${index}`} to={`/p/${thread.subplebbitAddress}/c/${thread.cid}`} onClick={() => setSelectedThread(thread.cid)} className="ttl-link">Click here</Link>
&nbsp;to view. </span> &nbsp;to view. </span>
</blockquote> </blockquote>
</Fragment> </Fragment>
@@ -448,7 +433,7 @@ const Subscriptions = () => {
<span key={`oc-${index}`} className="ttl"> <span key={`oc-${index}`} className="ttl">
<span key={`oc1-${index}`}> <span key={`oc1-${index}`}>
{omittedCount} post{omittedCount > 1 ? "s" : ""} omitted. Click&nbsp; {omittedCount} post{omittedCount > 1 ? "s" : ""} omitted. Click&nbsp;
<Link key={`oc2-${index}`} to={`/p/${selectedAddress}/c/${thread.cid}`} onClick={() => setSelectedThread(thread.cid)} className="ttl-link">here</Link> <Link key={`oc2-${index}`} to={`/p/${thread.subplebbitAddress}/c/${thread.cid}`} onClick={() => setSelectedThread(thread.cid)} className="ttl-link">here</Link>
&nbsp;to view. &nbsp;to view.
</span> </span>
</span>) : null} </span>) : null}
@@ -507,7 +492,7 @@ const Subscriptions = () => {
<span key={`pn-${index}`} className="post-number post-number-desktop"> <span key={`pn-${index}`} className="post-number post-number-desktop">
<span id="reply-button" style={{cursor: 'pointer'}} key={`pl1-${index}`} title="Link to this post">c/</span> <span id="reply-button" style={{cursor: 'pointer'}} key={`pl1-${index}`} title="Link to this post">c/</span>
{reply.shortCid ? ( {reply.shortCid ? (
<Link to={`/p/${selectedAddress}/c/${thread.cid}`} id="reply-button" key={`pl2-${index}`} <Link to={`/p/${thread.subplebbitAddress}/c/${thread.cid}`} id="reply-button" key={`pl2-${index}`}
onClick={(e) => { onClick={(e) => {
if (e.button === 2) return; if (e.button === 2) return;
e.preventDefault(); e.preventDefault();
@@ -610,7 +595,7 @@ const Subscriptions = () => {
<span key={`ttl-s-${index}`} className="ttl"> (...) <span key={`ttl-s-${index}`} className="ttl"> (...)
<br key={`ttl-s-br1-${index}`} /><br key={`ttl-s-br2${reply.cid}`} /> <br key={`ttl-s-br1-${index}`} /><br key={`ttl-s-br2${reply.cid}`} />
Comment too long.&nbsp; Comment too long.&nbsp;
<Link key={`ttl-l-${index}`} to={`/p/${selectedAddress}/c/${thread.cid}`} onClick={() => setSelectedThread(thread.cid)} className="ttl-link">Click here</Link> <Link key={`ttl-l-${index}`} to={`/p/${thread.subplebbitAddress}/c/${thread.cid}`} onClick={() => setSelectedThread(thread.cid)} className="ttl-link">Click here</Link>
&nbsp;to view. </span> &nbsp;to view. </span>
</blockquote> </blockquote>
</Fragment> </Fragment>
@@ -694,7 +679,7 @@ const Subscriptions = () => {
{getDate(thread.timestamp)} {getDate(thread.timestamp)}
&nbsp; &nbsp;
<span key={`mob-no-${index}`}>c/</span> <span key={`mob-no-${index}`}>c/</span>
<Link to={`/p/${selectedAddress}/c/${thread.cid}`} id="reply-button" key={`mob-no2-${index}`} <Link to={`/p/${thread.subplebbitAddress}/c/${thread.cid}`} id="reply-button" key={`mob-no2-${index}`}
onClick={(e) => { onClick={(e) => {
if (e.button === 2) return; if (e.button === 2) return;
e.preventDefault(); e.preventDefault();
@@ -759,7 +744,7 @@ const Subscriptions = () => {
<span key={`mob-ttl-s-${index}`} className="ttl"> (...) <span key={`mob-ttl-s-${index}`} className="ttl"> (...)
<br key={`mob-ttl-s-br1-${index}`} /><br key={`mob-ttl-s-br2${thread.cid}`} /> <br key={`mob-ttl-s-br1-${index}`} /><br key={`mob-ttl-s-br2${thread.cid}`} />
Post too long.&nbsp; Post too long.&nbsp;
<Link key={`mob-ttl-l-${index}`} to={`/p/${selectedAddress}/c/${thread.cid}`} onClick={() => setSelectedThread(thread.cid)} className="ttl-link">Click here</Link> <Link key={`mob-ttl-l-${index}`} to={`/p/${thread.subplebbitAddress}/c/${thread.cid}`} onClick={() => setSelectedThread(thread.cid)} className="ttl-link">Click here</Link>
&nbsp;to view. </span> &nbsp;to view. </span>
</blockquote> </blockquote>
</Fragment> </Fragment>
@@ -845,7 +830,7 @@ const Subscriptions = () => {
{getDate(reply.timestamp)}&nbsp; {getDate(reply.timestamp)}&nbsp;
<span key={`mob-pl1-${index}`}>c/</span> <span key={`mob-pl1-${index}`}>c/</span>
{reply.shortCid ? ( {reply.shortCid ? (
<Link to={`/p/${selectedAddress}/c/${thread.cid}`} id="reply-button" key={`mob-pl2-${index}`} <Link to={`/p/${thread.subplebbitAddress}/c/${thread.cid}`} id="reply-button" key={`mob-pl2-${index}`}
onClick={(e) => { onClick={(e) => {
if (e.button === 2) return; if (e.button === 2) return;
e.preventDefault(); e.preventDefault();
@@ -916,7 +901,7 @@ const Subscriptions = () => {
<span key={`mob-ttl-s-${index}`} className="ttl"> (...) <span key={`mob-ttl-s-${index}`} className="ttl"> (...)
<br key={`mob-ttl-s-br1-${index}`} /><br key={`mob-ttl-s-br2${reply.cid}`} /> <br key={`mob-ttl-s-br1-${index}`} /><br key={`mob-ttl-s-br2${reply.cid}`} />
Comment too long.&nbsp; Comment too long.&nbsp;
<Link key={`mob-ttl-l-${index}`} to={`/p/${selectedAddress}/c/${thread.cid}`} onClick={() => setSelectedThread(thread.cid)} className="ttl-link">Click here</Link> <Link key={`mob-ttl-l-${index}`} to={`/p/${thread.subplebbitAddress}/c/${thread.cid}`} onClick={() => setSelectedThread(thread.cid)} className="ttl-link">Click here</Link>
&nbsp;to view. </span> &nbsp;to view. </span>
</blockquote> </blockquote>
</Fragment> </Fragment>
@@ -1004,7 +989,7 @@ const Subscriptions = () => {
}>Create Board</button> }>Create Board</button>
] ]
[ [
<Link to={`/p/${selectedAddress}/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link> <Link to={`/profile/p/subscriptions/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>
] ]
[ [
<Link to="/" onClick={() => handleStyleChange({target: {value: "Yotsuba"}} <Link to="/" onClick={() => handleStyleChange({target: {value: "Yotsuba"}}