svelte 5

3 files changed, 14 insertions, 15 deletions

diff --git a/src/routes/(app)/ecash/[id]/[...version]/+layout.svelte b/src/routes/(app)/ecash/[id]/[...version]/+layout.svelte
index f9c80329..d0d06046 100644
--- a/src/routes/(app)/ecash/[id]/[...version]/+layout.svelte
+++ b/src/routes/(app)/ecash/[id]/[...version]/+layout.svelte
@@ -3,7 +3,7 @@
   import { t } from "$lib/translations";
   import Icon from "$comp/Icon.svelte";
 
-  export let data;
+  let { data, children } = $props();
 
   let { id, rates, user, token, total, spent, external, mint } = data;
   let currency = user?.currency || "USD";
@@ -11,8 +11,8 @@
 
   let amount = total - spent;
 
-  $: amountFiat = parseFloat(((amount * rate) / sats).toFixed(2));
-  $: spentFiat = parseFloat(((spent * rate) / sats).toFixed(2));
+  let amountFiat = $derived(parseFloat(((amount * rate) / sats).toFixed(2)));
+  let spentFiat = $derived(parseFloat(((spent * rate) / sats).toFixed(2)));
 </script>
 
 <div class="container px-4 max-w-lg mx-auto space-y-5 mt-20">
@@ -52,5 +52,5 @@
     </div>
   {/if}
 
-  <slot />
+  {@render children?.()}
 </div>
diff --git a/src/routes/(app)/ecash/[id]/[...version]/+page.svelte b/src/routes/(app)/ecash/[id]/[...version]/+page.svelte
index b350b124..47126c78 100644
--- a/src/routes/(app)/ecash/[id]/[...version]/+page.svelte
+++ b/src/routes/(app)/ecash/[id]/[...version]/+page.svelte
@@ -4,11 +4,10 @@
   import { t } from "$lib/translations";
   import { page } from "$app/stores";
 
-  export let data;
-  export let form;
+  let { data, form } = $props();
 
   let link = $page.url.href;
-  let { id, total, version, token, external, spent } = data;
+  let { id, total, version, token, external, spent } = $state(data);
 </script>
 
 {#if form?.error}
@@ -20,8 +19,8 @@
 {/if}
 
 <div class="flex flex-wrap gap-2 text-xl">
-  <button type="button" class="btn" on:click={() => copy(link)}>
-    <iconify-icon icon="ph:link-bold" width="32" />
+  <button type="button" class="btn" onclick={() => copy(link)}>
+    <iconify-icon icon="ph:link-bold" width="32"></iconify-icon>
     <div class="my-auto">{$t("payments.shareLink")}</div>
   </button>
 
@@ -33,7 +32,7 @@
             icon="ph:hand-coins-bold"
             width="32"
             flip="horizontal"
-          />
+></iconify-icon>
           <div class="my-auto">{$t("payments.swap")}</div>
         </button>
       </a>
@@ -45,7 +44,7 @@
             icon="ph:hand-coins-bold"
             width="32"
             flip="horizontal"
-          />
+></iconify-icon>
           <div class="my-auto">{$t("payments.redeem")}</div>
         </button>
       </form>
@@ -54,7 +53,7 @@
 
   <button
     class="btn break-all !h-auto py-5 font-normal leading-normal"
-    on:click={() => copy(token)}
+    onclick={() => copy(token)}
   >
     {token}
   </button>
@@ -62,14 +61,14 @@
   {#if version === 4}
     <a data-sveltekit-reload href={`/ecash/${id}/3`} class="contents">
       <button type="button" class="btn">
-        <iconify-icon icon="ph:gear-bold" width="32" />
+        <iconify-icon icon="ph:gear-bold" width="32"></iconify-icon>
         <div class="my-auto">{$t("payments.legacyVersion")}</div>
       </button>
     </a>
   {:else}
     <a data-sveltekit-reload href={`/ecash/${id}`} class="contents">
       <button type="button" class="btn">
-        <iconify-icon icon="ph:gear-bold" width="32" />
+        <iconify-icon icon="ph:gear-bold" width="32"></iconify-icon>
         <div class="my-auto">{$t("payments.newVersion")}</div>
       </button>
     </a>
diff --git a/src/routes/(app)/ecash/[id]/[...version]/swap/+page.svelte b/src/routes/(app)/ecash/[id]/[...version]/swap/+page.svelte
index ee22cea2..c434c9b4 100644
--- a/src/routes/(app)/ecash/[id]/[...version]/swap/+page.svelte
+++ b/src/routes/(app)/ecash/[id]/[...version]/swap/+page.svelte
@@ -1,5 +1,5 @@
 <script>
-  export let data;
+  let { data } = $props();
 </script>
 
 <div class="text-center">