From 67e26efeb6f0c7cc2d4dfbd91f30ff0a158991e6 Mon Sep 17 00:00:00 2001 From: Adam Soltys Date: Thu, 28 Nov 2024 14:02:31 -0800 Subject: number formatting --- src/components/Amount.svelte | 4 +- src/components/Balance.svelte | 5 +- src/components/Numpad.svelte | 67 ++-------------------- src/lib/utils.ts | 16 ++++-- src/locales/en.json | 4 +- .../(app)/[username]/(profile)/+layout.svelte | 2 +- src/routes/(app)/payment/[id]/+page.svelte | 6 +- src/routes/(app)/payments/[...page]/+page.svelte | 15 ++--- 8 files changed, 37 insertions(+), 82 deletions(-) diff --git a/src/components/Amount.svelte b/src/components/Amount.svelte index 46aa2d1b..035152d1 100644 --- a/src/components/Amount.svelte +++ b/src/components/Amount.svelte @@ -11,7 +11,7 @@ >
{s(amount)} + >{s(amount, locale)}
{#if tip} @@ -19,7 +19,7 @@
+
-
{s(tip)}
+
{s(tip, locale)}
{/if} diff --git a/src/components/Balance.svelte b/src/components/Balance.svelte index 33597c18..28bd69b3 100644 --- a/src/components/Balance.svelte +++ b/src/components/Balance.svelte @@ -6,6 +6,7 @@ let show = $state(); let { user, rate, balance } = $props(); + let locale = loc(user); let toggleShow = (e) => { e.preventDefault(); e.stopPropagation(); @@ -27,14 +28,14 @@
- {s(balance)} + {s(balance, locale)}
{#if isNaN(rate)}
—
{:else} - {f(toFiat(balance, rate), user.currency, loc(user))} + {f(toFiat(balance, rate), user.currency, locale)} {/if}
{/if} diff --git a/src/components/Numpad.svelte b/src/components/Numpad.svelte index e813a24b..f694679a 100644 --- a/src/components/Numpad.svelte +++ b/src/components/Numpad.svelte @@ -72,65 +72,9 @@ ]; const handleInput = (value) => { - if (selecting) amount = 0; - selecting = false; - - if ($fiat) { - if ( - amountFiat === 0 && - value !== decimal && - value !== "<" && - value !== "0" - ) { - amountFiat = value; - } else if ((amountFiat === 0 || amountFiat === "0") && value === "0") { - return; - } else if (amountFiat === 0 && value === decimal) { - amountFiat = `0${decimal}`; - } else if ( - amountFiat !== 0 && - amountFiat.includes(decimal) && - value === decimal - ) { - return; - } else if (value === "<") { - if (amountFiat !== 0) { - amountFiat = amountFiat.slice(0, amountFiat.length - 1); - if (amountFiat.length === 0) { - amountFiat = 0; - amount = 0; - } - } - } else if ( - value !== decimal && - value !== "<" && - parseInt(amountFiat + value) > rate - ) { - warning($t("user.receive.lessThan1BTCWarning")); - } else if (amountFiat !== 0 && amountFiat.match(/\.../)) { - return; - } else { - amountFiat = amountFiat + value; - } - } else { - if (value === decimal) { - return; - } else if (!amount && value !== "<" && value !== "0") { - amount = parseInt(value); - } else if (value === "<") { - if (amount !== 0) { - amount = Math.floor(amount / 10); - if (amount.length === 0) { - amount = 0; - amountFiat = 0; - } - } - } else if (value !== "<" && parseInt(amount + value) > sats) { - warning($t("user.receive.lessThan1BTCWarning")); - } else { - amount = parseInt(amount.toString() + value); - } - } + if (value === "<") html = html.substr(0, html.length - 1); + else html += value; + input(); }; $: html = $fiat ? amountFiat : s(amount); @@ -196,10 +140,11 @@ if (html.length < prev.length && p === 1 && i > 1) i--; } - let node = e.target.childNodes[0]; + let node = element.childNodes[0]; let range = document.createRange(); if (node) { + if (i > node.length) i = node.length; range.setStart(node, i); range.setEnd(node, i); @@ -280,7 +225,7 @@ {#if $fiat} - {s(amount)} + {s(amount, locale)} {:else} {f(amountFiat, currency, locale)} {/if} diff --git a/src/lib/utils.ts b/src/lib/utils.ts index 60e30fe5..cb18d32c 100644 --- a/src/lib/utils.ts +++ b/src/lib/utils.ts @@ -280,16 +280,22 @@ export const loc = (user) => { return map[l]?.[c] || map[c]; }; -export const f = (s: number, currency: string, locale = "en-US") => +export const f = ( + s: number, + currency: string, + locale = "en-US", + minimumFractionDigits = 2, + maximumFractionDigits = 2, +) => new Intl.NumberFormat(locale, { style: "currency", currency, - minimumFractionDigits: 2, - maximumFractionDigits: 2, + minimumFractionDigits, + maximumFractionDigits, }).format(s); -export const s = (s: number): string => - new Intl.NumberFormat("en-US", { maximumFractionDigits: 0 }).format(s); +export const s = (s: number, locale = "en-US"): string => + new Intl.NumberFormat(locale, { maximumFractionDigits: 0 }).format(s); export const sat = (s: number): string => `${si(Math.abs(s)).toString()}`; diff --git a/src/locales/en.json b/src/locales/en.json index 10bccaba..282d2f19 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -344,9 +344,9 @@ "enterWalletPass": "Wallet password", "legacyVersion": "Legacy version", "newVersion": "New version", - "income": "Income", + "income": "Received", "subtotal": "Subtotal", - "expenditure": "Expenditure", + "expenditure": "Spent", "spent": "Already spent", "mint": "Mint", "ecash": "Ecash", diff --git a/src/routes/(app)/[username]/(profile)/+layout.svelte b/src/routes/(app)/[username]/(profile)/+layout.svelte index 2ce8aa7a..76a0c8f5 100644 --- a/src/routes/(app)/[username]/(profile)/+layout.svelte +++ b/src/routes/(app)/[username]/(profile)/+layout.svelte @@ -292,7 +292,7 @@
1
Bitcoin -
= {f(rates[currency], currency, locale)}
+
= {f(rates[currency], currency, locale, 0, 0)}
diff --git a/src/routes/(app)/payment/[id]/+page.svelte b/src/routes/(app)/payment/[id]/+page.svelte index 85821fee..279b87e7 100644 --- a/src/routes/(app)/payment/[id]/+page.svelte +++ b/src/routes/(app)/payment/[id]/+page.svelte @@ -6,6 +6,7 @@ copy, f, s, + loc, toFiat, post, sats, @@ -23,6 +24,7 @@ let { data } = $props(); let { user, payment: p } = $state(data); let locale = user ? locales[user.language] : locales["en"]; + let userLocale = loc(user); let { id, @@ -79,10 +81,10 @@
{s(amount)} + >{s(amount, userLocale)}
- {f(toFiat(amount, rate), currency)} + {f(toFiat(amount, rate), currency, userLocale)}
diff --git a/src/routes/(app)/payments/[...page]/+page.svelte b/src/routes/(app)/payments/[...page]/+page.svelte index 91b74d98..5625c8de 100644 --- a/src/routes/(app)/payments/[...page]/+page.svelte +++ b/src/routes/(app)/payments/[...page]/+page.svelte @@ -24,6 +24,7 @@ } = $derived(data); let locale = locales[user.language]; + let userLocale = loc(user); let change = ({ target: { value } }) => goto(value); let link = (p) => { @@ -216,12 +217,12 @@ width="24" class="text-yellow-300" > -
{s(Math.abs(p.amount))}
+
{s(Math.abs(p.amount), userLocale)}
- {f(Math.abs(p.amount) * (p.rate / sats), p.currency, loc(user))} + {f(Math.abs(p.amount) * (p.rate / sats), p.currency, userLocale)} {#if p.tip} @@ -311,7 +312,7 @@ {#if tipsIn || tipsOut}{$t("payments.tips")}{/if} - {$t("payments.total")} + {$t("payments.total")} {@const totalIn = incoming[c]?.fiat || 0} {@const tipsIn = incoming[c]?.fiatTips || 0} @@ -325,15 +326,15 @@ >{$t("payments.income")} - {tipsIn ? f(tipsIn, c, loc(user)) : "-"} - {totalIn ? f(totalIn, c, loc(user)) : "-"} + {tipsIn > 0 ? f(tipsIn, c, userLocale) : "-"} + {totalIn > 0 ? f(totalIn, c, userLocale) : "-"} {$t("payments.expenditure")} - {tipsOut ? f(tipsOut, c, loc(user)) : "-"} - {totalOut ? f(totalOut, c, loc(user)) : "-"} + {tipsOut > 0 ? f(tipsOut, c, userLocale) : "-"} + {totalOut > 0 ? f(totalOut, c, userLocale) : "-"} {/each}
-- cgit v1.2.3