External/5chan
1
0
Fork 0
mirror of https://github.com/bitsocialnet/5chan.git synced 2026-08-03 07:41:04 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat(app): add pending post view

Browse Source
This commit is contained in:
plebeius.eth
2024-04-25 22:02:55 +02:00
parent bef2a88f06
commit 394c7d8a81
9 changed files with 125 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/board-banner/board-banner.tsx
+5 -2
View File
@@ -1,5 +1,5 @@
import { useParams } from 'react-router-dom';
import { useSubplebbit } from '@plebbit/plebbit-react-hooks';
import { useAccountComment, useSubplebbit } from '@plebbit/plebbit-react-hooks';
import { useState } from 'react';
import styles from './board-banner.module.css';
@@ -15,7 +15,10 @@ const ImageBanner = () => {
};
const BoardBanner = () => {
const { subplebbitAddress } = useParams<{ subplebbitAddress: string }>();
const params = useParams();
const accountComment = useAccountComment({ commentIndex: params?.accountCommentIndex as any });
const subplebbitAddress = params?.subplebbitAddress || accountComment?.subplebbitAddress;
const subplebbit = useSubplebbit({ subplebbitAddress });
const { address, title } = subplebbit || {};
const displayAddress = address && address.length > 10 && !address.includes('.') ? address.slice(0, 13).concat('...') : address;
src/components/board-buttons/board-buttons.tsx
+25 -18
View File
@@ -1,8 +1,8 @@
import { useTranslation } from 'react-i18next';
import { Link, useLocation, useParams } from 'react-router-dom';
import { useSubscribe } from '@plebbit/plebbit-react-hooks';
import { useAccountComment, useSubscribe } from '@plebbit/plebbit-react-hooks';
import styles from './board-buttons.module.css';
import { isCatalogView, isPostPageView } from '../../lib/utils/view-utils';
import { isCatalogView, isPendingPostView, isPostPageView } from '../../lib/utils/view-utils';
interface BoardButtonsProps {
address: string | undefined;
@@ -53,25 +53,30 @@ const BottomButton = () => {
};
export const MobileBoardButtons = () => {
const { subplebbitAddress: address } = useParams<{ subplebbitAddress: string }>();
const isInPostPage = isPostPageView(useLocation().pathname, useParams());
const params = useParams();
const location = useLocation();
const accountComment = useAccountComment({ commentIndex: params?.accountCommentIndex as any });
const subplebbitAddress = params?.subplebbitAddress || accountComment?.subplebbitAddress;
const isInPostPage = isPostPageView(location.pathname, params);
const isInPendingPostPage = isPendingPostView(location.pathname, params);
return (
<div className={styles.mobileBoardButtons}>
{isInPostPage ? (
{isInPostPage || isInPendingPostPage ? (
<div className={styles.mobilePostPageButtons}>
<ReturnButton address={address} />
<CatalogButton address={address} />
<ReturnButton address={subplebbitAddress} />
<CatalogButton address={subplebbitAddress} />
<BottomButton />
<div className={styles.mobilePostPageButtonsSecondRow}>
<OptionsButton />
<SubscribeButton address={address} />
<SubscribeButton address={subplebbitAddress} />
</div>
</div>
) : (
<>
<OptionsButton />
<CatalogButton address={address} />
<SubscribeButton address={address} />
<CatalogButton address={subplebbitAddress} />
<SubscribeButton address={subplebbitAddress} />
</>
)}
</div>
@@ -79,28 +84,30 @@ export const MobileBoardButtons = () => {
};
export const DesktopBoardButtons = () => {
const { subplebbitAddress: address } = useParams<{ subplebbitAddress: string }>();
const location = useLocation();
const params = useParams();
const location = useLocation();
const accountComment = useAccountComment({ commentIndex: params?.accountCommentIndex as any });
const subplebbitAddress = params?.subplebbitAddress || accountComment?.subplebbitAddress;
const isInPostPage = isPostPageView(location.pathname, params);
const isInCatalogView = isCatalogView(location.pathname, params);
const isInPendingPostPage = isPendingPostView(location.pathname, params);
return (
<div className={styles.desktopBoardButtons}>
<hr />
{isInPostPage ? (
{isInPostPage || isInPendingPostPage ? (
<>
[<ReturnButton address={address} />] [<CatalogButton address={address} isInCatalogView={isInCatalogView} />] [<BottomButton />] [<OptionsButton />]
[<ReturnButton address={subplebbitAddress} />] [<CatalogButton address={subplebbitAddress} isInCatalogView={isInCatalogView} />] [<BottomButton />] [
<OptionsButton />]
<span className={styles.subscribeButton}>
[<SubscribeButton address={address} />]
[<SubscribeButton address={subplebbitAddress} />]
</span>
</>
) : (
<>
[<OptionsButton />] [<CatalogButton address={address} isInCatalogView={isInCatalogView} />]
[<OptionsButton />] [<CatalogButton address={subplebbitAddress} isInCatalogView={isInCatalogView} />]
<span className={styles.subscribeButton}>
[<SubscribeButton address={address} />]
[<SubscribeButton address={subplebbitAddress} />]
</span>
</>
)}
src/components/board-nav/board-nav.tsx
+6 -1
View File
@@ -1,3 +1,4 @@
import { useAccountComment } from '@plebbit/plebbit-react-hooks';
import { Link, useLocation, useNavigate, useParams } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
import { isCatalogView } from '../../lib/utils/view-utils';
@@ -76,7 +77,11 @@ const BoardNavMobile = ({ subplebbitAddresses, subplebbitAddress }: BoardNavProp
const BoardNav = () => {
const subplebbitAddresses = useDefaultSubplebbitAddresses();
const { subplebbitAddress } = useParams();
const params = useParams();
const accountComment = useAccountComment({ commentIndex: params?.accountCommentIndex as any });
const subplebbitAddress = params?.subplebbitAddress || accountComment?.subplebbitAddress;
return (
<>
<BoardNavDesktop subplebbitAddresses={subplebbitAddresses} />
src/components/subplebbit-stats/subplebbit-stats.tsx
+6 -4
View File
@@ -1,23 +1,25 @@
import { useState } from 'react';
import { useLocation, useParams } from 'react-router-dom';
import { useComment, useSubplebbit, useSubplebbitStats } from '@plebbit/plebbit-react-hooks';
import { useAccountComment, useComment, useSubplebbit, useSubplebbitStats } from '@plebbit/plebbit-react-hooks';
import styles from './subplebbit-stats.module.css';
import { Trans, useTranslation } from 'react-i18next';
import { isDescriptionView, isRulesView } from '../../lib/utils/view-utils';
const SubplebbitStats = () => {
const { t } = useTranslation();
const { commentCid, subplebbitAddress } = useParams<{ subplebbitAddress: string; commentCid: string }>();
const params = useParams();
const accountComment = useAccountComment({ commentIndex: params?.accountCommentIndex as any });
const subplebbitAddress = params?.subplebbitAddress || accountComment?.subplebbitAddress;
const subplebbit = useSubplebbit({ subplebbitAddress });
const { address, createdAt } = subplebbit || {};
const location = useLocation();
const params = useParams();
const isInDescriptionView = isDescriptionView(location.pathname, params);
const isInRulesView = isRulesView(location.pathname, params);
const comment = useComment({ commentCid });
const comment = useComment({ commentCid: params?.commentCid });
const { deleted, locked, removed } = comment || {};
const hideStats = deleted || locked || removed || isInDescriptionView || isInRulesView;