aboutsummaryrefslogtreecommitdiffstats
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/components/Numpad.svelte6
-rw-r--r--src/components/Request.svelte9
-rw-r--r--src/components/index.js1
-rw-r--r--src/lib/socket.js12
-rw-r--r--src/lib/store.js1
-rw-r--r--src/routes/(app)/+layout.svelte9
-rw-r--r--src/routes/(app)/[username]/+page.svelte40
-rw-r--r--src/routes/(app)/[username]/request/+page.server.js8
-rw-r--r--src/routes/(app)/[username]/request/+page.svelte33
-rw-r--r--src/routes/(app)/[username]/request/sent/+page.svelte16
-rw-r--r--src/routes/(app)/[username]/transactions/[...page]/+page.svelte2
11 files changed, 80 insertions, 57 deletions
diff --git a/src/components/Numpad.svelte b/src/components/Numpad.svelte
index c5f1efa8..36fe9f67 100644
--- a/src/components/Numpad.svelte
+++ b/src/components/Numpad.svelte
@@ -90,12 +90,10 @@
<div class="space-y-5">
<div class="text-center">
<div class="text-5xl md:text-6xl font-semibold tracking-widest mb-1">
- {fiat ? `${symbol}${amountFiat}` : amountSatsFormatted}<span
- class="tracking-normal text-base font-normal">{fiat ? currency : 'SAT'}</span
- >
+ {fiat ? `${symbol}${amountFiat}` : '⚡️' + amountSatsFormatted}
</div>
<span class="text-secondary mr-1"
- >{fiat ? `${amountSatsConverted} SAT` : amountFiatConverted}</span
+ >{fiat ? `⚡️${amountSatsConverted}` : amountFiatConverted}</span
>
<button
type="button"
diff --git a/src/components/Request.svelte b/src/components/Request.svelte
new file mode 100644
index 00000000..c0e2afc0
--- /dev/null
+++ b/src/components/Request.svelte
@@ -0,0 +1,9 @@
+<script>
+ import { Avatar } from '$comp';
+ import { request } from '$lib/store';
+</script>
+
+<div class="fixed bottom-0 h-24 border-t w-full bg-primary" in:fly>
+ <Avatar user={$request.requester} />
+ {$request.requester.username} is requesting an invoice
+</div>
diff --git a/src/components/index.js b/src/components/index.js
index 468e132e..f3d550ec 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -1,3 +1,4 @@
+export { default as Request } from './Request.svelte';
export { default as Pin } from './Pin.svelte';
export { default as Card } from './Card.svelte';
export { default as Lock } from './Lock.svelte';
diff --git a/src/lib/socket.js b/src/lib/socket.js
index 672d008c..d3cc40ea 100644
--- a/src/lib/socket.js
+++ b/src/lib/socket.js
@@ -1,6 +1,6 @@
import { get } from 'svelte/store';
-import { invoices, newPayment, last, rate, user } from '$lib/store';
-import { success } from '$lib/utils';
+import { invoices, request, newPayment, last, rate, user } from '$lib/store';
+import { success, sat } from '$lib/utils';
import { env } from '$env/dynamic/public';
const socketUrl = env.PUBLIC_SOCKET;
@@ -23,6 +23,10 @@ export const messages = (data) => ({
rate.set(data);
},
+ request() {
+ request.set(data);
+ },
+
async payment() {
let { amount, invoice } = data;
@@ -34,9 +38,9 @@ export const messages = (data) => ({
newPayment.set(true);
if (amount > 0) {
- success(`Received ${amount} sats!`);
+ success(`Received ${sat(amount)}!`);
} else {
- success(`Sent ${-amount} sats!`);
+ success(`Sent ${sat(amount)}!`);
}
},
diff --git a/src/lib/store.js b/src/lib/store.js
index 52f2fe2a..c32ef49b 100644
--- a/src/lib/store.js
+++ b/src/lib/store.js
@@ -44,3 +44,4 @@ export const avatarUpload = writable();
export const bannerUpload = writable();
export const pin = persistSession('pin', undefined, 5 * 60 * 1000);
export const last = writable();
+export const request = writable();
diff --git a/src/routes/(app)/+layout.svelte b/src/routes/(app)/+layout.svelte
index f6d79788..9f29e9a2 100644
--- a/src/routes/(app)/+layout.svelte
+++ b/src/routes/(app)/+layout.svelte
@@ -1,12 +1,13 @@
<script>
+ import { fly } from 'svelte/transition';
import { SvelteToast } from '@zerodevx/svelte-toast';
import { onDestroy, onMount } from 'svelte';
import { close, connect, send } from '$lib/socket';
- import { last, selectedRate, rate, user } from '$lib/store';
+ import { last, selectedRate, rate, user, request } from '$lib/store';
import { page } from '$app/stores';
import { browser } from '$app/environment';
import { goto } from '$app/navigation';
- import { LoadingSplash } from '$comp';
+ import { LoadingSplash, Request } from '$comp';
import { warning, protectedRoutes } from '$lib/utils';
import { t, locale } from '$lib/translations';
@@ -83,3 +84,7 @@
<main data-sveltekit-prefetch>
<slot />
</main>
+
+{#if $request}
+ <Request />
+{/if}
diff --git a/src/routes/(app)/[username]/+page.svelte b/src/routes/(app)/[username]/+page.svelte
index 0f9aa38c..a5b627df 100644
--- a/src/routes/(app)/[username]/+page.svelte
+++ b/src/routes/(app)/[username]/+page.svelte
@@ -37,33 +37,31 @@
</script>
<div class="container px-4 flex flex-wrap sm:flex-nowrap mb-4">
- <div class="hidden sm:block w-sm min-w-sm pt-20 space-y-5">
- <h1 class="text-3xl font-bold">{subject.username}</h1>
+ <div class="w-full sm:w-[340px] pt-20 space-y-5 mr-4">
+ <h1 class="text-3xl font-bold text-center sm:text-left">{subject.username}</h1>
- <p class="text-secondary w-64 mb-4">
+ <div class="text-secondary w-64">
{subject.address && subject.address !== 'null' ? subject.address : ''}
- </p>
+ </div>
{#if user?.username !== subject.username}
- <a href={`/${subject.username}/receive`}>
- <button
- class="w-full sm:w-40 mt-2 text-black hover:bg-black hover:text-white font-semibold py-3 px-5 rounded-full border border-black"
- >
- Pay
- </button>
- </a>
+ <div>
+ <a href={`/${subject.username}/receive`}>
+ <button class="rounded-full border py-2 px-5 font-bold hover:opacity-80 w-full mb-2">
+ Pay
+ </button>
+ </a>
- <a href={`/${subject.username}/request`}>
- <button class="w-full sm:w-40 mt-2 bg-black text-white font-semibold py-3 px-5 rounded-full"
- >Request invoice</button
- >
- </a>
+ <a href={`/${subject.username}/request`}>
+ <button class="rounded-full border py-2 px-5 font-bold hover:opacity-80 w-full mb-2"
+ >Request an invoice</button
+ >
+ </a>
+ </div>
{/if}
</div>
- <div class="space-y-5 mt-20 mx-auto max-w-lg">
- <h1 class="text-2xl font-bold sm:hidden text-center">{subject.username}</h1>
- <span class="font-bold mb-1">Lightning address</span>
+ <div class="space-y-5 mt-5 sm:mt-20 mx-auto max-w-lg">
<p class="text-secondary mb-1">
This <a href="https://lightningaddress.com" class="underline" target="_blank" rel="noreferrer"
>lightning address</a
@@ -77,9 +75,9 @@
/>
<div class="bg-primary font-semibold rounded-xl text-sm p-3 flex">
- <div class="my-auto">{lightningAddress}</div>
+ <div class="my-auto font-semibold text-lg w-full text-center">{lightningAddress}</div>
<button class="ml-auto hover:opacity-80" on:click={() => copy(lightningAddress)}>
- <Icon icon="copy" style="ml-2" />
+ <Icon icon="copy" on:click={() => copy(lightningAddress)} />
</button>
</div>
</div>
diff --git a/src/routes/(app)/[username]/request/+page.server.js b/src/routes/(app)/[username]/request/+page.server.js
index a1d156e5..3ad76184 100644
--- a/src/routes/(app)/[username]/request/+page.server.js
+++ b/src/routes/(app)/[username]/request/+page.server.js
@@ -1,14 +1,14 @@
-import { redirect } from "@sveltejs/kit";
+import { redirect } from '@sveltejs/kit';
import { auth, post } from '$lib/utils';
export let load = ({ params }) => {
- let { username } = params;
-}
+ let { username } = params;
+};
export const actions = {
default: async ({ cookies, request, url }) => {
let form = Object.fromEntries(await request.formData());
await post('/requests', form, auth(cookies));
- throw redirect(307, url.href + '/sent');
+ throw redirect(307, url.href + '/sent');
}
};
diff --git a/src/routes/(app)/[username]/request/+page.svelte b/src/routes/(app)/[username]/request/+page.svelte
index 32b03eaa..37fdae96 100644
--- a/src/routes/(app)/[username]/request/+page.svelte
+++ b/src/routes/(app)/[username]/request/+page.svelte
@@ -3,27 +3,36 @@
import { Icon } from '$comp';
import { back } from '$lib/utils';
- export let data;
- export let form;
+ export let data;
+ export let form;
- let { subject, user } = data;
+ let { subject, user } = data;
</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>
-<h1 class="px-3 md:px-0 text-center text-3xl md:text-4xl font-semibold mb-8">Request an invoice</h1>
+<div class="container max-w-lg px-4 mx-auto">
+ <h1 class="px-3 md:px-0 text-center text-3xl md:text-4xl font-semibold">Request an invoice</h1>
-<div class="container max-w-lg px-4 flex mx-auto">
- <form method="POST" use:enhance>
- <input type="hidden" name="requester_id" value={user.id} />
- <input type="hidden" name="recipient" value={subject.username} />
+ <form method="POST" use:enhance class="space-y-5">
+ <input type="hidden" name="requester_id" value={user.id} />
+ <input type="hidden" name="recipient" value={subject.username} />
- <textarea name="memo" placeholder="(Optional) message. You might use this field to identify yourself or your order" class="w-full p-4 border rounded-xl h-48" />
+ <textarea
+ name="memo"
+ placeholder="(Optionally) use this field to describe your order"
+ class="w-full p-4 border rounded-xl h-48"
+ />
- <button type="submit" class="bg-black text-white border rounded-full px-6 py-2 font-bold">
- Go
- </button>
+ <div class="w-full flex">
+ <button
+ type="submit"
+ class="bg-black text-white border rounded-full px-6 py-2 font-bold mx-auto"
+ >
+ Submit Request
+ </button>
+ </div>
</form>
</div>
diff --git a/src/routes/(app)/[username]/request/sent/+page.svelte b/src/routes/(app)/[username]/request/sent/+page.svelte
index 47d930bf..1ee2cde1 100644
--- a/src/routes/(app)/[username]/request/sent/+page.svelte
+++ b/src/routes/(app)/[username]/request/sent/+page.svelte
@@ -2,8 +2,8 @@
import { scale } from 'svelte/transition';
import { Icon } from '$comp';
- export let data;
- let { subject } = data;
+ export let data;
+ let { subject } = data;
</script>
<div class="container px-4 text-center mx-auto">
@@ -12,11 +12,9 @@
</div>
<h1 class="text-3xl md:text-4xl font-bold mb-6">Request sent</h1>
- <a href={`/${subject.username}`}>
- <button
- class="bg-black text-white rounded-2xl w-20 py-3 font-bold hover:opacity-80"
- >
- Done
- </button>
- </a>
+ <a href={`/${subject.username}`}>
+ <button class="bg-black text-white rounded-2xl w-20 py-3 font-bold hover:opacity-80">
+ Done
+ </button>
+ </a>
</div>
diff --git a/src/routes/(app)/[username]/transactions/[...page]/+page.svelte b/src/routes/(app)/[username]/transactions/[...page]/+page.svelte
index da023c3d..f5fae1d9 100644
--- a/src/routes/(app)/[username]/transactions/[...page]/+page.svelte
+++ b/src/routes/(app)/[username]/transactions/[...page]/+page.svelte
@@ -7,7 +7,7 @@
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';
+ import { goto, invalidate } from '$app/navigation';
export let data;
generated by cgit v1.2.3 (git 2.51.0) at 2026-10-15 22:52:01 +0000