@@ -53,7 +46,7 @@ const BoardHeader = () => {
)}
{title || `p/${shortAddress || subplebbitAddress}`}
- {isBoardOffline &&
{subtitle}
diff --git a/src/components/catalog-row/catalog-row.tsx b/src/components/catalog-row/catalog-row.tsx
index f312d14b..f8981461 100644
--- a/src/components/catalog-row/catalog-row.tsx
+++ b/src/components/catalog-row/catalog-row.tsx
@@ -12,11 +12,11 @@ import useEditCommentPrivileges from '../../hooks/use-author-privileges';
import useCountLinksInReplies from '../../hooks/use-count-links-in-replies';
import useFetchGifFirstFrame from '../../hooks/use-fetch-gif-first-frame';
import useHide from '../../hooks/use-hide';
+import useWindowWidth from '../../hooks/use-window-width';
import PostMenuDesktop from '../post-desktop/post-menu-desktop';
import styles from './catalog-row.module.css';
import Markdown from '../markdown';
import _ from 'lodash';
-import useWindowWidth from '../../hooks/use-window-width';
interface CatalogPostMediaProps {
commentMediaInfo: any;
@@ -113,6 +113,7 @@ const CatalogPost = ({ post }: { post: Comment }) => {
timestamp,
title,
} = post || {};
+ const linkCount = useCountLinksInReplies(post);
const commentMediaInfo = getCommentMediaInfo(post);
const hasThumbnail = getHasThumbnail(commentMediaInfo, link);
const { hidden } = useHide({ cid });
@@ -122,8 +123,6 @@ const CatalogPost = ({ post }: { post: Comment }) => {
const postLink = isInAllView && isDescription ? `/p/all/description` : `/p/${subplebbitAddress}/${isDescription ? 'description' : isRules ? 'rules' : `c/${cid}`}`;
- const linkCount = useCountLinksInReplies(post);
-
const threadIcons = (
{pinned &&
}
@@ -188,9 +187,7 @@ const CatalogPost = ({ post }: { post: Comment }) => {
});
const postContent = (
-
- {hidden ? ({t('hidden')}) :
+
{hidden ? ({t('hidden')}) :
);
const { imageSize, showOPComment } = useCatalogStyleStore();
diff --git a/src/components/comment-media/comment-media.module.css b/src/components/comment-media/comment-media.module.css
index aede97f2..abca8390 100644
--- a/src/components/comment-media/comment-media.module.css
+++ b/src/components/comment-media/comment-media.module.css
@@ -88,6 +88,7 @@
.content iframe {
border: none;
+ color-scheme: light;
}
.fileInfo {
diff --git a/src/components/markdown/markdown.tsx b/src/components/markdown/markdown.tsx
index 72b9fdcf..8414b581 100644
--- a/src/components/markdown/markdown.tsx
+++ b/src/components/markdown/markdown.tsx
@@ -124,7 +124,6 @@ const blockquoteToGreentext = () => (tree: any) => {
interface MarkdownProps {
content: string;
- spoiler?: boolean;
title?: string;
}
diff --git a/src/components/post-desktop/post-desktop.tsx b/src/components/post-desktop/post-desktop.tsx
index 7103673c..f094a47e 100644
--- a/src/components/post-desktop/post-desktop.tsx
+++ b/src/components/post-desktop/post-desktop.tsx
@@ -207,7 +207,7 @@ const PostMedia = ({ post }: PostProps) => {
)}
- {(hasThumbnail || (!hasThumbnail && !showThumbnail)) && (
+ {(hasThumbnail || (!hasThumbnail && !showThumbnail) || spoiler) && (
@@ -217,8 +217,9 @@ const PostMedia = ({ post }: PostProps) => {
};
const PostMessage = ({ post }: PostProps) => {
- const { cid, content, commentAuthor, deleted, edit, original, parentCid, postCid, reason, removed, spoiler, state, subplebbitAddress } = post || {};
- const banned = !!commentAuthor?.banExpiresAt;
+ const { cid, content, deleted, edit, original, parentCid, postCid, reason, removed, state, subplebbitAddress } = post || {};
+ // TODO: commentAuthor is not available outside of editedComment, update when available
+ // const banned = !!post?.commentAuthor?.banExpiresAt;
const { t } = useTranslation();
const params = useParams();
const location = useLocation();
@@ -240,7 +241,7 @@ const PostMessage = ({ post }: PostProps) => {
return (
- {isReply && !(removed || deleted) && isReplyingToReply && ({t('this_post_was_removed')})}
@@ -251,12 +252,17 @@ const PostMessage = ({ post }: PostProps) => {
{t('user_deleted_this_post')}} content={reason && `${t('reason')}: ${reason}`} />
) : (
<>
- {!showOriginal &&
{showOriginal && } /> }}
+ />{' '}
{reason && <>{t('reason_reason', { reason: reason, interpolation: { escapeValue: false } })} }
{showOriginal ? (
{
)}
)}
- {banned && (
+ {/* TODO: commentAuthor is not available outside of editedComment, update when available */}
+ {/* {banned && (
- )}
+ )} */}
{!isReply && content.length > 1000 && !isInPostView && (
- {!(isInAllView || isInSubscriptionsView) && showForm && isBoardOffline &&
{offlineMessage}
}
+ {!(isInAllView || isInSubscriptionsView) && showForm && isOffline &&
{offlineTitle}
}
{isThreadClosed ? (
{t('thread_closed')}
@@ -302,7 +297,7 @@ const PostForm = () => {
)}
- {!(isInAllView || isInSubscriptionsView) && showForm && isBoardOffline &&
{offlineMessage}
}
+ {!(isInAllView || isInSubscriptionsView) && showForm && isOffline &&
{offlineTitle}
}
{isThreadClosed ? (
{t('thread_closed')}
diff --git a/src/components/post-mobile/post-mobile.tsx b/src/components/post-mobile/post-mobile.tsx
index cb0e227d..542fb75d 100644
--- a/src/components/post-mobile/post-mobile.tsx
+++ b/src/components/post-mobile/post-mobile.tsx
@@ -152,8 +152,9 @@ const ReplyBacklinks = ({ post }: PostProps) => {
const PostMessageMobile = ({ post }: PostProps) => {
const { t } = useTranslation();
- const { cid, commentAuthor, content, deleted, edit, original, parentCid, postCid, reason, removed, spoiler, state, subplebbitAddress } = post || {};
- const banned = !!commentAuthor?.banExpiresAt;
+ const { cid, content, deleted, edit, original, parentCid, postCid, reason, removed, state, subplebbitAddress } = post || {};
+ // TODO: commentAuthor is not available outside of editedComment, update when available
+ // const banned = !!post?.commentAuthor?.banExpiresAt;
const [showOriginal, setShowOriginal] = useState(false);
const params = useParams();
@@ -176,7 +177,7 @@ const PostMessageMobile = ({ post }: PostProps) => {
return (
content && (
- {isReply && !(removed || deleted) && isReplyingToReply && ({t('this_post_was_removed')})}
@@ -187,7 +188,7 @@ const PostMessageMobile = ({ post }: PostProps) => {
{t('user_deleted_this_post')}} content={reason && `${t('reason')}: ${reason}`} />
) : (
<>
- {!showOriginal &&
{showOriginal &&
- )}
+ )} */}
{!isReply && content.length > 1000 && !isInPostView && (
{state === 'failed' ? (
- state
+
{state}
) : isInSubscriptionsView && subscriptions?.length === 0 ? (
t('not_subscribed_to_any_board')
) : (
)}
{error && (
-
+
diff --git a/src/views/home/boards-box/boards-box.tsx b/src/views/home/boards-box/boards-box.tsx
index 7dbee2d8..6f9cda02 100644
--- a/src/views/home/boards-box/boards-box.tsx
+++ b/src/views/home/boards-box/boards-box.tsx
@@ -2,12 +2,12 @@ import { Link } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
import { Subplebbit, useAccount, useAccountSubplebbits } from '@plebbit/plebbit-react-hooks';
import Plebbit from '@plebbit/plebbit-js/dist/browser/index.js';
-import { getFormattedTimeAgo } from '../../../lib/utils/time-utils';
import useHomeFiltersStore from '../../../stores/use-home-filters-store';
import { useMultisubMetadata } from '../../../hooks/use-default-subplebbits';
import styles from '../home.module.css';
import { nsfwTags } from '../home';
import BoxModal from '../box-modal';
+import useIsSubplebbitOffline from '../../../hooks/use-is-subplebbit-offline';
const Board = ({ subplebbit, subplebbits }: { subplebbit: Subplebbit; subplebbits: any }) => {
const { t } = useTranslation();
@@ -18,15 +18,12 @@ const Board = ({ subplebbit, subplebbits }: { subplebbit: Subplebbit; subplebbit
const boardLink = useCatalog ? `/p/${address}/catalog` : `/p/${address}`;
const subplebbitData = subplebbits && subplebbits.find((sub: Subplebbit) => sub?.address === address);
- const updatedAt = subplebbitData?.updatedAt;
- const isOffline = updatedAt && updatedAt < Date.now() / 1000 - 60 * 60;
- const offlineTitle = updatedAt
- ? isOffline && t('posts_last_synced_info', { time: getFormattedTimeAgo(updatedAt), interpolation: { escapeValue: false } })
- : t('subplebbit_offline_info');
+ const { isDefinitelyOffline, isOffline, offlineTitle } = useIsSubplebbitOffline(subplebbitData);
+ const iconClass = `${styles.offlineIcon} ${isDefinitelyOffline ? styles.redOfflineIcon : ''}`;
return (
- {isOffline && ({t(nsfwTag)}) }
diff --git a/src/views/home/home.module.css b/src/views/home/home.module.css
index 043f746c..9e28a197 100644
--- a/src/views/home/home.module.css
+++ b/src/views/home/home.module.css
@@ -187,6 +187,10 @@
image-rendering: pixelated;
}
+.redOfflineIcon {
+ background-image: url('/public/assets/icons/offline-red.png') !important;
+}
+
.boardsBoxContent {
font-size: 93%;
padding: 0.5em;
diff --git a/src/views/home/popular-threads-box/popular-threads-box.tsx b/src/views/home/popular-threads-box/popular-threads-box.tsx
index 338dc4c8..6e6a58ae 100644
--- a/src/views/home/popular-threads-box/popular-threads-box.tsx
+++ b/src/views/home/popular-threads-box/popular-threads-box.tsx
@@ -30,8 +30,13 @@ const PopularThreadCard = ({ post, boardTitle, boardShortAddress }: PopularThrea
- {title && {title} }
- {content && (content.length > 99 ? `: ${content.substring(0, 99)}...` : `: ${content}`)}
+ {title && (
+ <>
+ {title.trim()}
+ {content && ': '}
+
+ )}
+ {content && (content.length > 99 ? `${content.substring(0, 99).trim()}...` : `${content}`)}
{isInSettigsView && Error: this thread has too many replies, some of them cannot be displayed right now. }
+ {error && Error: {error.message} }
{isInDescriptionView ? (