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(themes): inherit selected theme in pending post page

Browse Source
This commit is contained in:
Tom (plebeius.eth)
2024-07-10 12:36:44 +02:00
parent 14ef6fe1aa
commit d66a0b8efe
2 changed files with 13 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/hooks/use-initial-theme.ts
+6 -2
View File
@@ -1,21 +1,25 @@
import { useLocation, useParams } from 'react-router-dom'; import { useLocation, useParams } from 'react-router-dom';
import useThemeStore from '../stores/use-theme-store'; import useThemeStore from '../stores/use-theme-store';
import useDefaultSubplebbits from './use-default-subplebbits'; import useDefaultSubplebbits from './use-default-subplebbits';
import { isAllView, isHomeView, isNotFoundView, isSubscriptionsView } from '../lib/utils/view-utils'; import { isAllView, isHomeView, isNotFoundView, isPendingPostView, isSubscriptionsView } from '../lib/utils/view-utils';
import { nsfwTags } from '../views/home/home'; import { nsfwTags } from '../views/home/home';
const useInitialTheme = () => { const useInitialTheme = () => {
const location = useLocation(); const location = useLocation();
const { subplebbitAddress } = useParams<{ subplebbitAddress: string }>(); const { subplebbitAddress } = useParams<{ subplebbitAddress: string }>();
const getTheme = useThemeStore((state) => state.getTheme); const getTheme = useThemeStore((state) => state.getTheme);
const currentTheme = useThemeStore((state) => state.currentTheme);
const subplebbits = useDefaultSubplebbits(); const subplebbits = useDefaultSubplebbits();
const params = useParams(); const params = useParams();
const isInHomeView = isHomeView(location.pathname); const isInHomeView = isHomeView(location.pathname);
const isInNotFoundView = isNotFoundView(location.pathname, params); const isInNotFoundView = isNotFoundView(location.pathname, params);
const isInAllView = isAllView(location.pathname, params); const isInAllView = isAllView(location.pathname, params);
const isInSubscriptionsView = isSubscriptionsView(location.pathname, params); const isInSubscriptionsView = isSubscriptionsView(location.pathname, params);
const isInPendingPostView = isPendingPostView(location.pathname, params);
if (isInAllView) { if (isInPendingPostView) {
return currentTheme || 'yotsuba';
} else if (isInAllView) {
return getTheme('all') || 'yotsuba-b'; return getTheme('all') || 'yotsuba-b';
} else if (isInSubscriptionsView) { } else if (isInSubscriptionsView) {
return getTheme('subscriptions') || 'yotsuba-b'; return getTheme('subscriptions') || 'yotsuba-b';
src/stores/use-theme-store.ts
+7 -3
View File
@@ -8,6 +8,7 @@ interface ThemeState {
all: string; all: string;
subscriptions: string; subscriptions: string;
}; };
currentTheme: string | null;
setTheme: (category: keyof ThemeState['themes'], theme: string) => void; setTheme: (category: keyof ThemeState['themes'], theme: string) => void;
getTheme: (category: keyof ThemeState['themes']) => string | null; getTheme: (category: keyof ThemeState['themes']) => string | null;
loadThemes: () => Promise<void>; loadThemes: () => Promise<void>;
@@ -25,15 +26,18 @@ const useThemeStore = create<ThemeState>((set: StoreApi<ThemeState>['setState'],
all: 'yotsuba-b', all: 'yotsuba-b',
subscriptions: 'yotsuba-b', subscriptions: 'yotsuba-b',
}, },
currentTheme: null,
setTheme: async (category, theme) => { setTheme: async (category, theme) => {
const currentThemes = get().themes; const currentThemes = get().themes;
const updatedThemes = { ...currentThemes, [category]: theme }; const updatedThemes = { ...currentThemes, [category]: theme };
await themeStore.setItem(category, theme); await themeStore.setItem(category, theme);
set({ themes: updatedThemes }); set({ themes: updatedThemes, currentTheme: theme });
}, },
getTheme: (category) => { getTheme: (category) => {
const currentThemes = get().themes; const currentThemes = get().themes;
return currentThemes[category] || null; const theme = currentThemes[category] || null;
set({ currentTheme: theme });
return theme;
}, },
loadThemes: async () => { loadThemes: async () => {
const entries: [keyof ThemeState['themes'], string][] = await themeStore.entries(); const entries: [keyof ThemeState['themes'], string][] = await themeStore.entries();
@@ -46,7 +50,7 @@ const useThemeStore = create<ThemeState>((set: StoreApi<ThemeState>['setState'],
entries.forEach(([key, value]) => { entries.forEach(([key, value]) => {
themes[key] = value; themes[key] = value;
}); });
set({ themes }); set({ themes, currentTheme: null });
}, },
})); }));