External/5chan
1
0
Fork 0
mirror of https://github.com/bitsocialnet/5chan.git synced 2026-08-03 07:41:04 +02:00
Code Issues Packages Projects Releases Wiki Activity

updated reply modal states

Browse Source
This commit is contained in:
plebbitor
2023-04-12 21:56:25 +02:00
parent 322a7d3d23
commit d1f0fcd10c
4 changed files with 31 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/ReplyModal.jsx
+4 -3
View File
@@ -16,7 +16,8 @@ const ReplyModal = ({ isOpen, closeModal }) => {
setIsCaptchaOpen, setIsCaptchaOpen,
setPendingComment, setPendingComment,
selectedAddress, selectedAddress,
selectedReply, selectedParentCid,
selectedShortCid,
selectedStyle, selectedStyle,
selectedThread, selectedThread,
} = useGeneralStore(state => state); } = useGeneralStore(state => state);
@@ -113,7 +114,7 @@ const ReplyModal = ({ isOpen, closeModal }) => {
displayName: nameRef.current.value || undefined, displayName: nameRef.current.value || undefined,
content: commentRef.current.value || undefined, content: commentRef.current.value || undefined,
link: linkRef.current.value || undefined, link: linkRef.current.value || undefined,
parentCid: selectedReply, parentCid: selectedParentCid,
})); }));
}; };
@@ -172,7 +173,7 @@ const ReplyModal = ({ isOpen, closeModal }) => {
<Draggable handle=".modal-header" nodeRef={nodeRef}> <Draggable handle=".modal-header" nodeRef={nodeRef}>
<div className="modal-content" ref={nodeRef}> <div className="modal-content" ref={nodeRef}>
<div className="modal-header"> <div className="modal-header">
Reply to c/{selectedReply} Reply to c/{selectedShortCid}
<button className="icon" onClick={() => closeModal()} title="close" /> <button className="icon" onClick={() => closeModal()} title="close" />
</div> </div>
<div id="form"> <div id="form">
src/components/views/Board.jsx
+6 -5
View File
@@ -29,7 +29,8 @@ const Board = () => {
isSettingsOpen, setIsSettingsOpen, isSettingsOpen, setIsSettingsOpen,
setPendingComment, setPendingComment,
selectedAddress, setSelectedAddress, selectedAddress, setSelectedAddress,
setSelectedReply, setSelectedParentCid,
setSelectedShortCid,
selectedStyle, selectedStyle,
setSelectedThread, setSelectedThread,
selectedTitle, setSelectedTitle, selectedTitle, setSelectedTitle,
@@ -479,7 +480,7 @@ const Board = () => {
<Link to="" key={`pl1-${thread.cid}`} onClick={() => {}} title="Link to this post">c/</Link> <Link to="" key={`pl1-${thread.cid}`} onClick={() => {}} title="Link to this post">c/</Link>
<button id="reply-button" style={{ all: 'unset', cursor: 'pointer' }} key={`pl2-${thread.cid}`} <button id="reply-button" style={{ all: 'unset', cursor: 'pointer' }} key={`pl2-${thread.cid}`}
onClick={() => { onClick={() => {
setIsReplyOpen(true); setSelectedReply(thread.shortCid); setIsReplyOpen(true); setSelectedShortCid(thread.shortCid); setSelectedParentCid(thread.cid);
}} title="Reply to this post">{thread.shortCid}</button> }} title="Reply to this post">{thread.shortCid}</button>
&nbsp; &nbsp;
<span key={`rl1-${thread.cid}`}>&nbsp; <span key={`rl1-${thread.cid}`}>&nbsp;
@@ -572,7 +573,7 @@ const Board = () => {
<Link to="" key={`pl1-${reply.cid}`} onClick={() => {}} title="Link to this post">c/</Link> <Link to="" key={`pl1-${reply.cid}`} onClick={() => {}} title="Link to this post">c/</Link>
<button id="reply-button" style={{ all: 'unset', cursor: 'pointer' }} key={`pl2-${reply.cid}`} <button id="reply-button" style={{ all: 'unset', cursor: 'pointer' }} key={`pl2-${reply.cid}`}
onClick={() => { onClick={() => {
setIsReplyOpen(true); setSelectedReply(reply.shortCid); setIsReplyOpen(true); setSelectedShortCid(reply.shortCid); setSelectedParentCid(reply.cid);
}} title="Reply to this post">{reply.shortCid}</button> }} title="Reply to this post">{reply.shortCid}</button>
</span>&nbsp; </span>&nbsp;
<button key={`pmb-${reply.cid}`} className="post-menu-button" onClick={() => {}} title="Post menu" style={{ all: 'unset', cursor: 'pointer' }} data-cmd="post-menu">▶</button> <button key={`pmb-${reply.cid}`} className="post-menu-button" onClick={() => {}} title="Post menu" style={{ all: 'unset', cursor: 'pointer' }} data-cmd="post-menu">▶</button>
@@ -714,7 +715,7 @@ const Board = () => {
&nbsp; &nbsp;
<Link to="" key={`mob-no-${thread.cid}`} onClick={() => {}} title="Link to this post">c/</Link> <Link to="" key={`mob-no-${thread.cid}`} onClick={() => {}} title="Link to this post">c/</Link>
<button id="reply-button" style={{ all: 'unset', cursor: 'pointer' }} key={`mob-no2-${thread.cid}`} onClick={() => { <button id="reply-button" style={{ all: 'unset', cursor: 'pointer' }} key={`mob-no2-${thread.cid}`} onClick={() => {
setIsReplyOpen(true); setSelectedReply(thread.shortCid); setIsReplyOpen(true); setSelectedShortCid(thread.shortCid); setSelectedParentCid(thread.cid);
}} title="Reply to this post">{thread.shortCid}</button> }} title="Reply to this post">{thread.shortCid}</button>
</span> </span>
</div> </div>
@@ -810,7 +811,7 @@ const Board = () => {
{getDate(reply.timestamp)}&nbsp; {getDate(reply.timestamp)}&nbsp;
<Link to="" key={`mob-pl1-${reply.cid}`} onClick={() => {}} title="Link to this post">c/</Link> <Link to="" key={`mob-pl1-${reply.cid}`} onClick={() => {}} title="Link to this post">c/</Link>
<button id="reply-button" style={{ all: 'unset', cursor: 'pointer' }} key={`mob-pl2-${reply.cid}`} onClick={() => { <button id="reply-button" style={{ all: 'unset', cursor: 'pointer' }} key={`mob-pl2-${reply.cid}`} onClick={() => {
setIsReplyOpen(true); setSelectedReply(reply.shortCid); setIsReplyOpen(true); setSelectedShortCid(reply.shortCid); setSelectedParentCid(reply.cid)
}} title="Reply to this post">{reply.shortCid}</button> }} title="Reply to this post">{reply.shortCid}</button>
</span> </span>
</div> </div>
src/components/views/Thread.jsx
+15 -5
View File
@@ -29,6 +29,8 @@ const Thread = () => {
isSettingsOpen, setIsSettingsOpen, isSettingsOpen, setIsSettingsOpen,
setPendingComment, setPendingComment,
selectedAddress, setSelectedAddress, selectedAddress, setSelectedAddress,
setSelectedParentCid,
setSelectedShortCid,
selectedStyle, selectedStyle,
selectedThread, setSelectedThread, selectedThread, setSelectedThread,
selectedTitle, setSelectedTitle, selectedTitle, setSelectedTitle,
@@ -483,7 +485,9 @@ const Thread = () => {
&nbsp; &nbsp;
<span className="post-number"> <span className="post-number">
<Link to="" onClick={() => {}} title="Link to this post">c/</Link> <Link to="" onClick={() => {}} title="Link to this post">c/</Link>
<button id="reply-button" style={{ all: 'unset', cursor: 'pointer' }} onClick={() => setIsReplyOpen(true)} title="Reply to this post">{comment.shortCid}</button> <button id="reply-button" style={{ all: 'unset', cursor: 'pointer' }} onClick={() => {
setIsReplyOpen(true); setSelectedParentCid(comment.cid); setSelectedShortCid(comment.shortCid);
}} title="Reply to this post">{comment.shortCid}</button>
</span>&nbsp;&nbsp; </span>&nbsp;&nbsp;
<button key={`pmb-${comment.cid}`} className="post-menu-button" onClick={() => {}} title="Post menu" style={{ all: 'unset', cursor: 'pointer' }}>▶</button> <button key={`pmb-${comment.cid}`} className="post-menu-button" onClick={() => {}} title="Post menu" style={{ all: 'unset', cursor: 'pointer' }}>▶</button>
<div id="backlink-id" className="backlink"> <div id="backlink-id" className="backlink">
@@ -548,7 +552,9 @@ const Thread = () => {
&nbsp; &nbsp;
<span key={`pn-${reply.cid}`} className="post-number"> <span key={`pn-${reply.cid}`} className="post-number">
<Link to="" key={`pl1-${reply.cid}`} onClick={() => {}} title="Link to this post">c/</Link> <Link to="" key={`pl1-${reply.cid}`} onClick={() => {}} title="Link to this post">c/</Link>
<button id="reply-button" style={{ all: 'unset', cursor: 'pointer' }} key={`pl2-${reply.cid}`} onClick={() => setIsReplyOpen(true)} title="Reply to this post">{reply.shortCid}</button> <button id="reply-button" style={{ all: 'unset', cursor: 'pointer' }} key={`pl2-${reply.cid}`} onClick={() => {
setIsReplyOpen(true); setSelectedParentCid(reply.cid); setSelectedShortCid(reply.shortCid);
}} title="Reply to this post">{reply.shortCid}</button>
</span>&nbsp; </span>&nbsp;
<button key={`pmb-${reply.cid}`} className="post-menu-button" onClick={() => {}} title="Post menu" style={{ all: 'unset', cursor: 'pointer' }}>▶</button> <button key={`pmb-${reply.cid}`} className="post-menu-button" onClick={() => {}} title="Post menu" style={{ all: 'unset', cursor: 'pointer' }}>▶</button>
<div id="backlink-id" className="backlink"> <div id="backlink-id" className="backlink">
@@ -671,8 +677,10 @@ const Thread = () => {
<span key={`mob-dt-${comment.cid}`} className="date-time-mobile"> <span key={`mob-dt-${comment.cid}`} className="date-time-mobile">
{getDate(comment?.timestamp)} {getDate(comment?.timestamp)}
&nbsp; &nbsp;
<button id="reply-button" style={{ all: 'unset', cursor: 'pointer' }} key={`mob-no-${comment.cid}`} onClick={() => setIsReplyOpen(true)} title="Link to this post">c/</button> <button id="reply-button" style={{ all: 'unset', cursor: 'pointer' }} key={`mob-no-${comment.cid}`} onClick={() => {
<Link to="" key={`mob-no2-${comment.cid}`} onClick={() => {}} title="Reply to this post">{comment.cid?.slice(0, 8)}</Link> setIsReplyOpen(true); setSelectedParentCid(comment.cid); setSelectedShortCid(comment.shortCid);
}} title="Link to this post">c/</button>
<Link to="" key={`mob-no2-${comment.cid}`} onClick={() => {}} title="Reply to this post">{comment.shortCid}</Link>
</span> </span>
</div> </div>
{commentMediaInfo?.url ? ( {commentMediaInfo?.url ? (
@@ -753,7 +761,9 @@ const Thread = () => {
<span key={`mob-dt-${reply.cid}`} className="date-time-mobile"> <span key={`mob-dt-${reply.cid}`} className="date-time-mobile">
{getDate(reply?.timestamp)}&nbsp; {getDate(reply?.timestamp)}&nbsp;
<Link to="" key={`mob-pl1-${reply.cid}`} onClick={() => {}} title="Link to this post">c/</Link> <Link to="" key={`mob-pl1-${reply.cid}`} onClick={() => {}} title="Link to this post">c/</Link>
<button id="reply-button" style={{ all: 'unset', cursor: 'pointer' }} key={`mob-pl2-${reply.cid}`} onClick={() => setIsReplyOpen(true)} title="Reply to this post">{reply.shortCid}</button> <button id="reply-button" style={{ all: 'unset', cursor: 'pointer' }} key={`mob-pl2-${reply.cid}`} onClick={() => {
setIsReplyOpen(true); setSelectedParentCid(reply.cid); setSelectedShortCid(reply.shortCid);
}} title="Reply to this post">{reply.shortCid}</button>
</span> </span>
</div> </div>
<blockquote key={`mob-pm-${reply.cid}`} className="post-message-mobile"> <blockquote key={`mob-pm-${reply.cid}`} className="post-message-mobile">
src/hooks/stores/useGeneralStore.js
+6 -3
View File
@@ -34,9 +34,12 @@ const useGeneralStore = create((set) => ({
selectedAddress: '', selectedAddress: '',
setSelectedAddress: (address) => set({ selectedAddress: address }), setSelectedAddress: (address) => set({ selectedAddress: address }),
selectedReply: '', selectedParentCid: '',
setSelectedReply: (reply) => set({ selectedReply: reply }), setSelectedParentCid: (parentCid) => set({ selectedParentCid: parentCid }),
selectedShortCid: '',
setSelectedShortCid: (shortCid) => set({ selectedShortCid: shortCid }),
selectedStyle: localStorage.getItem('selectedStyle') || 'Yotsuba', selectedStyle: localStorage.getItem('selectedStyle') || 'Yotsuba',
setSelectedStyle: (style) => { setSelectedStyle: (style) => {