Fix publish of profile

src/app/note/note.component.css

@@ -1,17 +1,21 @@
 .thread-event {
-    margin-left: 1em;
-    border-left: 2px solid rgba(255, 255, 255, 0.15);
-    padding-top: 0em;
-    padding-left: 1em;
-  }
-  
-  .thread-content {
-    margin-left: 1em;
-    padding-left: 1em;
-    border-left: 2px solid rgba(255, 255, 255, 0.15) !important;
-    display: block;
-  }
-  
-  .events {
-    padding: 0 !important;
-  }
+  margin-left: 1em;
+  border-left: 2px solid rgba(255, 255, 255, 0.15);
+  padding-top: 0em;
+  padding-left: 1em;
+}
+
+.thread-content {
+  margin-left: 1em;
+  padding-left: 1em;
+  border-left: 2px solid rgba(255, 255, 255, 0.15) !important;
+  display: block;
+}
+
+.no-lines {
+  border-left: 2px solid transparent !important;
+}
+
+.events {
+  padding: 0 !important;
+}

src/app/note/note.component.html

@@ -1,6 +1,19 @@
 <!-- <mat-progress-bar *ngIf="!events || events.length == 0" mode="indeterminate"></mat-progress-bar> -->
 
 <div class="feed-page">
+
+  <mat-accordion class="options">
+    <mat-expansion-panel>
+      <mat-expansion-panel-header>
+        <mat-panel-title>Options</mat-panel-title>
+        <mat-panel-description></mat-panel-description>
+      </mat-expansion-panel-header>
+      <p>
+        <mat-slide-toggle class="options-slider" [(ngModel)]="showLines">Show lines</mat-slide-toggle>
+      </p>
+    </mat-expansion-panel>
+  </mat-accordion>
+
   <!-- <div class="root-event events" *ngIf="thread.root$ | async as event">
     <span>
       <app-profile-actions [event]="event" [pubkey]="event.pubkey"></app-profile-actions>
@@ -36,11 +49,11 @@
       <app-event-actions [event]="event" [pubkey]="event.pubkey"></app-event-actions>
     </div>
 
-    <app-content class="thread-content" [event]="event"></app-content>
+    <app-content class="thread-content" [ngClass]="{'no-lines': !showLines}" [event]="event"></app-content>
     <app-event-reactions class="thread-reactions" [threadEntry]="thread.getTreeEntry(thread.threadId)"></app-event-reactions>
   </div>
 
-  <app-event-thread [threadEntry]="thread.getTreeEntry(thread.threadId)"> </app-event-thread>
+  <app-event-thread [showLines]="showLines" [threadEntry]="thread.getTreeEntry(thread.threadId)"> </app-event-thread>
 </div>
 <mat-divider></mat-divider>
 

src/app/note/note.component.ts

@@ -99,6 +99,8 @@ export class NoteComponent {
     return eTags[0][1];
   }
 
+  showLines = true;
+
   ngOnInit() {
     console.log('CURRENT EVENT:', this.navigation.currentEvent);
 

src/app/profile/profile.component.ts

@@ -2,7 +2,7 @@ import { Component } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { ApplicationState } from '../services/applicationstate.service';
 import { Utilities } from '../services/utilities.service';
-import { relayInit, Relay, Event } from 'nostr-tools';
+import { relayInit, Relay, Event, getEventHash } from 'nostr-tools';
 import * as moment from 'moment';
 import { DataValidation } from '../services/data-validation.service';
 import { NostrEvent, NostrProfile, NostrProfileDocument } from '../services/interfaces';
@@ -91,14 +91,17 @@ export class ProfileComponent {
       tags: [],
     };
 
-    // await this.feedService.publish(event, false); // Don't persist this locally.
+    const signedEvent = await this.dataService.signEvent(event);
 
+    // await this.feedService.publish(event, false); // Don't persist this locally.
     this.profile!.created_at = event.created_at;
 
     // Use the whole document for this update as we don't want to loose additional metadata we have, such
     // as follow (on self).
     await this.profileService.updateProfile(this.profile!.pubkey, this.profile!);
 
+    await this.dataService.publishEvent(signedEvent);
+
     this.appState.navigateBack();
   }
 }

