diff --git a/package.json b/package.json index a95c4bb1..b20d905c 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#6de131a2e9f23578efd9faf4670d2cc43ce6d5ba", + "@plebbit/plebbit-react-hooks": "https://github.com/plebbit/plebbit-react-hooks.git#33fca8ef1cfc78e5c16d7fcbe7effbeebeb082c8", "@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 e80cc66e..0a12e9a5 100644 --- a/src/components/views/Board.jsx +++ b/src/components/views/Board.jsx @@ -41,6 +41,8 @@ const Board = () => { const commentRef = useRef(); const linkRef = useRef(); + const onChallengeVerificationRef = useRef(); + const [isReplyOpen, setIsReplyOpen] = useState(false); const navigate = useNavigate(); const [prevScrollPos, setPrevScrollPos] = useState(0); @@ -92,12 +94,10 @@ const Board = () => { }; - const onChallengeVerificationRef = useRef(); - const onChallengeVerification = (challengeVerification) => { if (challengeVerification.challengeSuccess === true) { - setSuccessMessage('challenge success', {publishedCid: challengeVerification.publication.cid}); - navigate(`/p/${selectedAddress}/c/${challengeVerification.publication.cid}`); + setSuccessMessage('challenge success', {publishedCid: challengeVerification.publication?.cid}); + navigate(`/p/${selectedAddress}/c/${challengeVerification.publication?.cid}`); } else if (challengeVerification.challengeSuccess === false) { setErrorMessage('challenge failed', {reason: challengeVerification.reason, errors: challengeVerification.errors}); @@ -105,6 +105,7 @@ const Board = () => { } }; + onChallengeVerificationRef.current = onChallengeVerification; @@ -142,6 +143,7 @@ const Board = () => { }, }); + useEffect(() => { setPublishCommentOptions((prevPublishCommentOptions) => ({ ...prevPublishCommentOptions, diff --git a/src/components/views/Catalog.jsx b/src/components/views/Catalog.jsx index 154e64cb..fe7aaa38 100644 --- a/src/components/views/Catalog.jsx +++ b/src/components/views/Catalog.jsx @@ -38,6 +38,8 @@ const Catalog = () => { const commentRef = useRef(); const linkRef = useRef(); + const onChallengeVerificationRef = useRef(); + const navigate = useNavigate(); const [prevScrollPos, setPrevScrollPos] = useState(0); const [visible, setVisible] = useState(true); @@ -82,15 +84,17 @@ const Catalog = () => { const onChallengeVerification = (challengeVerification) => { if (challengeVerification.challengeSuccess === true) { - setSuccessMessage('challenge success', {publishedCid: challengeVerification.publication.cid}); - setSelectedThread(challengeVerification.publication.cid); - navigate(`/p/${selectedAddress}/c/${challengeVerification.publication.cid}`); + setSuccessMessage('challenge success', {publishedCid: challengeVerification.publication?.cid}); + navigate(`/p/${selectedAddress}/c/${challengeVerification.publication?.cid}`); } else if (challengeVerification.challengeSuccess === false) { setErrorMessage('challenge failed', {reason: challengeVerification.reason, errors: challengeVerification.errors}); setErrorMessage("Error: You seem to have mistyped the CAPTCHA. Please try again."); } - } + }; + + + onChallengeVerificationRef.current = onChallengeVerification; const onChallenge = async (challenges, comment) => { @@ -110,20 +114,6 @@ const Catalog = () => { } - const publishCommentOptions = { - displayName: nameRef.current ? nameRef.current.value : undefined, - title: subjectRef.current ? subjectRef.current.value : undefined, - content: commentRef.current ? commentRef.current.value : undefined, - link: linkRef.current ? linkRef.current.value : undefined, - subplebbitAddress: selectedAddress, - onChallenge, - onChallengeVerification, - onError: (error) => { - setErrorMessage(error); - } - }; - - const resetFields = () => { nameRef.current.value = ''; subjectRef.current.value = ''; @@ -131,10 +121,51 @@ const Catalog = () => { linkRef.current.value = ''; }; + + const [publishCommentOptions, setPublishCommentOptions] = useState({ + subplebbitAddress: selectedAddress, + onChallenge, + onChallengeVerification: onChallengeVerificationRef.current, + onError: (error) => { + setErrorMessage(error); + }, + }); + + useEffect(() => { + setPublishCommentOptions((prevPublishCommentOptions) => ({ + ...prevPublishCommentOptions, + subplebbitAddress: selectedAddress, + onChallengeVerification: onChallengeVerificationRef.current, + })); + }, [selectedAddress]); + + + const handleSubmit = async (event) => { + event.preventDefault(); + + setPublishCommentOptions((prevPublishCommentOptions) => ({ + ...prevPublishCommentOptions, + displayName: nameRef.current.value || undefined, + title: subjectRef.current.value || undefined, + content: commentRef.current.value || undefined, + link: linkRef.current.value || undefined, + })); + }; + + + useEffect(() => { + if (publishCommentOptions.content) { + (async () => { + await publishComment(); + resetFields(); + })(); + } + }, [publishCommentOptions]); + const { publishComment } = usePublishComment(publishCommentOptions); - - + + const getChallengeAnswersFromUser = async (challenges) => { setChallengesArray(challenges); @@ -265,7 +296,7 @@ const Catalog = () => { {await publishComment(); resetFields();}} /> + onClick={handleSubmit} /> diff --git a/src/components/views/Thread.jsx b/src/components/views/Thread.jsx index 2a34aed0..f26979c7 100644 --- a/src/components/views/Thread.jsx +++ b/src/components/views/Thread.jsx @@ -40,6 +40,8 @@ const Thread = () => { const commentRef = useRef(); const linkRef = useRef(); + const onChallengeVerificationRef = useRef(); + const [isReplyOpen, setIsReplyOpen] = useState(false); const navigate = useNavigate(); const [prevScrollPos, setPrevScrollPos] = useState(0); @@ -83,15 +85,17 @@ const Thread = () => { const onChallengeVerification = (challengeVerification) => { if (challengeVerification.challengeSuccess === true) { - setSuccessMessage('challenge success', {publishedCid: challengeVerification.publication.cid}); - setSelectedThread(challengeVerification.publication.cid); - navigate(`/p/${selectedAddress}/c/${challengeVerification.publication.cid}`); + setSuccessMessage('challenge success', {publishedCid: challengeVerification.publication?.cid}); + navigate(`/p/${selectedAddress}/c/${challengeVerification.publication?.cid}`); } else if (challengeVerification.challengeSuccess === false) { setErrorMessage('challenge failed', {reason: challengeVerification.reason, errors: challengeVerification.errors}); setErrorMessage("Error: You seem to have mistyped the CAPTCHA. Please try again."); } - } + }; + + + onChallengeVerificationRef.current = onChallengeVerification; const onChallenge = async (challenges, comment) => { @@ -111,25 +115,53 @@ const Thread = () => { } - const publishCommentOptions = { - displayName: nameRef.current ? nameRef.current.value : undefined, - content: commentRef.current ? commentRef.current.value : undefined, - link: linkRef.current ? linkRef.current.value : undefined, - subplebbitAddress: selectedAddress, - onChallenge, - onChallengeVerification, - onError: (error) => { - setErrorMessage(error); - } - }; - - const resetFields = () => { nameRef.current.value = ''; commentRef.current.value = ''; linkRef.current.value = ''; }; + + const [publishCommentOptions, setPublishCommentOptions] = useState({ + subplebbitAddress: selectedAddress, + onChallenge, + onChallengeVerification: onChallengeVerificationRef.current, + onError: (error) => { + setErrorMessage(error); + }, + }); + + + useEffect(() => { + setPublishCommentOptions((prevPublishCommentOptions) => ({ + ...prevPublishCommentOptions, + subplebbitAddress: selectedAddress, + onChallengeVerification: onChallengeVerificationRef.current, + })); + }, [selectedAddress]); + + + const handleSubmit = async (event) => { + event.preventDefault(); + + setPublishCommentOptions((prevPublishCommentOptions) => ({ + ...prevPublishCommentOptions, + displayName: nameRef.current.value || undefined, + content: commentRef.current.value || undefined, + link: linkRef.current.value || undefined, + })); + }; + + + useEffect(() => { + if (publishCommentOptions.content) { + (async () => { + await publishComment(); + resetFields(); + })(); + } + }, [publishCommentOptions]); + const { publishComment } = usePublishComment(publishCommentOptions); @@ -290,7 +322,7 @@ const Thread = () => { {await publishComment(); resetFields();}} /> + onClick={handleSubmit} /> diff --git a/yarn.lock b/yarn.lock index a5973031..b576213f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2417,9 +2417,9 @@ mkdirp "^1.0.4" rimraf "^3.0.2" -"@plebbit/plebbit-js@https://github.com/plebbit/plebbit-js.git#d5f312ef577dc4a845e15d1f87c4273cb2195c08": +"@plebbit/plebbit-js@https://github.com/plebbit/plebbit-js.git#c90a5a2920f763a32bedc0584606b358d83600e5": version "0.0.3" - resolved "https://github.com/plebbit/plebbit-js.git#d5f312ef577dc4a845e15d1f87c4273cb2195c08" + resolved "https://github.com/plebbit/plebbit-js.git#c90a5a2920f763a32bedc0584606b358d83600e5" dependencies: "@keyv/sqlite" "3.6.2" "@plebbit/plebbit-logger" "github:plebbit/plebbit-logger" @@ -2444,8 +2444,10 @@ knex "2.3.0" libp2p-crypto "0.21.2" limiter "2.1.0" + localforage "1.10.0" lodash-es "4.17.21" open-graph-scraper "5.2.3" + p-limit "3.1.0" peer-id "0.16.0" proper-lockfile "github:plebbit/node-proper-lockfile" retry "0.13.1" @@ -2510,11 +2512,11 @@ dependencies: debug "4.3.3" -"@plebbit/plebbit-react-hooks@https://github.com/plebbit/plebbit-react-hooks.git#47c89c104bf3f16f790282fbdf26f672c395df52": +"@plebbit/plebbit-react-hooks@https://github.com/plebbit/plebbit-react-hooks.git#33fca8ef1cfc78e5c16d7fcbe7effbeebeb082c8": version "0.0.1" - resolved "https://github.com/plebbit/plebbit-react-hooks.git#47c89c104bf3f16f790282fbdf26f672c395df52" + resolved "https://github.com/plebbit/plebbit-react-hooks.git#33fca8ef1cfc78e5c16d7fcbe7effbeebeb082c8" dependencies: - "@plebbit/plebbit-js" "https://github.com/plebbit/plebbit-js.git#d5f312ef577dc4a845e15d1f87c4273cb2195c08" + "@plebbit/plebbit-js" "https://github.com/plebbit/plebbit-js.git#c90a5a2920f763a32bedc0584606b358d83600e5" "@plebbit/plebbit-logger" "https://github.com/plebbit/plebbit-logger.git" assert "2.0.0" ethers "5.6.9" @@ -9694,6 +9696,13 @@ p-fifo@^1.0.0: fast-fifo "^1.0.0" p-defer "^3.0.0" +p-limit@3.1.0, p-limit@^3.0.2: + version "3.1.0" + resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-3.1.0.tgz#e1daccbe78d0d1388ca18c64fea38e3e57e3706b" + integrity sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ== + dependencies: + yocto-queue "^0.1.0" + p-limit@^2.0.0, p-limit@^2.2.0: version "2.3.0" resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-2.3.0.tgz#3dd33c647a214fdfffd835933eb086da0dc21db1" @@ -9701,13 +9710,6 @@ p-limit@^2.0.0, p-limit@^2.2.0: dependencies: p-try "^2.0.0" -p-limit@^3.0.2: - version "3.1.0" - resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-3.1.0.tgz#e1daccbe78d0d1388ca18c64fea38e3e57e3706b" - integrity sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ== - dependencies: - yocto-queue "^0.1.0" - p-locate@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-3.0.0.tgz#322d69a05c0264b25997d9f40cd8a891ab0064a4"