From 2a184c2ea08d50365e98d2e74553b761510811b3 Mon Sep 17 00:00:00 2001
From: arpee <richard@saito.tech>
Date: Tue, 23 Jan 2024 10:33:52 +1100
Subject: [PATCH 01/12] make mods buttons in settings

---
 mods/settings/web/css/settings-base.css | 49 +++++++++++--------------
 1 file changed, 22 insertions(+), 27 deletions(-)

diff --git a/mods/settings/web/css/settings-base.css b/mods/settings/web/css/settings-base.css
index b6b6e9566f..a18af1c007 100644
--- a/mods/settings/web/css/settings-base.css
+++ b/mods/settings/web/css/settings-base.css
@@ -16,9 +16,10 @@
 
 .settings-appspace-link {
   cursor: pointer;
+  width: 15rem;
 }
 
-.settings-appspace-link:hover{
+.settings-appspace-link:hover {
   text-decoration: underline;
 }
 
@@ -37,7 +38,6 @@
   justify-content: center;
 }
 
-
 .settings-appspace-user-details {
   display: grid;
   grid-template-columns: 8rem min-content;
@@ -49,25 +49,24 @@
   overflow: auto;
 }
 
-.settings-appspace-user-details > div {
+.settings-appspace-user-details>div {
   width: 100%;
   min-width: 0;
 }
 
-.settings-appspace-user-details > div.register-identifier-btn {
+.settings-appspace-user-details>div.register-identifier-btn {
   width: fit-content;
 }
 
-.settings-appspace-user-details .pubkey-containter{
+.settings-appspace-user-details .pubkey-containter {
   justify-content: initial;
   gap: 1rem;
 }
 
-.settings-appspace-user-details .profile-public-key{
+.settings-appspace-user-details .profile-public-key {
   width: 38rem;
 }
 
-
 .settings-appspace-modules {
   display: grid;
   grid-gap: 1.5rem;
@@ -75,10 +74,16 @@
   margin: 1rem;
 }
 
-
 .settings-appspace-app {
   display: flex;
   align-items: center;
+  padding: 0.6rem 0.5rem 0.2rem 0.5rem;
+  border: 1px solid var(--saito-border-color);
+  border-radius: 0.5rem;
+}
+
+.settings-appspace-app:hover {
+  border-color: var(--saito-primary);
 }
 
 .settings-appspace-app div {
@@ -102,7 +107,6 @@ label.treated {
   list-style: none;
 }
 
-
 @media only screen and (max-width: 900px) {
   .settings-appspace {
     padding: 1.5rem;
@@ -110,32 +114,23 @@ label.treated {
   .settings-appspace-modules {
     grid-template-columns: repeat(4, 1fr);
   }
-
 }
 
-
 @media only screen and (max-width: 600px) {
   .settings-appspace {
     padding: 1rem;
   }
-
   .settings-appspace-modules {
     grid-template-columns: repeat(3, 1fr);
   }
-
   .settings-appspace-user-details {
-   grid-template-columns: 8rem 1fr;
+    grid-template-columns: 8rem 1fr;
   }
-
-.settings-actions-container {
-  gap: 0.6rem;
-  margin-right: 0.5rem;
-}
-.settings-actions-container .saito-button-secondary {
-  padding: 0.4rem 0.3rem;
-}
-
-}
-
-
-
+  .settings-actions-container {
+    gap: 0.6rem;
+    margin-right: 0.5rem;
+  }
+  .settings-actions-container .saito-button-secondary {
+    padding: 0.4rem 0.3rem;
+  }
+}
\ No newline at end of file

From 2d8f493dc6ceac5cb9cf21b95a3e342c423d9d5a Mon Sep 17 00:00:00 2001
From: Daniel Worlton <f8daniel@gmail.com>
Date: Tue, 23 Jan 2024 08:06:29 +0700
Subject: [PATCH 02/12] improve error catching in settings

---
 mods/settings/lib/appspace/main.template.js | 28 ++++++++++-----------
 1 file changed, 14 insertions(+), 14 deletions(-)

diff --git a/mods/settings/lib/appspace/main.template.js b/mods/settings/lib/appspace/main.template.js
index 3d73d3a727..d9ee9ea59a 100644
--- a/mods/settings/lib/appspace/main.template.js
+++ b/mods/settings/lib/appspace/main.template.js
@@ -24,23 +24,23 @@ module.exports = SettingsAppspaceTemplate = (app, mod, main) => {
 
     for (let i = 0; i < app.options.modules.length; i++){
       let mod = app.modules.returnModule(app.options.modules[i].name);
-      let CHECKED = app.options.modules[i].active ? 'CHECKED' : '';
-      modules_html += `
-      <div class="settings-appspace-app">
-          <div class="saito-switch">
-            <input type="checkbox"  id="${i}" class="modules_mods_checkbox" name="modules_mods_${i}" ${CHECKED}>
-          </div>
-          <div id="${mod.name}" class="settings-appspace-module settings-appspace-link">${mod.returnName()}</div>
-         </div>
-      `;  
+      if (mod){
+        let CHECKED = app.options.modules[i].active ? 'CHECKED' : '';
+        modules_html += `
+        <div class="settings-appspace-app">
+            <div class="saito-switch">
+              <input type="checkbox"  id="${i}" class="modules_mods_checkbox" name="modules_mods_${i}" ${CHECKED}>
+            </div>
+            <div id="${mod.name}" class="settings-appspace-module settings-appspace-link">${mod.returnName()}</div>
+           </div>
+        `;  
+      }else{
+        console.warn(app.options.modules[i].name + " not found!");
+      }
     }
 
   } catch (err) {
-    if (err.message.startsWith("Cannot read property 'map'")) {
-      modules_html = "Initialization error. Refresh page should fix this.";
-    } else {
-      modules_html = `Unknown error<br/>${err}`;
-    }
+    console.error(err);
   }
 
   let html = `

From 6de5858c8fba8eed224d63133473c3fc06b6cdd5 Mon Sep 17 00:00:00 2001
From: Daniel Worlton <f8daniel@gmail.com>
Date: Tue, 23 Jan 2024 08:42:56 +0700
Subject: [PATCH 03/12] fix settings for deactivated modules

---
 mods/settings/lib/appspace/main.js          |  4 +--
 mods/settings/lib/appspace/main.template.js | 27 +++++++++++----------
 2 files changed, 16 insertions(+), 15 deletions(-)

diff --git a/mods/settings/lib/appspace/main.js b/mods/settings/lib/appspace/main.js
index 166ce721c4..81843aa1fa 100644
--- a/mods/settings/lib/appspace/main.js
+++ b/mods/settings/lib/appspace/main.js
@@ -99,7 +99,7 @@ class SettingsAppspace {
           let currentTarget = e.currentTarget;
 
           if (currentTarget.checked == true) {
-            let sc = await sconfirm("Reactivate this module?");
+            let sc = await sconfirm("Reactivate this module? (Will take effect on refresh)");
             if (sc) {
               app.options.modules[thisid].active = 1;
               app.storage.saveOptions();
@@ -107,7 +107,7 @@ class SettingsAppspace {
               currentTarget.checked = false;
             } 
           } else {
-            let sc = await sconfirm("Remove this module?");
+            let sc = await sconfirm("Remove this module? (Will take effect on refresh)");
             if (sc) {
               app.options.modules[thisid].active = 0;
               app.storage.saveOptions();
diff --git a/mods/settings/lib/appspace/main.template.js b/mods/settings/lib/appspace/main.template.js
index d9ee9ea59a..909f3cbd27 100644
--- a/mods/settings/lib/appspace/main.template.js
+++ b/mods/settings/lib/appspace/main.template.js
@@ -24,19 +24,20 @@ module.exports = SettingsAppspaceTemplate = (app, mod, main) => {
 
     for (let i = 0; i < app.options.modules.length; i++){
       let mod = app.modules.returnModule(app.options.modules[i].name);
-      if (mod){
-        let CHECKED = app.options.modules[i].active ? 'CHECKED' : '';
-        modules_html += `
-        <div class="settings-appspace-app">
-            <div class="saito-switch">
-              <input type="checkbox"  id="${i}" class="modules_mods_checkbox" name="modules_mods_${i}" ${CHECKED}>
-            </div>
-            <div id="${mod.name}" class="settings-appspace-module settings-appspace-link">${mod.returnName()}</div>
-           </div>
-        `;  
-      }else{
-        console.warn(app.options.modules[i].name + " not found!");
-      }
+      let shortName = app.options.modules[i].name;
+      let fullName = mod ? mod.returnName() : shortName;
+
+      
+      let CHECKED = app.options.modules[i].active ? 'CHECKED' : '';
+      modules_html += `
+      <div class="settings-appspace-app">
+          <div class="saito-switch">
+            <input type="checkbox"  id="${i}" class="modules_mods_checkbox" name="modules_mods_${i}" ${CHECKED}>
+          </div>
+          <div id="${shortName}" class="settings-appspace-module settings-appspace-link">${fullName}</div>
+         </div>
+      `;  
+    
     }
 
   } catch (err) {

From d9ded08ad8c263233b95bbb768a8489c390a514a Mon Sep 17 00:00:00 2001
From: umairkhannn <104337801+umairkhannn@users.noreply.github.com>
Date: Tue, 23 Jan 2024 07:01:44 +0500
Subject: [PATCH 04/12] Add call and other icons in chat header (#2297)

* Saito chat header updates

* Saito chat header changes

* Add call and menu feature to chat

* reduce header size

* fix css for firefox

* allow dms in user menu without key exchange

* use variables instead of hardcoded strings

---------

Co-authored-by: arpee <richard@saito.tech>
Co-authored-by: Daniel Worlton <f8daniel@gmail.com>
---
 mods/chat/chat.js                            | 33 +++-----
 mods/chat/lib/chat-manager/popup.js          | 47 ++++++++++-
 mods/chat/lib/chat-manager/popup.template.js | 28 +++++-
 mods/stun/stun.js                            | 23 +++++
 web/saito/css-imports/saito-chat.css         | 89 +++++++++++++++++---
 5 files changed, 181 insertions(+), 39 deletions(-)

diff --git a/mods/chat/chat.js b/mods/chat/chat.js
index 6ad5e61154..cd4cba48da 100644
--- a/mods/chat/chat.js
+++ b/mods/chat/chat.js
@@ -102,7 +102,7 @@ class Chat extends ModTemplate {
     if (app.BROWSER == 0) {
       this.communityGroup = this.returnOrCreateChatGroupFromMembers(
         [this.publicKey],
-        "Saito Community Chat"
+        this.communityGroupName
       );
       this.communityGroup.members = [this.publicKey];
 
@@ -349,7 +349,7 @@ class Chat extends ModTemplate {
     let services = [];
     // servers with chat service run plaintext community chat groups
     if (this.app.BROWSER == 0) {
-      services.push(new PeerService(null, "chat", "Saito Community Chat"));
+      services.push(new PeerService(null, "chat", this.communityGroupName));
     }
     return services;
   }
@@ -446,24 +446,19 @@ class Chat extends ModTemplate {
         }
         return null;
       case "user-menu":
-        if (obj?.publicKey) {
-          if (
-            chat_self.app.keychain.hasSharedSecret(obj.publicKey) &&
-            obj.publicKey !== this.publicKey
-          ) {
-            return {
-              text: "Chat",
-              icon: "far fa-comment-dots",
-              callback: function (app, publicKey) {
-                if (chat_self.chat_manager == null) {
-                  chat_self.chat_manager = new ChatManager(chat_self.app, chat_self);
-                }
+        if (obj?.publicKey!== this.publicKey) {
+          return {
+            text: "Chat",
+            icon: "far fa-comment-dots",
+            callback: function (app, publicKey) {
+              if (chat_self.chat_manager == null) {
+                chat_self.chat_manager = new ChatManager(chat_self.app, chat_self);
+              }
 
-                chat_self.chat_manager.render_popups_to_screen = 1;
-                chat_self.app.connection.emit("open-chat-with", { key: publicKey });
-              },
-            };
-          }
+              chat_self.chat_manager.render_popups_to_screen = 1;
+              chat_self.app.connection.emit("open-chat-with", { key: publicKey });
+            },
+          };
         }
 
         return null;
diff --git a/mods/chat/lib/chat-manager/popup.js b/mods/chat/lib/chat-manager/popup.js
index b35c99ad6e..a385ef1865 100644
--- a/mods/chat/lib/chat-manager/popup.js
+++ b/mods/chat/lib/chat-manager/popup.js
@@ -23,6 +23,8 @@ class ChatPopup {
 
     this.events_attached = false;
 
+    this.callbacks = {};
+
     app.connection.on("chat-remove-fetch-button-request", (group_id) => {
       if (this.group?.id === group_id) {
         this.no_older_messages = true;
@@ -51,6 +53,7 @@ class ChatPopup {
   }
 
   render() {
+    let this_self = this;
     //
     // exit if group unset
     //
@@ -171,6 +174,29 @@ class ChatPopup {
       }
     }
 
+    // add call icon, ignore if community chat
+    let mods = this.app.modules.mods;
+    if (this.group.name != this.mod.communityGroupName) {
+      let index = 0;
+      for (const mod of mods) {
+
+        let item = mod.respondTo("chat-actions", { publicKey: this.group.name });
+        if (item instanceof Array) {
+          item.forEach((j) => {
+            let id = `chat_action_item_${index}`;
+            this_self.callbacks[id] = j.callback;
+            this_self.addChatActionItem(j, id);
+            index++;
+          });
+        } else if (item != null) {
+          let id = `chat_action_item_${index}`;
+          this_self.callbacks[id] = item.callback;
+          this_self.addChatActionItem(item, id);
+        }
+        index++;
+      }
+    }
+
     //
     // re-render typed text
     //
@@ -210,7 +236,18 @@ class ChatPopup {
       return;
     }
 
-
+    if (this.group.name != this.mod.communityGroupName) {
+      document.querySelectorAll(".chat-action-item").forEach((menu) => {
+        let id = menu.getAttribute("id");
+        let callback = this_self.callbacks[id];
+        menu.addEventListener("click", (e) => {
+          let pk = e.currentTarget.getAttribute("data-id");
+          console.log("clicked on chat-action-item ///");
+          console.log(pk);
+          callback(app, pk);
+        });
+      });
+    }
 
     // add reply functionality
     document.querySelectorAll(`${popup_qs} .saito-userline-reply .chat-reply`).forEach((el) => {
@@ -371,6 +408,7 @@ class ChatPopup {
         if (chatPopup.classList.contains("minimized")) {
           this.restorePopup(chatPopup);
         } else {
+
           if (chatPopup.classList.contains("maximized")) {
             chatPopup.classList.remove("maximized");
           } else {
@@ -495,8 +533,13 @@ class ChatPopup {
 
     app.browser.addDragAndDropFileUploadToElement(popup_id, this.input.callbackOnUpload, false); // false = no drag-and-drop image click
 
+  }
 
-
+  addChatActionItem(item, id) {
+    let popup_qs = "#chat-popup-" + this.group.id;    
+    document.querySelector(`${popup_qs} .chat-actions`).innerHTML = `
+      <i id="${id}" class="chat-action-item ${item.icon}" data-id="${this.group.name}" title="${item.text}"></i>
+      `;
   }
 
   restorePopup(chatPopup) {
diff --git a/mods/chat/lib/chat-manager/popup.template.js b/mods/chat/lib/chat-manager/popup.template.js
index 0055a5582a..2b72c12c20 100644
--- a/mods/chat/lib/chat-manager/popup.template.js
+++ b/mods/chat/lib/chat-manager/popup.template.js
@@ -28,13 +28,33 @@ module.exports = (app, mod, group, isStatic = false) => {
        <div class="${class_name} chat-popup ${(group.members.length == 2 ? "saito-dm-chat" : "")}" id="chat-popup-${group.id}">
 
           <div class="chat-header" id="chat-header-${group.id}">
-            ${is_encrypted}
-            <div id="chat-group-${group.id}" class="chat-group active-chat-tab saito-address" data-id="${group.name}" data-disable="true">${
-      group.name
-    }</div>
+            <div class="chat-header-nav">
+            
+            <div class="chat-details hide">
+              ${is_encrypted}
+              <div id="chat-group-${group.id}" class="chat-group active-chat-tab saito-address" data-id="${group.name}" 
+              data-disable="true">${group.name}</div>
+            </div>
+
             <i class="fa-solid fa-window-minimize chat-sizing-icon chat-minimizer-icon"></i>
             <i class="fa-regular fa-square chat-sizing-icon chat-maximizer-icon"></i>
             <i id="chat-container-close" class="chat-container-close fas fa-times"></i>
+            </div>
+            <div class="chat-header-info">
+              <div class="chat-details">
+              ${is_encrypted}
+              <div id="chat-group-${group.id}" class="chat-group active-chat-tab saito-address" data-id="${group.name}" 
+              data-disable="true">${group.name}</div>
+              </div>
+
+              ${group.name != mod.communityGroupName ? `
+              <div class="chat-action-icons">
+                <div class="chat-actions">
+                </div>
+                <i class="fa-solid fa-ellipsis-vertical saito-address" data-id="${group.name}"></i>
+              </div>
+              ` : ``}
+            </div>
           </div>
 
           <div class="chat-body">
diff --git a/mods/stun/stun.js b/mods/stun/stun.js
index e8d81c7cbb..64c204717c 100644
--- a/mods/stun/stun.js
+++ b/mods/stun/stun.js
@@ -283,6 +283,29 @@ class Stun extends ModTemplate {
       return menu_items;
     }
 
+    if (type === "chat-actions") {
+      if (obj?.publicKey) {
+        if (obj.publicKey !== this.app.wallet.publicKey) {
+          this.attachStyleSheets();
+          super.render(this.app, this);
+          return [
+            {
+              text: "Video/Audio Call",
+              icon: "fas fa-phone",
+              callback: function (app, public_key) {
+
+                if (!stun_self.room_obj) {
+                  stun_self.dialer.establishStunCallWithPeers([public_key]);
+                } else {
+                  salert("Already in or establishing a call");
+                }
+              },
+            },
+          ];
+        }
+      }
+    }
+
     return null;
   }
 
diff --git a/web/saito/css-imports/saito-chat.css b/web/saito/css-imports/saito-chat.css
index e300fd6aed..de711aef2c 100644
--- a/web/saito/css-imports/saito-chat.css
+++ b/web/saito/css-imports/saito-chat.css
@@ -233,44 +233,79 @@
   width: 100%;
 }
 
-.chat-header {
+.chat-header {  
   display: flex;
-  align-items: center;
-  justify-content: space-between;
+  flex-direction: column;
+  width: -webkit-fill-available;
+  height: -webkit-fill-available;
+  z-index: inherit;
+}
+
+.chat-header > .chat-header-nav {
+  display: flex;
+  align-items: end;
+  justify-content: flex-end;
   border-bottom: 1px solid var(--saito-border-color);
   cursor: grab;
   height: 4.5rem;
   font-size: 1.7rem;
+  background: var(--saito-background-light);
 }
 
-.chat-header>i {
+.chat-header > .chat-header-nav > i {
   margin: 0;
-  padding: 1.2rem;
   color: var(--saito-primary);
-  font-size: 2rem;
+  font-size: 1.2rem;
   display: inline-block;
   position: relative;
   transition: all 0.2s;
   cursor: pointer;
+  padding: 0.5rem;
 }
 
-.chat-header>i:hover {
+.chat-header > .chat-header-nav > i:hover {
   background-color: var(--saito-primary);
   color: var(--saito-white);
 }
 
-.chat-header>i.noclick:hover {
+.chat-header > .chat-header-nav > i.noclick:hover {
   background-color: revert;
   color: var(--saito-primary);
   cursor: revert;
 }
 
-.chat-header>i.chat-sizing-icon {
+/*
+.chat-header > .chat-header-nav > i.chat-sizing-icon {
   padding: 1.2rem 0.6rem;
 }
+*/
+
+.chat-header > .chat-header-nav > i:last-child {
+  cursor: pointer;
+}
+
+
+
+.chat-header-info {
+  padding: 1.2rem 1rem;
+  background: var(--saito-arcade-background);
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+
+.chat-header-info  i {
+  font-size: 2rem;
+  color: var(--saito-faded-icon-font);
+}
+
+.chat-action-icons {
+  display: flex;
+  flex-direction: row;
+  gap: 2rem;
+}
 
-.chat-header>i:last-child {
-  padding-bottom: 1.3rem;
+.chat-action-icons i {
   cursor: pointer;
 }
 
@@ -279,12 +314,37 @@
 }*/
 
 .chat-header .chat-group {
-  max-width: 95%;
+  max-width: 70%;
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
-  margin: auto;
   cursor: unset;
+  font-size: 1.7rem;
+}
+
+
+.chat-header-nav .chat-details,
+.chat-header-info .chat-details {
+  width: 71%;
+  display: flex;
+  flex-direction: row;
+  gap: 1rem;
+}
+
+.chat-header-nav .chat-details {
+  display: none;
+}
+
+.chat-header-nav .chat-details .chat-group {
+  max-width: 82%; 
+}
+
+.chat-popup.minimized .chat-header .chat-header-nav .chat-details {
+  display: flex;
+}
+
+.chat-popup.minimized .chat-header > .chat-header-nav > i {
+  padding: 1.2rem 0.8rem;
 }
 
 .chat-body {
@@ -588,6 +648,7 @@
   color: var(--saito-font-color-light);
   font-style: italic;
   font-size: 1.4rem;
+  margin-top: 3rem;
 }
 
 .saito-chat-button:hover {
@@ -656,7 +717,7 @@
   .chat-manager-title {
     display: none;
   }
-  .chat-header>i.chat-sizing-icon {
+  .chat-header i.chat-sizing-icon {
     display: none;
   }
 

From 14f61470559833535120dc7d926b85f9c8f083f6 Mon Sep 17 00:00:00 2001
From: Daniel Worlton <f8daniel@gmail.com>
Date: Tue, 23 Jan 2024 11:36:53 +0700
Subject: [PATCH 05/12] fix stun slug

---
 mods/stun/stun.js                          | 2 +-
 mods/stun/web/css/stun-video-interface.css | 3 ++-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/mods/stun/stun.js b/mods/stun/stun.js
index 64c204717c..8e6dbb6256 100644
--- a/mods/stun/stun.js
+++ b/mods/stun/stun.js
@@ -15,7 +15,7 @@ class Stun extends ModTemplate {
     this.app = app;
     this.appname = "Saito Talk";
     this.name = "Stun";
-    this.slug = this.returnSlug();
+    this.slug = "videocall";
     this.description = "P2P Video & Audio Connection Module";
     this.categories = "Utilities Communications";
     this.icon = "fas fa-video";
diff --git a/mods/stun/web/css/stun-video-interface.css b/mods/stun/web/css/stun-video-interface.css
index d771ac49ad..c55f5564f0 100644
--- a/mods/stun/web/css/stun-video-interface.css
+++ b/mods/stun/web/css/stun-video-interface.css
@@ -885,8 +885,9 @@
   }
 
   .side-videos .video-box-container-large, .expanded-video .video-box-container-large {
-    height: min(100vw, 37vh);
+    height: min(100%, 37vh);
     width: fit-content;
+    max-width: 100%;
     margin: auto;
   }
 

From 0ce760f2a4696b8ce144eb3e747c05e4e00549db Mon Sep 17 00:00:00 2001
From: arpee <richard@saito.tech>
Date: Tue, 23 Jan 2024 16:01:06 +1100
Subject: [PATCH 06/12] wallet ug

---
 lib/saito/wallet.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/saito/wallet.ts b/lib/saito/wallet.ts
index 82bf5c2efa..57cf151868 100644
--- a/lib/saito/wallet.ts
+++ b/lib/saito/wallet.ts
@@ -22,7 +22,7 @@ export default class Wallet extends SaitoWallet {
 
   default_fee = 0;
 
-  version = 5.582;
+  version = 5.583;
 
   cryptos = new Map<string, any>();
   public saitoCrypto: any;

From cfdd726d6056b1f26c3cca4d249b9224031748ae Mon Sep 17 00:00:00 2001
From: Umair Khan <umair@saito.tech>
Date: Tue, 23 Jan 2024 10:46:56 +0500
Subject: [PATCH 07/12] fix chat identifier issue

---
 mods/chat/lib/chat-manager/popup.template.js | 2 +-
 web/saito/css-imports/saito-chat.css         | 2 ++
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/mods/chat/lib/chat-manager/popup.template.js b/mods/chat/lib/chat-manager/popup.template.js
index 2b72c12c20..dc3d3f92c4 100644
--- a/mods/chat/lib/chat-manager/popup.template.js
+++ b/mods/chat/lib/chat-manager/popup.template.js
@@ -51,7 +51,7 @@ module.exports = (app, mod, group, isStatic = false) => {
               <div class="chat-action-icons">
                 <div class="chat-actions">
                 </div>
-                <i class="fa-solid fa-ellipsis-vertical saito-address" data-id="${group.name}"></i>
+                <i class="fa-solid fa-ellipsis-vertical saito-identicon" data-id="${group.name}"></i>
               </div>
               ` : ``}
             </div>
diff --git a/web/saito/css-imports/saito-chat.css b/web/saito/css-imports/saito-chat.css
index de711aef2c..fe8c38667e 100644
--- a/web/saito/css-imports/saito-chat.css
+++ b/web/saito/css-imports/saito-chat.css
@@ -307,6 +307,8 @@
 
 .chat-action-icons i {
   cursor: pointer;
+  height: auto;
+  width: auto;
 }
 
 /*.chat-header > i:last-child:hover {

From 07fd8dff29adb2e5445731d16c5e56834e73be62 Mon Sep 17 00:00:00 2001
From: Daniel Worlton <f8daniel@gmail.com>
Date: Tue, 23 Jan 2024 12:49:15 +0700
Subject: [PATCH 08/12] fix stun bug

---
 mods/stun/stun.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/mods/stun/stun.js b/mods/stun/stun.js
index 8e6dbb6256..acc1768ab8 100644
--- a/mods/stun/stun.js
+++ b/mods/stun/stun.js
@@ -476,7 +476,7 @@ class Stun extends ModTemplate {
 
     let from = tx.from[0].publicKey;
     let call_list = [];
-    let peers = this.app.options?.stun;
+    let peers = this.app.options?.stun?.peers;
 
     if (peers) {
       peers.forEach((key) => {

From f0927808c7e13bbd018f57be43196a410b7d2132 Mon Sep 17 00:00:00 2001
From: arpee <richard@saito.tech>
Date: Tue, 23 Jan 2024 17:24:08 +1100
Subject: [PATCH 09/12] fixed display issue with user name

---
 lib/saito/browser.ts                         | 3 ++-
 mods/chat/lib/chat-manager/popup.template.js | 2 +-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/lib/saito/browser.ts b/lib/saito/browser.ts
index 953333c982..26a955ff39 100644
--- a/lib/saito/browser.ts
+++ b/lib/saito/browser.ts
@@ -255,7 +255,8 @@ class Browser {
       (e) => {
         if (
           e.target?.classList?.contains("saito-identicon") ||
-          e.target?.classList?.contains("saito-address")
+          e.target?.classList?.contains("saito-address") ||
+          e.target?.classList?.contains("saito-add-user-menu")
         ) {
           let disable_click = e.target.getAttribute("data-disable");
           let publicKey = e.target.getAttribute("data-id");
diff --git a/mods/chat/lib/chat-manager/popup.template.js b/mods/chat/lib/chat-manager/popup.template.js
index dc3d3f92c4..6d8c71d620 100644
--- a/mods/chat/lib/chat-manager/popup.template.js
+++ b/mods/chat/lib/chat-manager/popup.template.js
@@ -51,7 +51,7 @@ module.exports = (app, mod, group, isStatic = false) => {
               <div class="chat-action-icons">
                 <div class="chat-actions">
                 </div>
-                <i class="fa-solid fa-ellipsis-vertical saito-identicon" data-id="${group.name}"></i>
+                <i class="fa-solid fa-ellipsis-vertical saito-add-user-menu" data-id="${group.name}"></i>
               </div>
               ` : ``}
             </div>

From bddb490667a64ac1d64874e504f5f73b6ad8a02d Mon Sep 17 00:00:00 2001
From: Umair Khan <umair@saito.tech>
Date: Tue, 23 Jan 2024 11:52:09 +0500
Subject: [PATCH 10/12] Add check for group chat

---
 mods/chat/lib/chat-manager/popup.template.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/mods/chat/lib/chat-manager/popup.template.js b/mods/chat/lib/chat-manager/popup.template.js
index 6d8c71d620..71ebc2434f 100644
--- a/mods/chat/lib/chat-manager/popup.template.js
+++ b/mods/chat/lib/chat-manager/popup.template.js
@@ -47,7 +47,7 @@ module.exports = (app, mod, group, isStatic = false) => {
               data-disable="true">${group.name}</div>
               </div>
 
-              ${group.name != mod.communityGroupName ? `
+              ${(group.name != mod.communityGroupName && group.members.length == 2) ? `
               <div class="chat-action-icons">
                 <div class="chat-actions">
                 </div>

From 2d9c846f11c192c61e8e2c91fb1cb72c1e6947b1 Mon Sep 17 00:00:00 2001
From: Daniel Worlton <f8daniel@gmail.com>
Date: Tue, 23 Jan 2024 14:56:42 +0700
Subject: [PATCH 11/12] Stun: improve settings

---
 mods/stun/lib/appspace/PeerManager.js         | 11 ++++++++
 mods/stun/lib/overlays/videocall-settings.js  | 27 ++++++++++++++-----
 .../overlays/videocall-settings.template.js   | 25 ++++++++++-------
 mods/stun/stun.js                             |  2 +-
 mods/stun/web/css/stun-video-interface.css    | 10 +++----
 5 files changed, 52 insertions(+), 23 deletions(-)

diff --git a/mods/stun/lib/appspace/PeerManager.js b/mods/stun/lib/appspace/PeerManager.js
index 8b0cd22030..b29889605e 100644
--- a/mods/stun/lib/appspace/PeerManager.js
+++ b/mods/stun/lib/appspace/PeerManager.js
@@ -102,6 +102,7 @@ class PeerManager {
 
     app.connection.on("begin-share-screen", async () => {
       try {
+        console.log("Start");
         this.presentationStream = await navigator.mediaDevices.getDisplayMedia({ 
           video: {
             displaySurface: "window",
@@ -127,6 +128,16 @@ class PeerManager {
       }
     });
 
+
+    app.connection.on("stop-share-screen", async () => {
+      console.log("no more");
+      if (this.presentationStream){
+        this.presentationStream.getTracks().forEach(track => track.stop());
+        this.stopSharing();
+        this.presentationStream = null;
+      }
+    });
+
     //Launch the Stun call
     app.connection.on("start-stun-call", async () => {
       console.log("STUN: start-stun-call");
diff --git a/mods/stun/lib/overlays/videocall-settings.js b/mods/stun/lib/overlays/videocall-settings.js
index 195f93af78..1277b488bf 100644
--- a/mods/stun/lib/overlays/videocall-settings.js
+++ b/mods/stun/lib/overlays/videocall-settings.js
@@ -23,15 +23,30 @@ class VideoCallSettings {
       };
     });
 
-    if (!this.mod.screen_share){
-      document.querySelectorAll(".share-control").forEach((item) => {
-        item.onclick = () => {
+    if (document.querySelector(".share-control")) {
+      document.querySelector(".share-control").onclick = (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        if (this_self.mod.screen_share) {
+          console.log("Emit event to stop");
+          this_self.app.connection.emit("stop-share-screen");
+        } else {
+          console.log("Emit event to start");
           this_self.app.connection.emit("begin-share-screen");
-          this_self.saitoOverlay.remove();
-        };
-      });
+        }
+        this_self.saitoOverlay.remove();
+      };
+    }
+
+    if (document.querySelector(".advanced-settings-link")){
+      document.querySelector(".advanced-settings-link").onclick = (e) => {
+        let anotherOverlay = new SaitoOverlay(this.app, this.mod);
+        anotherOverlay.show(`<div class="videocall-setting-grid-item saito-module-settings"></div>`);
+        this.mod.loadSettings(".saito-module-settings");
+      }
     }
   }
+
 }
 
 module.exports = VideoCallSettings;
diff --git a/mods/stun/lib/overlays/videocall-settings.template.js b/mods/stun/lib/overlays/videocall-settings.template.js
index 031d6c718e..a890ef57bb 100644
--- a/mods/stun/lib/overlays/videocall-settings.template.js
+++ b/mods/stun/lib/overlays/videocall-settings.template.js
@@ -47,17 +47,24 @@ const VideoCallSettingsTemplate = (display_mode, mod) => {
             
             </div>
 
+            <hr>
 
-             ${(!mod.screen_share) ?
-              `<div class="videocall-option-grid">
-                  <div class="videocall-setting-title">Screenshare</div>
-                  <div class="videocall-setting-icon share-control">
-                    <i class="fa-solid fa-display"></i>
-                  </div>
-                </div>`
-                : ``
-            }
+
+            <div class="videocall-option-container share-control">
+              <label class="videocall-option-label" for="videocall-screenshare">
+              <input id="videocall-screenshare" ${(mod.screen_share)?`checked` : ``} type="checkbox" name="videocall-screenshare">
+                <div class="videocall-option-name">Share screen</div>
+                <i class="fa-solid fa-display"></i>
+              </label>
+            </div>
+
+            <hr>
             
+            <div class="videocall-option-label">
+              <i class="fa-solid fa-sliders"></i>
+              <div class="videocall-option-name advanced-settings-link">Module Settings</div>
+            </div>
+
           </div>
          
       `;
diff --git a/mods/stun/stun.js b/mods/stun/stun.js
index acc1768ab8..37bb3b0b23 100644
--- a/mods/stun/stun.js
+++ b/mods/stun/stun.js
@@ -313,7 +313,7 @@ class Stun extends ModTemplate {
     return true;
   }
 
-  loadSettings(container) {
+  loadSettings(container = null) {
     let as = new AppSettings(this.app, this.mod, container);
     as.render();
   }
diff --git a/mods/stun/web/css/stun-video-interface.css b/mods/stun/web/css/stun-video-interface.css
index c55f5564f0..3110ee8e2c 100644
--- a/mods/stun/web/css/stun-video-interface.css
+++ b/mods/stun/web/css/stun-video-interface.css
@@ -975,9 +975,10 @@
 
 .videocall-setting-grid-item {
   display: grid;
-  gap: 1.5rem;
   background: var(--saito-background-color);
   color: var(--saito-font-color);
+  padding: 2rem;
+  font-size: 1.75rem;
 }
 
 .videocall-option-grid {
@@ -1010,20 +1011,15 @@
 .videocall-option-label i {
   font-size: 4rem;
   color: var(--saito-font-color);
+  margin: auto;
 }
 
 .videocall-option-label i.fa-table-cells {
   font-size: 4.5rem;
-  margin-left: 0.5rem;
 }
 
 .videocall-option-label i.fa-user {
   font-size: 3.5rem;
-  margin-left: 2rem;
-}
-
-.videocall-option-input {
-  line-height: 4rem
 }
 
 .videocall-setting-icon {

From 1a5f5ffd79a083f6d843691fda89d7c7ef2fe0ba Mon Sep 17 00:00:00 2001
From: davikstone <onyeji@saito.tech>
Date: Tue, 23 Jan 2024 14:32:02 +0100
Subject: [PATCH 12/12] add eslint

---
 .github/workflows/linting.yml | 29 +++++++++++++++++++++++++++++
 1 file changed, 29 insertions(+)
 create mode 100644 .github/workflows/linting.yml

diff --git a/.github/workflows/linting.yml b/.github/workflows/linting.yml
new file mode 100644
index 0000000000..086fb3ba61
--- /dev/null
+++ b/.github/workflows/linting.yml
@@ -0,0 +1,29 @@
+name: Lint
+
+on:
+  push:
+    branches: [ "staging","master" ]
+  pull_request:
+    branches: [ staging ,"master"]
+
+jobs:
+  lint:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      security-events: write
+
+    steps:
+    - name: Checkout code
+      uses: actions/checkout@v3
+
+    - name: Set up Node.js
+      uses: actions/setup-node@v2
+      with:
+        node-version: '20'
+
+    - name: Install dependencies
+      run: npm install
+
+    - name: Run ESLint
+      run: npx eslint . --config .eslintrc.js