fix navigating to home or 404 resets style

src/components/views/All.jsx

@@ -231,8 +231,7 @@ const All = () => {
               <Link to={`/p/all/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>
               ]
               [
-              <Link to="/" onClick={() => handleStyleChange({target: {value: "Yotsuba"}}
+              <Link to="/">Home</Link>
-              )}>Home</Link>
               ]
             </span>
             <div id="board-nav-mobile" style={{ top: visible ? 0 : '-23px' }}>

src/components/views/AllCatalog.jsx

@@ -132,8 +132,7 @@ const AllCatalog = () => {
               <Link to={`/p/all/catalog/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>
               ]
               [
-              <Link to="/" onClick={() => handleStyleChange({target: {value: "Yotsuba"}}
+              <Link to="/">Home</Link>
-              )}>Home</Link>
               ]
             </span>
             <div id="board-nav-mobile" style={{ top: visible ? 0 : '-23px' }}>

src/components/views/Board.jsx

@@ -574,8 +574,7 @@ const Board = () => {
               <Link to={`/p/${selectedAddress}/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>
               ]
               [
-              <Link to="/" onClick={() => handleStyleChange({target: {value: "Yotsuba"}}
+              <Link to="/">Home</Link>
-              )}>Home</Link>
               ]
             </span>
             <div id="board-nav-mobile" style={{ top: visible ? 0 : '-23px' }}>

src/components/views/Catalog.jsx

@@ -497,8 +497,7 @@ const Catalog = () => {
               <Link to={`/p/${selectedAddress}/catalog/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>
               ]
               [
-              <Link to="/" onClick={() => handleStyleChange({target: {value: "Yotsuba"}}
+              <Link to="/">Home</Link>
-              )}>Home</Link>
               ]
             </span>
             <div id="board-nav-mobile" style={{ top: visible ? 0 : '-23px' }}>

src/components/views/Home.jsx

@@ -15,25 +15,36 @@ const commitRef = process?.env?.REACT_APP_COMMIT_REF ? ` ${process.env.REACT_APP
 
 const Home = () => {
   const { 
-    setBodyStyle,
+    bodyStyle, setBodyStyle,
     defaultSubplebbits,
     setSelectedAddress, 
-    setSelectedStyle,
+    selectedStyle, setSelectedStyle,
     setSelectedTitle
   } = useGeneralStore(state => state);
 
   const account = useAccount();
-  const inputRef = useRef(null);
   const navigate = useNavigate();
   
+  const inputRef = useRef(null);
+  const prevStyle = useRef(selectedStyle);
+  const prevBodyStyle = useRef(bodyStyle);
+
   // prevent dark mode
   useEffect(() => {
+    const currentPrevStyle = prevStyle.current;
+    const currentPrevBodyStyle = prevBodyStyle.current;
+
     setBodyStyle({
       background: "#ffe url(assets/fade.png) top repeat-x",
       color: "maroon",
       fontFamily: "Helvetica, Arial, sans-serif"
     });
     setSelectedStyle("Yotsuba");
+
+    return () => {
+      setSelectedStyle(currentPrevStyle);
+      setBodyStyle(currentPrevBodyStyle);
+    };
   }, [setBodyStyle, setSelectedStyle]);
 
 

src/components/views/NotFound.jsx

@@ -1,4 +1,4 @@
-import React, { useEffect }  from 'react';
+import React, { useEffect, useRef }  from 'react';
 import { Helmet } from 'react-helmet-async';
 import useGeneralStore from '../../hooks/stores/useGeneralStore';
 import { Link } from "react-router-dom";
@@ -7,16 +7,31 @@ import packageJson from '../../../package.json'
 const {version} = packageJson
 
 
-const NotFound = ({ setBodyStyle }) => {
+const NotFound = () => {
-  const { setSelectedStyle } = useGeneralStore(state => state);
+  const { 
+    bodyStyle, setBodyStyle,
+    selectedStyle, setSelectedStyle,
+  } = useGeneralStore(state => state);
 
+  const prevStyle = useRef(selectedStyle);
+  const prevBodyStyle = useRef(bodyStyle);
+
+  // prevent dark mode
   useEffect(() => {
+    const currentPrevStyle = prevStyle.current;
+    const currentPrevBodyStyle = prevBodyStyle.current;
+
     setBodyStyle({
       background: "#ffe url(assets/fade.png) top repeat-x",
       color: "maroon",
       fontFamily: "Helvetica, Arial, sans-serif"
     });
     setSelectedStyle("Yotsuba");
+
+    return () => {
+      setSelectedStyle(currentPrevStyle);
+      setBodyStyle(currentPrevBodyStyle);
+    };
   }, [setBodyStyle, setSelectedStyle]);
 
   return (

src/components/views/Pending.jsx

@@ -136,8 +136,7 @@ const Pending = () => {
               <Link to={`/profile/c/${index}/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>
               ]
               [
-              <Link to="/" onClick={() => handleStyleChange({target: {value: "Yotsuba"}}
+              <Link to="/">Home</Link>
-              )}>Home</Link>
               ]
             </span>
             <div id="board-nav-mobile" style={{ top: visible ? 0 : '-23px' }}>

src/components/views/Subscriptions.jsx

@@ -230,8 +230,7 @@ const Subscriptions = () => {
               <Link to={`/p/subscriptions/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>
               ]
               [
-              <Link to="/" onClick={() => handleStyleChange({target: {value: "Yotsuba"}}
+              <Link to="/">Home</Link>
-              )}>Home</Link>
               ]
             </span>
             <div id="board-nav-mobile" style={{ top: visible ? 0 : '-23px' }}>

src/components/views/SubscriptionsCatalog.jsx

@@ -133,8 +133,7 @@ const SubscriptionsCatalog = () => {
               <Link to={`/p/subscriptions/catalog/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>
               ]
               [
-              <Link to="/" onClick={() => handleStyleChange({target: {value: "Yotsuba"}}
+              <Link to="/">Home</Link>
-              )}>Home</Link>
               ]
             </span>
             <div id="board-nav-mobile" style={{ top: visible ? 0 : '-23px' }}>

src/components/views/Thread.jsx

@@ -532,8 +532,7 @@ const Thread = () => {
               <Link to={`/p/${selectedAddress}/c/${selectedThread}/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>
               ]
               [
-              <Link to="/" onClick={() => handleStyleChange({target: {value: "Yotsuba"}}
+              <Link to="/">Home</Link>
-              )}>Home</Link>
               ]
             </span>
             <div id="board-nav-mobile" style={{ top: visible ? 0 : '-23px' }}>