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

fix(topbar): correct mobile topbar select values for directory boards

Browse Source
This commit is contained in:
plebeius
2025-11-14 14:39:48 +01:00
parent 1b38335118
commit 723ad9fb58
1 changed files with 16 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/topbar/topbar.tsx
+16 -15
View File
@@ -228,12 +228,12 @@ const TopBarDesktop = () => {
const TopBarMobile = ({ subplebbitAddress }: { subplebbitAddress: string }) => { const TopBarMobile = ({ subplebbitAddress }: { subplebbitAddress: string }) => {
const { t } = useTranslation(); const { t } = useTranslation();
const navigate = useNavigate(); const navigate = useNavigate();
const subplebbitAddresses = useDefaultSubplebbitAddresses();
const defaultSubplebbits = useDefaultSubplebbits(); const defaultSubplebbits = useDefaultSubplebbits();
const displaySubplebbitAddress = subplebbitAddress && subplebbitAddress.length > 30 ? subplebbitAddress.slice(0, 30).concat('...') : subplebbitAddress; const displaySubplebbitAddress = subplebbitAddress && subplebbitAddress.length > 30 ? subplebbitAddress.slice(0, 30).concat('...') : subplebbitAddress;
const [showSearchBar, setShowSearchBar] = useState(false); const [showSearchBar, setShowSearchBar] = useState(false);
const currentSubplebbitIsInList = subplebbitAddresses.some((address: string) => address === subplebbitAddress); // Filter to only show directory boards (those with titles)
const directoryBoards = useMemo(() => defaultSubplebbits.filter((sub) => sub.title && extractDirectoryFromTitle(sub.title)), [defaultSubplebbits]);
const location = useLocation(); const location = useLocation();
const params = useParams(); const params = useParams();
@@ -241,36 +241,37 @@ const TopBarMobile = ({ subplebbitAddress }: { subplebbitAddress: string }) => {
const isInCatalogView = isCatalogView(location.pathname, params); const isInCatalogView = isCatalogView(location.pathname, params);
const isInSubscriptionsView = isSubscriptionsView(location.pathname, params); const isInSubscriptionsView = isSubscriptionsView(location.pathname, params);
const boardPath = useBoardPath(subplebbitAddress); const boardPath = useBoardPath(subplebbitAddress);
const selectValue = isInAllView ? 'all' : isInSubscriptionsView ? 'subscriptions' : boardPath || subplebbitAddress; const selectValue = isInAllView ? 'all' : isInSubscriptionsView ? 'subs' : boardPath || subplebbitAddress;
const { accountSubplebbits } = useAccountSubplebbits(); const { accountSubplebbits } = useAccountSubplebbits();
const accountSubplebbitAddresses = Object.keys(accountSubplebbits); const accountSubplebbitAddresses = Object.keys(accountSubplebbits);
// Check if current subplebbit is a directory board
const currentIsDirectoryBoard = directoryBoards.some((board) => board.address === subplebbitAddress);
const boardSelect = ( const boardSelect = (
<select <select
value={selectValue} value={selectValue}
onChange={(e) => { onChange={(e) => {
const value = e.target.value; const value = e.target.value;
// If it's a directory code or special route, use it directly // If it's a special route, use it directly
if (value === 'all' || value === 'subscriptions' || value === 'mod') { if (value === 'all' || value === 'subs' || value === 'mod') {
navigate(`/${value}${isInCatalogView ? '/catalog' : ''}`); navigate(`/${value}${isInCatalogView ? '/catalog' : ''}`);
} else { } else {
// Otherwise, resolve to board path // Otherwise, it's a directory code, use it directly
const path = getBoardPath(value, defaultSubplebbits); navigate(`/${value}${isInCatalogView ? '/catalog' : ''}`);
navigate(`/${path}${isInCatalogView ? '/catalog' : ''}`);
} }
}} }}
> >
{!currentSubplebbitIsInList && subplebbitAddress && <option value={subplebbitAddress}>{displaySubplebbitAddress}</option>} {!currentIsDirectoryBoard && subplebbitAddress && <option value={subplebbitAddress}>{displaySubplebbitAddress}</option>}
<option value='all'>all</option> <option value='all'>all</option>
<option value='subscriptions'>subscriptions</option> <option value='subs'>subs</option>
{accountSubplebbitAddresses.length > 0 && <option value='mod'>mod</option>} {accountSubplebbitAddresses.length > 0 && <option value='mod'>mod</option>}
{subplebbitAddresses.map((address: any, index: number) => { {directoryBoards.map((board, index) => {
const subplebbitAddress = address?.includes('.') ? address : Plebbit.getShortAddress(address); const directoryCode = extractDirectoryFromTitle(board.title!);
const boardPath = getBoardPath(address, defaultSubplebbits);
return ( return (
<option key={index} value={boardPath}> <option key={index} value={directoryCode!}>
{Plebbit.getShortAddress(subplebbitAddress)} {board.title}
</option> </option>
); );
})} })}