Keep relays that are already in user relay list

src/app/development/development.html

@@ -18,11 +18,7 @@
   <br />
   <br />
 
-  <button mat-stroked-button (click)="deleteRelays()">Delete Relays</button>
-
   <app-relays [relays]="relayService.items2"></app-relays>
 
-
-
-  <mat-spinner></mat-spinner>
+  <!-- <mat-spinner></mat-spinner> -->
 </div>

src/app/development/development.ts

@@ -88,8 +88,4 @@ export class DevelopmentComponent {
   ngOnDestroy() {
     this.worker?.terminate();
   }
-
-  async deleteRelays() {
-    return this.relayService.deleteRelays();
-  }
 }

src/app/services/relay.ts

@@ -186,6 +186,7 @@ export class RelayService {
       this.items2.push(relay);
     } else {
       if (relay.type !== type) {
+        relay.type = type;
         this.db.storage.putRelay(relay);
       }
     }
@@ -197,15 +198,29 @@ export class RelayService {
     }
   }
 
-  async deleteRelays() {
-    await this.db.storage.deleteRelays();
+  async deleteRelays(keepRelays: string[]) {
+    // Relays to remove
+    const relaysToRemove = this.items2.filter((r) => keepRelays.indexOf(r.url) == -1);
 
-    for (let i = 0; i < this.workers.length; i++) {
-      const worker = this.workers[i];
-      worker.terminate();
+    for (let index = 0; index < relaysToRemove.length; index++) {
+      const relay = relaysToRemove[index];
+      await this.db.storage.deleteRelay(relay.url);
+
+      const worker = this.workers.find((w) => w.url == relay.url);
+      worker?.terminate();
     }
 
-    this.items2 = [];
+    // Relays to keep
+    this.items2 = this.items2.filter((r) => keepRelays.indexOf(r.url) > -1);
+
+    // await this.db.storage.deleteRelays();
+
+    // for (let i = 0; i < this.workers.length; i++) {
+    //   const worker = this.workers[i];
+    //   worker.terminate();
+    // }
+
+    // this.items2 = [];
   }
 
   openImportSheet(data: any): void {
@@ -504,6 +519,21 @@ export class RelayService {
     this.#replyEventsChanged.next(this.events);
   }
 
+  getRelayUrls(relays: any) {
+    let preparedRelays = relays;
+
+    if (Array.isArray(preparedRelays)) {
+      preparedRelays = {};
+
+      for (let i = 0; i < relays.length; i++) {
+        preparedRelays[relays[i]] = {};
+      }
+    }
+
+    const entries = Object.keys(preparedRelays);
+    return entries;
+  }
+
   /** Takes relay in the format used for extensions and adds to persistent storage. */
   async appendRelays(relays: any) {
     let preparedRelays = relays;

src/app/settings/settings.ts

@@ -36,7 +36,7 @@ export class SettingsComponent {
     public theme: ThemeService,
     private db: StorageService,
     private snackBar: MatSnackBar,
-    public dataService: DataService,
+    public dataService: DataService
   ) {}
 
   toggle() {
@@ -59,7 +59,7 @@ export class SettingsComponent {
   // }
 
   async deleteRelays() {
-    await this.relayService.deleteRelays();
+    await this.relayService.deleteRelays([]);
   }
 
   async clearProfileCache() {

src/app/shared/content/content.css

@@ -43,6 +43,10 @@
 }
 
 .event-content {
+  overflow-wrap: break-word;
+  inline-size: min-content;
+  overflow: hidden;
+  word-break: break-all;
 }
 
 .event-content-big {

src/app/shared/import-sheet/import-sheet.ts

@@ -17,16 +17,9 @@ export class ImportSheet {
     event.preventDefault();
 
     if (this.data.relaysCount > 0) {
-      // Reset all existing default connections.
-      await this.relayService.deleteRelays();
+      const relayUrls = this.relayService.getRelayUrls(this.data.relays);
 
-      // Delete of relays can take some time, and if we append
-      // right away, we might get terminate/disconnect event on the same relays
-      // being re-added. We can either solve this by providing "do not delete" list
-      // to the deleteRelays above, or implement some logic to wait for all relays to
-      // fully terminate before we continue. Until then, let's sleep for 3 seconds as a temporary
-      // fix for this issue.
-      await sleep(1500);
+      await this.relayService.deleteRelays(relayUrls);
 
       await this.relayService.appendRelays(this.data.relays);
     }