Add a link to view badge and display profile header on badges

src/app/badge/badge.ts

@@ -8,6 +8,7 @@ import { BadgeService } from '../services/badge';
 import { NavigationService } from '../services/navigation';
 import { RelayService } from '../services/relay';
 import { Utilities } from '../services/utilities';
+import { Subscription } from 'rxjs';
 
 @Component({
   selector: 'app-badge',
@@ -18,6 +19,7 @@ export class BadgeComponent implements OnInit {
   showIssuing: boolean = false;
   sub: any;
   pubkeys: string = '';
+  subscriptions: Subscription[] = [];
 
   constructor(
     private snackBar: MatSnackBar,
@@ -32,6 +34,7 @@ export class BadgeComponent implements OnInit {
 
   ngOnDestroy() {
     this.relayService.unsubscribe(this.sub.id);
+    this.utilities.unsubscribe(this.subscriptions);
   }
 
   edit(badge: any) {
@@ -74,47 +77,49 @@ export class BadgeComponent implements OnInit {
     this.appState.updateTitle('Badge');
     this.appState.showBackButton = true;
 
-    this.activatedRoute.paramMap.subscribe(async (params) => {
+    this.subscriptions.push(
-      const id: string | null = params.get('id');
+      this.activatedRoute.paramMap.subscribe(async (params) => {
+        const id: string | null = params.get('id');
 
-      if (!id) {
+        if (!id) {
-        this.router.navigateByUrl('/');
+          this.router.navigateByUrl('/');
-        return;
+          return;
-      }
+        }
 
-      if (id.startsWith('naddr')) {
+        if (id.startsWith('naddr')) {
-        const result = nip19.decode(id);
+          const result = nip19.decode(id);
-        console.log(result);
+          console.log(result);
 
-        if (result.type == 'naddr') {
+          if (result.type == 'naddr') {
-          const data = result.data as AddressPointer;
+            const data = result.data as AddressPointer;
 
-          if (data.kind == 30009) {
+            if (data.kind == 30009) {
-            this.router.navigate(['/b', data.pubkey, data.identifier]);
+              this.router.navigate(['/b', data.pubkey, data.identifier]);
-            return;
+              return;
+            }
           }
         }
-      }
 
-      const pubkey = id;
+        const pubkey = id;
-      const identifier = params.get('slug');
+        const identifier = params.get('slug');
 
-      if (!identifier) {
+        if (!identifier) {
-        return;
+          return;
-      }
+        }
 
-      console.log('pubkey', pubkey);
+        console.log('pubkey', pubkey);
-      console.log('identifier', identifier);
+        console.log('identifier', identifier);
 
-      this.sub = this.relayService.download([{ kinds: [30009], authors: [pubkey], ['#d']: [identifier] }], undefined, 'Replaceable');
+        this.sub = this.relayService.download([{ kinds: [30009], authors: [pubkey], ['#d']: [identifier] }], undefined, 'Replaceable');
-      //   this.queueService.enque(this.appState.getPublicKey(), 'BadgeDefinition');
+        //   this.queueService.enque(this.appState.getPublicKey(), 'BadgeDefinition');
 
-      //   // Only trigger the event event ID if it's different than the navigation ID.
+        //   // Only trigger the event event ID if it's different than the navigation ID.
-      //   if (this.navigation.currentEvent?.id != id) {
+        //   if (this.navigation.currentEvent?.id != id) {
-      //     debugger;
+        //     debugger;
-      //     // this.ui.setEventId(id);
+        //     // this.ui.setEventId(id);
-      //     // this.thread.changeSelectedEvent(id);
+        //     // this.thread.changeSelectedEvent(id);
-      //   }
+        //   }
-    });
+      })
+    );
   }
 }

src/app/badges/badges.html

@@ -14,6 +14,8 @@
     </mat-accordion>
   </div>
 
+  <app-event-header [pubkey]="pubkey"></app-event-header>
+
   <mat-tab-group [selectedIndex]="tabIndex" (selectedTabChange)="onTabChanged($event)">
     <mat-tab>
       <ng-template mat-tab-label>

src/app/badges/badges.ts

@@ -45,9 +45,33 @@ export class BadgesComponent implements OnInit {
       })
     );
 
+    this.subscriptions.push(
+      this.activatedRoute.paramMap.subscribe(async (params) => {
+        const id: string | null = params.get('id');
+
+        debugger;
+
+        if (id) {
+          this.pubkey = id;
+        }
+
+        // this.sub = this.relayService.download([{ kinds: [30009], authors: [pubkey], ['#d']: [identifier] }], undefined, 'Replaceable');
+        //   this.queueService.enque(this.appState.getPublicKey(), 'BadgeDefinition');
+
+        //   // Only trigger the event event ID if it's different than the navigation ID.
+        //   if (this.navigation.currentEvent?.id != id) {
+        //     debugger;
+        //     // this.ui.setEventId(id);
+        //     // this.thread.changeSelectedEvent(id);
+        //   }
+      })
+    );
+
     this.queueService.enque(this.appState.getPublicKey(), 'BadgeDefinition');
   }
 
+  pubkey = '';
+
   ngOnDestroy() {
     this.utilities.unsubscribe(this.subscriptions);
   }

src/app/editor-badges/editor.ts

@@ -85,8 +85,6 @@ export class EditorBadgesComponent {
       })
     );
 
-    debugger;
-
     if (this.badgeService.selectedBadge) {
       this.selectedBadge = this.badgeService.selectedBadge.slug;
       this.changedArticle();

src/app/services/badge.ts

@@ -23,6 +23,10 @@ export class BadgeService {
   }
 
   denormalizeBadge(badge: NostrBadgeDefinition) {
+    if (!badge) {
+      return;
+    }
+
     badge.slug = this.eventService.firstDTag(badge);
     badge.name = this.eventService.lastTagOfType(badge, 'name');
     badge.description = this.eventService.lastTagOfType(badge, 'description');

src/app/shared/profile-actions/profile-actions.html

@@ -126,12 +126,12 @@
 </mat-menu>
 
 <mat-menu #badges="matMenu">
-  <button mat-menu-item>
+  <button mat-menu-item (click)="openBadges(profile!.pubkey)">
     <mat-icon>badge</mat-icon>
     <span>View Badges</span>
   </button>
-  <button mat-menu-item>
+  <!-- <button mat-menu-item>
     <mat-icon>badge</mat-icon>
     <span>Issue Badge to</span>
-  </button>
+  </button> -->
 </mat-menu>

src/app/shared/profile-actions/profile-actions.ts

@@ -11,6 +11,7 @@ import { nip19 } from 'nostr-tools';
 import { EventPointer } from 'nostr-tools/nip19';
 import { UIService } from 'src/app/services/ui';
 import { ApplicationState } from 'src/app/services/applicationstate';
+import { Router } from '@angular/router';
 
 @Component({
   selector: 'app-profile-actions',
@@ -45,7 +46,8 @@ export class ProfileActionsComponent {
     private snackBar: MatSnackBar,
     private profileService: ProfileService,
     private notesService: NotesService,
-    private utilities: Utilities
+    private utilities: Utilities,
+    private router: Router
   ) {}
 
   async saveNote() {
@@ -69,6 +71,10 @@ export class ProfileActionsComponent {
     await this.notesService.deleteNote(this.event.id);
   }
 
+  openBadges(pubkey: string) {
+    this.router.navigate(['/badges', pubkey]);
+  }
+
   async follow(circle?: number) {
     if (circle == null) {
       circle = 0;