Browse Source

Get the login working.

master
Silberengel 11 months ago
parent
commit
fdc45858d0
  1. 13
      src/lib/components/Login.svelte
  2. 17
      src/lib/components/LoginModal.svelte
  3. 10
      src/routes/contact/+page.svelte

13
src/lib/components/Login.svelte

@ -11,6 +11,7 @@ @@ -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 @@ @@ -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 @@ @@ -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 @@ @@ -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}

17
src/lib/components/LoginModal.svelte

@ -1,9 +1,20 @@ @@ -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;
export let onClose = () => {};
const { show = false, onClose = () => {}, onLoginSuccess = () => {} } = $props<{
show?: boolean;
onClose?: (event: MouseEvent) => void;
onLoginSuccess?: () => void;
}>();
$effect(() => {
if ($ndkSignedIn && show) {
onLoginSuccess();
onClose(new MouseEvent('click'));
}
});
</script>
{#if show}
@ -15,7 +26,7 @@ @@ -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>

10
src/routes/contact/+page.svelte

@ -349,7 +349,15 @@ @@ -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>

Loading…
Cancel
Save