Adds splash screen to the app

src/App.svelte

@@ -45,6 +45,8 @@
     import UpgradeApp from './components/about/UpgradeApp.svelte'
     import { tryUpdate } from './modules/updater'
     import { isLoading } from 'svelte-i18n'
+    import { isBooted } from './modules/boot'
+    import SplashScreen from './components/layout/SplashScreen.svelte'
 
   // black magic with I18n here
   // temporarily set up here otherwise... issues
@@ -117,6 +119,10 @@
   <Style />
   <UpgradeApp />
 
+  {#if !$isBooted}
+    <SplashScreen />
+  {/if}
+
   {#if $isInit}
     <SearchingFullnodes />
     <KeyError/>

src/components/layout/SearchingFullnodes.svelte

@@ -11,7 +11,7 @@
 
 <main>
   {#if !$connected}
-    <div class="uk-background-primary uk-light uk-text-center">
+    <div class="uk-background-primary uk-light uk-text-center" style="max-height: 95px">
       {#if $scanningForFullnodes}
         <span class="uk-text-uppercase"> {$_('layout.attempting_to_connect')} </span>
         <div uk-spinner="ratio: 0.5" class="uk-padding" />

src/components/layout/SplashScreen.svelte

@@ -0,0 +1,36 @@
+<script>
+  export let loading = true;
+</script>
+
+<style>
+  .splash-container {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+    width: 100vw;
+    background-color: #ffffff;
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 9999;
+  }
+
+  .logo {
+    width: 150px;
+    height: 150px;
+  }
+
+  h1 {
+    margin-top: 20px;
+    font-size: 2rem; 
+  }
+</style>
+
+{#if loading}
+  <div class="splash-container">
+    <img src="/libra.png" alt="Libra Logo" class="logo" />
+    <h1 class="uk-text-muted">Carpe Libra</h1>
+  </div>
+{/if}

src/components/settings/AccountSettings.svelte

@@ -5,7 +5,7 @@
   import { raise_error } from '../../modules/carpeError'
   import { notify_success } from '../../modules/carpeNotify'
   import { responses } from '../../modules/debug'
-  import { watchAccounts } from '../../modules/accounts'
+  import { watchAccounts, pendingAccounts } from '../../modules/accounts'
 
   const removeAccounts = async () => {
     resetSigningAccount()
@@ -14,6 +14,7 @@
         responses.set(res)
         notify_success('Accounts removed successfully')
         watchAccounts.set([])
+        pendingAccounts.set([])
         localStorage.removeItem('watchAccounts')
         refreshAccounts()
       })

src/components/wallet/AccountsList.svelte

@@ -3,7 +3,7 @@
   import UIkit from 'uikit'
   import Icons from 'uikit/dist/js/uikit-icons'
   import { allAccounts, formatAccount, signingAccount } from '../../modules/accounts'
-  import { printCoins, unscaledCoins } from '../../modules/coinHelpers'
+  import { printCoins } from '../../modules/coinHelpers'
   import { connected } from '../../modules/networks'
   import { setAccount } from '../../modules/accountActions'
   import Actions from './Actions.svelte'
@@ -91,6 +91,23 @@
 
   // Re-sort when preferences change
   $: sortColumn && $allAccounts.length > 0 && privateSortAccounts(sortColumn)
+
+  const printAmount = (account, balance, isConnected) => {
+    const balanceFormatted = printCoins(balance);
+    if (!isConnected) {
+      return (balance > 0)
+        ? `${balanceFormatted} <span uk-icon="icon: warning" style="color:red" title="${$_('wallet.account_list.offline')}"></span>`
+        : `<span uk-icon="icon: warning" style="color:red" title="${$_('wallet.account_list.offline')}"></span>`;
+    }
+    if (account.on_chain != null && account.on_chain == false) {
+      return $_('wallet.account_list.account_on_chain');
+    }
+    if (account.on_chain) {
+      return balanceFormatted;
+    }
+    return $_('wallet.account_list.account_on_chain');
+  }
+
 </script>
 
 <main>
@@ -188,27 +205,11 @@
                   <span class="uk-transition-fade"><Copy text={a.account}></Copy></span>
                 </div>
               </td>
-              <td class="uk-text-right">{printCoins(a.balance.unlocked)}</td>
               <td class="uk-text-right uk-text-nowrap">
-                {#if a.on_chain != null && a.on_chain == false}
-                  {$_('wallet.account_list.account_on_chain')}
-                {:else if a.on_chain}
-                  <div class="uk-inline">
-                    {#if unscaledCoins(a.balance) < 1}
-                      <span class="uk-margin uk-text-warning" uk-icon="icon: info"></span>
-                      <div uk-dropdown>
-                        {$_('wallet.account_list.message')}
-                      </div>
-                    {/if}
-                    {printCoins(a.balance.total)}
-                  </div>
-                {:else if a.balance == null}
-                  {$_('wallet.account_list.loading')}...
-                {:else if !$connected}
-                  {$_('wallet.account_list.offline')}...
-                {:else}
-                  {$_('wallet.account_list.account_on_chain')}
-                {/if}
+                {@html printAmount(a, a.balance.unlocked, $connected)}
+              </td>
+              <td class="uk-text-right uk-text-nowrap" style="width: 150px">
+                {@html printAmount(a, a.balance.total, $connected)}
               </td>
             </tr>
           {/if}

src/components/wallet/AddWatchAccount.svelte

@@ -3,11 +3,18 @@
   import { addWatchAccount } from '../../modules/accountActions'
 
   let address: string
+  let isSubmitting = false
 
-  const initAccount = (address: string) => {
+  const initAccount = async (address: string) => {
+    isSubmitting=true
     address = address.trim()
     let isLegacy = address.length === 32 || address.startsWith('0'.padStart(32, '0'))
-    addWatchAccount(address, isLegacy)
+    try {
+      await addWatchAccount(address, isLegacy);
+    } finally {
+      isSubmitting = false;
+    }
+
   }
 </script>
 
@@ -30,9 +37,14 @@
     <button
       class="uk-button uk-button-primary"
       type="button"
+      disabled={isSubmitting}
       on:click|preventDefault={initAccount(address)}
     >
-      {$_('wallet.account_from_mnem_submit.btn_submit')}
+      {#if isSubmitting}
+        {$_('wallet.account_from_mnem_submit.btn_submiting')}...
+      {:else}
+        {$_('wallet.account_from_mnem_submit.btn_submit')}
+      {/if}
     </button>
   </div>
 </main>

src/modules/accountActions.ts

@@ -423,7 +423,7 @@ export function addWatchAccount(address: string, isLegacy: boolean = true) {
 
   addAccountOptimistic('loading...', true)
 
-  invoke('add_watch_account', {
+  return invoke('add_watch_account', {
     address,
     isLegacy,
   })

src/modules/boot.ts

@@ -44,6 +44,7 @@ export const bootUp = async () => {
   } else {
     logger(Level.Warn, 'carpe settings not initialized')
     await isLegacy().finally(() => {
+      isBooted.set(true)
       navigate('wallet')
     })
   }