diff --git a/package.json b/package.json index 11fa8f3a..bced27a8 100644 --- a/package.json +++ b/package.json @@ -6,7 +6,7 @@ "@babel/core": "^7.21.3", "@babel/plugin-syntax-flow": "^7.18.6", "@babel/plugin-transform-react-jsx": "^7.21.0", - "@plebbit/plebbit-react-hooks": "https://github.com/plebbit/plebbit-react-hooks.git#b42bcb6a4f74ab23bbb8dfa49e43e9cccef3ece6", + "@plebbit/plebbit-react-hooks": "https://github.com/plebbit/plebbit-react-hooks.git#47c89c104bf3f16f790282fbdf26f672c395df52", "@testing-library/dom": "^9.0.1", "@testing-library/jest-dom": "^5.14.1", "@testing-library/react": "^14.0.0", diff --git a/src/components/views/Board.jsx b/src/components/views/Board.jsx index 0dc9609e..ff8e8f3a 100644 --- a/src/components/views/Board.jsx +++ b/src/components/views/Board.jsx @@ -49,11 +49,11 @@ const Board = () => { const { subplebbitAddress } = useParams(); const handleClickForm = useClickForm(); + // useEffect(() => { // console.log(selectedFeed); // }, [selectedFeed]); - // temporary title from JSON, gets subplebbitAddress from URL useEffect(() => { setSelectedAddress(subplebbitAddress); @@ -82,8 +82,6 @@ const Board = () => { }, [prevScrollPos, visible]); - - const tryLoadMore = async () => { try { await loadMore(); @@ -93,7 +91,6 @@ const Board = () => { }; - const onChallengeVerification = (challengeVerification) => { if (challengeVerification.challengeSuccess === true) { onSuccess('challenge success', {publishedCid: challengeVerification.publication.cid}) @@ -149,10 +146,6 @@ const Board = () => { }); }; - - - const handleVoidClick = () => {}; - // desktop navbar board select functionality const handleClickTitle = (title, address) => { setSelectedTitle(title); @@ -167,19 +160,9 @@ const Board = () => { setSelectedTitle(selectedTitle); setSelectedAddress(selected); navigate(`/${selected}`); - } - - - const handleClickHelp = () => { - alert("- Embedding media is optional, posts can be text-only. \n- A CAPTCHA challenge will appear after posting. \n- The CAPTCHA is case-sensitive."); }; - const handleClickThread = (thread) => { - setSelectedThread(thread); - }; - - const handlePublishComment = async () => { try { const pendingComment = await publishComment({ @@ -208,28 +191,8 @@ const Board = () => { if (targetElement) { targetElement.scrollIntoView({ behavior: "instant" }); } - } - - const handleCaptchaClose = () => { - setIsCaptchaOpen(false); }; - const handleReplyClose = () => { - setIsReplyOpen(false); - }; - - const handleReplyOpen = () => { - setIsReplyOpen(true); - }; - - const handleSettingsClose = () => { - setIsSettingsOpen(false); - } - - const handleSettingsOpen = () => { - setIsSettingsOpen(true); - } - return ( @@ -237,16 +200,16 @@ const Board = () => { setIsCaptchaOpen(false)} captchaImage={captchaImage} /> + closeModal={() => setIsReplyOpen(false)} /> + closeModal={() => setIsSettingsOpen(false)} /> <> {defaultSubplebbits.map(subplebbit => ( @@ -259,7 +222,7 @@ const Board = () => { ))} [ - Settings + setIsSettingsOpen(true)}>Settings ] [ handleStyleChange({target: {value: "Yotsuba"}} @@ -278,7 +241,7 @@ const Board = () => {
- Settings + setIsSettingsOpen(true)}>Settings   handleStyleChange({target: {value: "Yotsuba"}} )}>Home @@ -338,7 +301,9 @@ const Board = () => { Embed File - + @@ -466,12 +431,12 @@ const Board = () => { {getDate(thread.timestamp)}   - c/ - + {}} title="Link to this post">c/ +     [ - handleClickThread(thread.cid)} className="reply-link" >Reply + setSelectedThread(thread.cid)} className="reply-link" >Reply ]   @@ -482,7 +447,7 @@ const Board = () => { .map((reply) => (
{}} className="quote-link" onClick={(event) => handleQuoteClick(reply, event)}> c/{reply.shortCid}   @@ -499,7 +464,7 @@ const Board = () => { (...)

Post too long.  - handleClickThread(thread.cid)} className="ttl-link">Click here + setSelectedThread(thread.cid)} className="ttl-link">Click here  to view.
@@ -515,7 +480,7 @@ const Board = () => { {omittedCount} post{omittedCount > 1 ? "s" : ""} omitted. Click  - handleClickThread(thread.cid)} className="ttl-link">here + setSelectedThread(thread.cid)} className="ttl-link">here  to view. ) : null} @@ -556,16 +521,16 @@ const Board = () => { {getDate(reply.timestamp)}   - c/ - + {}} title="Link to this post">c/ +   - + {renderedComments.map((reply) => { @@ -790,8 +755,8 @@ const Board = () => { {getDate(reply.timestamp)}  - c/ - + {}} title="Link to this post">c/ +
{reply.link ? ( @@ -831,19 +796,19 @@ const Board = () => { reply.content.length > 500 ?
- + {}}> {`c/${reply.parentCid.slice(0, 8)}`}{
} (...)

Comment too long.  - handleClickThread(thread.cid)} className="ttl-link">Click here + setSelectedThread(thread.cid)} className="ttl-link">Click here  to view.
:
- handleQuoteClick(reply, event)}> + {}} key={`mob-r-pm-${reply.cid}`} className="quotelink" onClick={(event) => handleQuoteClick(reply, event)}> {`c/${reply.parentCid.slice(0, 8)}`}{
} diff --git a/src/components/views/Catalog.jsx b/src/components/views/Catalog.jsx index 2d75d035..e0d39be9 100644 --- a/src/components/views/Catalog.jsx +++ b/src/components/views/Catalog.jsx @@ -46,7 +46,6 @@ const Catalog = () => { const handleClickForm = useClickForm(); - useEffect(() => { setSelectedAddress(subplebbitAddress); const selectedSubplebbit = defaultSubplebbits.find((subplebbit) => subplebbit.address === subplebbitAddress); @@ -55,7 +54,6 @@ const Catalog = () => { } }, [subplebbitAddress, setSelectedAddress, setSelectedTitle, defaultSubplebbits]); - // mobile navbar scroll effect useEffect(() => { const debouncedHandleScroll = debounce(() => { @@ -70,12 +68,11 @@ const Catalog = () => { }, [prevScrollPos, visible]); - const tryLoadMore = async () => { try {loadMore()} catch (e) {await new Promise(resolve => setTimeout(resolve, 1000))} - } + }; const onChallengeVerification = (challengeVerification) => { @@ -86,7 +83,7 @@ const Catalog = () => { onError('challenge failed', {reason: challengeVerification.reason, errors: challengeVerification.errors}); onError("Error: You seem to have mistyped the CAPTCHA. Please try again."); } - } + }; const onChallenge = async (challenges, comment) => { @@ -100,7 +97,7 @@ const Catalog = () => { if (challengeAnswers) { await comment.publishChallengeAnswers(challengeAnswers) } - } + }; const getChallengeAnswersFromUser = async (challenges) => { @@ -134,30 +131,14 @@ const Catalog = () => { }; - - const handleClickTitle = (title, address) => { - setSelectedTitle(title); - setSelectedAddress(address); - }; - - const handleSelectChange = (event) => { const selected = event.target.value; const selectedTitle = defaultSubplebbits.find((subplebbit) => subplebbit.address === selected).title; setSelectedTitle(selectedTitle); setSelectedAddress(selected); navigate(`/${selected}`); - } - - - const handleClickHelp = () => { - alert("- Embedding media is optional, posts can be text-only. \n- A CAPTCHA challenge will appear after posting. \n- The CAPTCHA is case-sensitive."); }; - const handleClickThread = (thread) => { - setSelectedThread(thread); - } - const handlePublishComment = async () => { // Event.preventDefault(); @@ -179,43 +160,34 @@ const Catalog = () => { } }; - const handleCaptchaClose = () => { - setIsCaptchaOpen(false); - }; - - const handleSettingsClose = () => { - setIsSettingsOpen(false); - } - - const handleSettingsOpen = () => { - setIsSettingsOpen(true); - } - - return ( setIsCaptchaOpen(false)} captchaImage={captchaImage} /> + closeModal={() => setIsSettingsOpen(false)} /> <> {defaultSubplebbits.map(subplebbit => ( [ - handleClickTitle(subplebbit.title, subplebbit.address)} + { + setSelectedTitle(subplebbit.title); + setSelectedAddress(subplebbit.address); + }} >{subplebbit.title} ]  ))} [ - Settings + setIsSettingsOpen(true)}>Settings ] [ handleStyleChange({target: {value: "Yotsuba"}} @@ -234,7 +206,7 @@ const Catalog = () => {
- Settings + setIsSettingsOpen(true)}>Settings   handleStyleChange({target: {value: "Yotsuba"}} )}>Home @@ -294,7 +266,9 @@ const Catalog = () => { Embed File - + @@ -342,7 +316,7 @@ const Catalog = () => { const commentMediaInfo = getCommentMediaInfo(thread); const fallbackImgUrl = "/assets/filedeleted-res.gif"; return ( - handleClickThread(thread.cid)}> + setSelectedThread(thread.cid)}>
{commentMediaInfo?.url ? ( diff --git a/src/components/views/Home.jsx b/src/components/views/Home.jsx index b260a7cd..f47029d8 100644 --- a/src/components/views/Home.jsx +++ b/src/components/views/Home.jsx @@ -13,12 +13,6 @@ const Home = () => { setSelectedTitle } = useAppStore(state => state); - - const handleClick = (title, address) => { - setSelectedTitle(title); - setSelectedAddress(address); - } - // prevent dark mode useEffect(() => { setBodyStyle({ @@ -67,7 +61,8 @@ const Home = () => {
{subplebbit.title}
{ - handleClick(subplebbit.title, subplebbit.address); + setSelectedTitle(subplebbit.title); + setSelectedAddress(subplebbit.address); }} > board logo diff --git a/src/components/views/Thread.jsx b/src/components/views/Thread.jsx index b72f39b8..f2228a41 100644 --- a/src/components/views/Thread.jsx +++ b/src/components/views/Thread.jsx @@ -52,11 +52,11 @@ const Thread = () => { const commentMediaInfo = getCommentMediaInfo(comment); const fallbackImgUrl = "/assets/filedeleted-res.gif"; + // useEffect(() => { // console.log(comment); // }, [comment]); - // temporary title from JSON, gets subplebbitAddress and threadCid from URL useEffect(() => { setSelectedAddress(subplebbitAddress); @@ -80,7 +80,6 @@ const Thread = () => { return () => window.removeEventListener('scroll', debouncedHandleScroll); }, [prevScrollPos, visible]); - const onChallengeVerification = (challengeVerification) => { if (challengeVerification.challengeSuccess === true) { @@ -90,7 +89,7 @@ const Thread = () => { onError('challenge failed', {reason: challengeVerification.reason, errors: challengeVerification.errors}); onError("Error: You seem to have mistyped the CAPTCHA. Please try again."); } - } + }; const onChallenge = async (challenges, comment) => { @@ -104,7 +103,7 @@ const Thread = () => { if (challengeAnswers) { await comment.publishChallengeAnswers(challengeAnswers) } - } + }; const getChallengeAnswersFromUser = async (challenges) => { @@ -137,16 +136,6 @@ const Thread = () => { }); }; - - - const handleVoidClick = () => {} - - // desktop navbar board select functionality - const handleClickTitle = (title, address) => { - setSelectedTitle(title); - setSelectedAddress(address); - }; - // mobile navbar board select functionality const handleSelectChange = (event) => { const selected = event.target.value; @@ -154,24 +143,9 @@ const Thread = () => { setSelectedTitle(selectedTitle); setSelectedAddress(selected); navigate(`/${selected}`); - } - - - const handleClickHelp = () => { - alert("- Embedding media is optional, posts can be text-only. \n- A CAPTCHA challenge will appear after posting. \n- The CAPTCHA is case-sensitive."); }; - const handleClickTop = () => { - window.scrollTo(0, 0); - } - - - const handleClickBottom = () => { - window.scrollTo(0, document.body.scrollHeight); - } - - const handlePublishComment = async () => { try { const pendingComment = await publishComment({ @@ -200,44 +174,23 @@ const Thread = () => { if (targetElement) { targetElement.scrollIntoView({ behavior: "instant" }); } - } - - const handleCaptchaClose = () => { - setIsCaptchaOpen(false); }; - const handleReplyClose = () => { - setIsReplyOpen(false); - }; - - const handleReplyOpen = () => { - setIsReplyOpen(true); - }; - - const handleSettingsClose = () => { - setIsSettingsOpen(false); - } - - const handleSettingsOpen = () => { - setIsSettingsOpen(true); - } - - return ( setIsCaptchaOpen(false)} captchaImage={captchaImage} /> + closeModal={() => setIsReplyOpen(false)} /> + closeModal={() => setIsSettingsOpen(false)} /> <> {defaultSubplebbits.map(subplebbit => ( @@ -245,14 +198,17 @@ const Thread = () => { [ handleClickTitle(subplebbit.title, subplebbit.address)} + onClick={() => { + setSelectedTitle(subplebbit.title); + setSelectedAddress(subplebbit.address); + }} >{subplebbit.title} ]  ))} [ - Settings + setIsSettingsOpen(true)}>Settings ] [ handleStyleChange({target: {value: "Yotsuba"}} @@ -271,7 +227,7 @@ const Thread = () => {
- Settings + setIsSettingsOpen(true)}>Settings   handleStyleChange({target: {value: "Yotsuba"}} )}>Home @@ -307,7 +263,7 @@ const Thread = () => {
@@ -340,7 +296,10 @@ const Thread = () => { Embed File - + @@ -372,7 +331,9 @@ const Thread = () => { [ - event.target.style.cursor='pointer'} onTouchStart={handleClickBottom}>Bottom + window.scrollTo(0, document.body.scrollHeight)} + onMouseOver={(event) => event.target.style.cursor='pointer'} + onTouchStart={() => window.scrollTo(0, document.body.scrollHeight)}>Bottom ] {comment ? ( @@ -476,16 +437,16 @@ const Thread = () => { {getDate(comment?.timestamp)}   - c/ - + {}} title="Link to this post">c/ +    - +