fix: performance, logic

This commit is contained in:
Tom (plebeius.eth)
2024-06-17 15:39:49 +02:00
parent 22c1acdd3d
commit 3eb9c5c20f
3 changed files with 42 additions and 56 deletions
+37 -23
View File
@@ -1,46 +1,60 @@
import { useEffect, useState } from 'react';
import { useState, useMemo } from 'react';
import { useLocation, useParams } from 'react-router-dom';
import useThemeStore from '../stores/use-theme-store';
import useDefaultSubplebbits from './use-default-subplebbits';
import { isHomeView } from '../lib/utils/view-utils';
import { isAllView, isHomeView, isNotFoundView, isSubscriptionsView } from '../lib/utils/view-utils';
import { nsfwTags } from '../views/home/home';
const useTheme = (): [string, (theme: string) => void] => {
const location = useLocation();
const isInHomeView = isHomeView(location.pathname);
const { subplebbitAddress } = useParams<{ subplebbitAddress: string }>();
const getTheme = useThemeStore((state) => state.getTheme);
const setTheme = useThemeStore((state) => state.setTheme);
const setThemeStore = useThemeStore((state) => state.setTheme);
const subplebbits = useDefaultSubplebbits();
const [theme, setLocalTheme] = useState('yotsuba-b');
const params = useParams();
const isInHomeView = isHomeView(location.pathname);
const isInNotFoundView = isNotFoundView(location.pathname, params);
const isInAllView = isAllView(location.pathname, params);
const isInSubscriptionsView = isSubscriptionsView(location.pathname, params);
useEffect(() => {
let initialTheme = 'yotsuba-b';
if (isInHomeView) {
initialTheme = 'yotsuba';
const initialTheme = useMemo(() => {
if (isInAllView || isInSubscriptionsView) {
const userTheme = getTheme(isInAllView ? 'all' : 'subscriptions');
return userTheme || 'yotsuba-b';
} else if (isInHomeView || isInNotFoundView) {
return 'yotsuba';
} else if (subplebbitAddress) {
initialTheme = getTheme(subplebbitAddress);
const subplebbit = subplebbits.find((s) => s.address === subplebbitAddress);
if (subplebbit && subplebbit.tags && subplebbit.tags.some((tag) => nsfwTags.includes(tag)) && initialTheme === 'yotsuba-b') {
initialTheme = 'yotsuba';
setTheme(subplebbitAddress, 'yotsuba');
const userTheme = getTheme(subplebbitAddress);
if (userTheme) {
return userTheme;
}
const subplebbit = subplebbits.find((s) => s.address === subplebbitAddress);
if (subplebbit && subplebbit.tags && subplebbit.tags.some((tag) => nsfwTags.includes(tag))) {
return 'yotsuba';
}
return 'yotsuba-b';
}
return 'yotsuba';
}, [location.pathname, subplebbitAddress, subplebbits, getTheme]);
setLocalTheme(initialTheme);
const [theme, setLocalTheme] = useState(initialTheme);
useMemo(() => {
document.body.classList.remove('yotsuba', 'yotsuba-b', 'futaba', 'burichan', 'tomorrow', 'photon');
document.body.classList.add(initialTheme);
}, [subplebbitAddress, subplebbits, getTheme, setTheme, isInHomeView, location.pathname]);
}, [initialTheme]);
const setSubplebbitTheme = (theme: string) => {
const setSubplebbitTheme = (newTheme: string) => {
if (subplebbitAddress) {
setTheme(subplebbitAddress, theme);
setLocalTheme(theme);
document.body.classList.remove('yotsuba', 'yotsuba-b', 'futaba', 'burichan', 'tomorrow', 'photon');
document.body.classList.add(theme);
setThemeStore(subplebbitAddress, newTheme);
} else if (isInAllView) {
setThemeStore('all', newTheme);
} else if (isInSubscriptionsView) {
setThemeStore('subscriptions', newTheme);
}
setLocalTheme(newTheme);
document.body.classList.remove('yotsuba', 'yotsuba-b', 'futaba', 'burichan', 'tomorrow', 'photon');
document.body.classList.add(newTheme);
};
return [theme, setSubplebbitTheme];