migrated activeAccount state to rehook

src/components/multiAccounts/activeAccount.tsx

@@ -29,20 +29,19 @@ export const ActiveAccount = memo(function ActiveAccount({ user }: { user: any }
   const insertFollowsToStorage = useCallback(
     async (tags) => {
       const { createPleb } = await import('@utils/bindings');
-      const activeAccount = JSON.parse(localStorage.getItem('activeAccount'));
 
       for (const tag of tags) {
         const metadata: any = await fetchMetadata(tag[1], pool, relays);
         createPleb({
-          pleb_id: tag[1] + '-lume' + activeAccount.id.toString(),
+          pleb_id: tag[1] + '-lume' + user.id.toString(),
           pubkey: tag[1],
           kind: 0,
           metadata: metadata.content,
-          account_id: activeAccount.id,
+          account_id: user.id,
         }).catch(console.error);
       }
     },
-    [pool, relays]
+    [pool, relays, user.id]
   );
 
   useEffect(() => {

src/components/multiAccounts/index.tsx

@@ -6,15 +6,15 @@ import { APP_VERSION } from '@stores/constants';
 import LumeSymbol from '@assets/icons/Lume';
 
 import { PlusIcon } from '@radix-ui/react-icons';
+import useLocalStorage from '@rehooks/local-storage';
 import Link from 'next/link';
 import { useCallback, useEffect, useState } from 'react';
 
 export default function MultiAccounts() {
   const [users, setUsers] = useState([]);
+  const [activeAccount]: any = useLocalStorage('activeAccount');
 
   const renderAccount = useCallback((user: { pubkey: string }) => {
-    const activeAccount = JSON.parse(localStorage.getItem('activeAccount'));
-
     if (user.pubkey === activeAccount.pubkey) {
       return <ActiveAccount key={user.pubkey} user={user} />;
     } else {