src/app/services/data.service.ts

@@ -410,6 +410,56 @@ export class DataService {
     // }, this.cleanProfileInterval);
   }
 
+  /** Request an event to be signed. This method will calculate the content id automatically. */
+  async signEvent(event: Event) {
+    if (!event.id) {
+      event.id = getEventHash(event);
+    }
+
+    const gt = globalThis as any;
+
+    // Use nostr directly on global, similar to how most Nostr app will interact with the provider.
+    const signedEvent = await gt.nostr.signEvent(event);
+
+    // We force validation upon user so we make sure they don't create content that we won't be able to parse back later.
+    // We must do this before we run nostr-tools validate and signature validation.
+    const verifiedEvent = this.eventService.processEvent(signedEvent as NostrEventDocument);
+
+    let ok = validateEvent(signedEvent);
+
+    if (!ok) {
+      throw new Error('The event is not valid. Cannot publish.');
+    }
+
+    let veryOk = await verifySignature(signedEvent as any); // Required .id and .sig, which we know has been added at this stage.
+
+    if (!veryOk) {
+      throw new Error('The event signature not valid. Maybe you choose a different account than the one specified?');
+    }
+
+    return signedEvent;
+  }
+
+  /** Will attempt to publish to all registered events independent of their current connection status. This will fail
+   * to publish if the relay is not currently connected. Failed publish will not be retried.
+   */
+  async publishEvent(event: Event) {
+    for (let i = 0; i < this.relayService.relays.length; i++) {
+      const relay = this.relayService.relays[i];
+
+      let pub = relay.publish(event);
+      pub.on('ok', () => {
+        console.log(`${relay.url} has accepted our event`);
+      });
+      pub.on('seen', () => {
+        console.log(`we saw the event on ${relay.url}`);
+      });
+      pub.on('failed', (reason: any) => {
+        console.log(`failed to publish to ${relay.url}: ${reason}`);
+      });
+    }
+  }
+
   async publishContacts(pubkeys: string[]) {
     const mappedContacts = pubkeys.map((c) => {
       return ['p', c];

src/app/services/utilities.service.ts

@@ -39,9 +39,9 @@ export class Utilities {
       picture: profile.picture,
       nip05: profile.nip05,
       lud06: profile.lud06,
+      display_name: profile.display_name,
+      website: profile.website
       // TODO: Consider adding support for these in the future depending on how the community of Nostr grows and adopts these fields.
-      // display_name: profile.display_name,
-      // website: profile.website
     } as NostrProfile;
   }
 

src/app/shared/event-thread/event-thread.component.html

@@ -1,4 +1,4 @@
-<div class="thread-event" *ngFor="let entry of threadEntry?.children">
+<div class="thread-event" [ngClass]="{'no-lines': !showLines}" *ngFor="let entry of threadEntry?.children">
   <span *ngIf="thread.getEvent(entry.id) as event">
     <div class="events-header">
       <app-event-header [pubkey]="event.pubkey"
@@ -6,8 +6,8 @@
       ></app-event-header>
       <app-event-actions [event]="event" [pubkey]="event.pubkey"></app-event-actions>
     </div>
-    <app-content class="thread-content" [displayRepliesTo]="false" [event]="event"></app-content>
+    <app-content class="thread-content" [ngClass]="{'no-lines': !showLines}" [displayRepliesTo]="false" [event]="event"></app-content>
     <app-event-reactions [threadEntry]="thread.getTreeEntry(entry.id)"></app-event-reactions>
-    <app-event-thread [threadEntry]="thread.getTreeEntry(entry.id)"> </app-event-thread>
+    <app-event-thread [showLines]="showLines" [threadEntry]="thread.getTreeEntry(entry.id)"> </app-event-thread>
   </span>
 </div>

src/app/shared/event-thread/event-thread.component.ts

@@ -12,6 +12,7 @@ import { Circle, ThreadEntry } from '../../services/interfaces';
 })
 export class EventThreadComponent {
   @Input() threadEntry?: ThreadEntry | undefined;
+  @Input() showLines?: boolean;
 
   imagePath = '/assets/profile.png';
   tooltip = '';