aboutsummaryrefslogtreecommitdiffstats
path: root/src/routes
diff options
context:
space:
mode:
Diffstat (limited to 'src/routes')
-rw-r--r--src/routes/(app)/+layout.svelte2
-rw-r--r--src/routes/(app)/[username]/+page.svelte7
-rw-r--r--src/routes/(app)/[username]/transactions/[...page]/+page.svelte58
-rw-r--r--src/routes/(app)/invoice/[id]/+layout.server.js10
-rw-r--r--src/routes/(app)/invoice/[id]/+page.svelte51
-rw-r--r--src/routes/(app)/invoice/[id]/tip/+page.svelte15
-rw-r--r--src/routes/(app)/locations/+server.js2
-rw-r--r--src/routes/+page.server.js4
8 files changed, 66 insertions, 83 deletions
diff --git a/src/routes/(app)/+layout.svelte b/src/routes/(app)/+layout.svelte
index 10b16449..f6d79788 100644
--- a/src/routes/(app)/+layout.svelte
+++ b/src/routes/(app)/+layout.svelte
@@ -24,8 +24,6 @@
$user = u;
};
- $: $page.url.searchParams.get('logout') && close();
-
$: $selectedRate = r * (rates[u?.currency || 'USD'] / rates.USD);
onMount(() => {
diff --git a/src/routes/(app)/[username]/+page.svelte b/src/routes/(app)/[username]/+page.svelte
index fb22c828..78e9a9d3 100644
--- a/src/routes/(app)/[username]/+page.svelte
+++ b/src/routes/(app)/[username]/+page.svelte
@@ -77,8 +77,11 @@
</button>
</div>
<p class="text-center">
- This is a <a href="https://lightningaddress.com/" class="underline" target="_blank" rel="noreferrer"
- >lightning address</a
+ This is a <a
+ href="https://lightningaddress.com/"
+ class="underline"
+ target="_blank"
+ rel="noreferrer">lightning address</a
>
</p>
</div>
diff --git a/src/routes/(app)/[username]/transactions/[...page]/+page.svelte b/src/routes/(app)/[username]/transactions/[...page]/+page.svelte
index dd58509a..efecbaf2 100644
--- a/src/routes/(app)/[username]/transactions/[...page]/+page.svelte
+++ b/src/routes/(app)/[username]/transactions/[...page]/+page.svelte
@@ -1,10 +1,10 @@
<script>
- import { Icon } from '$comp';
+ import { Avatar, Icon } from '$comp';
import { onMount } from 'svelte';
- import { formatDistance, parseISO } from 'date-fns';
+ import { format, parseISO } from 'date-fns';
import { newPayment } from '$lib/store';
import { t } from '$lib/translations';
- import { f, s, sats } from '$lib/utils';
+ import { f, s, sat, sats } from '$lib/utils';
import { page } from '$app/stores';
import { differenceInDays, getUnixTime, sub } from 'date-fns';
import { goto } from '$app/navigation';
@@ -15,7 +15,7 @@
let change = ({ target: { value } }) => goto(value);
let presets = [
- { title: 'Today', start: null, end: null },
+ { title: 'Day', start: sub(new Date(), { days: 1 }), end: null },
{ title: 'Week', start: sub(new Date(), { days: 7 }), end: null },
{ title: 'Month', start: sub(new Date(), { months: 1 }), end: null },
{ title: 'All', start: sub(new Date(), { years: 5 }), end: null }
@@ -35,7 +35,6 @@
$: $newPayment && invalidate(`/users/${user.username}`);
$: path = $page.url.pathname.substring(0, $page.url.pathname.lastIndexOf('/'));
- $: console.log(path);
let csv = () => {
const keys = ['hash', 'updatedAt', 'rate', 'currency', 'amount', 'fee', 'tip'];
@@ -74,16 +73,15 @@
{#each presets as { start, end, title }, i}
<option
selected={selection === i}
- value={`/${user.username}/transactions/${start ? getUnixTime(start) + '/' : ''}1`}
- >{title}</option
+ value={`/${user.username}/transactions/${getUnixTime(start) + '/'}1`}>{title}</option
>
{/each}
</select>
- <div class="hidden md:block flex flex-wrap gap-2">
+ <div class="hidden md:block flex">
{#each presets as { start, end, title }, i}
<a
class:active={selection === i}
- href={`/${user.username}/transactions/${start ? getUnixTime(start) + '/' : ''}1`}
+ href={`/${user.username}/transactions/${getUnixTime(start) + '/'}1`}
>
<button class="rounded-full border py-2 px-5 hover:opacity-80 mb-2">
<div class="my-auto">{title}</div>
@@ -109,38 +107,36 @@
{/if}
</div>
- <div class="text-secondary grid grid-cols-3 mb-5">
- <h2>{$t('user.transactions.AMOUNT')}</h2>
- <h2 class="text-center" />
- <h2 class="text-right">{$t('user.transactions.TIME')}</h2>
- </div>
-
<div class="space-y-10">
{#if transactions.length}
{#each transactions as tx}
<div class="grid grid-cols-3 border-b pb-5">
- <div class="font-bold">
- <span class="block mb-1"
- >{tx.amount > 0 ? '+' : ''}{f(tx.amount * (tx.rate / sats), tx.currency)}
- </span>
+ <div>
+ <div class="mb-1 font-bold">{f(tx.amount * (tx.rate / sats), tx.currency)}</div>
- <span class="text-secondary"
- >{tx.amount > 0 ? '+' : ''}{s(tx.amount)}
- SAT
- </span>
+ <span class="text-secondary">{sat(tx.amount)} </span>
</div>
- <div class="text-center">
- <span class="text-secondary"
- >{$t('user.transactions.' + (tx.amount < 0 ? 'sent' : 'received'))}</span
- >
+ <div class="flex">
+ {#if tx.with}
+ <a href={`/${tx.with.username}`} class="mx-auto">
+ <div class="flex">
+ <div class="my-auto">
+ <Avatar user={tx.with} size={12} />
+ </div>
+ <div class="my-auto ml-1">{tx.with.username}</div>
+ </div>
+ </a>
+ {/if}
</div>
<div class="text-secondary text-right">
- {formatDistance(parseISO(tx.createdAt), new Date(), {
- includeSeconds: true,
- addSuffix: true
- })}
+ <div>
+ {format(parseISO(tx.createdAt), 'h:mm aaa')}
+ </div>
+ <div>
+ {format(parseISO(tx.createdAt), 'MMM d')}
+ </div>
</div>
</div>
{/each}
diff --git a/src/routes/(app)/invoice/[id]/+layout.server.js b/src/routes/(app)/invoice/[id]/+layout.server.js
index 690deda0..9df99035 100644
--- a/src/routes/(app)/invoice/[id]/+layout.server.js
+++ b/src/routes/(app)/invoice/[id]/+layout.server.js
@@ -1,14 +1,10 @@
-import Qr from 'qrcode-svg';
+import Qr from 'qrcode-base64';
import { get } from '$lib/utils';
export async function load({ params }) {
let { id } = params;
let invoice = await get(`/invoice?uuid=${id}`);
- let svg = new Qr({
- content: invoice.text,
- join: true,
- container: 'svg-viewbox'
- }).svg();
+ let src = Qr.drawImg(invoice.text, { size: 600 });
- return { id, invoice, svg };
+ return { id, invoice, src };
}
diff --git a/src/routes/(app)/invoice/[id]/+page.svelte b/src/routes/(app)/invoice/[id]/+page.svelte
index bb41a116..98bde2ac 100644
--- a/src/routes/(app)/invoice/[id]/+page.svelte
+++ b/src/routes/(app)/invoice/[id]/+page.svelte
@@ -1,6 +1,6 @@
<script>
import { send } from '$lib/socket';
- import { back, copy, f, get, reverseFormat, s, sats } from '$lib/utils';
+ import { back, copy, f, get, sat, reverseFormat, s, sats } from '$lib/utils';
import { onMount, onDestroy } from 'svelte';
import { browser } from '$app/environment';
import { invoices, last } from '$lib/store';
@@ -11,7 +11,7 @@
export let data;
$: refresh(data);
- let { invoice, id, user, svg } = data;
+ let { invoice, id, user, src } = data;
let {
amount,
rate,
@@ -48,12 +48,6 @@
$: amountFiat = parseFloat(((amount * rate) / sats).toFixed(2));
$: tipAmount = ((tip * rate) / sats).toFixed(2);
- let full = () => {
- screenfull.toggle(qr);
- let el = document.getElementById('qr');
- el.style.width = '300px';
- };
-
let subbed;
onMount(() => {
browser &&
@@ -65,10 +59,7 @@
});
</script>
-<button
- class="ml-5 md:ml-20 mt-5 md:mt-10 hover:opacity-80"
- on:click={back}
->
+<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>
@@ -81,10 +72,12 @@
></span
>
- <div id="qr" class="w-80 mx-auto" bind:this={qr} on:click={full}>
- <div class="max-w-lg mx-auto">
- {@html svg}
- </div>
+ <div
+ class="w-80 mx-auto my-5 cursor-pointer"
+ bind:this={qr}
+ on:click={() => screenfull.toggle(qr)}
+ >
+ <img {src} class="mx-auto" />
</div>
<div class="mb-10">
@@ -99,27 +92,27 @@
<div class="px-5 space-y-3 w-80 mx-auto">
{#if invoice.tip}
<div class="flex justify-between">
- <span class="font-semibold text-sm">{$t('invoice.invoice')}</span>
- <span class="font-semibold text-sm"
- >{f(amountFiat, currency)}
- <span class="text-secondary font-normal">{`(${s(amount)} SAT)`}</span></span
- >
+ {$t('invoice.invoice')}
+ <span>
+ {f(amountFiat, currency)}
+ <span class="text-secondary">{`${sat(amount)}`}</span>
+ </span>
</div>
<div class="flex justify-between">
- <span class="font-semibold text-sm">{$t('invoice.tip')}</span>
- <span class="font-semibold text-sm"
+ {$t('invoice.tip')}
+ <span
>{f(tipAmount, currency)}
- <span class="text-secondary font-normal">{`(${s(tip)} SAT)`}</span></span
- >
+ <span class="text-secondary">{`${sat(tip)}`}</span>
+ </span>
</div>
{/if}
- <div class="flex flex-wrap justify-between">
- <span class="font-bold mr-1">{$t('invoice.total')}</span>
- <span class="font-bold"
+ <div class="flex flex-wrap justify-between font-bold">
+ <span class="mr-1">{$t('invoice.total')}</span>
+ <span
>{f(amountFiat + parseFloat(tipAmount), currency)}
- <span class="text-secondary font-normal">{`(${s(tip + amount)} SAT)`}</span></span
+ <span class="text-secondary font-normal">{`${sat(tip + amount)}`}</span></span
>
</div>
</div>
diff --git a/src/routes/(app)/invoice/[id]/tip/+page.svelte b/src/routes/(app)/invoice/[id]/tip/+page.svelte
index 6ea3aae5..b3906010 100644
--- a/src/routes/(app)/invoice/[id]/tip/+page.svelte
+++ b/src/routes/(app)/invoice/[id]/tip/+page.svelte
@@ -1,7 +1,7 @@
<script>
import { browser } from '$app/environment';
import { invoices } from '$lib/store';
- import { back, copy, f, get, reverseFormat, s, sats } from '$lib/utils';
+ import { back, copy, f, sat, get, reverseFormat, s, sats } from '$lib/utils';
import { Icon } from '$comp';
import { goto } from '$app/navigation';
import { t } from '$lib/translations';
@@ -107,10 +107,7 @@
$: invoiceAmountFiatFormatted = f(amountFiat, currency);
</script>
-<button
- class="ml-5 md:ml-20 mt-5 md:mt-10 hover:opacity-80"
- on:click={back}
->
+<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>
@@ -137,7 +134,7 @@
on:input={handleSlide}
/>
- <div class="flex mb-8 text-sm">
+ <div class="flex mb-8 text-lg">
<div>
<span class="mr-1">
{f(amountFiat, currency)}
@@ -145,9 +142,9 @@
</span>
</div>
- <div class="ml-auto">
- {s(amount)}
- <span class="font-semibold">+{s(tip)} SAT</span>
+ <div class="ml-auto text-lg">
+ {sat(amount)}
+ <span class="font-semibold">+{sat(tip)}</span>
</div>
</div>
diff --git a/src/routes/(app)/locations/+server.js b/src/routes/(app)/locations/+server.js
index 381919ab..87f8975d 100644
--- a/src/routes/(app)/locations/+server.js
+++ b/src/routes/(app)/locations/+server.js
@@ -1,4 +1,4 @@
-import { get } from "$lib/utils";
+import { get } from '$lib/utils';
import { json } from '@sveltejs/kit';
export async function GET({ fetch, setHeaders }) {
diff --git a/src/routes/+page.server.js b/src/routes/+page.server.js
index 774b4586..4b9e84b0 100644
--- a/src/routes/+page.server.js
+++ b/src/routes/+page.server.js
@@ -1,4 +1,4 @@
-import { get } from "$lib/utils";
+import { get } from '$lib/utils';
export const prerender = true;
-export let load = async () => get("/locations");
+export let load = async () => get('/locations');