@devchitchat/chat 4.4.0 → 4.4.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devchitchat/chat",
-  "version": "4.4.0",
+  "version": "4.4.2",
   "description": "A small chat app. p2p video and screenshare.",
   "scripts": {
     "dev": "bun --watch index.js",

package/pages/channels/[channelId].phtml

@@ -213,7 +213,10 @@
   </div>
   <footer class="thread-composer">
     <textarea class="thread-textarea" id="thread-input" placeholder="Reply in thread…" rows="2" aria-label="Reply in thread"></textarea>
-    <button class="btn-send thread-send-btn" id="thread-send" type="button">Reply</button>
+    <div class="thread-composer-actions">
+      <button class="btn-icon thread-panel-close thread-close-mobile" aria-label="Close thread" type="button">Close thread</button>
+      <button class="btn-send thread-send-btn" id="thread-send" type="button">Reply</button>
+    </div>
   </footer>
 </div>
 

package/pages/public/client/islands/call.js

@@ -502,7 +502,6 @@ export default function CallIsland(root) {
   const threadRepliesEl = document.getElementById('thread-replies')
   const threadInputEl  = document.getElementById('thread-input')
   const threadSendBtn  = document.getElementById('thread-send')
-  const threadCloseBtn = document.getElementById('thread-panel-close')
 
   let activeThreadParentId = null
 
@@ -553,7 +552,10 @@ export default function CallIsland(root) {
     if (threadRepliesEl) threadRepliesEl.innerHTML = ''
   }
 
-  threadCloseBtn?.addEventListener('click', closeThread)
+  // Use delegation so both the top ✕ and the mobile footer "Close thread" button work
+  threadPanelEl?.addEventListener('click', e => {
+    if (e.target.closest('.thread-panel-close')) closeThread()
+  })
 
   function sendThreadReply() {
     const text = threadInputEl?.value.trim()

package/pages/public/themes/base.css

@@ -1457,7 +1457,26 @@ mark { background: color-mix(in srgb, var(--accent) 30%, transparent); color: va
 
 /* Mobile: full-width overlay */
 @media (max-width: 700px) {
-  .thread-panel { width: 100%; }
+  .thread-panel {
+    width: 100%;
+    /* Push header below notch/Dynamic Island on iPhone PWA */
+    padding-top: env(safe-area-inset-top);
+  }
+  .thread-close-mobile { display: inline-flex; }
+}
+
+.thread-composer-actions {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap: 8px;
+}
+
+.thread-close-mobile {
+  display: none; /* desktop: hidden; mobile: shown via media query above */
+  font-size: 13px;
+  opacity: 0.7;
+  margin-right: auto; /* push Reply button to the right */
 }
 
 /* ── Call: status row (shown when a call is active, user hasn't joined) ──── */