/ src / hooks / use-initial-theme.ts
use-initial-theme.ts
 1  import { useMemo } from 'react';
 2  import { useLocation, useParams } from 'react-router-dom';
 3  import useThemeStore from '../stores/use-theme-store';
 4  import useDefaultSubplebbits from './use-default-subplebbits';
 5  import { isAllView, isHomeView, isNotFoundView, isPendingPostView, isSubscriptionsView } from '../lib/utils/view-utils';
 6  import { nsfwTags } from '../views/home/home';
 7  import { useAccountComment } from '@plebbit/plebbit-react-hooks';
 8  
 9  const useInitialTheme = (pendingPostSubplebbitAddress?: string) => {
10    const location = useLocation();
11    const { subplebbitAddress: paramsSubplebbitAddress, accountCommentIndex } = useParams<{ subplebbitAddress: string; accountCommentIndex?: string }>();
12    const commentIndex = accountCommentIndex ? parseInt(accountCommentIndex) : undefined;
13    const pendingPost = useAccountComment({ commentIndex });
14    const getTheme = useThemeStore((state) => state.getTheme);
15    const currentTheme = useThemeStore((state) => state.currentTheme);
16    const subplebbits = useDefaultSubplebbits();
17    const params = useParams();
18    const isInHomeView = isHomeView(location.pathname);
19    const isInNotFoundView = isNotFoundView(location.pathname, params);
20    const isInAllView = isAllView(location.pathname, params);
21    const isInSubscriptionsView = isSubscriptionsView(location.pathname, params);
22    const isInPendingPostView = isPendingPostView(location.pathname, params);
23  
24    const initialTheme = useMemo(() => {
25      let theme = 'yotsuba';
26  
27      if (isInPendingPostView) {
28        const subplebbitAddress = pendingPostSubplebbitAddress || pendingPost?.subplebbitAddress;
29        if (subplebbitAddress) {
30          const subplebbit = subplebbits.find((s) => s.address === subplebbitAddress);
31          if (subplebbit && subplebbit.tags && subplebbit.tags.some((tag) => nsfwTags.includes(tag))) {
32            theme = getTheme('nsfw', false) || 'yotsuba';
33          } else {
34            theme = getTheme('sfw', false) || 'yotsuba-b';
35          }
36        } else {
37          theme = currentTheme || 'yotsuba';
38        }
39      } else if (isInAllView || isInSubscriptionsView) {
40        theme = getTheme('sfw', false) || 'yotsuba-b'; // Add 'false' parameter
41      } else if (isInHomeView || isInNotFoundView) {
42        theme = 'yotsuba';
43      } else if (paramsSubplebbitAddress) {
44        const subplebbit = subplebbits.find((s) => s.address === paramsSubplebbitAddress);
45        if (subplebbit && subplebbit.tags && subplebbit.tags.some((tag) => nsfwTags.includes(tag))) {
46          theme = getTheme('nsfw', false) || 'yotsuba'; // Add 'false' parameter
47        } else {
48          theme = getTheme('sfw', false) || 'yotsuba-b'; // Add 'false' parameter
49        }
50      }
51  
52      return theme;
53    }, [
54      isInPendingPostView,
55      isInAllView,
56      isInSubscriptionsView,
57      isInHomeView,
58      isInNotFoundView,
59      paramsSubplebbitAddress,
60      getTheme,
61      currentTheme,
62      subplebbits,
63      pendingPostSubplebbitAddress,
64      pendingPost,
65    ]);
66  
67    return initialTheme;
68  };
69  
70  export default useInitialTheme;