feat: handle logout events in nostr-login

This commit introduces handling for logout events in nostr-login across various pages. When a user logs out, the current public key and other related information are reset to null. The nostrLogin.js file has also been updated to dispatch a 'nostrLoggedOut' event when this occurs. Additionally, the nostr-login package has been added to the project dependencies.

resources/js/nostrLogin.js

@@ -1,29 +1,48 @@
+import {init as initNostrLogin} from 'nostr-login';
+
 export default () => ({
 
     openNostrLogin() {
         window.nostr.getPublicKey();
     },
 
-    init() {
-        // listen for nostr auth events
-        document.addEventListener('nlAuth', (e) => {
-            // type is login, signup or logout
-            if (e.detail.type === 'login' || e.detail.type === 'signup') {
-                console.log('User logged in');
+    async init() {
+        await initNostrLogin({
+            methods: ['connect', 'extension'],
+            onAuth: async (npub, options) => {
+                console.log('User logged in', npub, options);
+                console.log('type', options.method);
+                if (options.method === 'readOnly') {
+                    console.log('User logged in as read-only');
+                    return;
+                }
+                if (options.method === undefined) {
+                    Alpine.store('nostr', {user: null});
+                    this.$dispatch('nostrLoggedOut', {});
+                    return;
+                }
+                const pubkey = await window.nostr.getPublicKey();
                 // fetch profile from /api/nostr/profile/{publicKey}
-                fetch('/api/nostr/profile/' + e.detail.pubkey)
+                fetch('/api/nostr/profile/' + pubkey)
                     .then(response => response.json())
                     .then(data => {
                         console.log('Profile fetched', data);
                         // store the profile in AlpineJS store
-                        Alpine.store('nostr', { user: data });
+                        Alpine.store('nostr', {user: data});
                         this.$dispatch('nostrLoggedIn', {pubkey: data.pubkey});
+                        document.addEventListener('nlAuth', (e) => {
+                            // type is login, signup or logout
+                            if (e.detail.type === 'login' || e.detail.type === 'signup') {
+
+                            } else {
+                                console.log('User logged out')
+                                Alpine.store('nostr', {user: null});
+                                this.$dispatch('nostrLoggedOut', {});
+                            }
+                        })
                     });
-            } else {
-                console.log('User logged out')
-                Alpine.store('nostr', { user: null });
             }
-        })
+        });
     },
 
 });

resources/views/components/layouts/app.blade.php

@@ -9,8 +9,6 @@
     @vite(['resources/js/app.js','resources/css/app.css'])
     @googlefonts
     <script src="https://kit.fontawesome.com/866fd3d0ab.js" crossorigin="anonymous"></script>
-    <script src='https://www.unpkg.com/nostr-login@latest/dist/unpkg.js' data-perms="sign_event:1,sign_event:0"
-            data-theme="default" data-dark-mode="true"></script>
     @wireUiScripts
     @stack('scripts')
 </head>

resources/views/pages/association/election/[Election:year].blade.php

@@ -46,6 +46,14 @@ mount(function () {
     }
 });
 
+on([
+    'nostrLoggedOut' => function () {
+        $this->isAllowed = false;
+        $this->currentPubkey = null;
+        $this->currentPleb = null;
+    },
+]);
+
 on([
     'nostrLoggedIn' => function ($pubkey) {
         $this->currentPubkey = $pubkey;

resources/views/pages/association/election/admin/[Election:year].blade.php

@@ -59,6 +59,13 @@ mount(fn()
     $this->loadBoardVotes(),
 ]);
 
+on([
+    'nostrLoggedOut' => function () {
+        $this->currentPubkey = null;
+        $this->currentPleb = null;
+    },
+]);
+
 on([
     'nostrLoggedIn' => fn($pubkey)
         => [

resources/views/pages/association/election/index.blade.php

@@ -23,6 +23,14 @@ mount(function () {
         ->toArray();
 });
 
+on([
+    'nostrLoggedOut' => function () {
+        $this->isAllowed = false;
+        $this->currentPubkey = null;
+        $this->currentPleb = null;
+    },
+]);
+
 on([
     'nostrLoggedIn' => function ($pubkey) {
         $this->currentPubkey = $pubkey;

resources/views/pages/association/members/admin.blade.php

@@ -17,6 +17,13 @@ state(['isAllowed' => false]);
 state(['currentPubkey' => null]);
 state(['members' => []]);
 
+on([
+    'nostrLoggedOut' => function () {
+        $this->isAllowed = false;
+        $this->currentPubkey = null;
+    },
+]);
+
 on([
     'nostrLoggedIn' => function ($pubkey) {
         $this->currentPubkey = $pubkey;
@@ -24,7 +31,7 @@ on([
             ->where('pubkey', $pubkey)->first();
         $allowedPubkeys = [
             '0adf67475ccc5ca456fd3022e46f5d526eb0af6284bf85494c0dd7847f3e5033',
-            '430169631f2f0682c60cebb4f902d68f0c71c498fd1711fd982f052cf1fd4279'
+            '430169631f2f0682c60cebb4f902d68f0c71c498fd1711fd982f052cf1fd4279',
         ];
         if (!in_array($this->currentPubkey, $allowedPubkeys, true)) {
             return redirect()->route('association.profile');

resources/views/pages/association/profile.blade.php

@@ -48,6 +48,20 @@ updated([
     },
 ]);
 
+on([
+    'nostrLoggedOut' => function () {
+    $this->currentPubkey = null;
+    $this->currentPleb = null;
+    $this->yearsPaid = [];
+    $this->events = [];
+    $this->payments = [];
+    $this->invoice = null;
+    $this->qrCode = null;
+    $this->amountToPay = config('app.env') === 'production' ? 21000 : 1;
+    $this->currentYearIsPaid = false;
+    },
+]);
+
 on([
     'nostrLoggedIn' => function ($pubkey) {
         $this->currentPubkey = $pubkey;