1 files changed, 13 insertions, 11 deletions
diff --git a/src/components/InvoiceActions.svelte b/src/components/InvoiceActions.svelte
index 7f1607e0..0b5dca55 100644
--- a/src/components/InvoiceActions.svelte
+++ b/src/components/InvoiceActions.svelte
@@ -1,33 +1,35 @@
 <script>
-  export let user,
+  let {
+    user,
     invoice,
     copy,
     t,
     link,
     type,
     types,
-    showQr,
+    showQr = $bindable(),
     txt,
-    toggleAmount;
+    toggleAmount
+  } = $props();
 </script>
 
 <div class="text-secondary space-y-2 text-xl pt-2">
-  <button type="button" class="btn" on:click={() => copy(txt)}>
-    <iconify-icon icon="ph:copy-bold" width="32" />
+  <button type="button" class="btn" onclick={() => copy(txt)}>
+    <iconify-icon icon="ph:copy-bold" width="32"></iconify-icon>
     <div class="my-auto">
       {t("payments.copy")}
     </div>
   </button>
 
   {#if user?.id === invoice?.user?.id}
-    <button class="btn" on:click={toggleAmount}>
-      <iconify-icon icon="ph:pencil-simple-bold" width="32" />
+    <button class="btn" onclick={toggleAmount}>
+      <iconify-icon icon="ph:pencil-simple-bold" width="32"></iconify-icon>
       <div class="my-auto">{t("payments.setAmount")}</div>
     </button>
   {:else}
     <a href={link} class="block">
       <button class="btn">
-        <iconify-icon icon="ph:wallet-bold" width="32" />
+        <iconify-icon icon="ph:wallet-bold" width="32"></iconify-icon>
         <div class="my-auto">{t("payments.openLink")}</div>
       </button>
     </a>
@@ -35,11 +37,11 @@
 
   {#if txt.startsWith("ln")}
     <div class="w-full flex justify-center gap-2 flex-wrap">
-      <button class="btn" on:click={() => (showQr = !showQr)}>
+      <button class="btn" onclick={() => (showQr = !showQr)}>
         {#if showQr}
-          <iconify-icon icon="ph:text-align-center-bold" width="32" />
+          <iconify-icon icon="ph:text-align-center-bold" width="32"></iconify-icon>
         {:else}
-          <iconify-icon icon="ph:qr-code-bold" width="32" />
+          <iconify-icon icon="ph:qr-code-bold" width="32"></iconify-icon>
         {/if}
         <div class="my-auto">
           {showQr ? t("payments.showText") : t("payments.showQr")}