migrated activeAccount state to rehook

src/pages/chats/[pubkey].tsx

@@ -5,9 +5,7 @@ import { MessageList } from '@components/chats/messageList';
 import FormChat from '@components/form/chat';
 import { RelayContext } from '@components/relaysProvider';
 
-import { activeAccountAtom } from '@stores/account';
-
-import { useAtomValue } from 'jotai';
+import useLocalStorage from '@rehooks/local-storage';
 import { useRouter } from 'next/router';
 import {
   JSXElementConstructor,
@@ -25,7 +23,7 @@ export default function Page() {
   const router = useRouter();
   const pubkey: any = router.query.pubkey || null;
 
-  const activeAccount: any = useAtomValue(activeAccountAtom);
+  const [activeAccount]: any = useLocalStorage('activeAccount');
   const [messages, setMessages] = useState([]);
 
   useEffect(() => {

src/pages/index.tsx

@@ -1,17 +1,13 @@
 import BaseLayout from '@layouts/base';
 
-import { activeAccountAtom, activeAccountFollowsAtom } from '@stores/account';
-
 import LumeSymbol from '@assets/icons/Lume';
 
-import { useSetAtom } from 'jotai';
+import { writeStorage } from '@rehooks/local-storage';
 import { useRouter } from 'next/router';
 import { JSXElementConstructor, ReactElement, ReactFragment, ReactPortal, useCallback, useEffect } from 'react';
 
 export default function Page() {
   const router = useRouter();
-  const setActiveAccount = useSetAtom(activeAccountAtom);
-  const setActiveAccountFollows = useSetAtom(activeAccountFollowsAtom);
 
   const fetchActiveAccount = useCallback(async () => {
     const { getAccounts } = await import('@utils/bindings');
@@ -29,10 +25,10 @@ export default function Page() {
         if (res.length > 0) {
           // fetch follows
           fetchFollowsByAccount(res[0].id).then((follows) => {
-            setActiveAccountFollows(follows);
+            writeStorage('activeAccountFollows', follows);
           });
           // update local storage
-          setActiveAccount(res[0]);
+          writeStorage('activeAccount', res[0]);
           // redirect
           router.replace('/init');
         } else {
@@ -40,7 +36,7 @@ export default function Page() {
         }
       })
       .catch(console.error);
-  }, [fetchActiveAccount, setActiveAccount, fetchFollowsByAccount, setActiveAccountFollows, router]);
+  }, [fetchActiveAccount, fetchFollowsByAccount, router]);
 
   return (
     <div className="relative h-full overflow-hidden">

src/pages/init.tsx

@@ -7,6 +7,7 @@ import { getParentID, pubkeyArray } from '@utils/transform';
 
 import LumeSymbol from '@assets/icons/Lume';
 
+import { useLocalStorage } from '@rehooks/local-storage';
 import { invoke } from '@tauri-apps/api/tauri';
 import { useRouter } from 'next/router';
 import {
@@ -30,11 +31,13 @@ export default function Page() {
 
   const [eose, setEose] = useState(false);
 
+  const [lastLogin] = useLocalStorage('lastLogin');
+  const [activeAccount]: any = useLocalStorage('activeAccount');
+  const [follows] = useLocalStorage('activeAccountFollows');
+
   const fetchData = useCallback(
     async (since: Date) => {
       const { createNote } = await import('@utils/bindings');
-      const activeAccount = JSON.parse(localStorage.getItem('activeAccount'));
-      const follows = JSON.parse(localStorage.getItem('activeAccountFollows'));
 
       unsubscribe.current = pool.subscribe(
         [
@@ -67,20 +70,19 @@ export default function Page() {
         }
       );
     },
-    [pool, relays]
+    [activeAccount.id, follows, pool, relays]
   );
 
   const isNoteExist = useCallback(async () => {
     invoke('count_total_notes').then((res: number) => {
       if (res > 0) {
-        const lastLogin = JSON.parse(localStorage.getItem('lastLogin'));
         const parseDate = new Date(lastLogin);
         fetchData(parseDate);
       } else {
         fetchData(hoursAgo(24, now.current));
       }
     });
-  }, [fetchData]);
+  }, [fetchData, lastLogin]);
 
   useEffect(() => {
     if (eose === false) {