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

add PendingLabel component

Browse Source
This commit is contained in:
plebeius.eth
2023-06-15 14:17:33 +02:00
parent ae2417dabc
commit cb90be9d1a
5 changed files with 46 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/PendingLabel.jsx
+33
View File
@@ -0,0 +1,33 @@
import React, { useState, useEffect } from "react";
import { useAccountComment } from "@plebbit/plebbit-react-hooks";
import useStateString from "../hooks/useStateString";
const PendingLabel = ({ commentIndex }) => {
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;
return (
commentIndex && stateString !== "Succeeded" ? (
(comment.state === "failed" || (stateString === undefined && !isLoading)) ? (
<span style={{color: 'red', fontWeight: '700'}}>
Failed
</span>
) : (
<span style={{color: 'red', fontWeight: '700'}}>
Pending
</span>
)
) : null
);
};
export default PendingLabel;
src/components/views/All.jsx
+3 -2
View File
@@ -17,6 +17,7 @@ import EditLabel from '../EditLabel';
import ImageBanner from '../ImageBanner';
import ModerationModal from '../modals/ModerationModal';
import OfflineIndicator from '../OfflineIndicator';
import PendingLabel from '../PendingLabel';
import Post from '../Post';
import PostLoader from '../PostLoader';
import PostOnHover from '../PostOnHover';
@@ -951,7 +952,7 @@ const All = () => {
setSelectedAddress(thread.subplebbitAddress);
}} title="Reply to this post">{reply.shortCid}</Link>
) : (
<span key="pending" style={{color: 'red', fontWeight: '700'}}>Pending</span>
<PendingLabel key="pending" commentIndex={reply.index} />
)}
&nbsp;p/
<Link key={`p-t-${index}`} to={`/p/${thread.subplebbitAddress}`} id="reply-button" title="Visit this board">
@@ -1557,7 +1558,7 @@ const All = () => {
}} title="Reply to this post">{reply.shortCid}
</Link>
) : (
<span key="pending" style={{color: 'red', fontWeight: '700'}}>Pending</span>
<PendingLabel key="pending-mob" commentIndex={reply.index} />
)}
</span>
</div>
src/components/views/Board.jsx
+3 -2
View File
@@ -17,6 +17,7 @@ import EditLabel from '../EditLabel';
import ImageBanner from '../ImageBanner';
import ModerationModal from '../modals/ModerationModal';
import OfflineIndicator from '../OfflineIndicator';
import PendingLabel from '../PendingLabel';
import Post from '../Post';
import PostLoader from '../PostLoader';
import PostOnHover from '../PostOnHover';
@@ -1134,7 +1135,7 @@ const Board = () => {
setSelectedParentCid(reply.cid);
}} title="Reply to this post">{reply.shortCid}</Link>
) : (
<span key="pending" style={{color: 'red', fontWeight: '700'}}>Pending</span>
<PendingLabel key="pending" commentIndex={reply.index} />
)}
</span>&nbsp;
<PostMenu
@@ -1689,7 +1690,7 @@ const Board = () => {
}} title="Reply to this post">{reply.shortCid}
</Link>
) : (
<span key="pending" style={{color: 'red', fontWeight: '700'}}>Pending</span>
<PendingLabel key="pending-mob" commentIndex={reply.index} />
)}
</span>
</div>
src/components/views/Subscriptions.jsx
+4 -3
View File
@@ -17,6 +17,7 @@ import EditLabel from '../EditLabel';
import ImageBanner from '../ImageBanner';
import ModerationModal from '../modals/ModerationModal';
import OfflineIndicator from '../OfflineIndicator';
import PendingLabel from '../PendingLabel';
import Post from '../Post';
import PostLoader from '../PostLoader';
import PostOnHover from '../PostOnHover';
@@ -962,8 +963,8 @@ const Subscriptions = () => {
setSelectedAddress(thread.subplebbitAddress);
}} title="Reply to this post">{reply.shortCid}</Link>
) : (
<span key="pending" style={{color: 'red', fontWeight: '700'}}>Pending</span>
)}
<PendingLabel key="pending" commentIndex={reply.index} />
)}
&nbsp;p/
<Link key={`p-t-${index}`} to={`/p/${thread.subplebbitAddress}`} id="reply-button" title="Visit this board">
{thread.subplebbitAddress.includes(".eth") ?
@@ -1568,7 +1569,7 @@ const Subscriptions = () => {
}} title="Reply to this post">{reply.shortCid}
</Link>
) : (
<span key="pending" style={{color: 'red', fontWeight: '700'}}>Pending</span>
<PendingLabel key="pending-mob" commentIndex={reply.index} />
)}
</span>
</div>
src/components/views/Thread.jsx
+3 -2
View File
@@ -16,6 +16,7 @@ import EditLabel from '../EditLabel';
import ImageBanner from '../ImageBanner';
import ModerationModal from '../modals/ModerationModal';
import OfflineIndicator from '../OfflineIndicator';
import PendingLabel from '../PendingLabel';
import Post from '../Post';
import PostLoader from '../PostLoader';
import PostOnHover from '../PostOnHover';
@@ -1051,7 +1052,7 @@ const Thread = () => {
setIsReplyOpen(true); setSelectedParentCid(reply.cid); setSelectedShortCid(reply.shortCid);
}} title="Reply to this post">{reply.shortCid}</button>
) : (
<span key="pending" style={{color: 'red', fontWeight: '700'}}>Pending</span>
<PendingLabel key="pending" commentIndex={reply.index} />
)}
</span>&nbsp;
<PostMenu
@@ -1490,7 +1491,7 @@ const Thread = () => {
setIsReplyOpen(true); setSelectedParentCid(reply.cid); setSelectedShortCid(reply.shortCid);
}} title="Reply to this post">{reply.shortCid}</button>
) : (
<span key="pending" style={{color: 'red', fontWeight: '700'}}>Pending</span>
<PendingLabel key="pending-mob" commentIndex={reply.index} />
)}
</span>
</div>