+
+
+ );
+};
+
+const ModQueueViewSelector = () => {
+ const { t } = useTranslation();
+ const { viewMode, setViewMode } = useModQueueStore();
+ return (
+
+
+
+ );
+};
+
const ShowOPCommentOption = () => {
const { t } = useTranslation();
const { showOPComment, setShowOPComment } = useCatalogStyleStore();
@@ -353,6 +445,8 @@ export const MobileBoardButtons = () => {
isInModQueueView={isInModQueueView}
/>
)}
- {!isInPostPageView && !isReply && !isHidden && (
+ {!isInPostPageView && !isReply && !isHidden && !isModQueue && (
[
!cid && e.preventDefault()}>
@@ -213,8 +244,41 @@ const PostInfo = ({ post, postReplyCount = 0, roles, isHidden, threadNumber }: P
]
)}
+ {isModQueue && (
+
+ {modQueueStatus === 'approved' ? (
+ {t('approved')}
+ ) : modQueueStatus === 'rejected' ? (
+ {t('rejected')}
+ ) : modQueueStatus === 'failed' ? (
+
+ {t('failed')}
+ {modQueueError ? `: ${modQueueError}` : ''}
+
+ ) : isPublishing ? (
+
- {showReplies ? (
+ {showReplies || isModQueue ? (
@@ -485,7 +561,19 @@ const PostDesktop = ({ post, roles, showAllReplies, showReplies = true, targetRe
isInSubscriptionsView={isInSubscriptionsView}
/>
)}
-
diff --git a/src/components/post-form/post-form.module.css b/src/components/post-form/post-form.module.css
index a16a7855..8e839b96 100644
--- a/src/components/post-form/post-form.module.css
+++ b/src/components/post-form/post-form.module.css
@@ -18,6 +18,18 @@
margin-top: -3px;
}
+.modQueueTitle {
+ font-size: 1.5em;
+ font-weight: bold;
+ padding: 10px 0;
+}
+
+@media (min-width: 640px) {
+ .modQueueTitle {
+ font-size: 1em;
+ }
+}
+
.closed {
font-size: x-large;
text-align: center;
diff --git a/src/components/post-form/post-form.tsx b/src/components/post-form/post-form.tsx
index fb71d823..d920e83b 100644
--- a/src/components/post-form/post-form.tsx
+++ b/src/components/post-form/post-form.tsx
@@ -8,7 +8,7 @@ import useSubplebbitsPagesStore from '@plebbit/plebbit-react-hooks/dist/stores/s
import { getHasThumbnail, getLinkMediaInfo } from '../../lib/utils/media-utils';
import { formatMarkdown } from '../../lib/utils/post-utils';
import { isValidURL } from '../../lib/utils/url-utils';
-import { isAllView, isCatalogView, isModView, isPostPageView, isSubscriptionsView } from '../../lib/utils/view-utils';
+import { isAllView, isCatalogView, isModQueueView, isModView, isPostPageView, isSubscriptionsView } from '../../lib/utils/view-utils';
import { useDefaultSubplebbits } from '../../hooks/use-default-subplebbits';
import { useResolvedSubplebbitAddress } from '../../hooks/use-resolved-subplebbit-address';
import useFetchGifFirstFrame from '../../hooks/use-fetch-gif-first-frame';
@@ -373,6 +373,7 @@ const PostForm = () => {
const isInPostView = isPostPageView(location.pathname, params);
const isInAllView = isAllView(location.pathname);
const isInModView = isModView(location.pathname);
+ const isInModQueueView = isModQueueView(location.pathname);
const isInSubscriptionsView = isSubscriptionsView(location.pathname, params);
const isInCatalogView = isCatalogView(location.pathname, params);
@@ -398,7 +399,9 @@ const PostForm = () => {
<>
{!(isInAllView || isInSubscriptionsView || isInModView) && showForm &&
{t('moderation_queue')}
+ ) : isThreadClosed ? (
{t('thread_closed')}
@@ -418,7 +421,9 @@ const PostForm = () => {
@@ -418,7 +421,9 @@ const PostForm = () => {
{!(isInAllView || isInSubscriptionsView || isInModView) && showForm && {getFormattedDate(timestamp)}} content={getFormattedTimeAgo(timestamp)} />{' '}
+ {isInModQueueView && isOverThreshold ? (
+ <>
+ {getFormattedDate(timestamp)}} content={getFormattedTimeAgo(timestamp)} /> (
+ {getFormattedTimeAgo(timestamp)})
+
+ ) : (
+ {getFormattedDate(timestamp)}} content={getFormattedTimeAgo(timestamp)} />
+ )}{' '}
{cid ? (
{
);
};
-const PostMobile = ({ post, roles, showAllReplies, showReplies = true, targetReplyCid }: PostProps) => {
+const PostMobile = ({
+ post,
+ roles,
+ showAllReplies,
+ showReplies = true,
+ targetReplyCid,
+ isModQueue,
+ modQueueStatus,
+ modQueueError,
+ isPublishing,
+ onApprove,
+ onReject,
+}: PostProps) => {
const { t } = useTranslation();
const { author, cid, pinned, postCid, replyCount, state, subplebbitAddress } = post || {};
const params = useParams();
@@ -356,12 +387,12 @@ const PostMobile = ({ post, roles, showAllReplies, showReplies = true, targetRep
) : (
{t('moderation_queue')}
+ ) : isThreadClosed ? (
{t('thread_closed')}
diff --git a/src/components/post-mobile/post-mobile.tsx b/src/components/post-mobile/post-mobile.tsx index c1664f1a..c67741a5 100644 --- a/src/components/post-mobile/post-mobile.tsx +++ b/src/components/post-mobile/post-mobile.tsx @@ -9,7 +9,8 @@ import { shouldShowSnow } from '../../lib/snow'; import { getHasThumbnail } from '../../lib/utils/media-utils'; import { getTextColorForBackground, hashStringToColor } from '../../lib/utils/post-utils'; import { getFormattedDate, getFormattedTimeAgo } from '../../lib/utils/time-utils'; -import { isAllView, isPendingPostView, isPostPageView, isSubscriptionsView } from '../../lib/utils/view-utils'; +import { isAllView, isModQueueView, isPendingPostView, isPostPageView, isSubscriptionsView } from '../../lib/utils/view-utils'; +import useModQueueStore from '../../stores/use-mod-queue-store'; import { useDefaultSubplebbits } from '../../hooks/use-default-subplebbits'; import { getBoardPath } from '../../lib/utils/route-utils'; import useAvatarVisibilityStore from '../../stores/use-avatar-visibility-store'; @@ -52,10 +53,21 @@ const PostInfoAndMedia = ({ post, postReplyCount = 0, roles, threadNumber }: Pos const isInAllView = isAllView(location.pathname); const isInPostPageView = isPostPageView(location.pathname, params); const isInSubscriptionsView = isSubscriptionsView(location.pathname, params); + const isInModQueueView = isModQueueView(location.pathname); + const { getAlertThresholdSeconds } = useModQueueStore(); const commentMediaInfo = useCommentMediaInfo(link, thumbnailUrl, linkWidth, linkHeight); const hasThumbnail = getHasThumbnail(commentMediaInfo, link); + // Check if post is awaiting approval and over threshold (for mod queue view) + const approved = post?.approved; + const alreadyApproved = approved === true; + const alreadyRejected = removed === true; + const isAwaitingApproval = isInModQueueView && !alreadyApproved && !alreadyRejected; + const timeWaiting = timestamp ? Date.now() / 1000 - timestamp : 0; + const alertThresholdSeconds = getAlertThresholdSeconds(); + const isOverThreshold = isAwaitingApproval && timeWaiting > alertThresholdSeconds; + const stateString = useStateString(post); const postMenuProps = useMemo(() => selectPostMenuProps(post), [post]); @@ -176,7 +188,14 @@ const PostInfoAndMedia = ({ post, postReplyCount = 0, roles, threadNumber }: Pos Board: {boardPath}
)}
- diff --git a/src/components/post-mobile/post-mobile.tsx b/src/components/post-mobile/post-mobile.tsx index c1664f1a..c67741a5 100644 --- a/src/components/post-mobile/post-mobile.tsx +++ b/src/components/post-mobile/post-mobile.tsx @@ -9,7 +9,8 @@ import { shouldShowSnow } from '../../lib/snow'; import { getHasThumbnail } from '../../lib/utils/media-utils'; import { getTextColorForBackground, hashStringToColor } from '../../lib/utils/post-utils'; import { getFormattedDate, getFormattedTimeAgo } from '../../lib/utils/time-utils'; -import { isAllView, isPendingPostView, isPostPageView, isSubscriptionsView } from '../../lib/utils/view-utils'; +import { isAllView, isModQueueView, isPendingPostView, isPostPageView, isSubscriptionsView } from '../../lib/utils/view-utils'; +import useModQueueStore from '../../stores/use-mod-queue-store'; import { useDefaultSubplebbits } from '../../hooks/use-default-subplebbits'; import { getBoardPath } from '../../lib/utils/route-utils'; import useAvatarVisibilityStore from '../../stores/use-avatar-visibility-store'; @@ -52,10 +53,21 @@ const PostInfoAndMedia = ({ post, postReplyCount = 0, roles, threadNumber }: Pos const isInAllView = isAllView(location.pathname); const isInPostPageView = isPostPageView(location.pathname, params); const isInSubscriptionsView = isSubscriptionsView(location.pathname, params); + const isInModQueueView = isModQueueView(location.pathname); + const { getAlertThresholdSeconds } = useModQueueStore(); const commentMediaInfo = useCommentMediaInfo(link, thumbnailUrl, linkWidth, linkHeight); const hasThumbnail = getHasThumbnail(commentMediaInfo, link); + // Check if post is awaiting approval and over threshold (for mod queue view) + const approved = post?.approved; + const alreadyApproved = approved === true; + const alreadyRejected = removed === true; + const isAwaitingApproval = isInModQueueView && !alreadyApproved && !alreadyRejected; + const timeWaiting = timestamp ? Date.now() / 1000 - timestamp : 0; + const alertThresholdSeconds = getAlertThresholdSeconds(); + const isOverThreshold = isAwaitingApproval && timeWaiting > alertThresholdSeconds; + const stateString = useStateString(post); const postMenuProps = useMemo(() => selectPostMenuProps(post), [post]); @@ -176,7 +188,14 @@ const PostInfoAndMedia = ({ post, postReplyCount = 0, roles, threadNumber }: Pos Board: {boardPath}
- {showReplies && (
+ {(showReplies || isModQueue) && (
)}
-
+
;
+type PersistedModQueueData = Pick;
const useModQueueStore = create()(
persist(
@@ -30,8 +34,10 @@ const useModQueueStore = create()(
alertThresholdValue: 6,
alertThresholdUnit: 'hours' as AlertThresholdUnit,
selectedBoardFilter: null,
+ viewMode: 'compact',
setAlertThreshold: (value, unit) => set({ alertThresholdValue: value, alertThresholdUnit: unit }),
setSelectedBoardFilter: (boardAddress) => set({ selectedBoardFilter: boardAddress }),
+ setViewMode: (viewMode) => set({ viewMode }),
getAlertThresholdSeconds: () => {
const { alertThresholdValue, alertThresholdUnit } = get();
return alertThresholdUnit === 'hours' ? alertThresholdValue * 3600 : alertThresholdValue * 60;
@@ -39,7 +45,7 @@ const useModQueueStore = create()(
}),
{
name: 'mod-queue-storage',
- version: 1,
+ version: 2,
// Migrate old alertThresholdHours format to new alertThresholdValue/alertThresholdUnit format
migrate: (persistedState, version): ModQueueState => {
const state = persistedState as OldPersistedState;
@@ -48,6 +54,7 @@ const useModQueueStore = create()(
alertThresholdValue: state.alertThresholdHours,
alertThresholdUnit: 'hours' as AlertThresholdUnit,
selectedBoardFilter: state.selectedBoardFilter ?? null,
+ viewMode: state.viewMode ?? 'compact',
};
// Zustand will merge this with the store definition (which includes methods)
return migrated as ModQueueState;
@@ -57,6 +64,7 @@ const useModQueueStore = create()(
alertThresholdValue: state.alertThresholdValue ?? 6,
alertThresholdUnit: state.alertThresholdUnit ?? 'hours',
selectedBoardFilter: state.selectedBoardFilter ?? null,
+ viewMode: state.viewMode ?? 'compact',
};
return current as ModQueueState;
},
diff --git a/src/views/mod-queue/mod-queue.module.css b/src/views/mod-queue/mod-queue.module.css
index fef3d539..2fa9bb2c 100644
--- a/src/views/mod-queue/mod-queue.module.css
+++ b/src/views/mod-queue/mod-queue.module.css
@@ -233,6 +233,52 @@
display: inline;
}
+.mobileCard {
+ border: var(--mod-queue-table-border);
+ background: var(--post-mobile-background-color, transparent);
+ padding: 8px;
+ margin: 6px 0;
+ display: flex;
+ flex-direction: column;
+ gap: 6px;
+}
+
+.cardHeader {
+ display: flex;
+ justify-content: space-between;
+ font-size: 9pt;
+ font-weight: bold;
+}
+
+.cardNumber {
+ color: var(--body-font-color);
+}
+
+.cardTime {
+ white-space: nowrap;
+}
+
+.cardContent {
+ font-size: 9pt;
+ color: var(--body-font-color);
+}
+
+.cardContent a {
+ text-decoration: var(--post-link-text-decoration);
+ color: var(--post-link-text-color);
+}
+
+.cardContent a:hover {
+ text-decoration: var(--post-link-text-decoration-hover);
+ color: var(--post-link-text-color-hover);
+}
+
+.cardActions {
+ display: flex;
+ justify-content: flex-end;
+ gap: 8px;
+}
+
/* Desktop: buttons styled as text links (same as board buttons) */
@media (min-width: 640px) {
.actions {
diff --git a/src/views/mod-queue/mod-queue.tsx b/src/views/mod-queue/mod-queue.tsx
index bdee9f98..bc520b1d 100644
--- a/src/views/mod-queue/mod-queue.tsx
+++ b/src/views/mod-queue/mod-queue.tsx
@@ -1,4 +1,4 @@
-import React, { useMemo, useState, useEffect } from 'react';
+import React, { useMemo, useState, useEffect, useCallback } from 'react';
import { useTranslation } from 'react-i18next';
import { useParams, Link } from 'react-router-dom';
import { useFeed, Comment, usePublishCommentModeration, useEditedComment, useSubplebbit } from '@plebbit/plebbit-react-hooks';
@@ -21,6 +21,7 @@ import useChallengesStore from '../../stores/use-challenges-store';
import { alertChallengeVerificationFailed } from '../../lib/utils/challenge-utils';
import Tooltip from '../../components/tooltip';
import useIsMobile from '../../hooks/use-is-mobile';
+import { Post } from '../post/post';
const { addChallenge } = useChallengesStore.getState();
@@ -55,30 +56,22 @@ interface ModQueueRowProps {
// Track which action was initiated to show appropriate completion message
type ModerationAction = 'approve' | 'reject' | null;
-const ModQueueRow = ({ comment, isOdd = false }: ModQueueRowProps) => {
+interface ModQueueActionState {
+ status: 'approved' | 'rejected' | 'failed' | null;
+ errorMessage?: string;
+ isPublishing: boolean;
+ handleApprove: () => Promise;
+ handleReject: () => Promise;
+}
+
+const useModQueueActions = (comment: Comment): ModQueueActionState => {
const { t } = useTranslation();
- const { getAlertThresholdSeconds } = useModQueueStore();
+ const { cid, subplebbitAddress, approved, removed } = comment || {};
const [initiatedAction, setInitiatedAction] = useState(null);
- const isMobile = useIsMobile();
- const { editedComment } = useEditedComment({ comment });
- const displayComment = editedComment || comment;
-
- const { content, title, timestamp, subplebbitAddress, cid, shortCid, threadCid, link, thumbnailUrl, linkWidth, linkHeight, removed, approved, number } = displayComment;
-
- // Check if already moderated (from previous session or API update)
- // Note: `approved` and `removed` are direct fields on the comment from CommentUpdate,
- // not nested under commentModeration (which is the options object for publishing moderation actions)
const alreadyApproved = approved === true;
const alreadyRejected = removed === true;
- const timeWaiting = Date.now() / 1000 - timestamp;
- const alertThresholdSeconds = getAlertThresholdSeconds();
- const isOverThreshold = timeWaiting > alertThresholdSeconds;
-
- // Only show alert animation for comments awaiting approval (not approved or rejected)
- const isAwaitingApproval = !alreadyApproved && !alreadyRejected;
-
const {
publishCommentModeration: approve,
state: approveState,
@@ -117,8 +110,7 @@ const ModQueueRow = ({ comment, isOdd = false }: ModQueueRowProps) => {
},
});
- const handleApprove = async () => {
- // Double confirmation for approve action
+ const handleApprove = useCallback(async () => {
const confirm = window.confirm(t('double_confirm'));
if (!confirm) {
return;
@@ -130,10 +122,9 @@ const ModQueueRow = ({ comment, isOdd = false }: ModQueueRowProps) => {
} catch (e) {
console.error(e);
}
- };
+ }, [approve, t]);
- const handleReject = async () => {
- // Double confirmation for reject action
+ const handleReject = useCallback(async () => {
const confirm = window.confirm(t('double_confirm'));
if (!confirm) {
return;
@@ -145,9 +136,8 @@ const ModQueueRow = ({ comment, isOdd = false }: ModQueueRowProps) => {
} catch (e) {
console.error(e);
}
- };
+ }, [reject, t]);
- // Determine the current moderation state based on which action was initiated
const isApproving = initiatedAction === 'approve' && approveState !== 'initializing' && approveState !== 'succeeded' && approveState !== 'failed';
const isRejecting = initiatedAction === 'reject' && rejectState !== 'initializing' && rejectState !== 'succeeded' && rejectState !== 'failed';
const isPublishing = isApproving || isRejecting;
@@ -158,6 +148,37 @@ const ModQueueRow = ({ comment, isOdd = false }: ModQueueRowProps) => {
const approveFailed = initiatedAction === 'approve' && approveState === 'failed';
const rejectFailed = initiatedAction === 'reject' && rejectState === 'failed';
+ const status = alreadyApproved || approveSucceeded ? 'approved' : alreadyRejected || rejectSucceeded ? 'rejected' : approveFailed || rejectFailed ? 'failed' : null;
+ const errorMessage = approveFailed ? approveError?.message : rejectFailed ? rejectError?.message : undefined;
+
+ return { status, errorMessage, isPublishing, handleApprove, handleReject };
+};
+
+const ModQueueRow = ({ comment, isOdd = false }: ModQueueRowProps) => {
+ const { t } = useTranslation();
+ const { getAlertThresholdSeconds } = useModQueueStore();
+ const isMobile = useIsMobile();
+
+ const { editedComment } = useEditedComment({ comment });
+ const displayComment = editedComment || comment;
+
+ const { content, title, timestamp, subplebbitAddress, cid, threadCid, link, thumbnailUrl, linkWidth, linkHeight, removed, approved, number } = displayComment;
+
+ // Check if already moderated (from previous session or API update)
+ // Note: `approved` and `removed` are direct fields on the comment from CommentUpdate,
+ // not nested under commentModeration (which is the options object for publishing moderation actions)
+ const alreadyApproved = approved === true;
+ const alreadyRejected = removed === true;
+
+ const timeWaiting = Date.now() / 1000 - timestamp;
+ const alertThresholdSeconds = getAlertThresholdSeconds();
+ const isOverThreshold = timeWaiting > alertThresholdSeconds;
+
+ // Only show alert animation for comments awaiting approval (not approved or rejected)
+ const isAwaitingApproval = !alreadyApproved && !alreadyRejected;
+
+ const { status, errorMessage, isPublishing, handleApprove, handleReject } = useModQueueActions(displayComment);
+
const boardPath = useBoardPath(subplebbitAddress);
const hasTitle = title && title.trim().length > 0;
const hasContent = content && content.trim().length > 0;
@@ -176,23 +197,17 @@ const ModQueueRow = ({ comment, isOdd = false }: ModQueueRowProps) => {
// Render the status or action buttons
const renderActions = () => {
// Check existing moderation state first (from API/previous sessions)
- if (alreadyApproved || approveSucceeded) {
+ if (status === 'approved') {
return {t('approved')};
}
- if (alreadyRejected || rejectSucceeded) {
+ if (status === 'rejected') {
return {t('rejected')};
}
- if (approveFailed) {
+ if (status === 'failed') {
return (
- {t('failed')}: {approveError?.message}
-
- );
- }
- if (rejectFailed) {
- return (
-
- {t('failed')}: {rejectError?.message}
+ {t('failed')}
+ {errorMessage ? `: ${errorMessage}` : ''}
);
}
@@ -258,6 +273,137 @@ const ModQueueRow = ({ comment, isOdd = false }: ModQueueRowProps) => {
);
};
+interface ModQueueCardProps {
+ comment: Comment;
+}
+
+const ModQueueCard = ({ comment }: ModQueueCardProps) => {
+ const { t } = useTranslation();
+ const { getAlertThresholdSeconds } = useModQueueStore();
+
+ const { editedComment } = useEditedComment({ comment });
+ const displayComment = editedComment || comment;
+
+ const { content, title, timestamp, subplebbitAddress, cid, threadCid, link, thumbnailUrl, linkWidth, linkHeight, removed, approved, number } = displayComment;
+
+ const alreadyApproved = approved === true;
+ const alreadyRejected = removed === true;
+
+ const timeWaiting = Date.now() / 1000 - timestamp;
+ const alertThresholdSeconds = getAlertThresholdSeconds();
+ const isOverThreshold = timeWaiting > alertThresholdSeconds;
+ const isAwaitingApproval = !alreadyApproved && !alreadyRejected;
+
+ const { status, errorMessage, isPublishing, handleApprove, handleReject } = useModQueueActions(displayComment);
+
+ const boardPath = useBoardPath(subplebbitAddress);
+ const hasTitle = title && title.trim().length > 0;
+ const hasContent = content && content.trim().length > 0;
+ const hasLink = link && link.length > 0;
+ const rawExcerpt =
+ (hasTitle ? title : null) ||
+ (hasContent ? content : null) ||
+ (hasLink ? link : null) ||
+ (getHasThumbnail(getCommentMediaInfo(link, thumbnailUrl, linkWidth, linkHeight), link) ? t('image') : null) ||
+ t('no_content');
+ const excerpt = rawExcerpt.length > 140 ? rawExcerpt.slice(0, 137) + '...' : rawExcerpt;
+ const threadTargetCid = threadCid || cid;
+ const postUrl = boardPath && threadTargetCid ? `/${boardPath}/thread/${threadTargetCid}` : undefined;
+
+ const renderActions = () => {
+ if (status === 'approved') {
+ return (
+
{replyCount > 0 && `${replyCount} Replies`}
{linksCount > 0 && ` / ${linksCount} Links`}
-
- {t('view_thread')}
-
+ {isModQueue ? (
+
)}
+ {modQueueStatus === 'approved' ? (
+ {t('approved')}
+ ) : modQueueStatus === 'rejected' ? (
+ {t('rejected')}
+ ) : modQueueStatus === 'failed' ? (
+
+ {t('failed')}
+ {modQueueError ? `: ${modQueueError}` : ''}
+
+ ) : isPublishing ? (
+
+ ) : (
+
+ {t('view_thread')}
+
+ )}
+ {t('approved')}
+
+ );
+ }
+ if (status === 'rejected') {
+ return (
+
+ {t('rejected')}
+
+ );
+ }
+ if (status === 'failed') {
+ return (
+
+
+ {t('failed')}
+ {errorMessage ? `: ${errorMessage}` : ''}
+
+
+ );
+ }
+ if (isPublishing) {
+ return (
+
+
+ );
+ }
+
+ return (
+
+
+
+
+ );
+ };
+
+ return (
+
+
+ );
+};
+
+const ModQueueFeedPost = ({ comment }: { comment: Comment }) => {
+ const { editedComment } = useEditedComment({ comment });
+ const displayComment = editedComment || comment;
+ const { status, errorMessage, isPublishing, handleApprove, handleReject } = useModQueueActions(displayComment);
+
+ return (
+
+ No. {number ?? 'N/A'}
+
+ {isAwaitingApproval && isOverThreshold ? (
+ <>
+ {getFormattedDate(timestamp)} ({getFormattedTimeAgo(timestamp)})
+
+ ) : (
+ getFormattedDate(timestamp)
+ )}
+
+
+
+ {t('excerpt')}:{' '}
+ {postUrl ? (
+
+ {excerpt}
+
+ ) : (
+ {excerpt}
+ )}
+
+ {renderActions()}
+
-
-
- );
-
return (
{!resolvedAddress && (
-
-
{t('moderation_queue')}
+
+
)}
-
+
- {!resolvedAddress ? (
- <>
-
-
{feed.length === 0 && !hasMore ? (
-
- {alertThresholdControl}
-
- ) : (
- <>
-
-
- {t('moderation_queue')}
- {alertThresholdControl}
-
- )}
- {t('queue_is_empty')}
) : (
<>
-
-
-
- {/* Use Virtuoso for infinite scroll only when there's more content to paginate */}
- {hasMore ? (
- No.
- {t('excerpt')}
- {t('submitted')}
- {t('actions')}
-
-
+
+
+
+ {hasMore ? (
+ No.
+ {t('excerpt')}
+ {t('submitted')}
+ {t('actions')}
+
+
+ )}
+
+
+ )}
+
+
+ )}
+
{isMobile ? (
-