add accounts wip

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

@@ -3,6 +3,7 @@ import {
   Alert,
   Box,
   Button,
+  CircularProgress,
   Dialog,
   DialogActions,
   DialogContent,
@@ -115,6 +116,8 @@ const NameAccount = ({ onNext }: { onNext: (value: string) => void }) => {
 
 const ConfirmPassword = ({ onConfirm }: { onConfirm: (password: string) => void }) => {
   const [value, setValue] = useState('');
+  const { isLoading } = useContext(AccountsContext);
+
   return (
     <Box sx={{ mt: 1 }}>
       <DialogContent>
@@ -122,12 +125,13 @@ const ConfirmPassword = ({ onConfirm }: { onConfirm: (password: string) => void
       </DialogContent>
       <DialogActions sx={{ p: 3, pt: 0 }}>
         <Button
-          disabled={!value.length}
+          disabled={!value.length || isLoading}
           fullWidth
           disableElevation
           variant="contained"
           size="large"
           onClick={() => onConfirm(value)}
+          endIcon={isLoading && <CircularProgress size={20} />}
         >
           Add account
         </Button>

nym-wallet/src/context/accounts.tsx

@@ -9,6 +9,7 @@ type TAccounts = {
   selectedAccount?: AccountEntry;
   accountToEdit?: AccountEntry;
   dialogToDisplay?: TAccountsDialog;
+  isLoading: boolean;
   handleAddAccount: (data: { accountName: string; mnemonic: string; password: string }) => void;
   setDialogToDisplay: (dialog?: TAccountsDialog) => void;
   handleSelectAccount: (accountId: string) => void;
@@ -22,11 +23,11 @@ export type TAccountsDialog = 'Accounts' | 'Add' | 'Edit' | 'Import';
 export const AccountsContext = createContext({} as TAccounts);
 
 export const AccountsProvider: React.FC = ({ children }) => {
-  const [accounts, setAccounts] = useState<AccountEntry[]>();
+  const [accounts, setAccounts] = useState<AccountEntry[]>([]);
   const [selectedAccount, setSelectedAccount] = useState<AccountEntry>();
   const [accountToEdit, setAccountToEdit] = useState<AccountEntry>();
   const [dialogToDisplay, setDialogToDisplay] = useState<TAccountsDialog>();
-
+  const [isLoading, setIsLoading] = useState(false);
   const { onAccountChange, storedAccounts } = useContext(ClientContext);
   const { enqueueSnackbar } = useSnackbar();
 
@@ -39,14 +40,20 @@ export const AccountsProvider: React.FC = ({ children }) => {
     mnemonic: string;
     password: string;
   }) => {
+    setIsLoading(true);
     try {
-      await addAccountRequest({
+      const newAccount = await addAccountRequest({
         accountName,
         mnemonic,
         password,
       });
+      setAccounts((accs) => [...accs, newAccount]);
+      enqueueSnackbar('New account created', { variant: 'success' });
+      setDialogToDisplay('Accounts');
     } catch (e) {
-      enqueueSnackbar('Error adding account', { variant: 'error' });
+      enqueueSnackbar(`Error adding account: ${e}`, { variant: 'error' });
+    } finally {
+      setIsLoading(false);
     }
   };
   const handleEditAccount = (account: AccountEntry) =>
@@ -63,7 +70,7 @@ export const AccountsProvider: React.FC = ({ children }) => {
       const match = accounts?.find((acc) => acc.id === accountName);
       setSelectedAccount(match);
     } catch (e) {
-      enqueueSnackbar('Error swtiching account', { variant: 'error' });
+      console.log('boom!');
     }
   };
 
@@ -86,13 +93,14 @@ export const AccountsProvider: React.FC = ({ children }) => {
           accountToEdit,
           dialogToDisplay,
           setDialogToDisplay,
+          isLoading,
           handleAddAccount,
           handleEditAccount,
           handleAccountToEdit,
           handleSelectAccount,
           handleImportAccount,
         }),
-        [accounts, selectedAccount, accountToEdit, dialogToDisplay],
+        [accounts, selectedAccount, accountToEdit, dialogToDisplay, isLoading],
       )}
     >
       {children}

nym-wallet/src/context/main.tsx

@@ -153,10 +153,15 @@ export const ClientContextProvider = ({ children }: { children: React.ReactNode
   const onAccountChange = async (accountId: string) => {
     if (network) {
       setIsLoading(true);
-      await switchAccount(accountId);
-      await loadAccount(network);
-      setIsLoading(false);
-      enqueueSnackbar('Account switch success', { variant: 'success', preventDuplicate: true });
+      try {
+        await switchAccount(accountId);
+        await loadAccount(network);
+        enqueueSnackbar('Account switch success', { variant: 'success', preventDuplicate: true });
+      } catch (e) {
+        enqueueSnackbar(`Error swtiching account: ${e}`, { variant: 'error' });
+      } finally {
+        setIsLoading(false);
+      }
     }
   };
 

nym-wallet/src/requests/account.ts

@@ -2,32 +2,35 @@ import { invoke } from '@tauri-apps/api';
 import { AccountEntry } from 'src/types/rust/accountentry';
 import { Account } from '../types';
 
-export const createMnemonic = async (): Promise<string> => invoke('create_new_mnemonic');
+export const createMnemonic = async () => {
+  const res: string = await invoke('create_new_mnemonic');
+  return res;
+};
 
-export const createPassword = async ({ mnemonic, password }: { mnemonic: string; password: string }): Promise<void> => {
+export const createPassword = async ({ mnemonic, password }: { mnemonic: string; password: string }) => {
   await invoke('create_password', { mnemonic, password });
 };
 
-export const signInWithMnemonic = async (mnemonic: string): Promise<Account> => {
+export const signInWithMnemonic = async (mnemonic: string) => {
   const res: Account = await invoke('connect_with_mnemonic', { mnemonic });
   return res;
 };
 
-export const signInWithPassword = async (password: string): Promise<Account> => {
+export const signInWithPassword = async (password: string) => {
   const res: Account = await invoke('sign_in_with_password', { password });
   return res;
 };
 
-export const validateMnemonic = async (mnemonic: string): Promise<boolean> => {
+export const validateMnemonic = async (mnemonic: string) => {
   const res: boolean = await invoke('validate_mnemonic', { mnemonic });
   return res;
 };
 
-export const signOut = async (): Promise<void> => {
+export const signOut = async () => {
   await invoke('logout');
 };
 
-export const isPasswordCreated = async (): Promise<boolean> => {
+export const isPasswordCreated = async () => {
   const res: boolean = await invoke('does_password_file_exist');
   return res;
 };
@@ -40,8 +43,9 @@ export const addAccount = async ({
   mnemonic: string;
   password: string;
   accountName: string;
-}): Promise<void> => {
-  await invoke('add_account_for_password', { mnemonic, password, innerId: accountName });
+}) => {
+  const res: AccountEntry = await invoke('add_account_for_password', { mnemonic, password, innerId: accountName });
+  return res;
 };
 
 export const removeAccount = async ({ password, accountName }: { password: string; accountName: string }) => {