allow deleting chat

src/Model/chatModel.ts

@@ -86,11 +86,20 @@ export class Chat {
     );
     this.cannotUndoChannel = React.createProxyState(
       [this.primaryChannelInput, this.primaryChannel],
-      () =>
-        this.primaryChannelInput.value == this.primaryChannel.value
+      () => this.primaryChannelInput.value == this.primaryChannel.value
     );
   }
 
+  // general
+  deleteSelf = () => {
+    Object.values(storageKeys).forEach((storageKey) => {
+      localStorage.removeItem(storageKey(this.id));
+    });
+
+    chats.remove(this);
+    chatIds.remove(this.id);
+  }
+
   // handlers
   onmessage = async (data: Message): Promise<void> => {
     if (data.messageChannel && data.messageChannel != this.primaryChannel.value)
@@ -201,12 +210,3 @@ export function createChatWithName(name: string): void {
 
   UDN.subscribe(name);
 }
-
-export function removeChat(chat: Chat): void {
-  Object.values(storageKeys).forEach((cb) => {
-    localStorage.removeItem(cb(chat.id));
-  });
-
-  chats.remove(chat);
-  chatIds.remove(chat.id);
-}

src/Views/chatOptionModal.tsx

@@ -8,6 +8,11 @@ export function ChatOptionModal(chat: Chat, isPresented: React.State<boolean>) {
     isPresented.value = false;
   }
 
+  function deleteChat() {
+    chat.deleteSelf()
+    closeModal();
+  }
+
   const secondaryChannelConverter: React.ListItemConverter<string> = (
     secondaryChannel
   ) => {
@@ -108,8 +113,15 @@ export function ChatOptionModal(chat: Chat, isPresented: React.State<boolean>) {
               ></input>
             </div>
           </label>
+
+          <hr></hr>
+
+          <button class="danger" on:click={deleteChat}>
+            {translation.removeChat}
+            <span class="icon">delete</span>
+          </button>
         </main>
-        <button class="danger" on:click={closeModal}>
+        <button on:click={closeModal}>
           {translation.close}
           <span class="icon">close</span>
         </button>

src/translations.ts

@@ -34,7 +34,6 @@ const englishTranslations = {
   newChatPrimaryChannel: "Primary channel",
   newChatNamePlaceholder: "my-channel",
   addChat: "Add",
-  removeChat: "Remove chat",
 
   // messages
   showChatOptions: "show chat options",
@@ -51,6 +50,8 @@ const englishTranslations = {
   encryptionKey: "Encryption key",
   encryptionKeyPlaceholder: "n10d2482dg283hg",
 
+  removeChat: "Remove chat",
+
   noChatSelected: "No chat selected",
 
   composerPlaceholder: "Type a message...",