mirror of
https://github.com/bitsocialnet/5chan.git
synced 2026-08-03 07:41:04 +02:00
fix(ui): hardcode /all/ and /mod/ multiboard titles
Use fixed labels in the board header and mobile board selector instead of directories metadata or translated mod copy.
This commit is contained in:
@@ -13,7 +13,6 @@ const testState = vi.hoisted(() => ({
|
|||||||
community: { address: 'music-posting.eth' } as { address?: string; name?: string; publicKey?: string } | undefined,
|
community: { address: 'music-posting.eth' } as { address?: string; name?: string; publicKey?: string } | undefined,
|
||||||
communityIdentifier: { name: 'music-posting.eth' } as { name?: string; publicKey?: string } | undefined,
|
communityIdentifier: { name: 'music-posting.eth' } as { name?: string; publicKey?: string } | undefined,
|
||||||
directories: [{ address: 'music-posting.eth', title: '/mu/ - Music' }] as Array<{ address: string; title?: string }>,
|
directories: [{ address: 'music-posting.eth', title: '/mu/ - Music' }] as Array<{ address: string; title?: string }>,
|
||||||
directoriesMetadata: { title: '/all/ - Directories' } as { title?: string } | undefined,
|
|
||||||
isMobile: false,
|
isMobile: false,
|
||||||
navigateMock: vi.fn(),
|
navigateMock: vi.fn(),
|
||||||
offlineIconClass: 'offline',
|
offlineIconClass: 'offline',
|
||||||
@@ -82,7 +81,6 @@ vi.mock('../../../hooks/use-stable-community', () => ({
|
|||||||
|
|
||||||
vi.mock('../../../hooks/use-directories', () => ({
|
vi.mock('../../../hooks/use-directories', () => ({
|
||||||
useDirectories: () => testState.directories,
|
useDirectories: () => testState.directories,
|
||||||
useDirectoriesMetadata: () => testState.directoriesMetadata,
|
|
||||||
}));
|
}));
|
||||||
|
|
||||||
vi.mock('../../../hooks/use-community-identifiers', () => ({
|
vi.mock('../../../hooks/use-community-identifiers', () => ({
|
||||||
@@ -132,7 +130,6 @@ describe('BoardHeader', () => {
|
|||||||
testState.community = { address: 'music-posting.eth' };
|
testState.community = { address: 'music-posting.eth' };
|
||||||
testState.communityIdentifier = { name: 'music-posting.eth' };
|
testState.communityIdentifier = { name: 'music-posting.eth' };
|
||||||
testState.directories = [{ address: 'music-posting.eth', title: '/mu/ - Music' }];
|
testState.directories = [{ address: 'music-posting.eth', title: '/mu/ - Music' }];
|
||||||
testState.directoriesMetadata = { title: '/all/ - Directories' };
|
|
||||||
testState.isMobile = false;
|
testState.isMobile = false;
|
||||||
testState.navigateMock.mockReset();
|
testState.navigateMock.mockReset();
|
||||||
testState.offlineIconClass = 'offline';
|
testState.offlineIconClass = 'offline';
|
||||||
@@ -169,7 +166,7 @@ describe('BoardHeader', () => {
|
|||||||
it('renders the all view title and banner chrome on desktop', async () => {
|
it('renders the all view title and banner chrome on desktop', async () => {
|
||||||
await renderHeader('/all');
|
await renderHeader('/all');
|
||||||
|
|
||||||
expect(container.textContent).toContain('/all/ - Directories');
|
expect(container.textContent).toContain('/all/ - All 5chan Directories');
|
||||||
expect(container.querySelector('img')?.getAttribute('src')).toBe('banner-a.png');
|
expect(container.querySelector('img')?.getAttribute('src')).toBe('banner-a.png');
|
||||||
expect(container.textContent).not.toContain('subscriptions_subtitle');
|
expect(container.textContent).not.toContain('subscriptions_subtitle');
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -9,14 +9,13 @@ import { useStableCommunity } from '../../hooks/use-stable-community';
|
|||||||
import { isAllView, isSubscriptionsView, isModView } from '../../lib/utils/view-utils';
|
import { isAllView, isSubscriptionsView, isModView } from '../../lib/utils/view-utils';
|
||||||
import { isArchiveRoute, isDirectoryListRoute } from '../../lib/utils/route-utils';
|
import { isArchiveRoute, isDirectoryListRoute } from '../../lib/utils/route-utils';
|
||||||
import styles from './board-header.module.css';
|
import styles from './board-header.module.css';
|
||||||
import { useDirectoriesMetadata, useDirectories } from '../../hooks/use-directories';
|
import { useDirectories } from '../../hooks/use-directories';
|
||||||
import { useResolvedCommunityAddress } from '../../hooks/use-resolved-community-address';
|
import { useResolvedCommunityAddress } from '../../hooks/use-resolved-community-address';
|
||||||
import useSafeAccountComment from '../../hooks/use-safe-account-comment';
|
import useSafeAccountComment from '../../hooks/use-safe-account-comment';
|
||||||
import useIsMobile from '../../hooks/use-is-mobile';
|
import useIsMobile from '../../hooks/use-is-mobile';
|
||||||
import useIsCommunityOffline from '../../hooks/use-is-community-offline';
|
import useIsCommunityOffline from '../../hooks/use-is-community-offline';
|
||||||
import { shouldShowSnow } from '../../lib/snow';
|
import { shouldShowSnow } from '../../lib/snow';
|
||||||
import Tooltip from '../tooltip';
|
import Tooltip from '../tooltip';
|
||||||
import startCase from 'lodash/startCase';
|
|
||||||
import { BANNERS } from '../../generated/asset-manifest';
|
import { BANNERS } from '../../generated/asset-manifest';
|
||||||
|
|
||||||
const ImageBanner = () => {
|
const ImageBanner = () => {
|
||||||
@@ -63,7 +62,6 @@ const BoardHeader = () => {
|
|||||||
const stableCommunity = useStableCommunity(communityAddress);
|
const stableCommunity = useStableCommunity(communityAddress);
|
||||||
const { address, shortAddress } = stableCommunity || {};
|
const { address, shortAddress } = stableCommunity || {};
|
||||||
|
|
||||||
const directoriesMetadata = useDirectoriesMetadata();
|
|
||||||
const directories = useDirectories();
|
const directories = useDirectories();
|
||||||
|
|
||||||
// Find matching community from default list to get its title
|
// Find matching community from default list to get its title
|
||||||
@@ -78,18 +76,18 @@ const BoardHeader = () => {
|
|||||||
const subscriptionsSubtitle = t('subscriptions_subtitle', { count: subscriptionsCount });
|
const subscriptionsSubtitle = t('subscriptions_subtitle', { count: subscriptionsCount });
|
||||||
|
|
||||||
const title = isInAllView
|
const title = isInAllView
|
||||||
? directoriesMetadata?.title || '/all/ - 5chan Directories'
|
? '/all/ - All 5chan Directories'
|
||||||
: isInSubscriptionsView
|
: isInSubscriptionsView
|
||||||
? '/subs/ - Subscriptions'
|
? '/subs/ - Subscriptions'
|
||||||
: isInModView
|
: isInModView
|
||||||
? startCase(t('boards_you_moderate'))
|
? '/mod/ - Boards You Moderate'
|
||||||
: defaultCommunity?.title || stableCommunity?.title;
|
: defaultCommunity?.title || stableCommunity?.title;
|
||||||
const subtitle = isInAllView
|
const subtitle = isInAllView
|
||||||
? ''
|
? ''
|
||||||
: isInSubscriptionsView
|
: isInSubscriptionsView
|
||||||
? subscriptionsSubtitle
|
? subscriptionsSubtitle
|
||||||
: isInModView
|
: isInModView
|
||||||
? '/mod/'
|
? ''
|
||||||
: isInDirectoryListView
|
: isInDirectoryListView
|
||||||
? t('directory_subtitle', { boardIdentifier: params.boardIdentifier })
|
? t('directory_subtitle', { boardIdentifier: params.boardIdentifier })
|
||||||
: `${address || communityAddress || ''}`;
|
: `${address || communityAddress || ''}`;
|
||||||
|
|||||||
@@ -15,7 +15,6 @@ const testState = vi.hoisted(() => ({
|
|||||||
{ address: 'music-posting.eth', title: '/mu/ - Music' },
|
{ address: 'music-posting.eth', title: '/mu/ - Music' },
|
||||||
{ address: 'tech-posting.eth', title: '/g/ - Technology' },
|
{ address: 'tech-posting.eth', title: '/g/ - Technology' },
|
||||||
] as Array<{ address: string; title?: string }>,
|
] as Array<{ address: string; title?: string }>,
|
||||||
directoriesMetadata: { title: '/all/ - All Boards' } as { title?: string } | null,
|
|
||||||
initializeVisibilityMock: vi.fn(),
|
initializeVisibilityMock: vi.fn(),
|
||||||
navigateMock: vi.fn(),
|
navigateMock: vi.fn(),
|
||||||
openBoardsBarEditModalMock: vi.fn(),
|
openBoardsBarEditModalMock: vi.fn(),
|
||||||
@@ -78,7 +77,6 @@ vi.mock('../../../hooks/use-directories', async () => {
|
|||||||
return {
|
return {
|
||||||
...actual,
|
...actual,
|
||||||
useDirectories: () => testState.directories,
|
useDirectories: () => testState.directories,
|
||||||
useDirectoriesMetadata: () => testState.directoriesMetadata,
|
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -160,7 +158,6 @@ describe('BoardsBar', () => {
|
|||||||
{ address: 'music-posting.eth', title: '/mu/ - Music' },
|
{ address: 'music-posting.eth', title: '/mu/ - Music' },
|
||||||
{ address: 'tech-posting.eth', title: '/g/ - Technology' },
|
{ address: 'tech-posting.eth', title: '/g/ - Technology' },
|
||||||
];
|
];
|
||||||
testState.directoriesMetadata = { title: '/all/ - All Boards' };
|
|
||||||
testState.navigateMock.mockReset();
|
testState.navigateMock.mockReset();
|
||||||
testState.openBoardsBarEditModalMock.mockReset();
|
testState.openBoardsBarEditModalMock.mockReset();
|
||||||
testState.openCreateBoardModalMock.mockReset();
|
testState.openCreateBoardModalMock.mockReset();
|
||||||
|
|||||||
@@ -5,7 +5,7 @@ import getShortAddress from '../../lib/get-short-address';
|
|||||||
import useAccountsStore from '@bitsocial/bitsocial-react-hooks/dist/stores/accounts';
|
import useAccountsStore from '@bitsocial/bitsocial-react-hooks/dist/stores/accounts';
|
||||||
import { isAllView, isCatalogView, isModView, isSubscriptionsView } from '../../lib/utils/view-utils';
|
import { isAllView, isCatalogView, isModView, isSubscriptionsView } from '../../lib/utils/view-utils';
|
||||||
import { useAccountCommunityAddresses } from '../../hooks/use-account-community-addresses';
|
import { useAccountCommunityAddresses } from '../../hooks/use-account-community-addresses';
|
||||||
import { useDirectories, useDirectoriesMetadata, DirectoryCommunity } from '../../hooks/use-directories';
|
import { useDirectories, DirectoryCommunity } from '../../hooks/use-directories';
|
||||||
import { useBoardPath, useResolvedCommunityAddress } from '../../hooks/use-resolved-community-address';
|
import { useBoardPath, useResolvedCommunityAddress } from '../../hooks/use-resolved-community-address';
|
||||||
import useSafeAccountComment from '../../hooks/use-safe-account-comment';
|
import useSafeAccountComment from '../../hooks/use-safe-account-comment';
|
||||||
import { getBoardPath, extractDirectoryFromTitle } from '../../lib/utils/route-utils';
|
import { getBoardPath, extractDirectoryFromTitle } from '../../lib/utils/route-utils';
|
||||||
@@ -19,7 +19,6 @@ import styles from './boards-bar.module.css';
|
|||||||
import capitalize from 'lodash/capitalize';
|
import capitalize from 'lodash/capitalize';
|
||||||
import debounce from 'lodash/debounce';
|
import debounce from 'lodash/debounce';
|
||||||
import lowerCase from 'lodash/lowerCase';
|
import lowerCase from 'lodash/lowerCase';
|
||||||
import startCase from 'lodash/startCase';
|
|
||||||
|
|
||||||
const SearchBar = ({ setShowSearchBar }: { setShowSearchBar: (show: boolean) => void }) => {
|
const SearchBar = ({ setShowSearchBar }: { setShowSearchBar: (show: boolean) => void }) => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
@@ -302,7 +301,6 @@ const BoardsBarMobile = ({ communityAddress }: { communityAddress?: string }) =>
|
|||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
const directories = useDirectories();
|
const directories = useDirectories();
|
||||||
const directoriesMetadata = useDirectoriesMetadata();
|
|
||||||
const displayCommunityAddress = communityAddress && communityAddress.length > 30 ? communityAddress.slice(0, 30).concat('...') : communityAddress;
|
const displayCommunityAddress = communityAddress && communityAddress.length > 30 ? communityAddress.slice(0, 30).concat('...') : communityAddress;
|
||||||
const [showSearchBar, setShowSearchBar] = useState(false);
|
const [showSearchBar, setShowSearchBar] = useState(false);
|
||||||
|
|
||||||
@@ -325,9 +323,9 @@ const BoardsBarMobile = ({ communityAddress }: { communityAddress?: string }) =>
|
|||||||
|
|
||||||
// Build multiboards with full titles, then combine with directory boards and sort alphabetically
|
// Build multiboards with full titles, then combine with directory boards and sort alphabetically
|
||||||
const sortedBoardOptions = useMemo(() => {
|
const sortedBoardOptions = useMemo(() => {
|
||||||
const allTitle = directoriesMetadata?.title || '/all/ - All 5chan Directories';
|
const allTitle = '/all/ - All 5chan Directories';
|
||||||
const subsTitle = '/subs/ - Subscriptions';
|
const subsTitle = '/subs/ - Subscriptions';
|
||||||
const modTitle = `/mod/ - ${startCase(t('boards_you_moderate'))}`;
|
const modTitle = '/mod/ - Boards You Moderate';
|
||||||
|
|
||||||
const multiboards: Array<{ value: string; label: string }> = [
|
const multiboards: Array<{ value: string; label: string }> = [
|
||||||
{ value: 'all', label: allTitle },
|
{ value: 'all', label: allTitle },
|
||||||
@@ -341,7 +339,7 @@ const BoardsBarMobile = ({ communityAddress }: { communityAddress?: string }) =>
|
|||||||
});
|
});
|
||||||
|
|
||||||
return [...multiboards, ...directoryOptions].sort((a, b) => a.label.localeCompare(b.label, undefined, { sensitivity: 'base' }));
|
return [...multiboards, ...directoryOptions].sort((a, b) => a.label.localeCompare(b.label, undefined, { sensitivity: 'base' }));
|
||||||
}, [directoriesMetadata?.title, t, accountCommunityAddresses.length, directoryBoards]);
|
}, [accountCommunityAddresses.length, directoryBoards]);
|
||||||
|
|
||||||
const boardSelect = (
|
const boardSelect = (
|
||||||
<select
|
<select
|
||||||
|
|||||||
Reference in New Issue
Block a user