aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--.env.production1
-rw-r--r--src/locales/en.json10
-rw-r--r--src/routes/(app)/[username]/transactions/[...page]/+page.svelte117
-rw-r--r--src/routes/(app)/invoice/[id]/+page.svelte4
-rw-r--r--src/routes/(app)/tx/[id]/+page.server.js6
-rw-r--r--src/routes/(app)/tx/[id]/+page.svelte62
-rw-r--r--src/routes/(app)/voucher/[redeemcode]/+page.server.js2
-rw-r--r--static/icons/logo-symbol.svg107
8 files changed, 173 insertions, 136 deletions
diff --git a/.env.production b/.env.production
index e9923d84..4a2101df 100644
--- a/.env.production
+++ b/.env.production
@@ -1,3 +1,4 @@
PUBLIC_COINOS_URL=http://app:3119
PUBLIC_BTC=6f0279e9ed041c3d710a9f57d0c02928416460c4b722ae3457a11eec381c526d
PUBLIC_SOCKET=wss://coinos.io/ws
+PUBLIC_EXPLORER=https://mempool.space
diff --git a/src/locales/en.json b/src/locales/en.json
index 5714adff..ec89d1c4 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -258,10 +258,14 @@
}
},
"transactions": {
+ "amount": "Amount",
+ "date": "Date",
+ "id": "Transaction ID",
+ "details": "Transaction Details",
"header": "Transactions",
- "AMOUNT": "AMOUNT",
- "TYPE": "TYPE",
- "TIME": "TIME",
+ "preimage": "Preimage",
+ "type": "Type",
+ "time": "Time",
"sent": "Sent",
"received": "Received",
"empty": "No transactions yet.",
diff --git a/src/routes/(app)/[username]/transactions/[...page]/+page.svelte b/src/routes/(app)/[username]/transactions/[...page]/+page.svelte
index 2ea151d5..89207134 100644
--- a/src/routes/(app)/[username]/transactions/[...page]/+page.svelte
+++ b/src/routes/(app)/[username]/transactions/[...page]/+page.svelte
@@ -13,6 +13,11 @@
let { start, end, user } = data;
let change = ({ target: { value } }) => goto(value);
+ let link = (tx) => {
+ if (tx.redeemcode) return `/voucher/${tx.redeemcode}`;
+ if (tx.with) return '/' + tx.with.username;
+ return `/tx/${tx.hash}`;
+ };
let presets = [
{ title: $t('transactions.day'), start: sub(new Date(), { days: 1 }), end: null },
@@ -101,75 +106,77 @@
<div class="text-base">
{#each $txns as tx}
- <div class="grid grid-cols-3 border-b h-24">
- <div class="whitespace-nowrap my-auto">
- <div class="font-bold">
- {f(tx.amount * (tx.rate / sats), tx.currency)}
+ <a href={link(tx)}>
+ <div class="grid grid-cols-3 border-b h-24 hover:bg-gray-100 px-4">
+ <div class="whitespace-nowrap my-auto">
+ <div class="font-bold">
+ {f(tx.amount * (tx.rate / sats), tx.currency)}
- {#if tx.tip}
- <span class="text-sm">
- +{f(tx.tip * (tx.rate / sats), tx.currency)}
- </span>
- {/if}
- </div>
+ {#if tx.tip}
+ <span class="text-sm">
+ +{f(tx.tip * (tx.rate / sats), tx.currency)}
+ </span>
+ {/if}
+ </div>
- <div class="text-secondary">
- {sat(tx.amount)}
+ <div class="text-secondary">
+ {sat(tx.amount)}
- {#if tx.tip}
- <span class="text-sm">
- +{sat(tx.tip)}
- </span>
- {/if}
+ {#if tx.tip}
+ <span class="text-sm">
+ +{sat(tx.tip)}
+ </span>
+ {/if}
+ </div>
</div>
- </div>
- <div class="flex my-auto">
- {#if tx.redeemcode}
- <a href={`/voucher/${tx.redeemcode}`}>
- <div class="text-secondary flex">
- <div class="my-auto mr-1">
- <img src="/icons/logo-symbol.svg" class="w-12 border-4 border-white" />
+ <div class="flex my-auto">
+ {#if tx.redeemcode}
+ <a href={`/voucher/${tx.redeemcode}`}>
+ <div class="text-secondary flex">
+ <div class="my-auto mr-1">
+ <img src="/icons/logo-symbol.svg" class="w-12 border-4 border-transparent" />
+ </div>
+
+ <div class="my-auto">Voucher</div>
+ </div>
+ </a>
+ {:else if tx.with}
+ <a href={`/${tx.with.username}`}>
+ <div class="flex">
+ <div class="my-auto">
+ <Avatar user={tx.with} size={12} />
+ </div>
+ <div class="my-auto ml-1 text-secondary">{tx.with.username}</div>
</div>
+ </a>
+ {:else}
+ <div class="text-secondary flex">
+ {#if tx.network === 'lightning'}
+ <div class="text-3xl">⚡️</div>
+ {:else}
+ <div class="my-auto mr-1">
+ <img src="/images/bitcoin.svg" class="w-12 border-4 border-transparent" />
+ </div>
+ {/if}
- <div class="my-auto">Voucher</div>
- </div>
- </a>
- {:else if tx.with}
- <a href={`/${tx.with.username}`}>
- <div class="flex">
<div class="my-auto">
- <Avatar user={tx.with} size={12} />
+ {tx.amount > 0 ? (tx.confirmed ? 'Received' : 'Pending') : 'Sent'}
</div>
- <div class="my-auto ml-1 text-secondary">{tx.with.username}</div>
</div>
- </a>
- {:else}
- <div class="text-secondary flex">
- {#if tx.network === 'lightning'}
- <div class="text-3xl">⚡️</div>
- {:else}
- <div class="my-auto mr-1">
- <img src="/images/bitcoin.svg" class="w-12 border-4 border-white" />
- </div>
- {/if}
+ {/if}
+ </div>
- <div class="my-auto">
- {tx.amount > 0 ? (tx.confirmed ? 'Received' : 'Pending') : 'Sent'}
- </div>
+ <div class="text-secondary text-right text-sm my-auto">
+ <div>
+ {format(parseISO(tx.createdAt), 'h:mm aaa')}
+ </div>
+ <div>
+ {format(parseISO(tx.createdAt), 'MMM d')}
</div>
- {/if}
- </div>
-
- <div class="text-secondary text-right text-sm my-auto">
- <div>
- {format(parseISO(tx.createdAt), 'h:mm aaa')}
- </div>
- <div>
- {format(parseISO(tx.createdAt), 'MMM d')}
</div>
</div>
- </div>
+ </a>
{:else}
<p class="text-secondary text-lg text-center">{$t('transactions.empty')}</p>
{/each}
diff --git a/src/routes/(app)/invoice/[id]/+page.svelte b/src/routes/(app)/invoice/[id]/+page.svelte
index e99d6747..5eadb179 100644
--- a/src/routes/(app)/invoice/[id]/+page.svelte
+++ b/src/routes/(app)/invoice/[id]/+page.svelte
@@ -22,7 +22,7 @@
prompt,
text,
tip,
- user: { username, currency }
+ user: { username, currency, uuid }
} = invoice;
let showQr = !amount;
@@ -43,7 +43,7 @@
prompt,
text,
tip,
- user: { username, currency }
+ user: { username, currency, uuid }
} = invoice);
tipPercent = (tip / amount) * 100;
diff --git a/src/routes/(app)/tx/[id]/+page.server.js b/src/routes/(app)/tx/[id]/+page.server.js
new file mode 100644
index 00000000..7db5d4f1
--- /dev/null
+++ b/src/routes/(app)/tx/[id]/+page.server.js
@@ -0,0 +1,6 @@
+import { auth, get } from '$lib/utils';
+
+export async function load({ cookies, params }) {
+ let tx = await get(`/payments/${params.id}`, auth(cookies));
+ return { tx };
+}
diff --git a/src/routes/(app)/tx/[id]/+page.svelte b/src/routes/(app)/tx/[id]/+page.svelte
new file mode 100644
index 00000000..fc793916
--- /dev/null
+++ b/src/routes/(app)/tx/[id]/+page.svelte
@@ -0,0 +1,62 @@
+<script>
+ import { t } from '$lib/translations';
+ import { back, copy, f, s, sats } from '$lib/utils';
+ import { Avatar, Icon } from '$comp';
+ import { format, parseISO } from 'date-fns';
+ import { PUBLIC_EXPLORER as expl } from '$env/static/public';
+
+ export let data;
+ let { user, tx } = data;
+ let { username } = user;
+ let { amount, hash, createdAt, rate, network, preimage, fee, currency } = tx;
+ let fiat = (Math.abs(amount) * rate) / sats;
+</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 break-all">
+ <h1 class="px-3 md:px-0 text-center text-3xl md:text-4xl font-semibold mb-10">
+ {$t(amount < 0 ? 'transactions.sent' : 'transactions.received')}
+ </h1>
+
+ <div>
+ <div class="font-bold">{$t('transactions.amount')}</div>
+ <div class="text-xl">
+ {f(fiat, currency)}
+ <span class="text-secondary">⚡️{`${s(Math.abs(amount) + fee)}`}</span>
+ </div>
+ </div>
+
+ <div>
+ <div class="font-bold">{$t('transactions.date')}</div>
+ <div>
+ {format(parseISO(createdAt), 'MMMM d')},
+ {format(parseISO(createdAt), 'h:mm aaa')}
+ </div>
+ </div>
+
+ {#if network === 'lightning'}
+ <div>
+ <div class="font-bold">{$t('transactions.preimage')}</div>
+ <div>
+ {preimage}
+ </div>
+ </div>
+ {:else}
+ <div>
+ <div class="font-bold">{$t('transactions.id')}</div>
+ <div class="flex">
+ <div>
+ <a href={`${expl}/tx/${hash}`} target="_blank" class="text-blue-600">{hash}</a>
+ </div>
+ <button
+ class="flex font-bold hover:opacity-80 mb-auto"
+ on:click={() => copy(hash)}
+ ><Icon icon="copy" style="mr-1" />
+ </button>
+ </div>
+ </div>
+ {/if}
+</div>
diff --git a/src/routes/(app)/voucher/[redeemcode]/+page.server.js b/src/routes/(app)/voucher/[redeemcode]/+page.server.js
index 0af98538..27c8a8c1 100644
--- a/src/routes/(app)/voucher/[redeemcode]/+page.server.js
+++ b/src/routes/(app)/voucher/[redeemcode]/+page.server.js
@@ -3,7 +3,7 @@ import { auth, get, post } from '$lib/utils';
import Qr from 'qrcode-base64';
export let load = async ({ params: { redeemcode }, url }) => {
- let payment = await get(`/payment/${redeemcode}`);
+ let payment = await get(`/voucher/${redeemcode}`);
console.log(payment);
let src = Qr.drawImg(url.href, { size: 300 });
diff --git a/static/icons/logo-symbol.svg b/static/icons/logo-symbol.svg
index ddb2fe19..d0c9e054 100644
--- a/static/icons/logo-symbol.svg
+++ b/static/icons/logo-symbol.svg
@@ -1,82 +1,39 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
<svg
- width="72"
- height="72"
- viewBox="0 0 72 72"
- fill="none"
+ width="19.049999mm"
+ height="19.049999mm"
+ viewBox="0 0 19.049999 19.049999"
version="1.1"
- id="svg118"
- sodipodi:docname="logo-symbol.svg"
- inkscape:version="1.2.1 (9c6d41e410, 2022-07-14)"
- xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
- xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ id="svg515"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
- id="defs122" />
- <sodipodi:namedview
- id="namedview120"
- pagecolor="#ffffff"
- bordercolor="#000000"
- borderopacity="0.25"
- inkscape:showpageshadow="2"
- inkscape:pageopacity="0.0"
- inkscape:pagecheckerboard="0"
- inkscape:deskcolor="#d1d1d1"
- showgrid="false"
- inkscape:zoom="5.1522634"
- inkscape:cx="121.5"
- inkscape:cy="35.90655"
- inkscape:window-width="1920"
- inkscape:window-height="1011"
- inkscape:window-x="0"
- inkscape:window-y="32"
- inkscape:window-maximized="1"
- inkscape:current-layer="svg118" />
- <path
- d="M 69.8824,36 C 69.8824,54.7127 54.7127,69.8824 36,69.8824 17.2873,69.8824 2.11765,54.7127 2.11765,36 2.11765,17.2873 17.2873,2.11765 36,2.11765 54.7127,2.11765 69.8824,17.2873 69.8824,36 Z"
- fill="#ffffff"
- id="path98" />
- <path
- fill-rule="evenodd"
- clip-rule="evenodd"
- d="M 36,4.23529 C 18.4568,4.23529 4.23529,18.4568 4.23529,36 4.23529,53.5432 18.4568,67.7647 36,67.7647 53.5432,67.7647 67.7647,53.5432 67.7647,36 67.7647,18.4568 53.5432,4.23529 36,4.23529 Z M 0,36 C 0,16.1177 16.1177,0 36,0 55.8823,0 72,16.1177 72,36 72,55.8823 55.8823,72 36,72 16.1177,72 0,55.8823 0,36 Z"
- fill="#000000"
- id="path100" />
- <path
- fill-rule="evenodd"
- clip-rule="evenodd"
- d="M 36,58.5882 C 48.4751,58.5882 58.5882,48.4751 58.5882,36 58.5882,23.5248 48.4751,13.4117 36,13.4117 23.5249,13.4117 13.4118,23.5248 13.4118,36 13.4118,48.4751 23.5249,58.5882 36,58.5882 Z M 36,54 c 9.9411,0 18,-8.0589 18,-18 0,-9.9411 -8.0589,-18 -18,-18 -9.9411,0 -18,8.0589 -18,18 0,9.9411 8.0589,18 18,18 z"
- fill="#000000"
- id="path102" />
- <path
- fill-rule="evenodd"
- clip-rule="evenodd"
- d="m 36.0001,22.8988 c 0,0 -1e-4,0 -1e-4,0 -7.2356,0 -13.1012,5.8656 -13.1012,13.1012 0,7.2356 5.8656,13.1012 13.1012,13.1012 0,0 1e-4,0 1e-4,0 z"
- fill="#000000"
- id="path104" />
- <path
- d="m 99.288,18.168 c 2.528,0 4.776,0.52 6.744,1.56 1.984,1.04 3.576,2.44 4.776,4.2 1.216,1.744 1.936,3.696 2.16,5.856 H 106.8 c -0.352,-1.904 -1.168,-3.496 -2.448,-4.776 -1.28,-1.296 -3.024,-1.944 -5.232,-1.944 -2.768,0 -4.904,1.008 -6.408,3.024 -1.504,2 -2.256,5.256 -2.256,9.768 0,4.56 0.752,7.88 2.256,9.96 1.504,2.08 3.64,3.12 6.408,3.12 1.472,0 2.736,-0.32 3.792,-0.96 1.056,-0.656 1.904,-1.52 2.544,-2.592 0.656,-1.088 1.104,-2.272 1.344,-3.552 h 6.168 c -0.272,2.112 -0.904,4.08 -1.896,5.904 -0.992,1.824 -2.448,3.296 -4.368,4.416 -1.904,1.12 -4.376,1.68 -7.416,1.68 -3.184,0 -5.92,-0.728 -8.208,-2.184 -2.272,-1.472 -4.024,-3.552 -5.256,-6.24 C 84.608,42.704 84,39.496 84,35.784 c 0,-3.696 0.608,-6.856 1.824,-9.48 1.216,-2.64 2.96,-4.656 5.232,-6.048 2.288,-1.392 5.032,-2.088 8.232,-2.088 z"
- fill="#000000"
- id="path106" />
- <path
- d="m 127.588,53.832 c -3.568,0 -6.416,-1.12 -8.544,-3.36 -2.128,-2.256 -3.192,-5.392 -3.192,-9.408 0,-2.592 0.464,-4.864 1.392,-6.816 0.944,-1.952 2.288,-3.472 4.032,-4.56 1.76,-1.088 3.872,-1.632 6.336,-1.632 3.536,0 6.36,1.152 8.472,3.456 2.112,2.304 3.168,5.488 3.168,9.552 0,2.512 -0.456,4.728 -1.368,6.648 -0.896,1.92 -2.216,3.424 -3.96,4.512 -1.728,1.072 -3.84,1.608 -6.336,1.608 z m 0.024,-4.44 c 2,0 3.48,-0.8 4.44,-2.4 0.976,-1.6 1.464,-3.632 1.464,-6.096 0,-1.52 -0.192,-2.92 -0.576,-4.2 -0.384,-1.28 -1.008,-2.304 -1.872,-3.072 -0.864,-0.784 -2.016,-1.176 -3.456,-1.176 -2.048,0 -3.568,0.784 -4.56,2.352 -0.976,1.568 -1.464,3.6 -1.464,6.096 0,1.504 0.192,2.904 0.576,4.2 0.4,1.28 1.04,2.32 1.92,3.12 0.88,0.784 2.056,1.176 3.528,1.176 z"
- fill="#000000"
- id="path108" />
- <path
- d="m 149.088,18.672 v 5.52 h -5.784 v -5.52 z m -0.072,9.864 V 53.352 H 143.4 V 28.536 Z"
- fill="#000000"
- id="path110" />
- <path
- d="M 154.865,53.352 V 28.536 h 5.712 v 3.552 c 0.576,-0.96 1.464,-1.84 2.664,-2.64 1.216,-0.8 2.816,-1.2 4.8,-1.2 1.536,0 2.96,0.304 4.272,0.912 1.328,0.608 2.392,1.56 3.192,2.856 0.816,1.296 1.224,2.968 1.224,5.016 v 16.32 h -5.856 V 37.728 c 0,-1.616 -0.456,-2.824 -1.368,-3.624 -0.896,-0.8 -2.016,-1.2 -3.36,-1.2 -1.408,0 -2.672,0.352 -3.792,1.056 -1.104,0.704 -1.656,1.768 -1.656,3.192 v 16.2 z"
- fill="#000000"
- id="path112" />
- <path
- d="m 196.262,53.832 c -3.2,0 -5.968,-0.704 -8.304,-2.112 -2.32,-1.408 -4.12,-3.432 -5.4,-6.072 -1.264,-2.656 -1.896,-5.848 -1.896,-9.576 0,-3.744 0.64,-6.952 1.92,-9.624 1.28,-2.672 3.088,-4.72 5.424,-6.144 2.336,-1.424 5.088,-2.136 8.256,-2.136 3.152,0 5.88,0.712 8.184,2.136 2.32,1.424 4.112,3.472 5.376,6.144 1.264,2.672 1.896,5.88 1.896,9.624 0,3.712 -0.624,6.896 -1.872,9.552 -1.248,2.64 -3.032,4.672 -5.352,6.096 -2.32,1.408 -5.064,2.112 -8.232,2.112 z m 0,-4.896 c 2.848,0 5.072,-1.008 6.672,-3.024 1.616,-2.032 2.424,-5.288 2.424,-9.768 0,-4.56 -0.816,-7.88 -2.448,-9.96 -1.616,-2.08 -3.832,-3.12 -6.648,-3.12 -2.816,0 -5.056,1.048 -6.72,3.144 -1.648,2.08 -2.472,5.392 -2.472,9.936 0,4.496 0.824,7.752 2.472,9.768 1.664,2.016 3.904,3.024 6.72,3.024 z"
- fill="#000000"
- id="path114" />
- <path
- d="m 229.431,53.832 c -2.24,0 -4.392,-0.376 -6.456,-1.128 -2.048,-0.752 -3.768,-1.872 -5.16,-3.36 -1.392,-1.488 -2.224,-3.352 -2.496,-5.592 h 6.048 c 0.384,1.76 1.312,3.104 2.784,4.032 1.472,0.912 3.224,1.368 5.256,1.368 2.144,0 3.96,-0.424 5.448,-1.272 1.488,-0.848 2.232,-2.08 2.232,-3.696 0,-1.424 -0.544,-2.52 -1.632,-3.288 -1.088,-0.784 -2.52,-1.368 -4.296,-1.752 l -6.384,-1.392 c -2.592,-0.528 -4.64,-1.552 -6.144,-3.072 -1.488,-1.52 -2.248,-3.544 -2.28,-6.072 -0.016,-2.096 0.536,-3.92 1.656,-5.472 1.12,-1.568 2.656,-2.776 4.608,-3.624 1.968,-0.864 4.184,-1.296 6.648,-1.296 2.88,0 5.304,0.472 7.272,1.416 1.968,0.944 3.456,2.2 4.464,3.768 1.024,1.552 1.552,3.264 1.584,5.136 h -5.904 c -0.208,-2.064 -1.008,-3.504 -2.4,-4.32 -1.376,-0.832 -3.024,-1.248 -4.944,-1.248 -1.92,0 -3.544,0.44 -4.872,1.32 -1.312,0.88 -1.968,2.104 -1.968,3.672 0,1.12 0.368,2.032 1.104,2.736 0.752,0.688 2.152,1.272 4.2,1.752 l 6.24,1.392 c 1.936,0.384 3.496,0.968 4.68,1.752 1.184,0.768 2.08,1.64 2.688,2.616 0.624,0.976 1.04,1.984 1.248,3.024 0.224,1.024 0.336,1.992 0.336,2.904 0,1.808 -0.552,3.448 -1.656,4.92 -1.104,1.456 -2.672,2.616 -4.704,3.48 -2.032,0.864 -4.432,1.296 -7.2,1.296 z"
- fill="#000000"
- id="path116" />
+ id="defs512" />
+ <g
+ id="layer1"
+ transform="translate(46.987939,-145.34756)">
+ <path
+ fill-rule="evenodd"
+ clip-rule="evenodd"
+ d="m -37.462939,146.46815 c -4.641638,0 -8.404413,3.76277 -8.404413,8.40441 0,4.64164 3.762775,8.40441 8.404413,8.40441 4.641638,0 8.40441,-3.76277 8.40441,-8.40441 0,-4.64164 -3.762772,-8.40441 -8.40441,-8.40441 z m -9.525,8.40441 c 0,-5.26053 4.264475,-9.525 9.525,-9.525 5.260525,0 9.525,4.26447 9.525,9.525 0,5.26053 -4.264475,9.525 -9.525,9.525 -5.260525,0 -9.525,-4.26447 -9.525,-9.525 z"
+ fill="#000000"
+ id="path100"
+ style="stroke-width:0.264583" />
+ <path
+ fill-rule="evenodd"
+ clip-rule="evenodd"
+ d="m -37.462939,160.84902 c 3.300703,0 5.976461,-2.67576 5.976461,-5.97646 0,-3.30073 -2.675758,-5.97649 -5.976461,-5.97649 -3.300704,0 -5.976461,2.67576 -5.976461,5.97649 0,3.3007 2.675757,5.97646 5.976461,5.97646 z m 0,-1.21396 c 2.630249,0 4.7625,-2.13225 4.7625,-4.7625 0,-2.63025 -2.132251,-4.7625 -4.7625,-4.7625 -2.630249,0 -4.7625,2.13225 -4.7625,4.7625 0,2.63025 2.132251,4.7625 4.7625,4.7625 z"
+ fill="#000000"
+ id="path102"
+ style="stroke-width:0.264583" />
+ <path
+ fill-rule="evenodd"
+ clip-rule="evenodd"
+ d="m -37.462913,151.4062 c 0,0 -2.6e-5,0 -2.6e-5,0 -1.914419,0 -3.466359,1.55194 -3.466359,3.46636 0,1.91442 1.55194,3.46636 3.466359,3.46636 0,0 2.6e-5,0 2.6e-5,0 z"
+ fill="#000000"
+ id="path104"
+ style="stroke-width:0.264583" />
+ </g>
</svg>
generated by cgit v1.2.3 (git 2.51.0) at 2026-10-18 01:36:59 +0000