From 8e5a5919fad923d37decb31c455607401b2035cf Mon Sep 17 00:00:00 2001 From: "Tom (plebeius.eth)" Date: Tue, 11 Jun 2024 15:49:26 +0200 Subject: [PATCH] refactor: rename PostPage to Post, export Post component from Post view --- src/app.tsx | 16 ++++----- src/components/catalog-row/catalog-row.tsx | 2 +- .../{post => }/edit-menu/edit-menu.module.css | 0 .../{post => }/edit-menu/edit-menu.tsx | 6 ++-- src/components/{post => }/edit-menu/index.ts | 0 .../{post => }/post-desktop/index.ts | 0 .../{post => }/post-desktop/post-desktop.tsx | 28 +++++++-------- .../post-desktop/post-menu-desktop/index.ts | 0 .../post-menu-desktop.module.css | 0 .../post-menu-desktop/post-menu-desktop.tsx | 6 ++-- .../{post => }/post-mobile/index.ts | 0 .../post-mobile/post-menu-mobile/index.ts | 0 .../post-menu-mobile.module.css | 0 .../post-menu-mobile/post-menu-mobile.tsx | 6 ++-- .../{post => }/post-mobile/post-mobile.tsx | 20 +++++------ src/components/post/index.ts | 1 - src/components/post/post.tsx | 35 ------------------ .../{post => }/reply-quote-preview/index.ts | 0 .../reply-quote-preview.tsx | 6 ++-- .../subplebbit-description.tsx | 2 +- .../subplebbit-rules/subplebbit-rules.tsx | 2 +- src/components/{post => }/timestamp/index.ts | 0 .../{post => }/timestamp/timestamp.tsx | 2 +- src/views/board/board.tsx | 2 +- src/views/pending-post/pending-post.tsx | 2 +- src/views/post-page/index.ts | 1 - src/views/post-page/post-page.module.css | 4 --- src/views/post/index.ts | 1 + .../post/post.module.css | 5 +++ .../post-page.tsx => post/post.tsx} | 36 +++++++++++++++++-- 30 files changed, 89 insertions(+), 94 deletions(-) rename src/components/{post => }/edit-menu/edit-menu.module.css (100%) rename src/components/{post => }/edit-menu/edit-menu.tsx (97%) rename src/components/{post => }/edit-menu/index.ts (100%) rename src/components/{post => }/post-desktop/index.ts (100%) rename src/components/{post => }/post-desktop/post-desktop.tsx (94%) rename src/components/{post => }/post-desktop/post-menu-desktop/index.ts (100%) rename src/components/{post => }/post-desktop/post-menu-desktop/post-menu-desktop.module.css (100%) rename src/components/{post => }/post-desktop/post-menu-desktop/post-menu-desktop.tsx (97%) rename src/components/{post => }/post-mobile/index.ts (100%) rename src/components/{post => }/post-mobile/post-menu-mobile/index.ts (100%) rename src/components/{post => }/post-mobile/post-menu-mobile/post-menu-mobile.module.css (100%) rename src/components/{post => }/post-mobile/post-menu-mobile/post-menu-mobile.tsx (95%) rename src/components/{post => }/post-mobile/post-mobile.tsx (94%) delete mode 100644 src/components/post/index.ts delete mode 100644 src/components/post/post.tsx rename src/components/{post => }/reply-quote-preview/index.ts (100%) rename src/components/{post => }/reply-quote-preview/reply-quote-preview.tsx (98%) rename src/components/{post => }/timestamp/index.ts (100%) rename src/components/{post => }/timestamp/timestamp.tsx (93%) delete mode 100644 src/views/post-page/index.ts delete mode 100644 src/views/post-page/post-page.module.css create mode 100644 src/views/post/index.ts rename src/{components => views}/post/post.module.css (99%) rename src/views/{post-page/post-page.tsx => post/post.tsx} (68%) diff --git a/src/app.tsx b/src/app.tsx index 52dc18f9..ee561a73 100644 --- a/src/app.tsx +++ b/src/app.tsx @@ -9,7 +9,7 @@ import Catalog from './views/catalog'; import Home from './views/home'; import NotFound from './views/not-found'; import PendingPost from './views/pending-post'; -import PostPage from './views/post-page'; +import Post from './views/post'; import { DesktopBoardButtons, MobileBoardButtons } from './components/board-buttons'; import BoardHeader from './components/board-header'; import ChallengeModal from './components/challenge-modal'; @@ -85,16 +85,16 @@ const App = () => { } /> } /> - } /> - } /> - } /> - } /> - } /> - } /> + } /> + } /> + } /> + } /> + } /> + } /> } /> } /> - } /> + } /> } /> } /> diff --git a/src/components/catalog-row/catalog-row.tsx b/src/components/catalog-row/catalog-row.tsx index e562ae7d..eba9c2c7 100644 --- a/src/components/catalog-row/catalog-row.tsx +++ b/src/components/catalog-row/catalog-row.tsx @@ -10,7 +10,7 @@ import { isAllView } from '../../lib/utils/view-utils'; import useFetchGifFirstFrame from '../../hooks/use-fetch-gif-first-frame'; import useCountLinksInReplies from '../../hooks/use-count-links-in-replies'; import useEditCommentPrivileges from '../../hooks/use-author-privileges'; -import PostMenuDesktop from '../post/post-desktop/post-menu-desktop/'; +import PostMenuDesktop from '../post-desktop/post-menu-desktop'; import styles from './catalog-row.module.css'; import _ from 'lodash'; diff --git a/src/components/post/edit-menu/edit-menu.module.css b/src/components/edit-menu/edit-menu.module.css similarity index 100% rename from src/components/post/edit-menu/edit-menu.module.css rename to src/components/edit-menu/edit-menu.module.css diff --git a/src/components/post/edit-menu/edit-menu.tsx b/src/components/edit-menu/edit-menu.tsx similarity index 97% rename from src/components/post/edit-menu/edit-menu.tsx rename to src/components/edit-menu/edit-menu.tsx index 4c9191d2..66551042 100644 --- a/src/components/post/edit-menu/edit-menu.tsx +++ b/src/components/edit-menu/edit-menu.tsx @@ -3,10 +3,10 @@ import { Trans, useTranslation } from 'react-i18next'; import { autoUpdate, flip, FloatingFocusManager, offset, shift, useClick, useDismiss, useFloating, useId, useInteractions, useRole } from '@floating-ui/react'; import { PublishCommentEditOptions, useComment, useEditedComment, usePublishCommentEdit } from '@plebbit/plebbit-react-hooks'; import styles from './edit-menu.module.css'; -import { alertChallengeVerificationFailed } from '../../../lib/utils/challenge-utils'; -import useChallengesStore from '../../../stores/use-challenges-store'; +import { alertChallengeVerificationFailed } from '../../lib/utils/challenge-utils'; +import useChallengesStore from '../../stores/use-challenges-store'; import _ from 'lodash'; -import useIsMobile from '../../../hooks/use-is-mobile'; +import useIsMobile from '../../hooks/use-is-mobile'; const { addChallenge } = useChallengesStore.getState(); diff --git a/src/components/post/edit-menu/index.ts b/src/components/edit-menu/index.ts similarity index 100% rename from src/components/post/edit-menu/index.ts rename to src/components/edit-menu/index.ts diff --git a/src/components/post/post-desktop/index.ts b/src/components/post-desktop/index.ts similarity index 100% rename from src/components/post/post-desktop/index.ts rename to src/components/post-desktop/index.ts diff --git a/src/components/post/post-desktop/post-desktop.tsx b/src/components/post-desktop/post-desktop.tsx similarity index 94% rename from src/components/post/post-desktop/post-desktop.tsx rename to src/components/post-desktop/post-desktop.tsx index eab6903c..92588def 100644 --- a/src/components/post/post-desktop/post-desktop.tsx +++ b/src/components/post-desktop/post-desktop.tsx @@ -3,22 +3,22 @@ import { Trans, useTranslation } from 'react-i18next'; import { Link, useLocation, useParams } from 'react-router-dom'; import { Comment, useAccount, useBlock, useComment } from '@plebbit/plebbit-react-hooks'; import Plebbit from '@plebbit/plebbit-js/dist/browser/index.js'; -import styles from '../post.module.css'; -import { getCommentMediaInfo, getDisplayMediaInfoType, getHasThumbnail } from '../../../lib/utils/media-utils'; -import { isValidURL } from '../../../lib/utils/url-utils'; -import { isAllView, isPendingPostView, isPostPageView, isSubscriptionsView } from '../../../lib/utils/view-utils'; -import useCountLinksInReplies from '../../../hooks/use-count-links-in-replies'; -import useEditCommentPrivileges from '../../../hooks/use-author-privileges'; -import useReplies from '../../../hooks/use-replies'; -import useStateString from '../../../hooks/use-state-string'; -import CommentMedia from '../../comment-media'; -import { canEmbed } from '../../embed'; -import LoadingEllipsis from '../../loading-ellipsis'; -import Markdown from '../../markdown'; -import PostMenuDesktop from './post-menu-desktop/'; +import styles from '../../views/post/post.module.css'; +import { getCommentMediaInfo, getDisplayMediaInfoType, getHasThumbnail } from '../../lib/utils/media-utils'; +import { isValidURL } from '../../lib/utils/url-utils'; +import { isAllView, isPendingPostView, isPostPageView, isSubscriptionsView } from '../../lib/utils/view-utils'; +import useCountLinksInReplies from '../../hooks/use-count-links-in-replies'; +import useEditCommentPrivileges from '../../hooks/use-author-privileges'; +import useReplies from '../../hooks/use-replies'; +import useStateString from '../../hooks/use-state-string'; +import CommentMedia from '../comment-media'; +import { canEmbed } from '../embed'; +import LoadingEllipsis from '../loading-ellipsis'; +import Markdown from '../markdown'; +import PostMenuDesktop from './post-menu-desktop'; import EditMenu from '../edit-menu/edit-menu'; import ReplyQuotePreview from '../reply-quote-preview'; -import { PostProps } from '../post'; +import { PostProps } from '../../views/post/post'; import Timestamp from '../timestamp'; import _ from 'lodash'; diff --git a/src/components/post/post-desktop/post-menu-desktop/index.ts b/src/components/post-desktop/post-menu-desktop/index.ts similarity index 100% rename from src/components/post/post-desktop/post-menu-desktop/index.ts rename to src/components/post-desktop/post-menu-desktop/index.ts diff --git a/src/components/post/post-desktop/post-menu-desktop/post-menu-desktop.module.css b/src/components/post-desktop/post-menu-desktop/post-menu-desktop.module.css similarity index 100% rename from src/components/post/post-desktop/post-menu-desktop/post-menu-desktop.module.css rename to src/components/post-desktop/post-menu-desktop/post-menu-desktop.module.css diff --git a/src/components/post/post-desktop/post-menu-desktop/post-menu-desktop.tsx b/src/components/post-desktop/post-menu-desktop/post-menu-desktop.tsx similarity index 97% rename from src/components/post/post-desktop/post-menu-desktop/post-menu-desktop.tsx rename to src/components/post-desktop/post-menu-desktop/post-menu-desktop.tsx index 306e4435..974f34e1 100644 --- a/src/components/post/post-desktop/post-menu-desktop/post-menu-desktop.tsx +++ b/src/components/post-desktop/post-menu-desktop/post-menu-desktop.tsx @@ -5,9 +5,9 @@ import { useTranslation } from 'react-i18next'; import { autoUpdate, flip, FloatingFocusManager, offset, shift, useClick, useDismiss, useFloating, useId, useInteractions, useRole } from '@floating-ui/react'; import { Comment, useBlock } from '@plebbit/plebbit-react-hooks'; import styles from './post-menu-desktop.module.css'; -import { getCommentMediaInfo } from '../../../../lib/utils/media-utils'; -import { copyShareLinkToClipboard, isValidURL } from '../../../../lib/utils/url-utils'; -import { isAllView, isCatalogView, isPostPageView, isSubscriptionsView } from '../../../../lib/utils/view-utils'; +import { getCommentMediaInfo } from '../../../lib/utils/media-utils'; +import { copyShareLinkToClipboard, isValidURL } from '../../../lib/utils/url-utils'; +import { isAllView, isCatalogView, isPostPageView, isSubscriptionsView } from '../../../lib/utils/view-utils'; import _ from 'lodash'; interface PostMenuDesktopProps { diff --git a/src/components/post/post-mobile/index.ts b/src/components/post-mobile/index.ts similarity index 100% rename from src/components/post/post-mobile/index.ts rename to src/components/post-mobile/index.ts diff --git a/src/components/post/post-mobile/post-menu-mobile/index.ts b/src/components/post-mobile/post-menu-mobile/index.ts similarity index 100% rename from src/components/post/post-mobile/post-menu-mobile/index.ts rename to src/components/post-mobile/post-menu-mobile/index.ts diff --git a/src/components/post/post-mobile/post-menu-mobile/post-menu-mobile.module.css b/src/components/post-mobile/post-menu-mobile/post-menu-mobile.module.css similarity index 100% rename from src/components/post/post-mobile/post-menu-mobile/post-menu-mobile.module.css rename to src/components/post-mobile/post-menu-mobile/post-menu-mobile.module.css diff --git a/src/components/post/post-mobile/post-menu-mobile/post-menu-mobile.tsx b/src/components/post-mobile/post-menu-mobile/post-menu-mobile.tsx similarity index 95% rename from src/components/post/post-mobile/post-menu-mobile/post-menu-mobile.tsx rename to src/components/post-mobile/post-menu-mobile/post-menu-mobile.tsx index 75bd5c94..ff47969a 100644 --- a/src/components/post/post-mobile/post-menu-mobile/post-menu-mobile.tsx +++ b/src/components/post-mobile/post-menu-mobile/post-menu-mobile.tsx @@ -4,9 +4,9 @@ import { useTranslation } from 'react-i18next'; import { Comment } from '@plebbit/plebbit-react-hooks'; import { autoUpdate, flip, FloatingFocusManager, offset, shift, useClick, useDismiss, useFloating, useId, useInteractions, useRole } from '@floating-ui/react'; import styles from './post-menu-mobile.module.css'; -import { getCommentMediaInfo } from '../../../../lib/utils/media-utils'; -import { copyShareLinkToClipboard, isValidURL } from '../../../../lib/utils/url-utils'; -import useEditCommentPrivileges from '../../../../hooks/use-author-privileges'; +import { getCommentMediaInfo } from '../../../lib/utils/media-utils'; +import { copyShareLinkToClipboard, isValidURL } from '../../../lib/utils/url-utils'; +import useEditCommentPrivileges from '../../../hooks/use-author-privileges'; import EditMenu from '../../edit-menu/edit-menu'; interface PostMenuMobileProps { diff --git a/src/components/post/post-mobile/post-mobile.tsx b/src/components/post-mobile/post-mobile.tsx similarity index 94% rename from src/components/post/post-mobile/post-mobile.tsx rename to src/components/post-mobile/post-mobile.tsx index 1bd0ac7f..333baf00 100644 --- a/src/components/post/post-mobile/post-mobile.tsx +++ b/src/components/post-mobile/post-mobile.tsx @@ -3,18 +3,18 @@ import { Trans, useTranslation } from 'react-i18next'; import { Link, useLocation, useParams } from 'react-router-dom'; import { Comment, useAccount, useComment } from '@plebbit/plebbit-react-hooks'; import Plebbit from '@plebbit/plebbit-js/dist/browser/index.js'; -import styles from '../post.module.css'; -import { getCommentMediaInfo, getHasThumbnail } from '../../../lib/utils/media-utils'; -import { isAllView, isPendingPostView, isPostPageView, isSubscriptionsView } from '../../../lib/utils/view-utils'; -import useCountLinksInReplies from '../../../hooks/use-count-links-in-replies'; -import useReplies from '../../../hooks/use-replies'; -import useStateString from '../../../hooks/use-state-string'; -import CommentMedia from '../../comment-media'; -import LoadingEllipsis from '../../loading-ellipsis'; -import Markdown from '../../markdown'; +import styles from '../../views/post/post.module.css'; +import { getCommentMediaInfo, getHasThumbnail } from '../../lib/utils/media-utils'; +import { isAllView, isPendingPostView, isPostPageView, isSubscriptionsView } from '../../lib/utils/view-utils'; +import useCountLinksInReplies from '../../hooks/use-count-links-in-replies'; +import useReplies from '../../hooks/use-replies'; +import useStateString from '../../hooks/use-state-string'; +import CommentMedia from '../comment-media'; +import LoadingEllipsis from '../loading-ellipsis'; +import Markdown from '../markdown'; import ReplyQuotePreview from '../reply-quote-preview'; import PostMenuMobile from './post-menu-mobile'; -import { PostProps } from '../post'; +import { PostProps } from '../../views/post/post'; import Timestamp from '../timestamp'; import _ from 'lodash'; diff --git a/src/components/post/index.ts b/src/components/post/index.ts deleted file mode 100644 index c8f5c111..00000000 --- a/src/components/post/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './post'; diff --git a/src/components/post/post.tsx b/src/components/post/post.tsx deleted file mode 100644 index 555a51f6..00000000 --- a/src/components/post/post.tsx +++ /dev/null @@ -1,35 +0,0 @@ -import { Role, useSubplebbit } from '@plebbit/plebbit-react-hooks'; -import useIsMobile from '../../hooks/use-is-mobile'; -import styles from './post.module.css'; -import PostDesktop from './post-desktop'; -import PostMobile from './post-mobile'; - -export interface PostProps { - index?: number; - isHidden?: boolean; - post?: any; - reply?: any; - roles?: Role[]; - showAllReplies?: boolean; - showReplies?: boolean; - openReplyModal?: (cid: string) => void; -} - -const Post = ({ post, showAllReplies = false, showReplies = true, openReplyModal }: PostProps) => { - const subplebbit = useSubplebbit({ subplebbitAddress: post?.subplebbitAddress }); - const isMobile = useIsMobile(); - - return ( -
-
- {isMobile ? ( - - ) : ( - - )} -
-
- ); -}; - -export default Post; diff --git a/src/components/post/reply-quote-preview/index.ts b/src/components/reply-quote-preview/index.ts similarity index 100% rename from src/components/post/reply-quote-preview/index.ts rename to src/components/reply-quote-preview/index.ts diff --git a/src/components/post/reply-quote-preview/reply-quote-preview.tsx b/src/components/reply-quote-preview/reply-quote-preview.tsx similarity index 98% rename from src/components/post/reply-quote-preview/reply-quote-preview.tsx rename to src/components/reply-quote-preview/reply-quote-preview.tsx index 3873fca4..488531e5 100644 --- a/src/components/post/reply-quote-preview/reply-quote-preview.tsx +++ b/src/components/reply-quote-preview/reply-quote-preview.tsx @@ -3,9 +3,9 @@ import { createPortal } from 'react-dom'; import { Link } from 'react-router-dom'; import { Comment, useAccount } from '@plebbit/plebbit-react-hooks'; import { useFloating, offset, shift, size, autoUpdate, Placement } from '@floating-ui/react'; -import useIsMobile from '../../../hooks/use-is-mobile'; -import styles from '../post.module.css'; -import Post from '../post'; +import useIsMobile from '../../hooks/use-is-mobile'; +import styles from '../../views/post/post.module.css'; +import { Post } from '../../views/post'; interface ReplyQuotePreviewProps { isBacklinkReply?: boolean; diff --git a/src/components/subplebbit-description/subplebbit-description.tsx b/src/components/subplebbit-description/subplebbit-description.tsx index a8cb207f..4c3c8015 100644 --- a/src/components/subplebbit-description/subplebbit-description.tsx +++ b/src/components/subplebbit-description/subplebbit-description.tsx @@ -1,4 +1,4 @@ -import Post from '../post'; +import { Post } from '../../views/post'; import { useTranslation } from 'react-i18next'; import { isAllView } from '../../lib/utils/view-utils'; import { useMultisubMetadata } from '../../hooks/use-default-subplebbits'; diff --git a/src/components/subplebbit-rules/subplebbit-rules.tsx b/src/components/subplebbit-rules/subplebbit-rules.tsx index ff08bb6c..d027040a 100644 --- a/src/components/subplebbit-rules/subplebbit-rules.tsx +++ b/src/components/subplebbit-rules/subplebbit-rules.tsx @@ -1,4 +1,4 @@ -import Post from '../post'; +import { Post } from '../../views/post'; import { useTranslation } from 'react-i18next'; import _ from 'lodash'; diff --git a/src/components/post/timestamp/index.ts b/src/components/timestamp/index.ts similarity index 100% rename from src/components/post/timestamp/index.ts rename to src/components/timestamp/index.ts diff --git a/src/components/post/timestamp/timestamp.tsx b/src/components/timestamp/timestamp.tsx similarity index 93% rename from src/components/post/timestamp/timestamp.tsx rename to src/components/timestamp/timestamp.tsx index d5b71828..28a6e841 100644 --- a/src/components/post/timestamp/timestamp.tsx +++ b/src/components/timestamp/timestamp.tsx @@ -1,5 +1,5 @@ import { useState } from 'react'; -import { getFormattedDate, getFormattedTimeAgo } from '../../../lib/utils/time-utils'; +import { getFormattedDate, getFormattedTimeAgo } from '../../lib/utils/time-utils'; import { useFloating, autoUpdate, offset, flip, shift, useHover, useFocus, useDismiss, useRole, useInteractions, FloatingPortal } from '@floating-ui/react'; const Timestamp = ({ timestamp }: { timestamp: number }) => { diff --git a/src/views/board/board.tsx b/src/views/board/board.tsx index d8b89408..9a74c93e 100644 --- a/src/views/board/board.tsx +++ b/src/views/board/board.tsx @@ -12,7 +12,7 @@ import useTimeFilter from '../../hooks/use-time-filter'; import useFeedResetStore from '../../stores/use-feed-reset-store'; import useSortingStore from '../../stores/use-sorting-store'; import LoadingEllipsis from '../../components/loading-ellipsis'; -import Post from '../../components/post'; +import { Post } from '../post'; import ReplyModal from '../../components/reply-modal'; import SettingsModal from '../../components/settings-modal'; import SubplebbitDescription from '../../components/subplebbit-description'; diff --git a/src/views/pending-post/pending-post.tsx b/src/views/pending-post/pending-post.tsx index 4b25fd9c..c0c65d0a 100644 --- a/src/views/pending-post/pending-post.tsx +++ b/src/views/pending-post/pending-post.tsx @@ -2,7 +2,7 @@ import { useEffect } from 'react'; import { useLocation, useNavigate, useParams } from 'react-router-dom'; import { useAccountComment } from '@plebbit/plebbit-react-hooks'; import { isSettingsView } from '../../lib/utils/view-utils'; -import Post from '../../components/post'; +import { Post } from '../post'; import SettingsModal from '../../components/settings-modal'; const PendingPost = () => { diff --git a/src/views/post-page/index.ts b/src/views/post-page/index.ts deleted file mode 100644 index 223b2106..00000000 --- a/src/views/post-page/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './post-page'; diff --git a/src/views/post-page/post-page.module.css b/src/views/post-page/post-page.module.css deleted file mode 100644 index fc21cf30..00000000 --- a/src/views/post-page/post-page.module.css +++ /dev/null @@ -1,4 +0,0 @@ -.content { - margin-bottom: 150px; - overflow-x: hidden; -} \ No newline at end of file diff --git a/src/views/post/index.ts b/src/views/post/index.ts new file mode 100644 index 00000000..fc440f09 --- /dev/null +++ b/src/views/post/index.ts @@ -0,0 +1 @@ +export { Post, default } from './post'; diff --git a/src/components/post/post.module.css b/src/views/post/post.module.css similarity index 99% rename from src/components/post/post.module.css rename to src/views/post/post.module.css index 0a9acdfa..33d87525 100644 --- a/src/components/post/post.module.css +++ b/src/views/post/post.module.css @@ -1,3 +1,8 @@ +.content { + margin-bottom: 150px; + overflow-x: hidden; +} + .thread { clear: both; } diff --git a/src/views/post-page/post-page.tsx b/src/views/post/post.tsx similarity index 68% rename from src/views/post-page/post-page.tsx rename to src/views/post/post.tsx index 8cd90d3b..680948cf 100644 --- a/src/views/post-page/post-page.tsx +++ b/src/views/post/post.tsx @@ -1,15 +1,45 @@ import { useEffect } from 'react'; import { useTranslation } from 'react-i18next'; -import { Comment, useComment, useEditedComment, useSubplebbit } from '@plebbit/plebbit-react-hooks'; +import { Comment, Role, useComment, useEditedComment, useSubplebbit } from '@plebbit/plebbit-react-hooks'; import { useLocation, useParams } from 'react-router-dom'; -import styles from './post-page.module.css'; import { isDescriptionView, isRulesView, isSettingsView } from '../../lib/utils/view-utils'; +import useIsMobile from '../../hooks/use-is-mobile'; import useReplyModal from '../../hooks/use-reply-modal'; -import Post from '../../components/post'; +import PostDesktop from '../../components/post-desktop'; +import PostMobile from '../../components/post-mobile'; import ReplyModal from '../../components/reply-modal'; import SettingsModal from '../../components/settings-modal'; import SubplebbitDescription from '../../components/subplebbit-description'; import SubplebbitRules from '../../components/subplebbit-rules'; +import styles from './post.module.css'; + +export interface PostProps { + index?: number; + isHidden?: boolean; + post?: any; + reply?: any; + roles?: Role[]; + showAllReplies?: boolean; + showReplies?: boolean; + openReplyModal?: (cid: string) => void; +} + +export const Post = ({ post, showAllReplies = false, showReplies = true, openReplyModal }: PostProps) => { + const subplebbit = useSubplebbit({ subplebbitAddress: post?.subplebbitAddress }); + const isMobile = useIsMobile(); + + return ( +
+
+ {isMobile ? ( + + ) : ( + + )} +
+
+ ); +}; const PostPage = () => { const { t } = useTranslation();