amount component

2 files changed, 6 insertions, 25 deletions

diff --git a/src/routes/(app)/send/invoice/[id]/+page.svelte b/src/routes/(app)/send/invoice/[id]/+page.svelte
index 57f33f24..f5259170 100644
--- a/src/routes/(app)/send/invoice/[id]/+page.svelte
+++ b/src/routes/(app)/send/invoice/[id]/+page.svelte
@@ -7,6 +7,7 @@
   import { goto, invalidateAll } from "$app/navigation";
   import { pin } from "$lib/store";
   import { enhance } from "$app/forms";
+  import Amount from "$comp/Amount.svelte";
   import Avatar from "$comp/Avatar.svelte";
   import Icon from "$comp/Icon.svelte";
   import Numpad from "$comp/Numpad.svelte";
@@ -18,7 +19,7 @@
     post,
     back,
     f,
-    fiat as toFiat,
+    toFiat,
     s,
     sats,
     focus,
@@ -99,25 +100,8 @@
     <h1 class="text-4xl font-bold">
       {$t("payments.send")}
     </h1>
-    <div>
-      <h2 class="text-2xl md:text-3xl font-semibold">
-        {f(toFiat(amount, rate), currency)}
-        {#if tip}
-          <span class="text-lg">
-            + {f(toFiat(tip, rate), currency)}
-          </span>
-        {/if}
-      </h2>
-      <h3 class="text-secondary md:text-lg mt-1">
-        ⚡️{s(amount)}
 
-        {#if tip}
-          <span class="text-lg">
-            + ⚡️{s(tip)}
-          </span>
-        {/if}
-      </h3>
-    </div>
+    <Amount {amount} {tip} {rate} {currency} />
 
     <h1 class="text-xl md:text-2xl text-secondary">
       {$t("payments.to")}
diff --git a/src/routes/(app)/send/lightning/[payreq]/+page.svelte b/src/routes/(app)/send/lightning/[payreq]/+page.svelte
index 6b9fe4e2..af3e09f4 100644
--- a/src/routes/(app)/send/lightning/[payreq]/+page.svelte
+++ b/src/routes/(app)/send/lightning/[payreq]/+page.svelte
@@ -7,7 +7,7 @@
   import Numpad from "$comp/Numpad.svelte";
   import Spinner from "$comp/Spinner.svelte";
   import { page } from "$app/stores";
-  import { back, fiat, f, s, focus } from "$lib/utils";
+  import { back, toFiat, f, s, focus } from "$lib/utils";
   import { rate, pin } from "$lib/store";
 
   let { data, form } = $props();
@@ -68,10 +68,7 @@
         {$t("payments.send")}
       </h1>
 
-      <h2 class="text-3xl font-semibold">
-        {f(fiat(amount, $rate), currency)}
-      </h2>
-      <h3 class="text-secondary text-xl">⚡️{s(amount)}</h3>
+      <Amount {amount} rate={$rate} {currency} />
     </div>
 
     <div class="text-xl">
@@ -86,7 +83,7 @@
         <div class="flex flex-wrap gap-4 justify-center">
           <div class="my-auto">
             <h2 class="text-xl">
-              {f(fiat(ourfee, $rate), currency)}
+              {f(toFiat(ourfee, $rate), currency)}
             </h2>
             <h3 class="text-secondary">⚡️{s(ourfee)}</h3>
           </div>