Still progressing...

src/components/account/Account.tsx

@@ -16,6 +16,7 @@ import dispatch from '../../workers/dispatcher-main';
 import allGpxes from '../all-gpxes';
 import gpx from '../gpx';
 import { cloneDeep } from 'lodash';
+import { getAccountById } from '../../db/account';
 
 const Account: Component<{}> = (props) => {
   const [t] = useI18n();
@@ -34,6 +35,9 @@ const Account: Component<{}> = (props) => {
       action: 'getAccounts',
     });
     setAccounts([{ id: '--new--', name: t('newAccount') }, ...newAccounts]);
+    setAccount(
+      cloneDeep(getAccountById(accounts(), settings().currentAccountId))
+    );
 
     console.log({
       caller: 'Account / handleClickOpen',
@@ -54,15 +58,12 @@ const Account: Component<{}> = (props) => {
   };
 
   const changeAccountHandler = (event: any) => {
-    const selectedAccountName = event.target.value;
-    const targetAccount =
-      accounts().filter((acc: any) => acc.name === selectedAccountName)[0] ||
-      {};
-    setAccount(cloneDeep(targetAccount));
+    const selectedAccountId = event.target.value;
+    setAccount(cloneDeep(getAccountById(accounts(), selectedAccountId)));
     console.log({
       caller: 'Account / changeAccountHandler',
       event,
-      selectedAccountName,
+      selectedAccountName: selectedAccountId,
       account: account(),
     });
   };
@@ -115,7 +116,10 @@ const Account: Component<{}> = (props) => {
           >
             <For each={accounts()}>
               {(account: any) => (
-                <option value={account.id} selected={account.id === ''}>
+                <option
+                  value={account.id}
+                  selected={account.id === settings().currentAccountId}
+                >
                   {account.name}
                 </option>
               )}