diff --git a/src/components/views/All.jsx b/src/components/views/All.jsx index 557be53b..414322c7 100755 --- a/src/components/views/All.jsx +++ b/src/components/views/All.jsx @@ -32,9 +32,11 @@ import handleQuoteClick from '../../utils/handleQuoteClick'; import handleQuoteHover from '../../utils/handleQuoteHover'; import handleStyleChange from '../../utils/handleStyleChange'; import removeHighlight from '../../utils/removeHighlight'; +import useAnonModeRef from '../../hooks/useAnonModeRef'; import useError from '../../hooks/useError'; import useFeedStateString from '../../hooks/useFeedStateString'; import useSuccess from '../../hooks/useSuccess'; +import useAnonModeStore from '../../hooks/stores/useAnonModeStore'; import useGeneralStore from '../../hooks/stores/useGeneralStore'; import packageJson from '../../../package.json' const {version} = packageJson @@ -62,6 +64,7 @@ const All = () => { setSelectedTitle, } = useGeneralStore(state => state); + const { anonymousMode } = useAnonModeStore(); const account = useAccount(); const navigate = useNavigate(); @@ -76,6 +79,7 @@ const All = () => { const backlinkRefsMobile = useRef({}); const quoteRefsMobile = useRef({}); const postOnHoverRef = useRef(null); + const selectedThreadCidRef = useRef(null); const [isReplyOpen, setIsReplyOpen] = useState(false); const [isEditModalOpen, setIsEditModalOpen] = useState(false); @@ -92,6 +96,13 @@ const All = () => { const [postOnHoverHeight, setPostOnHoverHeight] = useState(0); const [deletePost, setDeletePost] = useState(false); const [moderatorPermissions, setModeratorPermissions] = useState({}); + const [executeAnonMode, setExecuteAnonMode] = useState(false); + + const setSelectedThreadCid = (cid) => { + selectedThreadCidRef.current = cid; + } + + useAnonModeRef(selectedThreadCidRef, anonymousMode && executeAnonMode); const addresses = defaultSubplebbits.map(subplebbit => subplebbit.address); const { feed, hasMore, loadMore } = useFeed({subplebbitAddresses: addresses, sortType: 'active'}); @@ -303,6 +314,14 @@ const All = () => { }); }; + + useEffect(() => { + if (anonymousMode) { + setExecuteAnonMode(true); + } + }, [anonymousMode, selectedThreadCidRef]); + + const [publishCommentEditOptions, setPublishCommentEditOptions] = useState({ commentCid: commentCid, content: editedComment || undefined, @@ -668,6 +687,7 @@ const All = () => { onClick={(e) => { if (e.button === 2) return; e.preventDefault(); + setSelectedThreadCid(thread.cid); setIsReplyOpen(true); setSelectedShortCid(thread.shortCid); setSelectedParentCid(thread.cid); @@ -947,6 +967,7 @@ const All = () => { onClick={(e) => { if (e.button === 2) return; e.preventDefault(); + setSelectedThreadCid(thread.cid); setIsReplyOpen(true); setSelectedShortCid(reply.shortCid); setSelectedParentCid(reply.cid); @@ -1380,6 +1401,7 @@ const All = () => { onClick={(e) => { if (e.button === 2) return; e.preventDefault(); + setSelectedThreadCid(thread.cid); setIsReplyOpen(true); setSelectedShortCid(thread.shortCid); setSelectedParentCid(thread.cid); @@ -1552,6 +1574,7 @@ const All = () => { onClick={(e) => { if (e.button === 2) return; e.preventDefault(); + setSelectedThreadCid(thread.cid); setIsReplyOpen(true); setSelectedShortCid(reply.shortCid); setSelectedParentCid(reply.cid); diff --git a/src/components/views/Board.jsx b/src/components/views/Board.jsx index 56d7964a..c103496b 100755 --- a/src/components/views/Board.jsx +++ b/src/components/views/Board.jsx @@ -32,10 +32,12 @@ import handleQuoteClick from '../../utils/handleQuoteClick'; import handleQuoteHover from '../../utils/handleQuoteHover'; import handleStyleChange from '../../utils/handleStyleChange'; import removeHighlight from '../../utils/removeHighlight'; +import useAnonModeRef from '../../hooks/useAnonModeRef'; import useClickForm from '../../hooks/useClickForm'; import useError from '../../hooks/useError'; import useStateString from '../../hooks/useStateString'; import useSuccess from '../../hooks/useSuccess'; +import useAnonModeStore from '../../hooks/stores/useAnonModeStore'; import useGeneralStore from '../../hooks/stores/useGeneralStore'; import packageJson from '../../../package.json' const {version} = packageJson @@ -65,7 +67,8 @@ const Board = () => { showPostForm, showPostFormLink, } = useGeneralStore(state => state); - + + const { anonymousMode } = useAnonModeStore(); const account = useAccount(); const navigate = useNavigate(); @@ -86,6 +89,7 @@ const Board = () => { const backlinkRefsMobile = useRef({}); const quoteRefsMobile = useRef({}); const postOnHoverRef = useRef(null); + const selectedThreadCidRef = useRef(null); const { feed, hasMore, loadMore } = useFeed({subplebbitAddresses: [`${selectedAddress}`], sortType: 'active'}); const subplebbit = useSubplebbit({subplebbitAddress: selectedAddress}); @@ -109,6 +113,13 @@ const Board = () => { const [outOfViewCid, setOutOfViewCid] = useState(null); const [outOfViewPosition, setOutOfViewPosition] = useState({top: 0, left: 0}); const [postOnHoverHeight, setPostOnHoverHeight] = useState(0); + const [executeAnonMode, setExecuteAnonMode] = useState(false); + + const setSelectedThreadCid = (cid) => { + selectedThreadCidRef.current = cid; + } + + useAnonModeRef(selectedThreadCidRef, anonymousMode && executeAnonMode); useEffect(() => { @@ -351,9 +362,17 @@ const Board = () => { })); setTriggerPublishComment(true); + setExecuteAnonMode(false); }; + useEffect(() => { + if (anonymousMode) { + setExecuteAnonMode(true); + } + }, [anonymousMode, selectedThreadCidRef]); + + useEffect(() => { if (publishCommentOptions && triggerPublishComment) { (async () => { @@ -1115,6 +1134,7 @@ const Board = () => { onClick={(e) => { if (e.button === 2) return; e.preventDefault(); + setSelectedThreadCid(thread.cid); setIsReplyOpen(true); setSelectedShortCid(thread.shortCid); setSelectedParentCid(thread.cid); @@ -1392,6 +1412,7 @@ const Board = () => { onClick={(e) => { if (e.button === 2) return; e.preventDefault(); + setSelectedThreadCid(thread.cid); setIsReplyOpen(true); setSelectedShortCid(reply.shortCid); setSelectedParentCid(reply.cid); @@ -1796,6 +1817,7 @@ const Board = () => { onClick={(e) => { if (e.button === 2) return; e.preventDefault(); + setSelectedThreadCid(thread.cid); setIsReplyOpen(true); setSelectedShortCid(thread.shortCid); setSelectedParentCid(thread.cid); @@ -1946,6 +1968,7 @@ const Board = () => { onClick={(e) => { if (e.button === 2) return; e.preventDefault(); + setSelectedThreadCid(thread.cid); setIsReplyOpen(true); setSelectedShortCid(reply.shortCid); setSelectedParentCid(reply.cid); diff --git a/src/components/views/Subscriptions.jsx b/src/components/views/Subscriptions.jsx index 29871faa..9df97290 100755 --- a/src/components/views/Subscriptions.jsx +++ b/src/components/views/Subscriptions.jsx @@ -33,9 +33,11 @@ import handleQuoteClick from '../../utils/handleQuoteClick'; import handleQuoteHover from '../../utils/handleQuoteHover'; import handleStyleChange from '../../utils/handleStyleChange'; import removeHighlight from '../../utils/removeHighlight'; +import useAnonModeRef from '../../hooks/useAnonModeRef'; import useError from '../../hooks/useError'; import useFeedStateString from '../../hooks/useFeedStateString'; import useSuccess from '../../hooks/useSuccess'; +import useAnonModeStore from '../../hooks/stores/useAnonModeStore'; import packageJson from '../../../package.json' const {version} = packageJson @@ -62,6 +64,8 @@ const Subscriptions = () => { setSelectedTitle, } = useGeneralStore(state => state); + const { anonymousMode } = useAnonModeStore(); + const account = useAccount(); const navigate = useNavigate(); const [, setNewErrorMessage] = useError(); @@ -75,6 +79,7 @@ const Subscriptions = () => { const backlinkRefsMobile = useRef({}); const quoteRefsMobile = useRef({}); const postOnHoverRef = useRef(null); + const selectedThreadCidRef = useRef(null); const [isReplyOpen, setIsReplyOpen] = useState(false); const [isEditModalOpen, setIsEditModalOpen] = useState(false); @@ -91,6 +96,13 @@ const Subscriptions = () => { const [postOnHoverHeight, setPostOnHoverHeight] = useState(0); const [deletePost, setDeletePost] = useState(false); const [moderatorPermissions, setModeratorPermissions] = useState({}); + const [executeAnonMode, setExecuteAnonMode] = useState(false); + + const setSelectedThreadCid = (cid) => { + selectedThreadCidRef.current = cid; + } + + useAnonModeRef(selectedThreadCidRef, anonymousMode && executeAnonMode); const { feed, hasMore, loadMore } = useFeed({subplebbitAddresses: account?.subscriptions, sortType: 'active'}); const [selectedFeed, setSelectedFeed] = useState(feed.sort((a, b) => b.timestamp - a.timestamp)); @@ -316,6 +328,13 @@ const Subscriptions = () => { }); + useEffect(() => { + if (anonymousMode) { + setExecuteAnonMode(true); + } + }, [anonymousMode, selectedThreadCidRef]); + + const { publishCommentEdit } = usePublishCommentEdit(publishCommentEditOptions); @@ -678,6 +697,7 @@ const Subscriptions = () => { onClick={(e) => { if (e.button === 2) return; e.preventDefault(); + setSelectedThreadCid(thread.cid); setIsReplyOpen(true); setSelectedShortCid(thread.shortCid); setSelectedParentCid(thread.cid); @@ -957,6 +977,7 @@ const Subscriptions = () => { onClick={(e) => { if (e.button === 2) return; e.preventDefault(); + setSelectedThreadCid(thread.cid); setIsReplyOpen(true); setSelectedShortCid(reply.shortCid); setSelectedParentCid(reply.cid); @@ -1390,6 +1411,7 @@ const Subscriptions = () => { onClick={(e) => { if (e.button === 2) return; e.preventDefault(); + setSelectedThreadCid(thread.cid); setIsReplyOpen(true); setSelectedShortCid(thread.shortCid); setSelectedParentCid(thread.cid); @@ -1562,6 +1584,7 @@ const Subscriptions = () => { onClick={(e) => { if (e.button === 2) return; e.preventDefault(); + setSelectedThreadCid(thread.cid); setIsReplyOpen(true); setSelectedShortCid(reply.shortCid); setSelectedParentCid(reply.cid); diff --git a/src/hooks/useAnonModeRef.js b/src/hooks/useAnonModeRef.js new file mode 100644 index 00000000..ed6b12a2 --- /dev/null +++ b/src/hooks/useAnonModeRef.js @@ -0,0 +1,32 @@ +import { useEffect } from "react"; +import { createAccount, setActiveAccount, useAccounts } from "@plebbit/plebbit-react-hooks"; +import useAnonModeStore from "./stores/useAnonModeStore"; + +const useAnonModeRef = (threadCidRef, execute) => { + const {accounts} = useAccounts(); + const { anonymousMode } = useAnonModeStore(); + + useEffect(() => { + const handleAnonMode = async () => { + let storedAccounts = JSON.parse(localStorage.getItem('storedAccounts')) || {}; + + if (!anonymousMode) return; + + if (!storedAccounts[threadCidRef.current] && execute) { + await createAccount(); + const lastAccount = accounts[accounts.length - 1]; + await setActiveAccount(lastAccount.name); + storedAccounts[threadCidRef.current] = lastAccount.name; + + localStorage.setItem('storedAccounts', JSON.stringify(storedAccounts)); + } else { + await setActiveAccount(storedAccounts[threadCidRef.current]); + } + } + + handleAnonMode(); + }, [threadCidRef, execute, accounts, anonymousMode]); + + return; +} +export default useAnonModeRef; \ No newline at end of file