diff options
| author | Adam Soltys <[email protected]> | 2023-02-02 23:26:34 -0800 |
|---|---|---|
| committer | Adam Soltys <[email protected]> | 2023-02-02 23:26:34 -0800 |
| commit | 01333bb3f33da6b2c51e910c0fe74637a8c8e24e (patch) | |
| tree | af238aebeab67adb0cf8f4cf9037b42270809b44 /src/routes/(app)/invoice | |
| parent | 43d893ff0195f14cd1fcb8acec17b7ca20ff6c28 (diff) | |
| download | coinos-ui-01333bb3f33da6b2c51e910c0fe74637a8c8e24e.tar.gz coinos-ui-01333bb3f33da6b2c51e910c0fe74637a8c8e24e.zip | |
move invoices, combine profile and dashboard
Diffstat (limited to 'src/routes/(app)/invoice')
| -rw-r--r-- | src/routes/(app)/invoice/+server.js | 5 | ||||
| -rw-r--r-- | src/routes/(app)/invoice/[hash]/+layout.server.js | 19 | ||||
| -rw-r--r-- | src/routes/(app)/invoice/[hash]/+layout.svelte | 1 | ||||
| -rw-r--r-- | src/routes/(app)/invoice/[hash]/+page.server.js | 5 | ||||
| -rw-r--r-- | src/routes/(app)/invoice/[hash]/+page.svelte | 156 | ||||
| -rw-r--r-- | src/routes/(app)/invoice/[hash]/paid/+page.svelte | 62 | ||||
| -rw-r--r-- | src/routes/(app)/invoice/[hash]/tip/+page.server.js | 11 | ||||
| -rw-r--r-- | src/routes/(app)/invoice/[hash]/tip/+page.svelte | 252 | ||||
| -rw-r--r-- | src/routes/(app)/invoice/sent/+page.svelte | 10 |
9 files changed, 0 insertions, 521 deletions
diff --git a/src/routes/(app)/invoice/+server.js b/src/routes/(app)/invoice/+server.js deleted file mode 100644 index 1321739e..00000000 --- a/src/routes/(app)/invoice/+server.js +++ /dev/null @@ -1,5 +0,0 @@ -import { auth, post } from '$lib/utils'; -import { json } from '@sveltejs/kit'; - -export let POST = async ({ cookies: c, request: r }) => - json(await post('/invoice', await r.json(), auth(c))); diff --git a/src/routes/(app)/invoice/[hash]/+layout.server.js b/src/routes/(app)/invoice/[hash]/+layout.server.js deleted file mode 100644 index d38f945f..00000000 --- a/src/routes/(app)/invoice/[hash]/+layout.server.js +++ /dev/null @@ -1,19 +0,0 @@ -import Qr from 'qrcode-base64'; -import { get } from '$lib/utils'; -import { redirect } from '@sveltejs/kit'; - -export async function load({ depends, params, url }) { - depends('app:invoice'); - - let { hash } = params; - let invoice = await get(`/invoice/${hash}`); - let { amount, received } = invoice; - amount = parseInt(amount); - - let paid = (!amount && received) || (amount > 0 && received >= amount); - if (paid && !url.pathname.endsWith('paid')) throw redirect(307, `/invoice/${hash}/paid`); - - let sm = Qr.drawImg(invoice.text, { size: 300 }); - - return { hash, invoice, sm, lg: sm }; -} diff --git a/src/routes/(app)/invoice/[hash]/+layout.svelte b/src/routes/(app)/invoice/[hash]/+layout.svelte deleted file mode 100644 index 4fa864ce..00000000 --- a/src/routes/(app)/invoice/[hash]/+layout.svelte +++ /dev/null @@ -1 +0,0 @@ -<slot /> diff --git a/src/routes/(app)/invoice/[hash]/+page.server.js b/src/routes/(app)/invoice/[hash]/+page.server.js deleted file mode 100644 index 1068f273..00000000 --- a/src/routes/(app)/invoice/[hash]/+page.server.js +++ /dev/null @@ -1,5 +0,0 @@ -import invoice from '$lib/invoice'; - -export const actions = { - default: invoice -}; diff --git a/src/routes/(app)/invoice/[hash]/+page.svelte b/src/routes/(app)/invoice/[hash]/+page.svelte deleted file mode 100644 index a2f05cc9..00000000 --- a/src/routes/(app)/invoice/[hash]/+page.svelte +++ /dev/null @@ -1,156 +0,0 @@ -<script> - import { send } from '$lib/socket'; - import { back, copy, f, get, sat, reverseFormat, s, sats } from '$lib/utils'; - import { tick, onMount, onDestroy } from 'svelte'; - import { browser } from '$app/environment'; - import { last } from '$lib/store'; - import { Avatar, Icon, Heart, Image } from '$comp'; - import { t } from '$lib/translations'; - import screenfull from 'screenfull'; - - export let data; - - $: refresh(data); - let { invoice, id, user, sm, lg } = data; - let { - address, - amount, - type, - rate, - received, - prompt, - text, - tip, - user: { username, currency } - } = invoice; - - let showQr = !amount; - - let src = sm; - - let qr; - let tipPercent = 0; - - let refresh = (data) => { - ({ invoice, id } = data); - ({ - address, - amount, - type, - rate, - received, - prompt, - text, - tip, - user: { username, currency } - } = invoice); - - tipPercent = (tip / amount) * 100; - }; - - $: amountFiat = parseFloat(((amount * rate) / sats).toFixed(2)); - $: tipAmount = ((tip * rate) / sats).toFixed(2); - - let subbed; - onMount(() => { - browser && - last.subscribe((v) => { - if (!v || subbed) return; - subbed = true; - send('subscribe', invoice); - }); - }); - - $: link = address ? text : `lightning:${text}`; - - let full; - let toggle = () => { - screenfull.toggle(qr); - full = !full; - if (full) src = lg; - else src = sm; - }; -</script> - -<button class="ml-5 md:ml-20 mt-5 md:mt-10 hover:opacity-80" on:click={back}> - <Icon icon="arrow-left" style="w-10" /> -</button> - -<div class="container mx-auto max-w-lg px-4 space-y-2 sm:space-y-5"> - <div> - <div class="flex w-full"> - <div class="mx-auto"> - <a href="/{username}" class="text-black font-semibold hover:opacity-80 mx-auto"> - <div class="flex my-auto"> - <Avatar user={invoice.user} size={20} /> - <div class="my-auto text-lg">{username}</div> - </div> - </a> - </div> - </div> - </div> - - <div class="w-full"> - <img - {src} - class:p-4={full} - class="w-[300px] mx-auto" - bind:this={qr} - on:click={toggle} - on:keydown={toggle} - alt={address || text} - /> - </div> - - {#if address} - <div class="text-secondary text-center">{address}</div> - {/if} - - <div class="flex gap-2 justify-center"> - <button - class="flex rounded-full border py-2 px-5 font-bold hover:opacity-80" - on:click={() => copy(address ? address : text)} - ><Icon icon="copy" style="mr-1" /> - <div>Copy</div></button - > - - {#if user && user.username !== username} - <a href={`/send/${invoice.id}`}> - <button class="flex rounded-full border py-2 px-5 font-bold hover:opacity-80"> - <Icon icon="send" style="mr-1" /> - <div class="my-auto">Pay</div> - </button> - </a> - {/if} - </div> - - <div class="space-y-2 w-80 mx-auto"> - {#if invoice.tip} - <div class="flex justify-between"> - {$t('invoice.invoice')} - <span> - {f(amountFiat, currency)} - <span class="text-secondary">{`${sat(amount)}`}</span> - </span> - </div> - - <div class="flex justify-between"> - {$t('invoice.tip')} - <span - >{f(tipAmount, currency)} - <span class="text-secondary">{`${sat(tip)}`}</span> - </span> - </div> - {/if} - - {#if amount > 0} - <div class="flex flex-wrap justify-between font-bold text-2xl !my-5"> - <span class="mr-1">{$t('invoice.total')}</span> - <span - >{f(amountFiat + parseFloat(tipAmount), currency)} - <span class="text-secondary font-normal">{`${sat(tip + amount)}`}</span></span - > - </div> - {/if} - </div> -</div> diff --git a/src/routes/(app)/invoice/[hash]/paid/+page.svelte b/src/routes/(app)/invoice/[hash]/paid/+page.svelte deleted file mode 100644 index 2ccbc971..00000000 --- a/src/routes/(app)/invoice/[hash]/paid/+page.svelte +++ /dev/null @@ -1,62 +0,0 @@ -<script> - import { scale } from 'svelte/transition'; - import { Icon } from '$comp'; - import { toast } from '@zerodevx/svelte-toast'; - import { browser } from '$app/environment'; - import { t } from '$lib/translations'; - import { f, s, sat, sats } from '$lib/utils'; - import { goto } from '$app/navigation'; - - export let data; - let amount, currency, rate, received, pending, tip, user, id; - $: data && ({ amount, currency, rate, received, pending, tip, user, id } = data.invoice); - - toast.pop(0); - - $: amountFiat = parseFloat((((received - tip) * rate) / sats).toFixed(2)); - $: pendingFiat = parseFloat((((pending - tip) * rate) / sats).toFixed(2)); - $: tipFiat = parseFloat(((tip * rate) / sats).toFixed(2)); -</script> - -<div class="container px-4 text-center mx-auto"> - <div class="flex w-full py-20 max-w-[200px] mx-auto" in:scale={{ start: 0.5 }}> - <Icon icon="check" style="mx-auto" /> - </div> - {#if received} - <h1 class="text-3xl md:text-4xl font-bold mb-6">{$t('invoice.paymentSuccessful')}</h1> - <h2 class="text-2xl md:text-3xl font-semibold"> - {f(amountFiat, currency)} - {#if tip} - + {f(tipFiat, currency)} - {/if} - </h2> - <h3 class="text-secondary md:text-lg mb-6 mt-1"> - {sat(received - tip)} - {#if tip} - +{sat(tip)} - {/if} - </h3> - {/if} - - {#if pending} - <h1 class="text-3xl md:text-4xl font-bold mb-6">Payment detected</h1> - <h2 class="text-2xl md:text-3xl font-semibold"> - {f(pendingFiat, currency)} - {#if tip} - + {f(tipFiat, currency)} - {/if} - </h2> - <h3 class="text-secondary md:text-lg mb-6 mt-1"> - {sat(pending - tip)} - {#if tip} - +{sat(tip)} - {/if} - </h3> - {/if} -</div> - -<a href={`/${user.username}/receive`}> - <div class="opacity-0 w-screen h-screen fixed top-0 left-0 z-50" /> -</a> - -<div class="fixed bottom-10 w-full text-center">{$t('payments.tapAnywhere')}</div> diff --git a/src/routes/(app)/invoice/[hash]/tip/+page.server.js b/src/routes/(app)/invoice/[hash]/tip/+page.server.js deleted file mode 100644 index c78e5020..00000000 --- a/src/routes/(app)/invoice/[hash]/tip/+page.server.js +++ /dev/null @@ -1,11 +0,0 @@ -import invoice from '$lib/invoice'; -import { redirect } from '@sveltejs/kit'; - -export async function load({ parent }) { - let { invoice } = await parent(); - if (!invoice.amount) throw redirect(307, `/invoice/${invoice.id}`); -} - -export const actions = { - default: invoice -}; diff --git a/src/routes/(app)/invoice/[hash]/tip/+page.svelte b/src/routes/(app)/invoice/[hash]/tip/+page.svelte deleted file mode 100644 index ea0ab903..00000000 --- a/src/routes/(app)/invoice/[hash]/tip/+page.svelte +++ /dev/null @@ -1,252 +0,0 @@ -<script> - import { onMount } from 'svelte'; - import { browser } from '$app/environment'; - import { invoice as inv, request } from '$lib/store'; - import { back, copy, focus, f, sat, get, reverseFormat, s, sats } from '$lib/utils'; - import { Icon } from '$comp'; - import { goto } from '$app/navigation'; - import { t } from '$lib/translations'; - import { enhance } from '$app/forms'; - import { tick } from 'svelte'; - - const tipAmounts = ['No', '10%', '15%', '20%']; - let showCustomAmount; - - let customInput; - let customTipAmount; - - let apply = async () => { - if (customTipAmount > 0) { - tipPercent = (customTipAmount / amountFiat) * 100; - showCustomAmount = false; - } - }; - - let active = (amount) => - !customTipAmount && Math.round(tipPercent) === parseInt(amount.slice(0, 2)); - - const handleCustomTipAmount = (e) => { - tipPercent = 0; - customTipAmount = e.target.value; - }; - - let timeout; - const handleSlide = (e) => { - customTipAmount = ''; - if (customInput) { - customInput.value = ''; - } - tipPercent = e.target.value; - - clearTimeout(timeout); - timeout = setTimeout(update, 800); - }; - - let submitting; - const handleTipButtonClick = async (amount) => { - submitting = true; - if (amount === 'No') { - tipPercent = 0; - } else { - tipPercent = parseInt(amount.slice(0, 2)); - } - - await tick(); - submit.click(); - }; - - let submit; - let update = async () => { - await tick(); - //submit.click(); - }; - - export let data; - $: refresh(data); - let { invoice, id, user } = data; - let { - amount, - type, - rate, - received, - prompt, - text, - tip, - user: { username, currency } - } = invoice; - - let qr; - let tipPercent = 0; - - let fullscreen; - - let refresh = (data) => { - $inv = null; - - ({ invoice, id } = data); - ({ - amount, - type, - rate, - received, - prompt, - text, - tip, - user: { username, currency } - } = invoice); - - tipPercent = (tip / amount) * 100; - }; - - $: tip = Math.round((amount / 100) * tipPercent); - - $: amountFiat = parseFloat(((amount * rate) / sats).toFixed(2)); - - $: tipAmount = ((tip * rate) / sats).toFixed(2); - - $: invoiceAmountFiatFormatted = f(amountFiat, currency); - - onMount(() => ($request = undefined)); -</script> - -<button class="ml-5 md:ml-20 mt-5 md:mt-10 hover:opacity-80" on:click={back}> - <Icon icon="arrow-left" style="w-10" /> -</button> - -<div class="container px-4 max-w-lg text-center mx-auto"> - <form method="POST" use:enhance class:invisible={submitting}> - <input type="hidden" name="amount" value={amount} /> - <input type="hidden" name="tip" value={tip} /> - <input type="hidden" name="username" value={username} /> - <input type="hidden" name="rate" value={rate} /> - <input type="hidden" name="prompt" value="false" /> - <input type="hidden" name="type" value={type} /> - <input type="hidden" name="request_id" value={invoice.request?.id} /> - - <h1 class="text-4xl font-semibold my-8">{$t('invoice.addTipq')}</h1> - {#if !showCustomAmount} - <div class="my-2 text-xl">{Math.round(tipPercent)}%</div> - - <input - id="slider" - type="range" - min="0" - max="100" - value={tipPercent} - class="px-0 py-0 my-5" - style="--bgPercent: {tipPercent}%;" - on:input={handleSlide} - /> - - <div class="flex mb-8 text-lg"> - <div> - <span class="mr-1"> - {f(amountFiat, currency)} - <span class="font-semibold">+{f(tipAmount, currency)}</span> - </span> - </div> - - <div class="ml-auto text-lg"> - {sat(amount)} - <span class="font-semibold">+{sat(tip)}</span> - </div> - </div> - - {#if tip} - <div> - <button type="button" on:click={() => submit.click()}>Next</button> - <button type="button" on:click={() => (tipPercent = 0)}>Reset</button> - </div> - {:else} - {#each tipAmounts as amount} - <button - type="button" - class:active={active(amount, tipPercent)} - on:click={() => handleTipButtonClick(amount)}>{amount}</button - > - {/each} - {/if} - - <div> - <button type="button" on:click={() => (showCustomAmount = true)}>Custom</button> - </div> - {/if} - - <button type="submit" bind:this={submit} /> - </form> - - {#if showCustomAmount} - <form on:submit|preventDefault={apply}> - <div class="relative"> - <span - class="absolute top-[18px] left-5 font-semibold {!customTipAmount - ? 'opacity-50' - : 'opacity-100'}">$</span - > - <input - bind:this={customInput} - type="number" - step="0.01" - on:input={(e) => handleCustomTipAmount(e)} - class="pl-10" - placeholder="Custom amount" - use:focus - /> - <button - type="submit" - class="w-full mt-2 bg-black text-white font-semibold py-3 px-7 rounded-2xl {!customTipAmount - ? 'opacity-50' - : 'opacity-100 hover:opacity-80'}" - disabled={!customTipAmount}>Apply</button - > - </div> - </form> - {/if} -</div> - -<style> - #slider { - -webkit-appearance: none; - width: 100%; - height: 6px; - border-radius: 5px; - background: linear-gradient( - to right, - black 0%, - black var(--bgPercent), - #f5f7fa var(--bgPercent), - #f5f7fa 100% - ); - outline: none; - } - - #slider:active { - background-color: black; - } - - #slider::-webkit-slider-thumb { - -webkit-appearance: none; - appearance: none; - width: 30px; - height: 30px; - border-radius: 50%; - background: black; - cursor: pointer; - } - - #slider::-moz-range-thumb { - width: 30px; - height: 30px; - border-radius: 50%; - background: black; - cursor: pointer; - } - - .active { - @apply !bg-black !text-white; - } - - .container button[type='button'] { - @apply w-full mt-2 bg-primary text-black hover:bg-black hover:text-white font-semibold py-5 px-7 rounded-2xl; - } -</style> diff --git a/src/routes/(app)/invoice/sent/+page.svelte b/src/routes/(app)/invoice/sent/+page.svelte deleted file mode 100644 index ae71eb2e..00000000 --- a/src/routes/(app)/invoice/sent/+page.svelte +++ /dev/null @@ -1,10 +0,0 @@ -<script> - import { Avatar, Icon } from '$comp'; - import { request } from '$lib/store'; -</script> - -Invoice sent to -<div class="flex"> - <Avatar user={$request.requester} size={12} /> - <h1 class="my-auto"><b>{$request.requester.username}</b> is ready to pay</h1> -</div> |
