From 853d88a0b9b0b9d2438e7d4dd01caba1c2731576 Mon Sep 17 00:00:00 2001 From: "plebeius.eth" Date: Fri, 22 Dec 2023 11:03:15 +0100 Subject: [PATCH 01/13] fix(sidebar): hide title section on pending page --- src/components/sidebar/sidebar.tsx | 21 ++++++++++++--------- 1 file changed, 12 insertions(+), 9 deletions(-) diff --git a/src/components/sidebar/sidebar.tsx b/src/components/sidebar/sidebar.tsx index f6862770..63673abd 100644 --- a/src/components/sidebar/sidebar.tsx +++ b/src/components/sidebar/sidebar.tsx @@ -5,7 +5,7 @@ import { useBlock, Role, useSubplebbitStats } from '@plebbit/plebbit-react-hooks import styles from './sidebar.module.css'; import { getFormattedDate, getFormattedDuration, getFormattedTimeAgo } from '../../lib/utils/time-utils'; import { findSubplebbitCreator } from '../../lib/utils/user-utils'; -import { isAboutView, isAllView, isHomeView, isPostView } from '../../lib/utils/view-utils'; +import { isAboutView, isAllView, isHomeView, isPendingView, isPostView } from '../../lib/utils/view-utils'; import SearchBar from '../search-bar'; import SubscribeButton from '../subscribe-button'; @@ -80,15 +80,18 @@ const Sidebar = ({ address, cid, createdAt, description, downvoteCount = 0, role const onlineNotice = t('users_online', { count: hourActiveUserCount }); const offlineNotice = updatedAt && t('community_last_seen', { dateAgo: getFormattedTimeAgo(updatedAt) }); const onlineStatus = isOnline ? onlineNotice : offlineNotice; + const location = useLocation(); const params = useParams(); - const isAbout = isAboutView(location.pathname); - const isAll = isAllView(location.pathname); - const isHome = isHomeView(location.pathname, params); - const isPost = isPostView(location.pathname, params); + const isAboutPage = isAboutView(location.pathname); + const isAllPage = isAllView(location.pathname); + const isHomePage = isHomeView(location.pathname, params); + const isPendingPage = isPendingView(location.pathname, params); + const isPostPage = isPostView(location.pathname, params); + const subplebbitCreator = findSubplebbitCreator(roles); const creatorAddress = subplebbitCreator === 'anonymous' ? 'anonymous' : `${getShortAddress(subplebbitCreator)}`; - const submitRoute = isHome || isAll ? '/submit' : `/p/${address}/submit`; + const submitRoute = isHomePage || isAllPage ? '/submit' : `/p/${address}/submit`; const { blocked, unblock, block } = useBlock({ address }); @@ -107,10 +110,10 @@ const Sidebar = ({ address, cid, createdAt, description, downvoteCount = 0, role }; return ( -
+
- {isPost && } + {isPostPage && }
{t('submit_post')} @@ -123,7 +126,7 @@ const Sidebar = ({ address, cid, createdAt, description, downvoteCount = 0, role
- {!isHome && !isAll && ( + {!isHomePage && !isAllPage && !isPendingPage && (
{address} From ef1b38570929f69cb8d2bb5627a2039ef4609665 Mon Sep 17 00:00:00 2001 From: "plebeius.eth" Date: Fri, 22 Dec 2023 11:33:09 +0100 Subject: [PATCH 02/13] feat(post): redirect to post view when cid is received for pending post --- src/views/post/post.tsx | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/src/views/post/post.tsx b/src/views/post/post.tsx index 8dad4b41..3535b11d 100644 --- a/src/views/post/post.tsx +++ b/src/views/post/post.tsx @@ -1,5 +1,5 @@ import { useEffect } from 'react'; -import { useLocation, useParams } from 'react-router-dom'; +import { useLocation, useNavigate, useParams } from 'react-router-dom'; import { useAccountComment, useComment, useSubplebbit } from '@plebbit/plebbit-react-hooks'; import { useTranslation } from 'react-i18next'; import styles from './post.module.css'; @@ -22,6 +22,14 @@ const Post = () => { const pendingPost = useAccountComment({ commentIndex: params?.accountCommentIndex as any }); const post = isPendingPage ? pendingPost : comment; + // in pending page, redirect to post view when post.cid is received + const navigate = useNavigate(); + useEffect(() => { + if (post?.cid && post?.subplebbitAddress) { + navigate(`/p/${post?.subplebbitAddress}/c/${post?.cid}`, { replace: true }); + } + }, [post?.cid, post?.subplebbitAddress, navigate]); + const { cid, downvoteCount, replyCount, subplebbitAddress, timestamp, title, upvoteCount } = comment || {}; const subplebbit = useSubplebbit({ subplebbitAddress }); const { createdAt, description, roles, rules, updatedAt } = subplebbit || {}; From 62672ee017899481f4833d255726e34c20253c13 Mon Sep 17 00:00:00 2001 From: "plebeius.eth" Date: Fri, 22 Dec 2023 11:40:54 +0100 Subject: [PATCH 03/13] style(comment tools): simplify design for tools menus --- .../post/comment-tools/hide-menu/hide-menu.module.css | 11 ----------- .../post/comment-tools/hide-menu/hide-menu.tsx | 1 - .../post/comment-tools/mod-menu/mod-menu.module.css | 11 ----------- .../post/comment-tools/mod-menu/mod-menu.tsx | 1 - .../comment-tools/share-menu/share-menu.module.css | 11 ----------- .../post/comment-tools/share-menu/share-menu.tsx | 1 - 6 files changed, 36 deletions(-) diff --git a/src/components/post/comment-tools/hide-menu/hide-menu.module.css b/src/components/post/comment-tools/hide-menu/hide-menu.module.css index 6528b485..1e0e0878 100644 --- a/src/components/post/comment-tools/hide-menu/hide-menu.module.css +++ b/src/components/post/comment-tools/hide-menu/hide-menu.module.css @@ -13,7 +13,6 @@ border: 1px solid var(--border-text); outline: none; font-size: 11px; - box-shadow: var(--box-shadow-modal); } .modal input { @@ -41,14 +40,4 @@ .menuItem { cursor: pointer; -} - -.modalTitle { - background: var(--background-primary); - padding-bottom: 2px; - margin-bottom: 6px; - text-align: center; - color: var(--text-primary); - font-size: 13px; - font-weight: bold; } \ No newline at end of file diff --git a/src/components/post/comment-tools/hide-menu/hide-menu.tsx b/src/components/post/comment-tools/hide-menu/hide-menu.tsx index 8e896754..4869af37 100644 --- a/src/components/post/comment-tools/hide-menu/hide-menu.tsx +++ b/src/components/post/comment-tools/hide-menu/hide-menu.tsx @@ -78,7 +78,6 @@ const HideMenu = ({ author, cid, subplebbitAddress }: HideMenuProps) => { {isHideMenuOpen && (
-
hide
diff --git a/src/components/post/comment-tools/mod-menu/mod-menu.module.css b/src/components/post/comment-tools/mod-menu/mod-menu.module.css index 2723eec1..16c431d0 100644 --- a/src/components/post/comment-tools/mod-menu/mod-menu.module.css +++ b/src/components/post/comment-tools/mod-menu/mod-menu.module.css @@ -13,20 +13,9 @@ color: var(--text); font-size: 11px; border: 1px solid var(--border-text); - box-shadow: var(--box-shadow-modal); width: 200px; } -.modalTitle { - background: var(--background-primary); - padding-bottom: 2px; - margin-bottom: 6px; - text-align: center; - color: var(--text-primary); - font-size: 13px; - font-weight: bold; -} - .modal input[type="checkbox"] { margin-right: 3px; outline: none; diff --git a/src/components/post/comment-tools/mod-menu/mod-menu.tsx b/src/components/post/comment-tools/mod-menu/mod-menu.tsx index 413e00c8..054b5ac2 100644 --- a/src/components/post/comment-tools/mod-menu/mod-menu.tsx +++ b/src/components/post/comment-tools/mod-menu/mod-menu.tsx @@ -72,7 +72,6 @@ const ModTools = ({ cid }: ModToolsProps) => {
-
moderation