From ee69ab60ed3af53e3559da8a9511a3b2b7ec8c59 Mon Sep 17 00:00:00 2001 From: "Tom (plebeius.eth)" Date: Sat, 1 Jun 2024 18:13:41 +0200 Subject: [PATCH] fix bugs --- .../board-buttons/board-buttons.module.css | 24 ++++-- .../board-buttons/board-buttons.tsx | 78 ++++++++++--------- .../post-menu-desktop/post-menu-desktop.tsx | 26 +++++-- .../post-menu-mobile/post-menu-mobile.tsx | 4 +- .../subplebbit-description.tsx | 2 +- src/components/topbar/topbar.tsx | 4 +- 6 files changed, 86 insertions(+), 52 deletions(-) diff --git a/src/components/board-buttons/board-buttons.module.css b/src/components/board-buttons/board-buttons.module.css index 64ac2de8..77ff352a 100644 --- a/src/components/board-buttons/board-buttons.module.css +++ b/src/components/board-buttons/board-buttons.module.css @@ -25,6 +25,24 @@ padding: 10px 0; } +.desktopBoardButtons { + display: flex; + align-items: center; + justify-content: space-between; /* Ensure elements are spaced out properly */ +} + +.desktopBoardButtons::after { + content: ""; + display: table; + clear: both; +} + +.desktopBoardButtons .rightSideButtons { + margin-left: auto; /* Push the right-side buttons to the right */ + display: flex; + align-items: center; +} + @media (max-width: 640px) { .desktopBoardButtons { display: none; @@ -35,8 +53,4 @@ .mobileBoardButtons { display: none; } - - .rightSideButtons { - float: right; - } -} \ No newline at end of file +} diff --git a/src/components/board-buttons/board-buttons.tsx b/src/components/board-buttons/board-buttons.tsx index 1b026ad7..b2459c5f 100644 --- a/src/components/board-buttons/board-buttons.tsx +++ b/src/components/board-buttons/board-buttons.tsx @@ -68,11 +68,12 @@ const SortOptions = () => { }; return ( <> - Sort by:{' '} + Sort by:  {' '} + +   ); }; @@ -134,45 +135,52 @@ export const DesktopBoardButtons = () => { const isInSubscriptionsView = isSubscriptionsView(location.pathname); return ( -
+ <>
- {isInPostView || isInPendingPostPage ? ( - <> - [ - - ] [ - - ] [ - ]{' '} - {isInPostView && ( - - [] - - )} - - ) : ( - <> - [ - {isInCatalogView ? ( +
+ {isInPostView || isInPendingPostPage ? ( + <> + [ - ) : ( + ] [ - )} - ] [ - - ] [ - ]{' '} - - {isInCatalogView && } - {!(isInAllView || isInSubscriptionsView) && ( - <> + ] [ + ] + {isInPostView && ( + [ ] + + )} + + ) : ( + <> + {isInCatalogView ? ( + <> + [ + ]{' '} + + ) : ( + <> + [ + ]{' '} )} - - - )} -
+ [ + ] [ + ] + + {isInCatalogView && } + {!(isInAllView || isInSubscriptionsView) && ( + <> + [ + ] + + )} + + + )} +
+ ); }; diff --git a/src/components/post/post-desktop/post-menu-desktop/post-menu-desktop.tsx b/src/components/post/post-desktop/post-menu-desktop/post-menu-desktop.tsx index a625d34a..aa6ae990 100644 --- a/src/components/post/post-desktop/post-menu-desktop/post-menu-desktop.tsx +++ b/src/components/post/post-desktop/post-menu-desktop/post-menu-desktop.tsx @@ -7,12 +7,14 @@ 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 { isCatalogView, isPostPageView } from '../../../../lib/utils/view-utils'; +import { isAllView, isCatalogView, isPostPageView, isSubscriptionsView } from '../../../../lib/utils/view-utils'; import _ from 'lodash'; interface PostMenuDesktopProps { cid: string; isDescription?: boolean; + isInAllView?: boolean; + isInSubscriptionsView?: boolean; isRules?: boolean; subplebbitAddress: string; onClose: () => void; @@ -67,10 +69,10 @@ const ImageSearchButton = ({ url, onClose }: { url: string; onClose: () => void ); }; -const ViewOnButton = ({ cid, isDescription, isRules, subplebbitAddress, onClose }: PostMenuDesktopProps) => { +const ViewOnButton = ({ cid, isDescription, isInAllView, isInSubscriptionsView, isRules, subplebbitAddress, onClose }: PostMenuDesktopProps) => { const { t } = useTranslation(); const [isClientRedirectMenuOpen, setIsClientRedirectMenuOpen] = useState(false); - const viewOnOtherClientLink = `p/${subplebbitAddress}${isDescription || isRules ? '' : `/c/${cid}`}`; + const viewOnOtherClientLink = `p/${isInAllView ? 'all' : isInSubscriptionsView ? 'subscriptions' : subplebbitAddress}${isDescription || isRules ? '' : `/c/${cid}`}`; const { refs, floatingStyles } = useFloating({ placement: 'right-start', @@ -85,13 +87,13 @@ const ViewOnButton = ({ cid, isDescription, isRules, subplebbitAddress, onClose ref={refs.setReference} onClick={onClose} > - {t('view_on')} » + {_.capitalize(t('view_on'))} » {isClientRedirectMenuOpen && (
- +
Seedit
 - +
Plebones
@@ -111,8 +113,10 @@ const PostMenuDesktop = ({ post }: { post: Comment }) => { const location = useLocation(); const params = useParams(); + const isInAllView = isAllView(location.pathname); const isInCatalogView = isCatalogView(location.pathname); const isInPostPageView = isPostPageView(location.pathname, params); + const isInSubscriptionsView = isSubscriptionsView(location.pathname); const { refs, floatingStyles, context } = useFloating({ placement: 'bottom-start', @@ -158,7 +162,15 @@ const PostMenuDesktop = ({ post }: { post: Comment }) => { )} {link && isValidURL(link) && (type === 'image' || type === 'gif' || thumbnail) && url && } - + , document.body, diff --git a/src/components/post/post-mobile/post-menu-mobile/post-menu-mobile.tsx b/src/components/post/post-mobile/post-menu-mobile/post-menu-mobile.tsx index d50584a3..6b8bdda7 100644 --- a/src/components/post/post-mobile/post-menu-mobile/post-menu-mobile.tsx +++ b/src/components/post/post-mobile/post-menu-mobile/post-menu-mobile.tsx @@ -51,10 +51,10 @@ const ViewOnButtons = ({ cid, isDescription, isRules, subplebbitAddress, onClose const viewOnOtherClientLink = `p/${subplebbitAddress}${isDescription || isRules ? '' : `/c/${cid}`}`; return (
- +
{t('view_on_client', { client: 'Seedit' })}
 - +
{t('view_on_client', { client: 'Plebones' })}
diff --git a/src/components/subplebbit-description/subplebbit-description.tsx b/src/components/subplebbit-description/subplebbit-description.tsx index 5bd5bc30..a8cb207f 100644 --- a/src/components/subplebbit-description/subplebbit-description.tsx +++ b/src/components/subplebbit-description/subplebbit-description.tsx @@ -23,7 +23,7 @@ const SubplebbitDescription = ({ avatarUrl, createdAt, description, shortAddress isDescription: true, subplebbitAddress, timestamp: isInAllView ? multisubMetadata?.createdAt : createdAt, - author: { displayName: `'## ${t('board_mods')}` }, + author: { displayName: `## ${t('board_mods')}` }, content: isInAllView ? multisubMetadata?.description : description, link: avatarUrl, title: t('welcome_to_board', { diff --git a/src/components/topbar/topbar.tsx b/src/components/topbar/topbar.tsx index 4d6be4bd..98a8418d 100644 --- a/src/components/topbar/topbar.tsx +++ b/src/components/topbar/topbar.tsx @@ -56,8 +56,8 @@ const TopBarMobile = ({ subplebbitAddress }: { subplebbitAddress: string }) => { const boardSelect = (