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(catalog): add media, styling

Browse Source
This commit is contained in:
plebeius.eth
2024-04-12 17:47:30 +02:00
parent f124d03366
commit 65c99ab188
7 changed files with 197 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/board-buttons/board-buttons.tsx
+12 -6
View File
@@ -2,10 +2,11 @@ import { useTranslation } from 'react-i18next';
import { Link, useLocation, useParams } from 'react-router-dom';
import { useSubscribe } from '@plebbit/plebbit-react-hooks';
import styles from './board-buttons.module.css';
import { isPostPageView } from '../../lib/utils/view-utils';
import { isCatalogView, isPostPageView } from '../../lib/utils/view-utils';
interface BoardButtonsProps {
address: string | undefined;
isInCatalogView?: boolean;
}
const OptionsButton = () => {
@@ -13,11 +14,11 @@ const OptionsButton = () => {
return <button className='button'>{t('options')}</button>;
};
const CatalogButton = ({ address }: BoardButtonsProps) => {
const CatalogButton = ({ address, isInCatalogView }: BoardButtonsProps) => {
const { t } = useTranslation();
return (
<button className='button'>
<Link to={`/p/${address}/catalog`}>{t('catalog')}</Link>
<Link to={isInCatalogView ? `/p/${address}` : `/p/${address}/catalog`}>{t(isInCatalogView ? 'return' : 'catalog')}</Link>
</button>
);
};
@@ -79,20 +80,25 @@ export const MobileBoardButtons = () => {
export const DesktopBoardButtons = () => {
const { subplebbitAddress: address } = useParams<{ subplebbitAddress: string }>();
const isInPostPage = isPostPageView(useLocation().pathname, useParams());
const location = useLocation();
const params = useParams();
const isInPostPage = isPostPageView(location.pathname, params);
const isInCatalogView = isCatalogView(location.pathname, params);
return (
<div className={styles.desktopBoardButtons}>
<hr />
{isInPostPage ? (
<>
[<ReturnButton address={address} />] [<CatalogButton address={address} />] [<BottomButton />] [<OptionsButton />]
[<ReturnButton address={address} />] [<CatalogButton address={address} isInCatalogView={isInCatalogView} />] [<BottomButton />] [<OptionsButton />]
<span className={styles.subscribeButton}>
[<SubscribeButton address={address} />]
</span>
</>
) : (
<>
[<OptionsButton />] [<CatalogButton address={address} />]
[<OptionsButton />] [<CatalogButton address={address} isInCatalogView={isInCatalogView} />]
<span className={styles.subscribeButton}>
[<SubscribeButton address={address} />]
</span>