get rid of /receive route

4 files changed, 31 insertions, 28 deletions

diff --git a/src/components/Account.svelte b/src/components/Account.svelte
index 44b53bdf..0be08a05 100644
--- a/src/components/Account.svelte
+++ b/src/components/Account.svelte
@@ -86,7 +86,7 @@
     }
   };
 
-  let receiveUrl = $derived(id === user.id ? `/${user.username}/receive` : "/invoice");
+  let receiveUrl = $derived(id === user.id ? "/invoice?lnurl=true" : "/invoice");
 
   let displayType = $derived(
     accountType === "ark"
diff --git a/src/components/InvoiceData.svelte b/src/components/InvoiceData.svelte
index 617f6f42..ece30457 100644
--- a/src/components/InvoiceData.svelte
+++ b/src/components/InvoiceData.svelte
@@ -24,31 +24,34 @@
   let { memo } = $derived(invoice);
 
   let qrSrc = $derived(`/qr/${encodeURIComponent(invoice.text)}/raw`);
-  let visibleSrc = $state("");
-  let first = true;
+  let srcs: string[] = $state([]);
 
   $effect(() => {
     const next = qrSrc;
-    if (first) {
-      first = false;
-      visibleSrc = next;
-      return;
+    if (!srcs.length) {
+      srcs = [next];
+    } else if (next !== srcs[srcs.length - 1]) {
+      srcs = [...srcs, next];
     }
-    const img = new Image();
-    img.onload = () => (visibleSrc = next);
-    img.src = next;
   });
+
+  let onLoaded = (src: string) => {
+    const idx = srcs.indexOf(src);
+    if (idx > 0) srcs = srcs.slice(idx);
+  };
 </script>
 
 {#if showQr}
-  <div class="max-w-[280px] w-full mx-auto">
-    <a href={link}>
-      <img
-        src={visibleSrc}
-        class="z-10 border-4 border-white"
-        alt={txt}
-      />
-    </a>
+  <div class="max-w-[280px] w-full mx-auto aspect-square relative">
+    {#each srcs as src, i (src)}
+      <a href={link} class="absolute inset-0" style:z-index={i}>
+        <img
+          {src}
+          alt={txt}
+          onload={srcs.length > 1 ? () => onLoaded(src) : undefined}
+        />
+      </a>
+    {/each}
   </div>
 {/if}
 
@@ -92,3 +95,4 @@
 {#if memo}
   <div class="text-xl text-center">{memo}</div>
 {/if}
+
diff --git a/src/components/InvoiceTypes.svelte b/src/components/InvoiceTypes.svelte
index b518364d..489fb367 100644
--- a/src/components/InvoiceTypes.svelte
+++ b/src/components/InvoiceTypes.svelte
@@ -2,7 +2,6 @@
   import PhLightningFill from "virtual:icons/ph/lightning-fill";
   import PhXBold from "virtual:icons/ph/x-bold";
   import { types } from "$lib/utils";
-  import { page } from "$app/stores";
   import { amountPrompt } from "$lib/store";
   let {
     newAmount = $bindable(),
@@ -14,6 +13,7 @@
     setAmount,
     setType,
     activeOnly = false,
+    lnurlMode = false,
   } = $props();
 
   let { aid, address_type, type } = $derived(invoice);
@@ -60,10 +60,9 @@
   <div class="flex flex-wrap gap-2">
     <button
       class="btn flex-nowrap !w-auto grow"
-      class:bg-base-300={type === types.lightning && $page.url.pathname.includes("/receive")}
-      class:text-secondary={type === types.lightning && $page.url.pathname.includes("/receive")}
-      class:hidden={activeOnly &&
-      (type !== types.lightning || !$page.url.pathname.includes("/receive"))}
+      class:bg-base-300={lnurlMode}
+      class:text-secondary={lnurlMode}
+      class:hidden={activeOnly && !lnurlMode}
       onclick={() => {
         if (activeOnly) toggleType();
         else {
@@ -97,10 +96,9 @@
 
     <button
       class="btn flex-nowrap !w-auto grow"
-      class:bg-base-300={type === types.lightning && !$page.url.pathname.includes("/receive")}
-      class:text-secondary={type === types.lightning && !$page.url.pathname.includes("/receive")}
-      class:hidden={activeOnly &&
-      (type !== types.lightning || $page.url.pathname.includes("/receive"))}
+      class:bg-base-300={type === types.lightning && !lnurlMode}
+      class:text-secondary={type === types.lightning && !lnurlMode}
+      class:hidden={activeOnly && !(type === types.lightning && !lnurlMode)}
       onclick={() => {
         if (activeOnly) toggleType();
         else {
diff --git a/src/components/SetType.svelte b/src/components/SetType.svelte
index 99bf676f..334c49ca 100644
--- a/src/components/SetType.svelte
+++ b/src/components/SetType.svelte
@@ -13,6 +13,7 @@
     setType,
     toggleType,
     activeOnly = false,
+    lnurlMode = false,
     t,
   }: any = $props();
 </script>
@@ -20,7 +21,7 @@
 {#if settingType}
   <div class="fixed inset-0 bg-base-100/90 overflow-y-auto h-full w-full z-50">
     <div class="relative mx-auto p-12 max-w-xl shadow-lg rounded-md bg-base-100 space-y-2">
-      <InvoiceTypes bind:newAmount {setAmount} {invoice} {user} {hasArk} {setType} {toggleType} {t} />
+      <InvoiceTypes bind:newAmount {setAmount} {invoice} {user} {hasArk} {setType} {toggleType} {lnurlMode} {t} />
     </div>
   </div>
 {/if}