aboutsummaryrefslogtreecommitdiffstats
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/routes/[username]/receive.svelte2
-rw-r--r--src/routes/invoice/[id].js6
-rw-r--r--src/routes/invoice/[id].svelte284
-rw-r--r--src/routes/invoice/index.js4
4 files changed, 141 insertions, 155 deletions
diff --git a/src/routes/[username]/receive.svelte b/src/routes/[username]/receive.svelte
index 9ebc0401..e0bf7751 100644
--- a/src/routes/[username]/receive.svelte
+++ b/src/routes/[username]/receive.svelte
@@ -82,7 +82,7 @@
};
let submit = async () => {
- let { id } = await post('/invoice', { amount, username: $page.params.username });
+ let { id } = await post('/invoice', { amount, rate: $rate, username: $page.params.username });
console.log(id)
goto(`/invoice/${id}`);
};
diff --git a/src/routes/invoice/[id].js b/src/routes/invoice/[id].js
index 37ef098d..7d18ba86 100644
--- a/src/routes/invoice/[id].js
+++ b/src/routes/invoice/[id].js
@@ -5,7 +5,9 @@ const username = 'bob',
export async function GET({ params }) {
let { id } = params;
- let { amount, text } = await get(`/invoice?uuid=${id}`);
+ let huh = await get(`/invoice?uuid=${id}`);
+ console.log(huh)
+ let { amount, rate, text } = await get(`/invoice?uuid=${id}`);
- return { body: { amount, text } };
+ return { body: { amount, rate, text } };
}
diff --git a/src/routes/invoice/[id].svelte b/src/routes/invoice/[id].svelte
index d1dea907..a9f3cefb 100644
--- a/src/routes/invoice/[id].svelte
+++ b/src/routes/invoice/[id].svelte
@@ -1,25 +1,25 @@
<script>
import { browser } from '$app/env';
- import { rate, user, invoiceAmount, invoiceAmountFiat } from '$lib/store';
+ import { user } from '$lib/store';
import { Icon } from '$comp';
import { goto } from '$app/navigation';
import { onMount } from 'svelte';
- export let text;
- export let amount;
+ export let amount, rate, text;
if (!$user && typeof window !== 'undefined') {
window.location = '/login';
}
+ $: amountFiat = parseFloat(((amount * rate) / 100000000).toFixed(2));
+
let tipPercent = 0;
- const setRate = ($invoiceAmountFiat / $invoiceAmount) * 100000000;
$: tipAmount = customTipAmount
? customTipAmount < 0
? (customTipAmount = 0)
: customTipAmount
- : ($invoiceAmountFiat / 100) * tipPercent;
+ : (amountFiat / 100) * tipPercent;
$: tipAmountFormatted = new Intl.NumberFormat('en-US', {
style: 'currency',
@@ -27,26 +27,26 @@
}).format(tipAmount);
$: tipAmountSats = new Intl.NumberFormat('en-US', { maximumFractionDigits: 0 }).format(
- tipAmount / (setRate / 100000000)
+ tipAmount / (rate / 100000000)
);
$: totalAmountSats = new Intl.NumberFormat('en-US', { maximumFractionDigits: 0 }).format(
- $invoiceAmount + parseFloat(tipAmountSats.replace(/,/g, ''))
+ amount + parseFloat(tipAmountSats.replace(/,/g, ''))
);
$: totalAmountFormatted = new Intl.NumberFormat('en-US', {
style: 'currency',
currency: 'USD'
- }).format($invoiceAmountFiat + tipAmount);
+ }).format(amountFiat + tipAmount);
- const invoiceAmountFormatted = new Intl.NumberFormat('en-US', {
+ const amountFormatted = new Intl.NumberFormat('en-US', {
maximumFractionDigits: 0
- }).format($invoiceAmount);
+ }).format(amount);
- const invoiceAmountFiatFormatted = new Intl.NumberFormat('en-US', {
+ $: invoiceAmountFiatFormatted = new Intl.NumberFormat('en-US', {
style: 'currency',
currency: 'USD'
- }).format($invoiceAmountFiat);
+ }).format(amountFiat);
let customTipAmount;
@@ -99,7 +99,7 @@
tipAmount = 0;
showMobileTip = false;
} else {
- goto('/receive');
+ goto(`/${$user.username}/receive`);
}
};
@@ -116,160 +116,144 @@
<div
class="block lg:flex justify-center items-center space-y-10 lg:space-y-0 space-x-0 lg:space-x-24"
>
- {#if $invoiceAmount && $invoiceAmountFiat && $rate && text}
- <!-- tipping section -->
- <div
- class="absolute {showMobileTip
- ? 'bottom-0'
- : '-bottom-full'} bg-white p-6 md:p-0 rounded-t-3xl md:rounded-none transition-all md:transition-none ease-in-out duration-500 left-0 md:static text-center space-y-5"
- >
- <h1 class="hidden md:block text-4xl font-semibold">Add a tip?</h1>
+ <!-- tipping section -->
+ <div
+ class="absolute {showMobileTip
+ ? 'bottom-0'
+ : '-bottom-full'} bg-white p-6 md:p-0 rounded-t-3xl md:rounded-none transition-all md:transition-none ease-in-out duration-500 left-0 md:static text-center space-y-5"
+ >
+ <h1 class="hidden md:block text-4xl font-semibold">Add a tip?</h1>
- <div>
- <span class="font-semibold mr-1">{tipAmountFormatted}</span><span
- class="text-secondary font-semibold text-sm">{`(${tipAmountSats} SATS)`}</span
- >
- <span class="block text-secondary text-sm">{tipPercent}%</span>
- </div>
+ <div>
+ <span class="font-semibold mr-1">{tipAmountFormatted}</span><span
+ class="text-secondary font-semibold text-sm">{`(${tipAmountSats} SATS)`}</span
+ >
+ <span class="block text-secondary text-sm">{tipPercent}%</span>
+ </div>
- <input
- id="slider"
- type="range"
- min="0"
- max="100"
- value={tipPercent}
- class="px-2"
- on:input={(e) => {
- customTipAmount = '';
- tipPercent = e.target.value;
- }}
- />
+ <input
+ id="slider"
+ type="range"
+ min="0"
+ max="100"
+ value={tipPercent}
+ class="px-2"
+ on:input={(e) => {
+ customTipAmount = '';
+ tipPercent = e.target.value;
+ }}
+ />
- <div>
- {#each tipAmounts as amount}
- <button
- class="bg-primary w-16 md:w-20 py-3 m-1 rounded-2xl font-semibold {tipPercent ===
- amount.slice(0, 2) ||
- ((tipPercent === 0 || tipPercent === '0') && amount === 'None')
- ? '!bg-black text-white'
- : ''}"
- on:click={() => handleTipButtonClick(amount)}>{amount}</button
- >
- {/each}
+ <div>
+ {#each tipAmounts as amount}
+ <button
+ class="bg-primary w-16 md:w-20 py-3 m-1 rounded-2xl font-semibold {tipPercent ===
+ amount.slice(0, 2) ||
+ ((tipPercent === 0 || tipPercent === '0') && amount === 'None')
+ ? '!bg-black text-white'
+ : ''}"
+ on:click={() => handleTipButtonClick(amount)}>{amount}</button
+ >
+ {/each}
- <div class="relative">
- <span
- class="absolute top-[20px] left-5 font-semibold {!customTipAmount
- ? 'opacity-50'
- : 'opacity-100'}">$</span
- >
- <input
- bind:this={customInput}
- type="number"
- min="0"
- on:input={(e) => handleCustomTipAmount(e)}
- class="bg-primary rounded-2xl py-3 px-10 font-semibold mt-2 mr-1 w-full md:w-auto"
- placeholder="Other"
- />
- <button
- class="w-full md:w-auto mt-2 md:mt-0 bg-black text-white font-semibold py-3 px-7 rounded-2xl {showMobileTip
- ? !customTipAmount && !tipAmount
- ? 'opacity-50'
- : 'opacity-100'
- : !customTipAmount
+ <div class="relative">
+ <span
+ class="absolute top-[20px] left-5 font-semibold {!customTipAmount
+ ? 'opacity-50'
+ : 'opacity-100'}">$</span
+ >
+ <input
+ bind:this={customInput}
+ type="number"
+ min="0"
+ on:input={(e) => handleCustomTipAmount(e)}
+ class="bg-primary rounded-2xl py-3 px-10 font-semibold mt-2 mr-1 w-full md:w-auto"
+ placeholder="Other"
+ />
+ <button
+ class="w-full md:w-auto mt-2 md:mt-0 bg-black text-white font-semibold py-3 px-7 rounded-2xl {showMobileTip
+ ? !customTipAmount && !tipAmount
? 'opacity-50'
- : 'opacity-100'}"
- disabled={showMobileTip ? !customTipAmount && !tipAmount : !customTipAmount}
- >Done</button
- >
- </div>
+ : 'opacity-100'
+ : !customTipAmount
+ ? 'opacity-50'
+ : 'opacity-100'}"
+ disabled={showMobileTip ? !customTipAmount && !tipAmount : !customTipAmount}
+ >Done</button
+ >
</div>
</div>
+ </div>
- <div
- class="hidden md:block h-[1px] lg:h-[600px] w-full lg:w-[1px] bg-lightgrey rounded-xl"
- id="section-divider"
- />
+ <div
+ class="hidden md:block h-[1px] lg:h-[600px] w-full lg:w-[1px] bg-lightgrey rounded-xl"
+ id="section-divider"
+ />
- <!-- invoice section -->
- <div class="text-center space-y-5">
- <button
- class="block md:hidden bg-black {showMobileTip
- ? 'text-white/50'
- : 'text-white'} rounded-xl px-6 py-3 block text-sm font-semibold mx-auto flex justify-center items-center"
- on:click={() => (showMobileTip = true)}
- disabled={showMobileTip}
+ <!-- invoice section -->
+ <div class="text-center space-y-5">
+ <button
+ class="block md:hidden bg-black {showMobileTip
+ ? 'text-white/50'
+ : 'text-white'} rounded-xl px-6 py-3 block text-sm font-semibold mx-auto flex justify-center items-center"
+ on:click={() => (showMobileTip = true)}
+ disabled={showMobileTip}
+ >
+ <svg
+ width="24"
+ height="24"
+ class="mr-1"
+ viewBox="0 0 24 24"
+ fill="none"
+ xmlns="http://www.w3.org/2000/svg"
>
- <svg
- width="24"
- height="24"
- class="mr-1"
- viewBox="0 0 24 24"
- fill="none"
- xmlns="http://www.w3.org/2000/svg"
- >
- <path
- d="M4.31802 6.31802C2.56066 8.07538 2.56066 10.9246 4.31802 12.682L12.0001 20.364L19.682 12.682C21.4393 10.9246 21.4393 8.07538 19.682 6.31802C17.9246 4.56066 15.0754 4.56066 13.318 6.31802L12.0001 7.63609L10.682 6.31802C8.92462 4.56066 6.07538 4.56066 4.31802 6.31802Z"
- stroke="currentColor"
- stroke-width="2"
- stroke-linecap="round"
- stroke-linejoin="round"
- />
- </svg> Add a tip
- </button>
+ <path
+ d="M4.31802 6.31802C2.56066 8.07538 2.56066 10.9246 4.31802 12.682L12.0001 20.364L19.682 12.682C21.4393 10.9246 21.4393 8.07538 19.682 6.31802C17.9246 4.56066 15.0754 4.56066 13.318 6.31802L12.0001 7.63609L10.682 6.31802C8.92462 4.56066 6.07538 4.56066 4.31802 6.31802Z"
+ stroke="currentColor"
+ stroke-width="2"
+ stroke-linecap="round"
+ stroke-linejoin="round"
+ />
+ </svg> Add a tip
+ </button>
- <span class="text-secondary block"
- >Scan to pay <span class="text-black font-semibold">{$user.username}</span></span
- >
+ <span class="text-secondary block"
+ >Scan to pay <span class="text-black font-semibold">{$user.username}</span></span
+ >
- <div
- id="qr"
- class="border {showMobileTip
- ? 'border-gray-400'
- : 'border-lightgrey'} rounded-3xl block md:flex justify-center items-center"
- />
+ <div
+ id="qr"
+ class="border {showMobileTip
+ ? 'border-gray-400'
+ : 'border-lightgrey'} rounded-3xl block md:flex justify-center items-center"
+ />
- <div class="px-5 space-y-3">
- <div class="flex justify-between">
- <span class="font-semibold text-sm">Invoice</span>
- <span class="font-semibold text-sm"
- >{invoiceAmountFiatFormatted}
- <span class="text-secondary font-normal"
- >{`(${invoiceAmountFormatted} SATS)`}</span
- ></span
- >
- </div>
+ <div class="px-5 space-y-3">
+ <div class="flex justify-between">
+ <span class="font-semibold text-sm">Invoice</span>
+ <span class="font-semibold text-sm"
+ >{invoiceAmountFiatFormatted}
+ <span class="text-secondary font-normal">{`(${amountFormatted} SATS)`}</span></span
+ >
+ </div>
- <div class="flex justify-between">
- <span class="font-semibold text-sm">Tip</span>
- <span class="font-semibold text-sm"
- >{tipAmountFormatted}
- <span class="text-secondary font-normal">{`(${tipAmountSats} SATS)`}</span></span
- >
- </div>
+ <div class="flex justify-between">
+ <span class="font-semibold text-sm">Tip</span>
+ <span class="font-semibold text-sm"
+ >{tipAmountFormatted}
+ <span class="text-secondary font-normal">{`(${tipAmountSats} SATS)`}</span></span
+ >
+ </div>
- <div class="flex justify-between">
- <span class="font-bold">Total</span>
- <span class="font-bold"
- >{totalAmountFormatted}
- <span class="text-secondary font-normal">{`(${totalAmountSats} SATS)`}</span
- ></span
- >
- </div>
+ <div class="flex justify-between">
+ <span class="font-bold">Total</span>
+ <span class="font-bold"
+ >{totalAmountFormatted}
+ <span class="text-secondary font-normal">{`(${totalAmountSats} SATS)`}</span></span
+ >
</div>
</div>
- {:else}
- <div
- class="w-[94vw] md:w-[375px] h-[381px] md:h-[269px] animate-pulse bg-gray-400 rounded-xl"
- />
- <div
- class="h-[1px] lg:h-[600px] w-full lg:w-[1px] bg-lightgrey rounded-xl"
- id="section-divider"
- />
- <div
- class="w-full md:w-[342px] h-[454px] md:h-[494px] animate-pulse bg-gray-400 rounded-xl"
- />
- {/if}
+ </div>
</div>
</div>
</div>
diff --git a/src/routes/invoice/index.js b/src/routes/invoice/index.js
index 26bffd37..d89f7130 100644
--- a/src/routes/invoice/index.js
+++ b/src/routes/invoice/index.js
@@ -3,9 +3,9 @@ import { post } from '$lib/utils';
let network = 'lightning';
export async function POST({ request }) {
- let { amount, username } = await request.json();
+ let { amount, rate, username } = await request.json();
let { text } = await post('/lightning/invoice', );
- let { uuid: id } = await post('/invoice', { invoice: { text, network }, user: { username } });
+ let { uuid: id } = await post('/invoice', { invoice: { amount, currency: 'USD', network, rate, text }, user: { username } });
return { body: { id } };
}
generated by cgit v1.2.3 (git 2.51.0) at 2026-10-15 23:12:10 +0000