number formatting

3 files changed, 13 insertions, 10 deletions

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 @@
         <div class="my-auto mr-1">1</div>
         <img src="/images/bitcoin.svg" class="w-5 my-auto" alt="Bitcoin" />
       </div>
-      <div>= {f(rates[currency], currency, locale)}</div>
+      <div>&#61; {f(rates[currency], currency, locale, 0, 0)}</div>
     </div>
     <div class="text-secondary flex ml-auto">
       <div class="flex items-center">
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 @@
     <div class="flex gap-2 items-end">
       <div class="flex items-center">
         <iconify-icon icon="ph:lightning-fill" class="text-yellow-300"
-        ></iconify-icon>{s(amount)}
+        ></iconify-icon>{s(amount, userLocale)}
       </div>
       <span class="text-secondary text-lg">
-        {f(toFiat(amount, rate), currency)}
+        {f(toFiat(amount, rate), currency, userLocale)}
       </span>
     </div>
   </div>
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"
                 ></iconify-icon>
-                <div>{s(Math.abs(p.amount))}</div>
+                <div>{s(Math.abs(p.amount), userLocale)}</div>
               </div>
             </div>
 
             <div class="text-secondary flex items-center text-base">
-              {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}
                 <span class="text-sm text-secondary">
@@ -311,7 +312,7 @@
         <span class="text-base text-secondary">
           {#if tipsIn || tipsOut}{$t("payments.tips")}{/if}
         </span>
-        <span class="text-base text-secondary">{$t("payments.total")}</span>
+        <span class="text-base text-secondary text-right">{$t("payments.total")}</span>
 
         {@const totalIn = incoming[c]?.fiat || 0}
         {@const tipsIn = incoming[c]?.fiatTips || 0}
@@ -325,15 +326,15 @@
           >{$t("payments.income")}</span
         >
         <!-- <span><b>{subtotalIn ? f(subtotalIn, c) : "-"}</b></span> -->
-        <span><b>{tipsIn ? f(tipsIn, c, loc(user)) : "-"}</b></span>
-        <span><b>{totalIn ? f(totalIn, c, loc(user)) : "-"}</b></span>
+        <span><b>{tipsIn > 0 ? f(tipsIn, c, userLocale) : "-"}</b></span>
+        <span class="text-right"><b>{totalIn > 0 ? f(totalIn, c, userLocale) : "-"}</b></span>
 
         <span class="text-left text-base text-secondary"
           >{$t("payments.expenditure")}</span
         >
         <!-- <span><b>{subtotalOut ? f(subtotalOut, c) : "-"}</b></span> -->
-        <span><b>{tipsOut ? f(tipsOut, c, loc(user)) : "-"}</b></span>
-        <span><b>{totalOut ? f(totalOut, c, loc(user)) : "-"}</b></span>
+        <span><b>{tipsOut > 0 ? f(tipsOut, c, userLocale) : "-"}</b></span>
+        <span class="text-right"><b>{totalOut > 0 ? f(totalOut, c, userLocale) : "-"}</b></span>
       {/each}
     </div>
   </div>