submit postmessage after form submission

3 files changed, 31 insertions, 19 deletions

diff --git a/src/components/AppForm.svelte b/src/components/AppForm.svelte
index ffdd3d26..5cef0d1e 100644
--- a/src/components/AppForm.svelte
+++ b/src/components/AppForm.svelte
@@ -1,4 +1,7 @@
 <script>
+  import { browser } from "$app/environment";
+  import { applyAction, deserialize } from "$app/forms";
+  import { page } from "$app/stores";
   import Numpad from "$comp/Numpad.svelte";
   import { getPublicKey } from "nostr-tools";
   import { onMount, tick } from "svelte";
@@ -7,6 +10,11 @@
   import { copy, focus, fail, post } from "$lib/utils";
   import { t } from "$lib/translations";
   import { enhance } from "$app/forms";
+  import {
+    PUBLIC_COINOS_PUBKEY as walletPubkey,
+    PUBLIC_COINOS_RELAY as relayUrl,
+  } from "$env/static/public";
+
   let { rate, user, name, max_amount, budget_renewal, pubkey, secret } =
     $props();
   let { currency } = $derived(user);
@@ -21,6 +29,27 @@
     pubkey = getPublicKey(secret);
   };
 
+  let lud16 = $derived(`${user.username}@${$page.url.host}`);
+
+  let el = $state();
+  let submit = async (e) => {
+    e.preventDefault();
+    let body = new FormData(el);
+    let params = { method: "POST", body };
+    let url = $page.url.pathname;
+
+    const response = await fetch(url, params);
+    const result = deserialize(await response.text());
+
+    if (result.type === "redirect") {
+      let type = "nwc:success";
+      let msg = { relayUrl, lud16, walletPubkey, type };
+      if (browser && window.opener) window.opener.postMessage(msg, "*");
+    }
+
+    applyAction(result);
+  };
+
   let del = async () => {
     try {
       await post(`/post/apps/delete`, { pubkey });
@@ -43,7 +72,7 @@
   let numpad = $state();
 </script>
 
-<form use:enhance method="POST" class="space-y-5">
+<form method="POST" class="space-y-5" onsubmit={submit} bind:this={el}>
   <div>
     <label for="name" class="font-bold mb-1 block">{$t("accounts.name")}</label>
     <input type="text" name="name" bind:value={name} use:focus />
diff --git a/src/routes/(app)/apps/new/+page.server.ts b/src/routes/(app)/apps/new/+page.server.ts
index 3fe18128..d8cd4e0f 100644
--- a/src/routes/(app)/apps/new/+page.server.ts
+++ b/src/routes/(app)/apps/new/+page.server.ts
@@ -8,7 +8,7 @@ export const load = async ({ parent, url }) => {
 	if (!user)
 		redirect(
 			307,
-			`/register?redirect=${encodeURIComponent(url.pathname + url.search)}`,
+			`/login?redirect=${encodeURIComponent(url.pathname + url.search)}`,
 		);
 
 	const app = {
diff --git a/src/routes/(app)/apps/new/+page.svelte b/src/routes/(app)/apps/new/+page.svelte
index cd710cfb..194840a8 100644
--- a/src/routes/(app)/apps/new/+page.svelte
+++ b/src/routes/(app)/apps/new/+page.svelte
@@ -1,26 +1,9 @@
 <script>
-  import { page } from "$app/stores";
-  import { onMount } from "svelte";
-  import { browser } from "$app/environment";
   import { t } from "$lib/translations";
   import AppForm from "$comp/AppForm.svelte";
-  import { untrack } from "svelte";
-  import {
-    PUBLIC_COINOS_PUBKEY as walletPubkey,
-    PUBLIC_COINOS_RELAY as relayUrl,
-  } from "$env/static/public";
 
   let { data, form } = $props();
   let { app, rate, user } = $derived(data);
-  let lud16 = $derived(`${user.username}@${$page.url.host}`);
-
-  onMount(() => {
-    if (browser) {
-      if (window.opener) {
-        window.opener.postMessage({ relayUrl, lud16, walletPubkey }, "*");
-      }
-    }
-  });
 </script>
 
 <div class="container px-4 max-w-lg mx-auto space-y-5 mt-20">