diff options
| author | Adam Soltys <[email protected]> | 2022-10-05 22:55:33 -0700 |
|---|---|---|
| committer | Adam Soltys <[email protected]> | 2022-10-05 22:55:33 -0700 |
| commit | 5b24ffae2d402fbbff78f53727ca87f5cfe75618 (patch) | |
| tree | 0898fffbdb76b7f2cea3d2ca492fc52177778d93 | |
| parent | ee9ec1265f18265cf0e6dc6779f5ab1cb8751bda (diff) | |
| download | coinos-ui-5b24ffae2d402fbbff78f53727ca87f5cfe75618.tar.gz coinos-ui-5b24ffae2d402fbbff78f53727ca87f5cfe75618.zip | |
loading spinners
| -rw-r--r-- | src/routes/send/bitcoin/[address]/+page.svelte | 4 | ||||
| -rw-r--r-- | src/routes/send/lightning/[payreq]/+page.svelte | 18 | ||||
| -rw-r--r-- | src/routes/send/user/[username]/+page.svelte | 11 |
3 files changed, 26 insertions, 7 deletions
diff --git a/src/routes/send/bitcoin/[address]/+page.svelte b/src/routes/send/bitcoin/[address]/+page.svelte index 2de624ce..28bfeb54 100644 --- a/src/routes/send/bitcoin/[address]/+page.svelte +++ b/src/routes/send/bitcoin/[address]/+page.svelte @@ -8,6 +8,8 @@ let { address } = $page.params; let { currency } = data.user; let amount, loading; + + let submit = () => (loading = true); </script> <button class="ml-5 md:ml-20 mt-5 md:mt-10 hover:opacity-80" on:click={back}> @@ -21,7 +23,7 @@ </div> <Numpad bind:amount {currency} /> - <form method="POST" use:enhance> + <form method="POST" use:enhance on:submit={submit}> <input name="address" value={address} type="hidden" /> <input name="amount" value={amount} type="hidden" /> <div class="flex w-full"> diff --git a/src/routes/send/lightning/[payreq]/+page.svelte b/src/routes/send/lightning/[payreq]/+page.svelte index b61a9264..1b248af6 100644 --- a/src/routes/send/lightning/[payreq]/+page.svelte +++ b/src/routes/send/lightning/[payreq]/+page.svelte @@ -11,6 +11,9 @@ let { currency } = data.user; let amount = form?.amount || data.amount; + + let loading; + let submit = () => (loading = true); </script> <button class="ml-5 md:ml-20 mt-5 md:mt-10 hover:opacity-80" on:click={back}> @@ -21,15 +24,17 @@ {#if amount} <div class="text-center mb-8"> <h1 class="text-xl md:text-2xl text-secondary mb-2">Sending</h1> - <p class="text-6xl break-words mb-4">{s(amount)} <span class="text-xl md:text-2xl text-secondary">sats</span></p> - <h1 class="text-xl md:text-2xl text-secondary mb-2">to</h1> + <p class="text-6xl break-words mb-4"> + {s(amount)} <span class="text-xl md:text-2xl text-secondary">sats</span> + </p> + <h1 class="text-xl md:text-2xl text-secondary mb-2">to</h1> <p class="text-6xl break-words">{alias}</p> </div> {:else} <Numpad bind:amount {currency} /> {/if} - <form method="POST" use:enhance> + <form method="POST" use:enhance on:submit={submit}> <input name="payreq" value={payreq} type="hidden" /> <input name="amount" value={amount} type="hidden" /> <input name="confirmed" value={form?.confirm} type="hidden" /> @@ -38,8 +43,13 @@ <button type="submit" class="opacity-100 hover:opacity-80'} rounded-2xl border py-3 font-bold mx-auto mt-2 bg-black text-white px-4 w-24" + disabled={loading} > - Send + {#if loading} + <Spinner /> + {:else} + Send + {/if} </button> </div> </form> diff --git a/src/routes/send/user/[username]/+page.svelte b/src/routes/send/user/[username]/+page.svelte index f200827f..1193696b 100644 --- a/src/routes/send/user/[username]/+page.svelte +++ b/src/routes/send/user/[username]/+page.svelte @@ -26,6 +26,9 @@ if (amount) amount = undefined; else back(); }; + + let loading; + let submit = () => (loading = true); </script> <button class="ml-5 md:ml-20 mt-5 md:mt-10 hover:opacity-80" on:click={handleBack}> @@ -50,7 +53,7 @@ <Numpad bind:amount={a} bind:amountFiat={af} {currency} bind:fiat /> {/if} - <form method="POST" use:enhance> + <form method="POST" use:enhance on:submit={submit}> <input name="amount" value={amount} type="hidden" /> <input name="username" value={recipient.username} type="hidden" /> <input name="confirmed" value={form?.confirm} type="hidden" /> @@ -61,7 +64,11 @@ type="submit" class="opacity-100 hover:opacity-80'} rounded-2xl border py-3 font-bold mx-auto mt-2 bg-black text-white px-4 w-24" > - Send + {#if loading} + <Spinner /> + {:else} + Send + {/if} </button> {:else} <button |