diff --git a/packages/dapp-svelte-wallet/ui/src/App.svelte b/packages/dapp-svelte-wallet/ui/src/App.svelte index 3d2f14eb336..11f49856553 100644 --- a/packages/dapp-svelte-wallet/ui/src/App.svelte +++ b/packages/dapp-svelte-wallet/ui/src/App.svelte @@ -10,7 +10,7 @@ import Purses from './Purses.svelte'; import Config from './Config.svelte'; import Transactions from './Transactions.svelte'; - import { connected } from './store'; + import { connected, ready } from './store'; import ListItems from '../lib/ListItems.svelte'; import MenuButton from '../lib/MenuButton.svelte'; @@ -195,7 +195,7 @@ - {#if !$connected} + {#if !$ready}
{}} /> diff --git a/packages/dapp-svelte-wallet/ui/src/Payment.svelte b/packages/dapp-svelte-wallet/ui/src/Payment.svelte index 604772dc8ed..e7e4dac6430 100644 --- a/packages/dapp-svelte-wallet/ui/src/Payment.svelte +++ b/packages/dapp-svelte-wallet/ui/src/Payment.svelte @@ -20,9 +20,10 @@ import Select from "smelte/src/components/Select/Select.svelte"; return E(item.actions).deposit(destination ? destination.purse : undefined); }; - $: purseItems = [{ value: null, text: 'Automatic' }, ...( - $purses ? $purses.filter(({ brand }) => brand === item.brand).map(p => ({ value: p, text: p.text })) : [] - )]; + $: purseItems = [ + { value: null, text: 'Automatic' }, + ...$purses.filter(({ brand }) => brand === item.brand).map(p => ({ value: p, text: p.text })) + ]; // $: console.log('purseItems', purseItems); diff --git a/packages/dapp-svelte-wallet/ui/src/Payments.svelte b/packages/dapp-svelte-wallet/ui/src/Payments.svelte index 97d78454cfc..7d79dcc588e 100644 --- a/packages/dapp-svelte-wallet/ui/src/Payments.svelte +++ b/packages/dapp-svelte-wallet/ui/src/Payments.svelte @@ -7,7 +7,7 @@ import ListCard from "../lib/ListCard.svelte"; import Card from "smelte/src/components/Card"; -$: paymentItems = $payments && $payments.filter(pmt => pmt.status !== 'deposited'); +$: paymentItems = $payments.filter(pmt => pmt.status !== 'deposited'); diff --git a/packages/dapp-svelte-wallet/ui/src/Transfer.svelte b/packages/dapp-svelte-wallet/ui/src/Transfer.svelte index ed255b01ba0..f92750078bd 100644 --- a/packages/dapp-svelte-wallet/ui/src/Transfer.svelte +++ b/packages/dapp-svelte-wallet/ui/src/Transfer.svelte @@ -37,8 +37,8 @@ } }; - $: contactItems = $contacts ? $contacts.map(({ value, text }) => ({ value, text })) : []; - $: purseItems = $purses ? $purses.filter(({ brand }) => brand === source.brand).map(p => ({ value: p, text: p.text })) : []; + $: contactItems = $contacts.map(({ value, text }) => ({ value, text })); + $: purseItems = $purses.filter(({ brand }) => brand === source.brand).map(p => ({ value: p, text: p.text }));
diff --git a/packages/dapp-svelte-wallet/ui/src/captp.js b/packages/dapp-svelte-wallet/ui/src/captp.js index dfb4366ff5a..d13898296ed 100644 --- a/packages/dapp-svelte-wallet/ui/src/captp.js +++ b/packages/dapp-svelte-wallet/ui/src/captp.js @@ -35,10 +35,8 @@ export function makeCapTPConnection(makeConnection, { onReset }) { await E.G(getBootstrap()).LOADING; // Begin the flow of messages to our wallet, which - // we refetch from the new, loaded, bootstrap object. - const bootPresence = getBootstrap(); - - bootPK.resolve(bootPresence); + // we refetch from the new, loaded, bootstrap promise. + bootPK.resolve(getBootstrap()); } // This is the public state, a promise that never resolves, @@ -61,7 +59,7 @@ export function makeCapTPConnection(makeConnection, { onReset }) { // Prepare the first reset, delayed so that our caller // can use makePermanentPresence. - setTimeout(() => onReset(Promise.resolve(true)), 1); + setTimeout(() => onReset(bootPK.promise), 1); return { makeStableForwarder, ...props }; } diff --git a/packages/dapp-svelte-wallet/ui/src/store.js b/packages/dapp-svelte-wallet/ui/src/store.js index 10b9264ba5f..8f5fd147c24 100644 --- a/packages/dapp-svelte-wallet/ui/src/store.js +++ b/packages/dapp-svelte-wallet/ui/src/store.js @@ -18,6 +18,9 @@ export const walletP = makeStableForwarder(bootP => E.G(bootP).wallet); export const boardP = makeStableForwarder(bootP => E.G(bootP).board); const resetAlls = []; + +// We initialize as false, but reset to true on disconnects. +const [ready, setReady] = makeReadable(false, true); const [inbox, setInbox] = makeReadable([]); const [purses, setPurses] = makeReadable([]); const [dapps, setDapps] = makeReadable([]); @@ -26,7 +29,7 @@ const [contacts, setContacts] = makeReadable([]); const [selfContact, setSelfContact] = makeReadable(); const [issuers, setIssuers] = makeReadable([]); -export { inbox, purses, dapps, payments, issuers, contacts, selfContact }; +export { ready, inbox, purses, dapps, payments, issuers, contacts, selfContact }; function cmp(a, b) { return a < b ? -1 : a === b ? 0 : 1; @@ -39,6 +42,10 @@ function kv(keyObj, val) { } function onReset(readyP) { + // Reset is beginning, set unready. + setReady(false); + + // When the ready promise fires, reset to ready. readyP.then(() => resetAlls.forEach(fn => fn())); E(walletP).getSelfContact().then(sc => setSelfContact({ contactPetname: 'Self', ...kv('Self', sc) })); // Set up our subscriptions. @@ -77,8 +84,8 @@ function onReset(readyP) { } // like React useHook, return a store and a setter for it -function makeReadable(value, start = undefined) { - const store = writable(value, start); - resetAlls.push(() => store.set(start)); +function makeReadable(value, reset = value) { + const store = writable(value); + resetAlls.push(() => store.set(reset)); return [{ subscribe: store.subscribe }, store.set]; }