nostr sign in

3 files changed, 64 insertions, 12 deletions

diff --git a/src/routes/(static)/login/+page.svelte b/src/routes/(static)/login/+page.svelte
index e64434fb..bfd30fe2 100644
--- a/src/routes/(static)/login/+page.svelte
+++ b/src/routes/(static)/login/+page.svelte
@@ -159,14 +159,14 @@
       >
     </div>
 
-    <button type="submit" class="btn" bind:this={btn}>
+    <button type="submit" class="btn btn-accent" bind:this={btn}>
       {$t("login.signIn")}
     </button>
 
     {#if nostr}
       <button type="button" class="btn" onclick={nostrLogin}>
         <img src="/images/nostr.png" class="w-8" />
-        <div class="my-auto">{$t("user.settings.nostr")}</div>
+        <div class="my-auto">{$t("login.nostr")}</div>
       </button>
     {/if}
 
diff --git a/src/routes/(static)/register/+page.server.ts b/src/routes/(static)/register/+page.server.ts
index 4cff0ed9..b459c622 100644
--- a/src/routes/(static)/register/+page.server.ts
+++ b/src/routes/(static)/register/+page.server.ts
@@ -1,4 +1,4 @@
-import { fd, login, post } from "$lib/utils";
+import { get, fd, login, post } from "$lib/utils";
 import { fail, redirect } from "@sveltejs/kit";
 
 export const load = async ({ parent }) => {
@@ -6,8 +6,9 @@ export const load = async ({ parent }) => {
 	if (user) redirect(307, `/${user.username}`);
 
 	const index = Math.floor(Math.random() * 64) + 1;
+	const { id } = await get("/challenge");
 
-	return { index };
+	return { index, id };
 };
 
 export const actions = {
@@ -23,17 +24,13 @@ export const actions = {
 		if (loginRedirect === "undefined") loginRedirect = undefined;
 
 		try {
-			console.log("ST", Date.now());
 			await post("/register", { user }, { "cf-connecting-ip": ip });
-			console.log("END", Date.now());
 		} catch (e) {
 			({ message: error } = e as Error);
 		}
 
 		try {
-			console.log("ST", Date.now());
 			await login(user, cookies, ip);
-			console.log("END", Date.now());
 			error = null;
 		} catch (e) {
 			const { message } = e as Error;
diff --git a/src/routes/(static)/register/+page.svelte b/src/routes/(static)/register/+page.svelte
index 4a4a3c57..8738e32b 100644
--- a/src/routes/(static)/register/+page.svelte
+++ b/src/routes/(static)/register/+page.svelte
@@ -1,4 +1,6 @@
 <script>
+  import { browser } from "$app/environment";
+  import { onMount } from "svelte";
   import punks from "$lib/punks";
   import { upload } from "$lib/upload";
   import { afterNavigate, invalidateAll } from "$app/navigation";
@@ -24,6 +26,12 @@
   } from "unique-names-generator";
 
   let { form = $bindable(), data } = $props();
+  let nostr = $state();
+  let { id } = $derived(data);
+
+  onMount(() => {
+    if (browser && window.nostr) nostr = true;
+  });
 
   let username = $state();
   let { index } = $state(data);
@@ -153,6 +161,43 @@
   $effect(() => {
     token && token?.length === 6 && tick().then(() => btn.click());
   });
+
+  let nostrLogin = async () => {
+    let pubkey = await window.nostr.getPublicKey();
+    const formData = new FormData();
+
+    let ev = {
+      kind: 1,
+      pubkey,
+      created_at: Date.now(),
+      content: id,
+      tags: [],
+    };
+
+    try {
+      let signedEvent = await window.nostr.signEvent(ev);
+
+      formData.append("loginRedirect", redirect);
+      formData.append("token", token);
+      formData.append("event", JSON.stringify(signedEvent));
+      formData.append("id", id);
+
+      let response = await fetch("/login?/nostr", {
+        method: "POST",
+        body: formData,
+      });
+
+      const result = deserialize(await response.text());
+
+      if (result.type === "success") {
+        await invalidateAll();
+      }
+
+      applyAction(result);
+    } catch (e) {
+      fail(e.message);
+    }
+  };
 </script>
 
 {#if need2fa}
@@ -176,7 +221,8 @@
       onclick={decr}
       aria-label="Previous"
     >
-      <iconify-icon noobserver icon="ph:caret-left-bold" width="32"></iconify-icon>
+      <iconify-icon noobserver icon="ph:caret-left-bold" width="32"
+      ></iconify-icon>
     </button>
     <button class="block relative w-32 mx-auto" onclick={selectAvatar}>
       <div
@@ -191,7 +237,8 @@
       <div
         class="absolute bg-base-100 rounded-full p-2 mx-auto right-0 bottom-0 z-10 w-12"
       >
-        <iconify-icon noobserver icon="ph:upload-simple-bold" width="24"></iconify-icon>
+        <iconify-icon noobserver icon="ph:upload-simple-bold" width="24"
+        ></iconify-icon>
       </div>
     </button>
     <button
@@ -199,7 +246,8 @@
       onclick={incr}
       aria-label="Next"
     >
-      <iconify-icon noobserver icon="ph:caret-right-bold" width="32"></iconify-icon>
+      <iconify-icon noobserver icon="ph:caret-right-bold" width="32"
+      ></iconify-icon>
     </button>
   </div>
 
@@ -250,7 +298,7 @@
       bind:show={revealPassword}
     />
 
-    <button type="submit" class="btn" disabled={loading} bind:this={btn}>
+    <button type="submit" class="btn btn-accent" disabled={loading} bind:this={btn}>
       {#if loading}
         <Spinner />
       {:else}
@@ -258,6 +306,13 @@
       {/if}
     </button>
 
+    {#if nostr}
+      <button type="button" class="btn" onclick={nostrLogin}>
+        <img src="/images/nostr.png" class="w-8" />
+        <div class="my-auto">{$t("login.nostr")}</div>
+      </button>
+    {/if}
+
     <p class="text-secondary text-center font-medium">
       {$t("login.haveAccount")}
       <a