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

Merge pull request #97 from plebbit/development

Browse Source 
Development
This commit is contained in:
plebeius.eth
2023-06-08 22:30:13 +02:00
committed by GitHub
parent 0c18d2e89c 3d2e699425
commit 6a3ebee3b7
11 changed files with 105 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/EditLabel.jsx
+20 -12
View File
@@ -1,4 +1,4 @@
import React from "react";
import React, { useState } from "react";
import { useComment, useEditedComment } from "@plebbit/plebbit-react-hooks";
import { Link } from "react-router-dom";
import OriginalCommentModal from "./modals/OriginalCommentModal";
@@ -6,33 +6,41 @@ import getDate from "../utils/getDate";
const EditLabel = ({ commentCid, className }) => {
const [isOriginalCommentModalOpen, setIsOriginalCommentModalOpen] = React.useState(false);
const [isOriginalCommentModalOpen, setIsOriginalCommentModalOpen] = useState(false);
const comment = useComment({commentCid});
const timestamp = getDate(comment.edit?.timestamp);
const {state: editedCommentState, editedComment} = useEditedComment({comment});
return (
<>
<OriginalCommentModal
isOpen={isOriginalCommentModalOpen}
closeModal={() => setIsOriginalCommentModalOpen(false)}
comment={comment}/>
{editedComment && (
{editedComment || comment.edit ? (
<>
<br />
<span className={className}>
{editedCommentState === 'succeeded' && (
{comment.removed ? (
<>
(Edited at {timestamp}, <Link className="ttl-link" onClick={
() => setIsOriginalCommentModalOpen(true)
}>show original</Link>)
(This post has been removed)
</>
)}
{editedCommentState === 'pending' && ("(Pending Edit)")}
{editedCommentState === 'failed' && ("(Failed Edit)")}
) : (
<>
{comment.edit ? (
<>
(Edited at {timestamp}, <Link className="ttl-link" onClick={
() => setIsOriginalCommentModalOpen(true)
}>show original</Link>)
</>
) : null}
{editedCommentState === 'pending' && ("(Pending edit)")}
{editedCommentState === 'failed' && ("(Failed edit)")}
</>
)}
</span>
</>
)}
) : null}
</>
);
};
src/components/StateLabel.jsx
+36 -13
View File
@@ -1,22 +1,45 @@
import React from "react";
import { useComment } from "@plebbit/plebbit-react-hooks";
import React, { useState, useEffect } from "react";
import { useAccountComment } from "@plebbit/plebbit-react-hooks";
import useStateString from "../hooks/useStateString";
const StateLabel = ({ commentCid, className }) => {
const comment = useComment({commentCid});
const StateLabel = ({ commentIndex, className }) => {
const comment = useAccountComment({commentIndex: commentIndex});
const stateString = useStateString(comment);
const [isLoading, setIsLoading] = useState(true);
useEffect(() => {
const timer = setTimeout(() => setIsLoading(false), 2000);
return () => clearTimeout(timer);
}, []);
if (commentIndex === undefined) return null;
console.log(commentIndex, stateString, comment);
return (
comment.state === "succeeded" ? null : (
<span className={className}>
<>
commentIndex && stateString !== "Succeeded" ? (
(comment.state === "failed" || (stateString === undefined && !isLoading)) ? (
<span className="ttl">
<br />
{stateString || comment.state.charAt(0).toUpperCase() + comment.state.slice(1)}
</>
</span>
)
)
(
<span className="ttl">
Failed
</span>
)
</span>
) : (
<span className="ttl">
<br />
(
<span className={className}>
{stateString}
</span>
)
</span>
)
) : null
);
};
export default StateLabel;
src/components/modals/ModerationModal.jsx
+5 -4
View File
@@ -26,7 +26,7 @@ const ModerationModal = ({ isOpen, closeModal, deletePost }) => {
const [reason, setReason] = useState('');
const [triggerPublishCommentEdit, setTriggerPublishCommentEdit] = useState(false);
const setErrorMessage = useError();
const [errorMessage, setErrorMessage] = useError();
const setSuccessMessage = useSuccess();
@@ -120,11 +120,12 @@ const ModerationModal = ({ isOpen, closeModal, deletePost }) => {
const {error, publishCommentEdit } = usePublishCommentEdit(publishCommentEditOptions);
useEffect(() => {
if (error) {
setErrorMessage(error);
if (error && error !== errorMessage) {
setErrorMessage(error);
}
}, [error, setErrorMessage]);
}, [error, setErrorMessage, errorMessage]);
useEffect(() => {
src/components/views/All.jsx
+4 -4
View File
@@ -46,7 +46,7 @@ const All = () => {
const account = useAccount();
const navigate = useNavigate();
const setErrorMessage = useError();
const [errorMessage, setErrorMessage] = useError();
const threadMenuRefs = useRef({});
const replyMenuRefs = useRef({});
@@ -85,10 +85,10 @@ const All = () => {
}, [subplebbits])
useEffect(() => {
if (errorString) {
setErrorMessage(errorString)
if (errorString && errorString !== errorMessage) {
setErrorMessage(errorString);
}
}, [errorString, setErrorMessage])
}, [errorString, setErrorMessage, errorMessage]);
useEffect(() => {
src/components/views/Board.jsx
+14 -14
View File
@@ -69,7 +69,7 @@ const Board = () => {
const navigate = useNavigate();
const { subplebbitAddress } = useParams();
const setErrorMessage = useError();
const [errorMessage, setErrorMessage] = useError();
const setSuccessMessage = useSuccess();
const nameRef = useRef();
@@ -157,10 +157,10 @@ const Board = () => {
useEffect(() => {
if (errorString) {
if (errorString && errorString !== errorMessage) {
setErrorMessage(errorString);
}
}, [errorString, setErrorMessage]);
}, [errorString, setErrorMessage, errorMessage]);
const flattenedRepliesByThread = useMemo(() => {
@@ -411,10 +411,10 @@ const Board = () => {
const {error, publishCommentEdit } = usePublishCommentEdit(publishCommentEditOptions);
useEffect(() => {
if (error) {
setErrorMessage(error);
if (error && error !== errorMessage) {
setErrorMessage(error);
}
}, [error, setErrorMessage]);
}, [error, setErrorMessage, errorMessage]);
const handleAuthorDeleteClick = (commentCid) => {
@@ -1019,7 +1019,7 @@ const Board = () => {
commentCid={thread.cid}
className="ttl"/>
<StateLabel key={`state-label-thread-${index}`}
commentCid={thread.cid}
commentIndex={thread.index}
className="ttl ellipsis"/>
<br key={`ttl-s-br2${index}`} />
Post too long.&nbsp;
@@ -1034,7 +1034,7 @@ const Board = () => {
commentCid={thread.cid}
className="ttl"/>
<StateLabel key={`state-label-thread-${index}`}
commentCid={thread.cid}
commentIndex={thread.index}
className="ttl ellipsis"/>
</blockquote>)
: null}
@@ -1337,7 +1337,7 @@ const Board = () => {
commentCid={reply.cid}
className="ttl"/>
<StateLabel key={`state-label-reply-${index}`}
commentCid={reply.cid}
commentIndex={reply.index}
className="ttl ellipsis"/>
<br key={`ttl-s-br2${index}`} />
Comment too long.&nbsp;
@@ -1377,7 +1377,7 @@ const Board = () => {
commentCid={reply.cid}
className="ttl"/>
<StateLabel key={`state-label-reply-${index}`}
commentCid={reply.cid}
commentIndex={reply.index}
className="ttl ellipsis"/>
</blockquote>)
: null}
@@ -1520,7 +1520,7 @@ const Board = () => {
commentCid={thread.cid}
className="ttl"/>
<StateLabel key={`state-label-thread-mob-${index}`}
commentCid={thread.cid}
commentIndex={thread.index}
className="ttl ellipsis"/>
<br key={`mob-ttl-s-br2${thread.cid}`} />
Post too long.&nbsp;
@@ -1534,7 +1534,7 @@ const Board = () => {
commentCid={thread.cid}
className="ttl"/>
<StateLabel key={`state-label-thread-mob-${index}`}
commentCid={thread.cid}
commentIndex={thread.index}
className="ttl ellipsis"/>
</blockquote>)
: null}
@@ -1682,7 +1682,7 @@ const Board = () => {
commentCid={reply.cid}
className="ttl"/>
<StateLabel key={`state-label-reply-mob-${index}`}
commentCid={reply.cid}
commentIndex={reply.index}
className="ttl ellipsis"/>
<br key={`mob-ttl-s-br2${reply.cid}`} />
Comment too long.&nbsp;
@@ -1705,7 +1705,7 @@ const Board = () => {
commentCid={reply.cid}
className="ttl"/>
<StateLabel key={`state-label-reply-mob-${index}`}
commentCid={reply.cid}
commentIndex={reply.index}
className="ttl ellipsis"/>
</blockquote>)
: null}
src/components/views/Catalog.jsx
+6 -6
View File
@@ -60,7 +60,7 @@ const Catalog = () => {
const navigate = useNavigate();
const setErrorMessage = useError();
const [errorMessage, setErrorMessage] = useError();
const setSuccessMessage = useSuccess();
const [triggerPublishComment, setTriggerPublishComment] = useState(false);
@@ -140,10 +140,10 @@ const Catalog = () => {
useEffect(() => {
if (errorString) {
if (errorString && errorString !== errorMessage) {
setErrorMessage(errorString);
}
}, [errorString, setErrorMessage]);
}, [errorString, setErrorMessage, errorMessage]);
const { subscribed, subscribe, unsubscribe } = useSubscribe({subplebbitAddress: selectedAddress});
@@ -336,10 +336,10 @@ const Catalog = () => {
const {error, publishCommentEdit } = usePublishCommentEdit(publishCommentEditOptions);
useEffect(() => {
if (error) {
setErrorMessage(error);
if (error && error !== errorMessage) {
setErrorMessage(error);
}
}, [error, setErrorMessage]);
}, [error, setErrorMessage, errorMessage]);
const handleAuthorDeleteClick = (commentCid) => {
src/components/views/Pending.jsx
+3 -3
View File
@@ -34,7 +34,7 @@ const Pending = () => {
const account = useAccount();
const comment = useAccountComment({commentIndex: index});
const setErrorMessage = useError();
const [errorMessage, setErrorMessage] = useError();
useEffect(() => {
setSelectedAddress(comment?.subplebbitAddress);
@@ -53,10 +53,10 @@ const Pending = () => {
}, [comment?.state, comment?.error, index])
useEffect(() => {
if (errorString) {
if (errorString && errorString !== errorMessage) {
setErrorMessage(errorString);
}
}, [errorString, setErrorMessage]);
}, [errorString, setErrorMessage, errorMessage]);
const [visible] = useState(true);
src/components/views/Subscriptions.jsx
+4 -4
View File
@@ -47,7 +47,7 @@ const Subscriptions = () => {
const account = useAccount();
const navigate = useNavigate();
const setErrorMessage = useError();
const [errorMessage, setErrorMessage] = useError();
const threadMenuRefs = useRef({});
const replyMenuRefs = useRef({});
@@ -84,10 +84,10 @@ const Subscriptions = () => {
}, [subplebbits])
useEffect(() => {
if (errorString) {
setErrorMessage(errorString)
if (errorString && errorString !== errorMessage) {
setErrorMessage(errorString);
}
}, [errorString, setErrorMessage])
}, [errorString, setErrorMessage, errorMessage]);
useEffect(() => {
src/components/views/Thread.jsx
+11 -10
View File
@@ -68,7 +68,7 @@ const Thread = () => {
const navigate = useNavigate();
const handleClickForm = useClickForm();
const setErrorMessage = useError();
const [errorMessage, setErrorMessage] = useError();
const setSuccessMessage = useSuccess();
const nameRef = useRef();
@@ -171,10 +171,10 @@ const Thread = () => {
useEffect(() => {
if (errorString) {
if (errorString && errorString !== errorMessage) {
setErrorMessage(errorString);
}
}, [errorString, setErrorMessage]);
}, [errorString, setErrorMessage, errorMessage]);
const flattenedReplies = useMemo(() =>
@@ -384,10 +384,11 @@ const Thread = () => {
const {error, publishCommentEdit } = usePublishCommentEdit(publishCommentEditOptions);
useEffect(() => {
if (error) {
setErrorMessage(error);
if (error && error !== errorMessage) {
setErrorMessage(error);
}
}, [error, setErrorMessage]);
}, [error, setErrorMessage, errorMessage]);
const handleAuthorDeleteClick = (commentCid) => {
@@ -971,7 +972,7 @@ const Thread = () => {
commentCid={comment.cid}
className="ttl"/>
<StateLabel key={`state-label-thread-${index}`}
commentCid={comment.cid}
commentIndex={comment.index}
className="ttl ellipsis"/>
</blockquote>
</div>
@@ -1250,7 +1251,7 @@ const Thread = () => {
commentCid={reply.cid}
className="ttl"/>
<StateLabel key={`state-label-reply-${index}`}
commentCid={reply.cid}
commentIndex={reply.index}
className="ttl ellipsis"/>
</blockquote>
</div>
@@ -1373,7 +1374,7 @@ const Thread = () => {
commentCid={comment.cid}
className="ttl"/>
<StateLabel key={`state-label-thread-mob-${index}`}
commentCid={comment.cid}
commentIndex={comment.index}
className="ttl ellipsis"/>
</>
) : null}
@@ -1498,7 +1499,7 @@ const Thread = () => {
commentCid={reply.cid}
className="ttl"/>
<StateLabel key={`state-label-reply-mob-${index}`}
commentCid={reply.cid}
commentIndex={reply.index}
className="ttl ellipsis"/>
</blockquote>
{reply.replyCount > 0 ? (
src/hooks/useError.js
+1 -1
View File
@@ -37,7 +37,7 @@ const useError = () => {
setRenderCount(prevCount => prevCount + 1);
};
return setNewErrorMessage;
return [errorMessage, setNewErrorMessage];
};
export default useError;
src/hooks/useSuccess.js
+1 -1
View File
@@ -37,7 +37,7 @@ const useSuccess = () => {
setRenderCount(prevCount => prevCount + 1);
};
return setNewSuccessMessage;
return [successMessage, setNewSuccessMessage];
};
export default useSuccess;