Add the ability to login with an extension

block-core · Sep 14, 2024 · 2b70059 · 2b70059
1 parent ad3b7c9
commit 2b70059
Show file tree

Hide file tree

Showing 5 changed files with 54 additions and 20 deletions.
diff --git a/src/app/components/auth/login/login.component.html b/src/app/components/auth/login/login.component.html
@@ -38,13 +38,13 @@
                 </div>
                 <mat-form-field class="w-full">
                     <mat-label>Secret Key</mat-label>
-                    <input matInput formControlName="secretKey" />
+                    <input matInput formControlName="secretKey" autocomplete="secretKey" />
                 </mat-form-field>
 
                 <!-- Password field -->
                 <mat-form-field class="w-full">
                     <mat-label>Password</mat-label>
-                    <input id="password" matInput type="password" [formControlName]="'password'" #secretPasswordField />
+                    <input matInput type="password" [formControlName]="'password'" autocomplete="current-password-seckey" #secretPasswordField />
                     <button mat-icon-button type="button" (click)="
                 secretPasswordField.type === 'password'
                     ? (secretPasswordField.type = 'text')
@@ -80,13 +80,13 @@
                 <!-- Menemonic field -->
                 <mat-form-field class="w-full">
                     <mat-label>Menemonic</mat-label>
-                    <input matInput formControlName="menemonic" />
+                    <input matInput formControlName="menemonic" autocomplete="menemonic" />
                 </mat-form-field>
 
                 <!-- Password field -->
                 <mat-form-field class="w-full">
                     <mat-label>Password</mat-label>
-                    <input id="password" matInput type="password" [formControlName]="'password'"
+                    <input matInput type="password" [formControlName]="'password'" autocomplete="current-password-menemonic"
                         #menemonicPasswordField />
                     <button mat-icon-button type="button" (click)="
                 menemonicPasswordField.type === 'password'
@@ -120,9 +120,9 @@
                     <div class="mt-px flex-auto border-t"></div>
                 </div>
 
-                <!-- Single sign-on buttons -->
+                <!-- extension login buttons -->
                 <div class="mt-8 flex items-center space-x-4">
-                    <button class="flex-auto" type="button" mat-stroked-button>
+                    <button class="flex-auto" type="button" mat-stroked-button (click)="loginWithNostrExtension()">
                         <mat-icon class="icon-size-5" [svgIcon]="'feather:zap'"></mat-icon>
                     </button>
                 </div>

diff --git a/src/app/components/auth/login/login.component.ts b/src/app/components/auth/login/login.component.ts
@@ -36,7 +36,10 @@ export class LoginComponent implements OnInit {
     showAlert = false;
     loading = false;
     isInstalledExtension = false;
-
+    privateKey: Uint8Array = new Uint8Array();
+    publicKey: string = "";
+    npub: string = "";
+    nsec: string = "";
     constructor(
         private _formBuilder: FormBuilder,
         private _router: Router,
@@ -113,4 +116,14 @@ export class LoginComponent implements OnInit {
             this.showAlert = true;
         }
     }
+
+    async loginWithNostrExtension(): Promise<void> {
+        const success = await this._signerService.handleLoginWithExtension();
+        if (success) {
+            this._router.navigateByUrl('/home');
+        } else {
+            console.error('Failed to log in using Nostr extension');
+        }
+    }
+
 }
diff --git a/src/app/components/auth/logout/logout.component.ts b/src/app/components/auth/logout/logout.component.ts
@@ -33,7 +33,7 @@ export class LogoutComponent implements OnInit, OnDestroy {
      * On init
      */
     ngOnInit(): void {
-        // Sign out
+        // Logout
 
         // Redirect after the countdown
         timer(1000, 1000)

diff --git a/src/app/core/auth/auth.guard.ts b/src/app/core/auth/auth.guard.ts
@@ -7,7 +7,7 @@ export const authGuard = () => {
   const signerService = inject(SignerService);
   const router = inject(Router);
 
-  if (signerService.getSecretKey() !== "") {
+  if (signerService.getPublicKey() !== "") {
     return true;
   }
 

diff --git a/src/app/services/signer.service.ts b/src/app/services/signer.service.ts
@@ -183,14 +183,31 @@ export class SignerService {
         localStorage.setItem("following", newFollowingList);
     }
 
-    savePublicKeyToSession(publicKey: string) {
-        localStorage.setItem(this.localStoragePublicKeyName, publicKey);
+
+
+     savePublicKeyToSession(publicKey: string): void {
+        const npub = nip19.npubEncode(publicKey);
+        window.localStorage.setItem(this.localStoragePublicKeyName, publicKey);
+        window.localStorage.setItem('npub', npub);
+    }
+
+     getNpub(): string {
+        return window.localStorage.getItem('npub') || '';
+    }
+
+    removePublicKeyToSession() {
+        localStorage.removeItem(this.localStoragePublicKeyName);
     }
 
+
     saveSecretKeyToSession(secretKey: string) {
         localStorage.setItem(this.localStorageSecretKeyName, secretKey);
     }
 
+    removeSecretKeyToSession() {
+        localStorage.removeItem(this.localStorageSecretKeyName);
+    }
+
     setPublicKeyFromExtension(publicKey: string) {
         this.savePublicKeyToSession(publicKey);
     }
@@ -247,19 +264,23 @@ export class SignerService {
     }
 
     async handleLoginWithExtension(): Promise<boolean> {
-        const gt = globalThis as any;
-        if (gt.nostr) {
-            const pubkey = await gt.nostr.getPublicKey().catch((e) => {
-                console.log(e);
-                return "";
-            });
-            if (pubkey === "") {
-                return false;
+        const globalContext = globalThis as unknown as { nostr?: { getPublicKey?: Function } };
+        if (!globalContext.nostr) {
+            return false;
+        }
+
+        try {
+            const pubkey = await globalContext.nostr.getPublicKey();
+            if (!pubkey) {
+                throw new Error("Public key not available from Nostr extension.");
             }
+
             this.setPublicKeyFromExtension(pubkey);
             return true;
+        } catch (error) {
+            console.error('Failed to connect to Nostr extension:', error);
+            return false;
         }
-        return false;
     }
 
     async signEventWithExtension(unsignedEvent: UnsignedEvent): Promise<Event> {