use top level await for some functions

src/components/appHeader/actions.tsx

@@ -1,9 +1,6 @@
 import { ArrowLeft, ArrowRight, Refresh } from 'iconoir-react';
-import { useCallback, useEffect, useState } from 'react';
 
 export default function AppActions() {
-  const [os, setOS] = useState('');
-
   const goBack = () => {
     window.history.back();
   };
@@ -16,27 +13,8 @@ export default function AppActions() {
     window.location.reload();
   };
 
-  const getPlatform = useCallback(async () => {
-    const { platform } = await import('@tauri-apps/api/os');
-    const result = await platform();
-
-    setOS(result);
-  }, []);
-
-  useEffect(() => {
-    let ignore = false;
-
-    if (!ignore) {
-      getPlatform().catch(console.error);
-    }
-
-    return () => {
-      ignore = true;
-    };
-  }, []);
-
   return (
-    <div className={`flex h-full items-center gap-2 ${os === 'darwin' ? 'pl-[68px]' : ''}`}>
+    <div className={`pl-[68px]} flex h-full items-center gap-2`}>
       <button
         onClick={() => goBack()}
         className="group inline-flex h-6 w-6 items-center justify-center rounded-md hover:bg-zinc-900"

src/components/channels/channelList.tsx

@@ -3,14 +3,11 @@ import { ChannelListItem } from '@components/channels/channelListItem';
 import { DEFAULT_CHANNELS } from '@stores/constants';
 
 import { Plus } from 'iconoir-react';
-import { useState } from 'react';
 
 export default function ChannelList() {
-  const [list] = useState(DEFAULT_CHANNELS);
-
   return (
     <div className="flex flex-col gap-px">
-      {list.map((item) => (
+      {DEFAULT_CHANNELS.map((item) => (
         <ChannelListItem key={item.event_id} data={item} />
       ))}
       <a

src/components/chats/chatList.tsx

@@ -3,32 +3,22 @@ import { ChatModal } from '@components/chats/chatModal';
 
 import { DEFAULT_AVATAR } from '@stores/constants';
 
-import { getChats } from '@utils/storage';
-
 import useLocalStorage from '@rehooks/local-storage';
-import { useEffect, useState } from 'react';
+
+let list: any = [];
+
+if (typeof window !== 'undefined') {
+  const { getChats } = await import('@utils/storage');
+  const getAccount = window.localStorage.getItem('account');
+  const account = getAccount ? JSON.parse(getAccount) : null;
+
+  list = await getChats(account.id);
+}
 
 export default function ChatList() {
-  const [list, setList] = useState([]);
   const [activeAccount]: any = useLocalStorage('account', {});
   const profile = activeAccount.metadata ? JSON.parse(activeAccount.metadata) : null;
 
-  useEffect(() => {
-    let ignore = false;
-
-    getChats(activeAccount.id)
-      .then((res: any) => {
-        if (!ignore) {
-          setList(res);
-        }
-      })
-      .catch(console.error);
-
-    return () => {
-      ignore = true;
-    };
-  }, [activeAccount.id]);
-
   return (
     <div className="flex flex-col gap-px">
       <a

src/components/multiAccounts/index.tsx

@@ -3,45 +3,43 @@ import { InactiveAccount } from '@components/multiAccounts/inactiveAccount';
 
 import { APP_VERSION } from '@stores/constants';
 
-import { getAccounts } from '@utils/storage';
-
 import LumeSymbol from '@assets/icons/Lume';
 
 import useLocalStorage from '@rehooks/local-storage';
 import { Plus } from 'iconoir-react';
-import { useCallback, useEffect, useState } from 'react';
+import { useCallback } from 'react';
+
+let accounts: any = [];
+
+if (typeof window !== 'undefined') {
+  const { getAccounts } = await import('@utils/storage');
+  accounts = await getAccounts();
+}
 
 export default function MultiAccounts() {
-  const [users, setUsers] = useState([]);
   const [activeAccount]: any = useLocalStorage('account', {});
 
   const renderAccount = useCallback(
-    (user: { pubkey: string }) => {
-      if (user.pubkey === activeAccount.pubkey) {
-        return <ActiveAccount key={user.pubkey} user={user} />;
+    (account: { pubkey: string }) => {
+      if (account.pubkey === activeAccount.pubkey) {
+        return <ActiveAccount key={account.pubkey} user={account} />;
       } else {
-        return <InactiveAccount key={user.pubkey} user={user} />;
+        return <InactiveAccount key={account.pubkey} user={account} />;
       }
     },
     [activeAccount.pubkey]
   );
 
-  useEffect(() => {
-    getAccounts()
-      .then((res: any) => setUsers(res))
-      .catch(console.error);
-  }, []);
-
   return (
     <div className="flex h-full flex-col items-center justify-between px-2 pb-4 pt-3">
-      <div className="flex flex-col gap-4">
+      <div className="flex flex-col gap-3">
         <a
           href="/explore"
           className="group relative flex h-11 w-11 shrink cursor-pointer items-center justify-center rounded-lg bg-zinc-900 hover:bg-zinc-800"
         >
           <LumeSymbol className="h-6 w-auto text-zinc-400 group-hover:text-zinc-200" />
         </a>
-        <div>{users.map((user) => renderAccount(user))}</div>
+        {accounts.map((account: { pubkey: string }) => renderAccount(account))}
         <a
           href="/onboarding"
           className="group relative flex h-11 w-11 shrink cursor-pointer items-center justify-center rounded-lg border-2 border-dashed border-zinc-600 hover:border-zinc-400"

src/pages/index.page.tsx

@@ -123,7 +123,7 @@ export function Page() {
         () => {
           updateLastLogin(dateToUnix(now.current));
           timeout.current = setTimeout(() => {
-            navigate('/newsfeed/following');
+            navigate('/newsfeed/following', { overwriteLastHistoryEntry: true });
           }, 5000);
         },
         {

src/pages/onboarding/create/index.page.client.tsx

@@ -60,7 +60,7 @@ export function Page() {
     // broadcast
     pool.publish(event, relays);
     // redirect to next step
-    navigate(`/onboarding/create/step-2?pubkey=${pubkey}&privkey=${privkey}`);
+    navigate(`/onboarding/create/step-2?pubkey=${pubkey}&privkey=${privkey}`, { overwriteLastHistoryEntry: true });
   }, [pool, pubkey, privkey, metadata, relays]);
 
   return (

src/pages/onboarding/login/index.page.client.tsx

@@ -39,7 +39,7 @@ export function Page() {
         privkey = nip19.decode(privkey).data;
       }
       if (typeof getPublicKey(privkey) === 'string') {
-        navigate(`/onboarding/login/step-2?privkey=${privkey}`);
+        navigate(`/onboarding/login/step-2?privkey=${privkey}`, { overwriteLastHistoryEntry: true });
       }
     } catch (error) {
       setError('key', {

src/utils/hooks/useProfileMetadata.tsx

@@ -1,10 +1,8 @@
-import { RelayContext } from '@components/relaysProvider';
-
 import { createPleb } from '@utils/storage';
 
 import useLocalStorage from '@rehooks/local-storage';
 import { fetch } from '@tauri-apps/api/http';
-import { useCallback, useContext, useEffect, useMemo, useState } from 'react';
+import { useCallback, useEffect, useMemo, useState } from 'react';
 
 export const fetchProfileMetadata = async (pubkey: string) => {
   const result = await fetch(`https://rbr.bio/${pubkey}/metadata.json`, {
@@ -15,7 +13,6 @@ export const fetchProfileMetadata = async (pubkey: string) => {
 };
 
 export const useProfileMetadata = (pubkey: string) => {
-  const [pool, relays]: any = useContext(RelayContext);
   const [activeAccount]: any = useLocalStorage('account', {});
   const [plebs] = useLocalStorage('plebs', []);
   const [profile, setProfile] = useState(null);
@@ -40,16 +37,11 @@ export const useProfileMetadata = (pubkey: string) => {
     return createPleb(pubkey, metadata);
   }, []);
 
-  const fetchProfileFromRelays = useCallback(async (pubkey: string) => {
-    const result = await pool.fetchAndCacheMetadata(pubkey, relays);
-    return result;
-  }, []);
-
   useEffect(() => {
     let ignore = false;
 
     if (!cacheProfile && !ignore) {
-      fetchProfileFromRelays(pubkey)
+      fetchProfileMetadata(pubkey)
         .then((res: any) => {
           // update state
           setProfile(JSON.parse(res.content));