small refactors

nym-wallet/src/components/Accounts/AccountContainer.tsx

@@ -15,6 +15,10 @@ export const AccountsContainer = ({ storedAccounts }: { storedAccounts: AccountE
     if (selected) setSelectedAccount(selected);
   }, [accounts, storedAccounts]);
 
+  useEffect(() => {
+    setAccounts(storedAccounts);
+  }, [storedAccounts]);
+
   const addAccount = async ({
     accountName,
     mnemonic,

nym-wallet/src/components/Accounts/Accounts.tsx

@@ -22,7 +22,7 @@ export const Accounts = ({
   setDialogToDisplay,
 }: {
   accounts?: AccountEntry[];
-  selectedAccount: AccountEntry;
+  selectedAccount?: AccountEntry;
   accountToEdit?: AccountEntry;
   dialogToDisplay?: TDialog;
   addAccount: (acc: { accountName: string; mnemonic: string; password: string }) => Promise<void>;
@@ -32,7 +32,7 @@ export const Accounts = ({
   setSelectedAccount: (accountName: string) => void;
   setDialogToDisplay: (dialog: TDialog | undefined) => void;
 }) =>
-  accounts ? (
+  accounts && selectedAccount ? (
     <>
       <Button
         startIcon={<AccountAvatar address={selectedAccount.address} name={selectedAccount.id} />}

nym-wallet/src/context/main.tsx

@@ -73,7 +73,7 @@ export const ClientContextProvider = ({ children }: { children: React.ReactNode
 
   const clearState = () => {
     userBalance.clearAll();
-    setClientDetails(undefined);
+    setStoredAccounts(undefined);
     setNetwork(undefined);
     setError(undefined);
     setIsLoading(false);
@@ -106,20 +106,19 @@ export const ClientContextProvider = ({ children }: { children: React.ReactNode
     const refreshAccount = async () => {
       if (network) {
         await loadAccount(network);
-        await getBondDetails();
-        await userBalance.fetchBalance();
       }
     };
     refreshAccount();
   }, [network]);
 
+  const loadAccounts = async () => {
+    const accs = await listAccounts();
+    setStoredAccounts(accs);
+  };
+
   useEffect(() => {
-    const fetchAccounts = async () => {
-      const accs = await listAccounts();
-      setStoredAccounts(accs);
-    };
-    fetchAccounts();
-  }, []);
+    if (!clientDetails) clearState();
+  }, [clientDetails]);
 
   const logIn = async ({ type, value }: { type: TLoginType; value: string }) => {
     if (value.length === 0) {
@@ -132,6 +131,7 @@ export const ClientContextProvider = ({ children }: { children: React.ReactNode
         await signInWithMnemonic(value);
       } else {
         await signInWithPassword(value);
+        await loadAccounts();
       }
       setNetwork('MAINNET');
       history.push('/balance');
@@ -143,8 +143,8 @@ export const ClientContextProvider = ({ children }: { children: React.ReactNode
   };
 
   const logOut = async () => {
-    clearState();
     await signOut();
+    setClientDetails(undefined);
     enqueueSnackbar('Successfully logged out', { variant: 'success' });
   };
 

nym-wallet/src/index.tsx

@@ -20,13 +20,11 @@ const App = () => {
     maximizeWindow();
   }, []);
 
-  if (!clientDetails)
-    return (
-      <WelcomeTheme>
-        <SignInProvider>{!isLoading ? <SignInRoutes /> : <LoadingPage />}</SignInProvider>
-      </WelcomeTheme>
-    );
-  return (
+  return !clientDetails ? (
+    <WelcomeTheme>
+      <SignInProvider>{!isLoading ? <SignInRoutes /> : <LoadingPage />}</SignInProvider>
+    </WelcomeTheme>
+  ) : (
     <NymWalletTheme>
       <ApplicationLayout>
         <Settings />

nym-wallet/src/pages/sign-in/pages/signin-mnemonic.tsx

@@ -3,12 +3,13 @@ import { useHistory } from 'react-router-dom';
 import { Box, Button, FormControl, Stack } from '@mui/material';
 import { isPasswordCreated } from 'src/requests';
 import { MnemonicInput, Subtitle } from '../components';
-import { ClientContext } from '../../../context/main';
+import { ClientContext } from 'src/context';
 
 export const SignInMnemonic = () => {
   const [mnemonic, setMnemonic] = useState('');
-  const { setError, logIn, error } = useContext(ClientContext);
   const [passwordExists, setPasswordExists] = useState(true);
+
+  const { setError, logIn, error } = useContext(ClientContext);
   const history = useHistory();
 
   const checkForPassword = async () => {