From 379ac2a5c9c5c63a67bb999b6875ecff33a15b2b Mon Sep 17 00:00:00 2001
From: Adam Soltys <asoltys@gmail.com>
Date: Tue, 3 Sep 2024 14:35:48 -0700
Subject: ecash version toggle

---
 src/locales/en.json                                |  2 +
 src/routes/(app)/ecash/[id]/+layout.server.ts      |  8 --
 src/routes/(app)/ecash/[id]/+layout.svelte         | 53 -------------
 src/routes/(app)/ecash/[id]/+page.server.ts        | 21 ------
 src/routes/(app)/ecash/[id]/+page.svelte           | 64 ----------------
 .../ecash/[id]/[...version]/+layout.server.ts      | 11 +++
 .../(app)/ecash/[id]/[...version]/+layout.svelte   | 52 +++++++++++++
 .../(app)/ecash/[id]/[...version]/+page.server.ts  | 21 ++++++
 .../(app)/ecash/[id]/[...version]/+page.svelte     | 86 ++++++++++++++++++++++
 .../ecash/[id]/[...version]/swap/+page.server.ts   |  3 +
 .../ecash/[id]/[...version]/swap/+page.svelte      |  5 ++
 src/routes/(app)/ecash/[id]/swap/+page.server.ts   |  3 -
 src/routes/(app)/ecash/[id]/swap/+page.svelte      |  5 --
 13 files changed, 180 insertions(+), 154 deletions(-)
 delete mode 100644 src/routes/(app)/ecash/[id]/+layout.server.ts
 delete mode 100644 src/routes/(app)/ecash/[id]/+layout.svelte
 delete mode 100644 src/routes/(app)/ecash/[id]/+page.server.ts
 delete mode 100644 src/routes/(app)/ecash/[id]/+page.svelte
 create mode 100644 src/routes/(app)/ecash/[id]/[...version]/+layout.server.ts
 create mode 100644 src/routes/(app)/ecash/[id]/[...version]/+layout.svelte
 create mode 100644 src/routes/(app)/ecash/[id]/[...version]/+page.server.ts
 create mode 100644 src/routes/(app)/ecash/[id]/[...version]/+page.svelte
 create mode 100644 src/routes/(app)/ecash/[id]/[...version]/swap/+page.server.ts
 create mode 100644 src/routes/(app)/ecash/[id]/[...version]/swap/+page.svelte
 delete mode 100644 src/routes/(app)/ecash/[id]/swap/+page.server.ts
 delete mode 100644 src/routes/(app)/ecash/[id]/swap/+page.svelte

(limited to 'src')

