Get the login working.

src/lib/components/Login.svelte

@@ -11,6 +11,7 @@
   let npub = $state<string | undefined >(undefined);
 
   let signInFailed = $state<boolean>(false);
+  let errorMessage = $state<string>('');
 
   $effect(() => {
     if ($ndkSignedIn) {
@@ -26,6 +27,9 @@
 
   async function handleSignInClick() {
     try {
+      signInFailed = false;
+      errorMessage = '';
+      
       const user = await loginWithExtension();
       if (!user) {
         throw new Error('The NIP-07 extension did not return a user.');
@@ -36,7 +40,7 @@
     } catch (e) {
       console.error(e);
       signInFailed = true;
-      // TODO: Show an error message to the user.
+      errorMessage = e instanceof Error ? e.message : 'Failed to sign in. Please try again.';
     }
   }
 
@@ -52,12 +56,17 @@
       placement='bottom'
       triggeredBy='#avatar'
     >
-      <div class='w-full flex space-x-2'>
+      <div class='w-full flex flex-col space-y-2'>
         <Button
           onclick={handleSignInClick}
         >
           Extension Sign-In
         </Button>
+        {#if signInFailed}
+          <div class="p-2 text-sm text-red-600 bg-red-100 rounded">
+            {errorMessage}
+          </div>
+        {/if}
         <!-- <Button
           color='alternative'
           on:click={signInWithBunker}

src/lib/components/LoginModal.svelte

@@ -1,9 +1,20 @@
 <script lang="ts">
   import { Button } from "flowbite-svelte";
   import Login from './Login.svelte';
+  import { ndkSignedIn } from '$lib/ndk';
   
-  export let show = false;
+  const { show = false, onClose = () => {}, onLoginSuccess = () => {} } = $props<{
-  export let onClose = () => {};
+    show?: boolean;
+    onClose?: (event: MouseEvent) => void;
+    onLoginSuccess?: () => void;
+  }>();
+
+  $effect(() => {
+    if ($ndkSignedIn && show) {
+      onLoginSuccess();
+      onClose(new MouseEvent('click'));
+    }
+  });
 </script>
 
 {#if show}
@@ -15,7 +26,7 @@
           <h3 class="text-xl font-medium text-gray-900">Login Required</h3>
           <button 
             class="ml-auto bg-transparent border-0 text-gray-400 float-right text-3xl leading-none font-semibold outline-none focus:outline-none"
-            on:click={onClose}
+            onclick={onClose}
           >
             <span class="bg-transparent text-gray-500 h-6 w-6 text-2xl block outline-none focus:outline-none">×</span>
           </button>

src/routes/contact/+page.svelte

@@ -349,7 +349,15 @@
 <!-- Login Modal -->
 <LoginModal 
   show={showLoginModal} 
-  onClose={() => showLoginModal = false} 
+  onClose={() => showLoginModal = false}
+  onLoginSuccess={() => {
+    // Restore saved form data
+    if (savedFormData.subject) subject = savedFormData.subject;
+    if (savedFormData.content) content = savedFormData.content;
+    
+    // Submit the issue
+    submitIssue();
+  }}
 />
 
 <style>