diff --git a/src/locales/en.json b/src/locales/en.json
index 09935e45..ef50a2ae 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -293,6 +293,8 @@
 		}
 	},
 	"payments": {
+    "legacyVersion": "Legacy version",
+    "newVersion": "New version",
     "income": "Income",
     "subtotal": "Subtotal",
     "expenditure": "Expenditure",
diff --git a/src/routes/(app)/ecash/[id]/+layout.server.ts b/src/routes/(app)/ecash/[id]/+layout.server.ts
deleted file mode 100644
index 5de15341..00000000
--- a/src/routes/(app)/ecash/[id]/+layout.server.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-import { get } from "$lib/utils";
-
-export async function load({ params }) {
-  let { id } = params;
-  let { token, status } = await get(`/cash/${id}`);
-  let { spent, total, mint, external } = status;
-  return { id, token, spent, total, mint, external };
-}
diff --git a/src/routes/(app)/ecash/[id]/+layout.svelte b/src/routes/(app)/ecash/[id]/+layout.svelte
deleted file mode 100644
index d3c95e00..00000000
--- a/src/routes/(app)/ecash/[id]/+layout.svelte
+++ /dev/null
@@ -1,53 +0,0 @@
-<script>
-  import AppHeader from "$comp/AppHeader.svelte";
-  import { getDecodedToken } from "@cashu/cashu-ts";
-  import { copy, sats, f, s } from "$lib/utils";
-  import { t } from "$lib/translations";
-  import Icon from "$comp/Icon.svelte";
-
-  export let data;
-
-  let { id, rates, user, token, total, spent, external, mint } = data;
-  let currency = user?.currency || "USD";
-  let rate = rates[currency];
-
-  let amount = total - spent;
-
-  $: amountFiat = parseFloat(((amount * rate) / sats).toFixed(2));
-  $: spentFiat = parseFloat(((spent * rate) / sats).toFixed(2));
-</script>
-
-<div class="container px-4 max-w-lg mx-auto space-y-5 mt-20">
-  <h1 class="px-3 md:px-0 text-center text-3xl md:text-4xl font-semibold">
-    {$t("payments.ecash")}
-  </h1>
-
-  {#if amount > 0}
-    <div class="text-center font-bold text-2xl">
-      <div>
-        {f(amountFiat, currency)}
-      </div>
-      <div>
-        <span class="text-secondary font-normal text-xl"
-          >⚡️{`${s(amount)}`}</span
-        >
-      </div>
-    </div>
-  {/if}
-
-  {#if spent > 0}
-    <div class="text-center font-bold text-2xl">
-      <div>
-        {f(spentFiat, currency)}
-        <span class=" text-red-600">{$t("payments.spent")}</span>
-      </div>
-      <div>
-        <span class="text-secondary font-normal text-xl"
-          >⚡️{`${s(spent)}`}</span
-        >
-      </div>
-    </div>
-  {/if}
-
-  <slot />
-</div>
diff --git a/src/routes/(app)/ecash/[id]/+page.server.ts b/src/routes/(app)/ecash/[id]/+page.server.ts
deleted file mode 100644
index 0ed2d1c4..00000000
--- a/src/routes/(app)/ecash/[id]/+page.server.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { fail, redirect } from "@sveltejs/kit";
-import { auth, fd, post } from "$lib/utils";
-
-export const actions = {
-  default: async ({ cookies, request, url }) => {
-    if (!cookies.get("username"))
-      redirect(307, `/register?redirect=${url.pathname}`);
-
-    let { token } = await fd(request);
-    let claimed;
-    try {
-      claimed = await post(`/claim`, { token }, auth(cookies));
-      claimed = { ok: true };
-    } catch (e: any) {
-      return fail(400, { error: e.message });
-    }
-    if (claimed?.ok) {
-      redirect(307, `/${cookies.get("username")}/payments`);
-    }
-  },
-};
diff --git a/src/routes/(app)/ecash/[id]/+page.svelte b/src/routes/(app)/ecash/[id]/+page.svelte
deleted file mode 100644
index 375f168a..00000000
--- a/src/routes/(app)/ecash/[id]/+page.svelte
+++ /dev/null
@@ -1,64 +0,0 @@
-<script>
-  import { enhance } from "$app/forms";
-  import { copy, sats, f, s } from "$lib/utils";
-  import { t } from "$lib/translations";
-  import Icon from "$comp/Icon.svelte";
-  import { page } from "$app/stores";
-
-  export let data;
-  export let form;
-
-  let link = $page.url.href;
-      let { id, total, token, external, spent } = data;
-</script>
-
-{#if form?.error}
-  <div class="mb-5">
-    <div class="text-red-600">
-      {form.error === "default" ? $t("error.unrecognizedInput") : form.error}
-    </div>
-  </div>
-{/if}
-
-<div class="flex flex-wrap gap-2 text-xl">
-  <button
-    type="button"
-    class="flex border rounded-2xl px-6 py-5 font-bold hover:opacity-80 w-full justify-center gap-2"
-    on:click={() => copy(link)}
-  >
-    <Icon icon="link" style="w-8 my-auto" />
-    <div class="my-auto">{$t("payments.copyLink")}</div>
-  </button>
-
-  {#if spent < total}
-    {#if external}
-      <a href={`/ecash/${id}/swap`} class="contents">
-        <button
-          type="submit"
-          class="flex border rounded-2xl px-6 py-5 font-bold hover:opacity-80 w-full justify-center gap-2"
-        >
-          <Icon icon="receive" style="w-8 my-auto" />
-          <div class="my-auto">{$t("payments.swap")}</div>
-        </button>
-      </a>
-    {:else}
-      <form method="POST" use:enhance class="w-full">
-        <input type="hidden" name="token" bind:value={token} />
-        <button
-          type="submit"
-          class="flex border rounded-2xl px-6 py-5 font-bold hover:opacity-80 w-full justify-center gap-2"
-        >
-          <Icon icon="receive" style="w-8 my-auto" />
-          <div class="my-auto">{$t("payments.redeem")}</div>
-        </button>
-      </form>
-    {/if}
-  {/if}
-
-  <button
-    class="border rounded-2xl px-6 py-5 w-full break-all text-xl hover:bg-slate-100"
-    on:click={() => copy(token)}
-  >
-    {token}
-  </button>
-</div>
diff --git a/src/routes/(app)/ecash/[id]/[...version]/+layout.server.ts b/src/routes/(app)/ecash/[id]/[...version]/+layout.server.ts
new file mode 100644
index 00000000..df8a6f83
--- /dev/null
+++ b/src/routes/(app)/ecash/[id]/[...version]/+layout.server.ts
@@ -0,0 +1,11 @@
+import { get } from "$lib/utils";
+
+export async function load({ params }) {
+  let { id, version } = params;
+  version ||= 4;
+  version = parseInt(version);
+
+  let { token, status } = await get(`/cash/${id}/${version}`);
+  let { spent, total, mint, external } = status;
+  return { id, token, spent, total, mint, external, version };
+}
diff --git a/src/routes/(app)/ecash/[id]/[...version]/+layout.svelte b/src/routes/(app)/ecash/[id]/[...version]/+layout.svelte
new file mode 100644
index 00000000..0aa1c405
--- /dev/null
+++ b/src/routes/(app)/ecash/[id]/[...version]/+layout.svelte
@@ -0,0 +1,52 @@
+<script>
+  import AppHeader from "$comp/AppHeader.svelte";
+  import { copy, sats, f, s } from "$lib/utils";
+  import { t } from "$lib/translations";
+  import Icon from "$comp/Icon.svelte";
+
+  export let data;
+
+  let { id, rates, user, token, total, spent, external, mint } = data;
+  let currency = user?.currency || "USD";
+  let rate = rates[currency];
+
+  let amount = total - spent;
+
+  $: amountFiat = parseFloat(((amount * rate) / sats).toFixed(2));
+  $: spentFiat = parseFloat(((spent * rate) / sats).toFixed(2));
+</script>
+
+<div class="container px-4 max-w-lg mx-auto space-y-5 mt-20">
+  <h1 class="px-3 md:px-0 text-center text-3xl md:text-4xl font-semibold">
+    {$t("payments.ecash")}
+  </h1>
+
+  {#if amount > 0}
+    <div class="text-center font-bold text-2xl">
+      <div>
+        {f(amountFiat, currency)}
+      </div>
+      <div>
+        <span class="text-secondary font-normal text-xl"
+          >⚡️{`${s(amount)}`}</span
+        >
+      </div>
+    </div>
+  {/if}
+
+  {#if spent > 0}
+    <div class="text-center font-bold text-2xl">
+      <div>
+        {f(spentFiat, currency)}
+        <span class=" text-red-600">{$t("payments.spent")}</span>
+      </div>
+      <div>
+        <span class="text-secondary font-normal text-xl"
+          >⚡️{`${s(spent)}`}</span
+        >
+      </div>
+    </div>
+  {/if}
+
+  <slot />
+</div>
diff --git a/src/routes/(app)/ecash/[id]/[...version]/+page.server.ts b/src/routes/(app)/ecash/[id]/[...version]/+page.server.ts
new file mode 100644
index 00000000..0ed2d1c4
--- /dev/null
+++ b/src/routes/(app)/ecash/[id]/[...version]/+page.server.ts
@@ -0,0 +1,21 @@
+import { fail, redirect } from "@sveltejs/kit";
+import { auth, fd, post } from "$lib/utils";
+
+export const actions = {
+  default: async ({ cookies, request, url }) => {
+    if (!cookies.get("username"))
+      redirect(307, `/register?redirect=${url.pathname}`);
+
+    let { token } = await fd(request);
+    let claimed;
+    try {
+      claimed = await post(`/claim`, { token }, auth(cookies));
+      claimed = { ok: true };
+    } catch (e: any) {
+      return fail(400, { error: e.message });
+    }
+    if (claimed?.ok) {
+      redirect(307, `/${cookies.get("username")}/payments`);
+    }
+  },
+};
diff --git a/src/routes/(app)/ecash/[id]/[...version]/+page.svelte b/src/routes/(app)/ecash/[id]/[...version]/+page.svelte
new file mode 100644
index 00000000..db238216
--- /dev/null
+++ b/src/routes/(app)/ecash/[id]/[...version]/+page.svelte
@@ -0,0 +1,86 @@
+<script>
+  import { enhance } from "$app/forms";
+  import { copy, sats, f, s } from "$lib/utils";
+  import { t } from "$lib/translations";
+  import Icon from "$comp/Icon.svelte";
+  import { page } from "$app/stores";
+
+  export let data;
+  export let form;
+
+  let link = $page.url.href;
+  let { id, total, version, token, external, spent } = data;
+</script>
+
+{#if form?.error}
+  <div class="mb-5">
+    <div class="text-red-600">
+      {form.error === "default" ? $t("error.unrecognizedInput") : form.error}
+    </div>
+  </div>
+{/if}
+
+<div class="flex flex-wrap gap-2 text-xl">
+  <button
+    type="button"
+    class="flex border rounded-2xl px-6 py-5 font-bold hover:opacity-80 w-full justify-center gap-2"
+    on:click={() => copy(link)}
+  >
+    <Icon icon="link" style="w-8 my-auto" />
+    <div class="my-auto">{$t("payments.copyLink")}</div>
+  </button>
+
+  {#if spent < total}
+    {#if external}
+      <a href={`/ecash/${id}/swap`} class="contents">
+        <button
+          type="submit"
+          class="flex border rounded-2xl px-6 py-5 font-bold hover:opacity-80 w-full justify-center gap-2"
+        >
+          <Icon icon="receive" style="w-8 my-auto" />
+          <div class="my-auto">{$t("payments.swap")}</div>
+        </button>
+      </a>
+    {:else}
+      <form method="POST" use:enhance class="w-full">
+        <input type="hidden" name="token" bind:value={token} />
+        <button
+          type="submit"
+          class="flex border rounded-2xl px-6 py-5 font-bold hover:opacity-80 w-full justify-center gap-2"
+        >
+          <Icon icon="receive" style="w-8 my-auto" />
+          <div class="my-auto">{$t("payments.redeem")}</div>
+        </button>
+      </form>
+    {/if}
+  {/if}
+
+  <button
+    class="border rounded-2xl px-6 py-5 w-full break-all text-xl hover:bg-slate-100"
+    on:click={() => copy(token)}
+  >
+    {token}
+  </button>
+
+  {#if version === 4}
+    <a data-sveltekit-reload href={`/ecash/${id}/3`} class="contents">
+      <button
+        type="button"
+        class="flex border rounded-2xl px-6 py-5 font-bold hover:opacity-80 w-full justify-center gap-2"
+      >
+        <Icon icon="settings" style="w-8 my-auto" />
+        <div class="my-auto">{$t("payments.legacyVersion")}</div>
+      </button>
+    </a>
+  {:else}
+    <a data-sveltekit-reload href={`/ecash/${id}`} class="contents">
+      <button
+        type="button"
+        class="flex border rounded-2xl px-6 py-5 font-bold hover:opacity-80 w-full justify-center gap-2"
+      >
+        <Icon icon="settings" style="w-8 my-auto" />
+        <div class="my-auto">{$t("payments.newVersion")}</div>
+      </button>
+    </a>
+  {/if}
+</div>
diff --git a/src/routes/(app)/ecash/[id]/[...version]/swap/+page.server.ts b/src/routes/(app)/ecash/[id]/[...version]/swap/+page.server.ts
new file mode 100644
index 00000000..c8806bf0
--- /dev/null
+++ b/src/routes/(app)/ecash/[id]/[...version]/swap/+page.server.ts
@@ -0,0 +1,3 @@
+  export async function load() {
+  return { test: 123 };
+}
diff --git a/src/routes/(app)/ecash/[id]/[...version]/swap/+page.svelte b/src/routes/(app)/ecash/[id]/[...version]/swap/+page.svelte
new file mode 100644
index 00000000..3df9504d
--- /dev/null
+++ b/src/routes/(app)/ecash/[id]/[...version]/swap/+page.svelte
@@ -0,0 +1,5 @@
+<script>
+  export let data;
+</script>
+
+<div class="text-center">Support for swapping in cash from other mints is coming soon</div>
diff --git a/src/routes/(app)/ecash/[id]/swap/+page.server.ts b/src/routes/(app)/ecash/[id]/swap/+page.server.ts
deleted file mode 100644
index c8806bf0..00000000
--- a/src/routes/(app)/ecash/[id]/swap/+page.server.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-  export async function load() {
-  return { test: 123 };
-}
diff --git a/src/routes/(app)/ecash/[id]/swap/+page.svelte b/src/routes/(app)/ecash/[id]/swap/+page.svelte
deleted file mode 100644
index 3df9504d..00000000
--- a/src/routes/(app)/ecash/[id]/swap/+page.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-  export let data;
-</script>
-
-<div class="text-center">Support for swapping in cash from other mints is coming soon</div>
-- 
cgit v1.2.3