@delt/claude-alarm 1.0.1 → 1.1.1

package/dist/dashboard/index.html

@@ -589,8 +589,23 @@
     background: linear-gradient(180deg, rgba(245,158,11,0.08) 0%, transparent 100%);
     padding: 0;
     display: none;
+    flex-shrink: 0;
+    max-height: 45vh;
+    overflow-y: auto;
+    scrollbar-width: thin;
   }
   .permission-bar.active { display: block; }
+  .perm-count {
+    position: sticky;
+    top: 0;
+    z-index: 1;
+    padding: 6px 20px;
+    font-size: 12px;
+    font-weight: 600;
+    color: var(--yellow);
+    background: var(--surface);
+    border-bottom: 1px solid var(--border);
+  }
   .perm-item {
     display: flex;
     align-items: center;
@@ -731,6 +746,18 @@
     margin-left: 2px;
     font-weight: 400;
   }
+  .perm-actions.choices {
+    flex-direction: column;
+    gap: 6px;
+  }
+  .perm-actions .perm-choice {
+    padding: 7px 16px;
+    font-size: 13px;
+    background: var(--surface);
+    color: var(--text);
+    border: 1px solid var(--border);
+  }
+  .perm-actions .perm-choice:hover { border-color: var(--yellow); }
   /* Permission in notification panel */
   .notif-perm-actions {
     display: flex;
@@ -1405,6 +1432,9 @@
           timestamp: msg.timestamp,
           resolved: false,
           behavior: null,
+          choices: msg.choices || null,
+          sent: null,
+          outcome: null,
         });
         // Auto-select session if none selected
         if (!state.selectedSession && state.sessions[msg.sessionId]) selectSession(msg.sessionId);
@@ -1426,6 +1456,23 @@
           renderNotifications();
         }
         break;
+      case 'permission_pending':
+        for (const m of applyPendingChoices(state.permissionRequests, msg.requests || [])) {
+          handleMessage({ type: 'permission_request', ...m });
+        }
+        renderPermissionBar();
+        renderNotifications();
+        break;
+      case 'permission_resolved': {
+        const req = (state.permissionRequests[msg.sessionId] || []).find(r => r.requestId === msg.requestId);
+        if (req && !req.resolved) {
+          req.resolved = true;
+          req.outcome = msg.state;
+          renderPermissionBar();
+          renderNotifications();
+        }
+        break;
+      }
     }
   }
 
@@ -1664,7 +1711,10 @@
       if (n.permRequestId) {
         const reqs = state.permissionRequests[n.sessionId] || [];
         const req = reqs.find(r => r.requestId === n.permRequestId);
-        if (req && !req.resolved) {
+        if (req && req.choices) {
+          if (req.resolved) permButtons = `<div class="perm-resolved-label">${req.outcome === 'expired' ? 'Expired' : 'Resolved'}</div>`;
+          else if (req.sent != null) permButtons = '<div class="perm-resolved-label">Sent</div>';
+        } else if (req && !req.resolved) {
           permButtons = `<div class="notif-perm-actions">
             <button class="notif-perm-allow" data-req-id="${esc(n.permRequestId)}" data-session-id="${esc(n.sessionId)}">Allow</button>
             <button class="notif-perm-deny" data-req-id="${esc(n.permRequestId)}" data-session-id="${esc(n.sessionId)}">Deny</button>
@@ -1951,6 +2001,7 @@
     let kind = 'code';
     let lang = '';
     switch (toolName) {
+      case 'Command':
       case 'Bash':
         text = p.command ? '$ ' + p.command : raw; lang = 'bash'; break;
       case 'Write':
@@ -2001,6 +2052,47 @@
     renderNotifications();
   }
 
+  // After a reconnect the hub lists the choice requests still waiting; any other unresolved one died with the old connection.
+  function applyPendingChoices(permissionRequests, pending) {
+    const missing = pending.filter(p => !(permissionRequests[p.sessionId] || []).some(r => r.requestId === p.requestId));
+    const live = new Set(pending.map(p => p.sessionId + '\n' + p.requestId));
+    for (const [sid, reqs] of Object.entries(permissionRequests)) {
+      for (const r of reqs) {
+        if (!r.choices || r.resolved) continue;
+        if (!live.has(sid + '\n' + r.requestId)) { r.resolved = true; r.outcome = 'expired'; }
+        else r.sent = null;
+      }
+    }
+    return missing;
+  }
+
+  function sendPermissionChoice(sessionId, requestId, choiceId) {
+    if (!state.ws || state.ws.readyState !== WebSocket.OPEN) return;
+    state.ws.send(JSON.stringify({ type: 'permission_response', sessionId, requestId, choiceId }));
+    const req = (state.permissionRequests[sessionId] || []).find(r => r.requestId === requestId);
+    if (req) req.sent = choiceId;
+    renderPermissionBar();
+    renderNotifications();
+  }
+
+  function permissionActions(r, sid) {
+    const ids = `data-req-id="${esc(r.requestId)}" data-session-id="${esc(sid)}"`;
+    if (!r.choices) {
+      return `<button class="perm-allow" ${ids}>Allow <span class="perm-kbd">(Enter)</span></button>
+          <button class="perm-deny" ${ids}>Deny <span class="perm-kbd">(Esc)</span></button>`;
+    }
+    if (r.sent != null) {
+      const chosen = r.choices.find(c => c.id === r.sent);
+      return `<div class="perm-resolved-label">Sent: ${esc(chosen ? chosen.label : r.sent)}</div>`;
+    }
+    return r.choices.map(c => `<button class="perm-choice" ${ids} data-choice-id="${esc(c.id)}">${esc(c.label)}</button>`).join('');
+  }
+
+  // Codex choices have no safe default, so Enter/Esc stay with the message box for them.
+  function shortcutRequest(reqs) {
+    return reqs.find(r => !r.resolved && !r.choices);
+  }
+
   function renderPermissionBar() {
     const bar = $('#permissionBar');
     const sid = state.selectedSession;
@@ -2008,7 +2100,8 @@
     const reqs = (state.permissionRequests[sid] || []).filter(r => !r.resolved);
     if (!reqs.length) { bar.classList.remove('active'); bar.innerHTML = ''; return; }
     bar.classList.add('active');
-    bar.innerHTML = reqs.map(r => {
+    const count = reqs.length > 1 ? `<div class="perm-count">${reqs.length} permission requests waiting</div>` : '';
+    bar.innerHTML = count + reqs.map(r => {
       const { text: previewText, kind: previewKind, lang: previewLang } = formatPermPreview(r.toolName, r.inputPreview);
       const displayName = formatToolName(r.toolName, r.inputPreview);
       return `<div class="perm-item">
@@ -2017,12 +2110,10 @@
           <div class="perm-header">
             <span class="perm-tool">${esc(displayName)}</span>
           </div>
+          ${r.choices && r.description ? `<div class="perm-desc">${esc(r.description)}</div>` : ''}
           ${previewText ? renderPermPreview(previewText, previewKind, previewLang) : ''}
         </div>
-        <div class="perm-actions">
-          <button class="perm-allow" data-req-id="${esc(r.requestId)}" data-session-id="${esc(sid)}">Allow <span class="perm-kbd">(Enter)</span></button>
-          <button class="perm-deny" data-req-id="${esc(r.requestId)}" data-session-id="${esc(sid)}">Deny <span class="perm-kbd">(Esc)</span></button>
-        </div>
+        <div class="perm-actions${r.choices ? ' choices' : ''}">${permissionActions(r, sid)}</div>
       </div>`;
     }).join('');
     bindPermissionButtons(bar);
@@ -2035,6 +2126,9 @@
     (container || document).querySelectorAll('.perm-deny, .notif-perm-deny').forEach(btn => {
       btn.addEventListener('click', (e) => { e.stopPropagation(); sendPermissionVerdict(btn.dataset.sessionId, btn.dataset.reqId, 'deny'); });
     });
+    (container || document).querySelectorAll('.perm-choice').forEach(btn => {
+      btn.addEventListener('click', (e) => { e.stopPropagation(); sendPermissionChoice(btn.dataset.sessionId, btn.dataset.reqId, btn.dataset.choiceId); });
+    });
   }
 
   // Keyboard shortcuts: Enter=allow, Esc=deny — works even in textarea when permission is pending
@@ -2044,7 +2138,7 @@
     const sid = state.selectedSession;
     if (!sid) return;
     const reqs = state.permissionRequests[sid] || [];
-    const pending = reqs.find(r => !r.resolved);
+    const pending = shortcutRequest(reqs);
     if (!pending) return;
     // Permission pending: intercept Enter/Esc everywhere (even in textarea)
     // Shift+Enter in textarea still inserts newline

package/dist/hub/server.js

@@ -234,8 +234,15 @@ function sessionLabel(session) {
   return session.agentKind === "codex" ? `Codex \xB7 ${base}` : base;
 }
 
+// src/shared/permission-key.ts
+function permissionKey(sessionId, requestId) {
+  return `${sessionId}
+${requestId}`;
+}
+
 // src/hub/telegram.ts
 var TELEGRAM_API = "https://api.telegram.org/bot";
+var MAX_CHOICE_MESSAGES = 200;
 var TelegramBot = class _TelegramBot {
   config;
   offset = 0;
@@ -249,6 +256,11 @@ var TelegramBot = class _TelegramBot {
   onImageToSession;
   // Callback: when a permission verdict arrives from Telegram
   onPermissionVerdict;
+  // Callback: when a Codex approval choice arrives from Telegram
+  onChoiceVerdict;
+  // Telegram caps callback_data at 64 bytes, so buttons carry a short token instead of the ids.
+  choiceTokens = /* @__PURE__ */ new Map();
+  choiceMessages = /* @__PURE__ */ new Map();
   // Callback: get current sessions list
   getSessions;
   // Pending messages for session selection
@@ -537,6 +549,71 @@ ${previewHtml}${truncNote}`;
     };
     await this.sendMessage(text, void 0, replyMarkup);
   }
+  async sendChoiceRequest(sessionId, sessionLabel2, requestId, toolName, description, inputPreview, choices) {
+    let preview = inputPreview;
+    try {
+      const p = JSON.parse(inputPreview);
+      if (typeof p.command === "string") preview = `$ ${p.command}`;
+      else if (typeof p.content === "string") preview = p.content;
+    } catch {
+    }
+    const slice = preview.slice(0, 3e3);
+    const html = `\u26A0\uFE0F <b>Permission Request</b> \u2014 ${this.escHtml(sessionLabel2)}
+
+\u{1F527} <b>${this.escHtml(toolName)}</b>` + (description ? `
+${this.escHtml(description)}` : "") + (slice ? `
+<pre>${this.escHtml(slice)}</pre>` : "") + (preview.length > slice.length ? "\n<i>...truncated</i>" : "");
+    const entry = { html };
+    this.choiceMessages.set(permissionKey(sessionId, requestId), entry);
+    const rows = choices.map((c) => {
+      const token = randomUUID().replace(/-/g, "").slice(0, 16);
+      this.choiceTokens.set(token, { sessionId, requestId, choiceId: c.id, label: c.label });
+      return [{ text: c.label, callback_data: `pc:${token}` }];
+    });
+    this.trimChoiceMessages();
+    const sent = await this.sendMessage(html, void 0, { inline_keyboard: rows });
+    if (!sent) return;
+    entry.messageId = sent.message_id;
+    if (entry.outcome) await this.editMessageText(this.config.chatId, sent.message_id, html + entry.outcome);
+  }
+  async resolveChoiceRequest(sessionId, requestId, state) {
+    this.dropChoiceTokens(sessionId, requestId);
+    const key = permissionKey(sessionId, requestId);
+    const entry = this.choiceMessages.get(key);
+    if (!entry) return;
+    this.choiceMessages.delete(key);
+    entry.outcome = state === "resolved" ? "\n\n\u2705 <b>Resolved</b>" : "\n\n\u231B <b>Expired</b>";
+    if (entry.messageId !== void 0) await this.editMessageText(this.config.chatId, entry.messageId, entry.html + entry.outcome);
+  }
+  async handleChoiceCallback(query) {
+    const choice = this.choiceTokens.get(query.data.slice("pc:".length));
+    if (!choice) {
+      await this.answerCallbackQuery(query.id, "Expired");
+      return;
+    }
+    this.dropChoiceTokens(choice.sessionId, choice.requestId);
+    this.onChoiceVerdict?.(choice.sessionId, choice.requestId, choice.choiceId);
+    await this.answerCallbackQuery(query.id, `Sent: ${choice.label}`);
+    const entry = this.choiceMessages.get(permissionKey(choice.sessionId, choice.requestId));
+    if (entry?.messageId !== void 0 && !entry.outcome) {
+      await this.editMessageText(this.config.chatId, entry.messageId, `${entry.html}
+
+\u23F3 <b>Sent: ${this.escHtml(choice.label)}</b>`);
+    }
+  }
+  dropChoiceTokens(sessionId, requestId) {
+    for (const [token, c] of this.choiceTokens) {
+      if (c.sessionId === sessionId && c.requestId === requestId) this.choiceTokens.delete(token);
+    }
+  }
+  trimChoiceMessages() {
+    while (this.choiceMessages.size > MAX_CHOICE_MESSAGES) {
+      const oldest = this.choiceMessages.keys().next().value;
+      this.choiceMessages.delete(oldest);
+      const [sessionId, requestId] = oldest.split("\n");
+      this.dropChoiceTokens(sessionId, requestId);
+    }
+  }
   async handleCallbackQuery(query) {
     if (!query.data) return;
     if (String(query.message?.chat.id) !== String(this.config.chatId)) return;
@@ -544,6 +621,10 @@ ${previewHtml}${truncNote}`;
       await this.handleSessionSelectCallback(query);
       return;
     }
+    if (query.data.startsWith("pc:")) {
+      await this.handleChoiceCallback(query);
+      return;
+    }
     if (!query.data.startsWith("perm:")) return;
     const parts = query.data.split(":");
     if (parts.length < 4) return;
@@ -899,6 +980,11 @@ function isSecureRequest(req) {
 // src/hub/server.ts
 var __dirname = path5.dirname(fileURLToPath(import.meta.url));
 var MAX_WS_PAYLOAD = 16 * 1024 * 1024;
+function validChoices(choices) {
+  if (!Array.isArray(choices)) return void 0;
+  const valid = choices.filter((c) => typeof c?.id === "string" && typeof c?.label === "string");
+  return valid.length ? valid : void 0;
+}
 var HubServer = class {
   httpServer;
   wssChannel;
@@ -917,6 +1003,8 @@ var HubServer = class {
   channelAlive = /* @__PURE__ */ new Map();
   // sessionId -> alive flag
   socketOwners = /* @__PURE__ */ new WeakMap();
+  // Codex approvals carry their own choices; a response is forwarded only in the mode of the request it answers.
+  choiceRequests = /* @__PURE__ */ new Map();
   host;
   port;
   token;
@@ -1054,6 +1142,7 @@ var HubServer = class {
       this.channelSockets.delete(sessionId);
       this.localChannels.delete(sessionId);
       this.channelAlive.delete(sessionId);
+      this.expireChoices(sessionId);
       if (session) {
         this.broadcastToDashboards({ type: "session_disconnected", sessionId });
         this.jsonResponse(res, 200, { ok: true });
@@ -1197,6 +1286,7 @@ var HubServer = class {
           this.channelSockets.delete(sessionId);
           this.localChannels.delete(sessionId);
           this.channelAlive.delete(sessionId);
+          this.expireChoices(sessionId);
           logger.info(`Channel disconnected: ${sessionId}`);
           this.broadcastToDashboards({
             type: "session_disconnected",
@@ -1284,7 +1374,22 @@ var HubServer = class {
       }
       case "permission_request": {
         this.sessions.updateActivity(msg.sessionId);
+        const choices = validChoices(msg.choices);
         logger.info(`Permission request [${msg.requestId}] from ${msg.sessionId}: ${msg.toolName}`);
+        if (choices) {
+          this.choiceRequests.set(permissionKey(msg.sessionId, msg.requestId), {
+            request: {
+              sessionId: msg.sessionId,
+              requestId: msg.requestId,
+              toolName: msg.toolName,
+              description: msg.description,
+              inputPreview: msg.inputPreview,
+              timestamp: msg.timestamp,
+              choices
+            },
+            choiceIds: new Set(choices.map((c) => c.id))
+          });
+        }
         this.broadcastToDashboards({
           type: "permission_request",
           sessionId: msg.sessionId,
@@ -1292,15 +1397,23 @@ var HubServer = class {
           toolName: msg.toolName,
           description: msg.description,
           inputPreview: msg.inputPreview,
-          timestamp: msg.timestamp
+          timestamp: msg.timestamp,
+          ...choices ? { choices } : {}
         });
         if (this.telegramBot) {
-          const session = this.sessions.get(msg.sessionId);
-          const label = this.getSessionLabel(session);
-          this.telegramBot.sendPermissionRequest(msg.sessionId, label, msg.requestId, msg.toolName, msg.description, msg.inputPreview);
+          const label = this.getSessionLabel(this.sessions.get(msg.sessionId));
+          if (choices) {
+            void this.telegramBot.sendChoiceRequest(msg.sessionId, label, msg.requestId, msg.toolName, msg.description, msg.inputPreview, choices);
+          } else {
+            this.telegramBot.sendPermissionRequest(msg.sessionId, label, msg.requestId, msg.toolName, msg.description, msg.inputPreview);
+          }
         }
         break;
       }
+      case "permission_resolved": {
+        this.resolveChoice(msg.sessionId, msg.requestId, msg.state === "expired" ? "expired" : "resolved");
+        break;
+      }
     }
   }
   // --- Dashboard WebSocket ---
@@ -1316,6 +1429,11 @@ var HubServer = class {
       sessions: this.sessions.getAll()
     };
     ws.send(JSON.stringify(sessionsMsg));
+    const pendingMsg = {
+      type: "permission_pending",
+      requests: [...this.choiceRequests.values()].map((c) => c.request)
+    };
+    ws.send(JSON.stringify(pendingMsg));
     ws.on("message", (data) => {
       try {
         const msg = JSON.parse(data.toString());
@@ -1327,10 +1445,9 @@ var HubServer = class {
         } else if (msg.type === "image_upload") {
           this.handleImageUpload(msg);
         } else if (msg.type === "permission_response") {
-          const channelWs = this.channelSockets.get(msg.sessionId);
-          if (channelWs?.readyState === WebSocket.OPEN) {
-            channelWs.send(JSON.stringify(msg));
-            logger.info(`Permission verdict [${msg.requestId}]: ${msg.behavior} -> session ${msg.sessionId}`);
+          if (this.forwardPermissionResponse(msg)) {
+            const verdict = msg.choiceId !== void 0 ? `choice ${msg.choiceId}` : msg.behavior;
+            logger.info(`Permission verdict [${msg.requestId}]: ${verdict} -> session ${msg.sessionId}`);
           }
         }
       } catch {
@@ -1343,6 +1460,32 @@ var HubServer = class {
     });
   }
   // --- Helpers ---
+  forwardPermissionResponse(msg) {
+    const pending = this.choiceRequests.get(permissionKey(msg.sessionId, msg.requestId));
+    let out;
+    if (pending) {
+      if (typeof msg.choiceId !== "string" || !pending.choiceIds.has(msg.choiceId)) return false;
+      out = { type: "permission_response", sessionId: msg.sessionId, requestId: msg.requestId, choiceId: msg.choiceId };
+    } else {
+      if (msg.behavior !== "allow" && msg.behavior !== "deny" || msg.choiceId !== void 0) return false;
+      if (this.sessions.get(msg.sessionId)?.agentKind === "codex") return false;
+      out = { type: "permission_response", sessionId: msg.sessionId, requestId: msg.requestId, behavior: msg.behavior };
+    }
+    const channelWs = this.channelSockets.get(msg.sessionId);
+    if (channelWs?.readyState !== WebSocket.OPEN) return false;
+    channelWs.send(JSON.stringify(out));
+    return true;
+  }
+  resolveChoice(sessionId, requestId, state) {
+    if (!this.choiceRequests.delete(permissionKey(sessionId, requestId))) return;
+    this.broadcastToDashboards({ type: "permission_resolved", sessionId, requestId, state });
+    void this.telegramBot?.resolveChoiceRequest(sessionId, requestId, state);
+  }
+  expireChoices(sessionId) {
+    for (const pending of [...this.choiceRequests.values()]) {
+      if (pending.request.sessionId === sessionId) this.resolveChoice(sessionId, pending.request.requestId, "expired");
+    }
+  }
   broadcastToDashboards(msg) {
     const payload = JSON.stringify(msg);
     for (const ws of this.dashboardSockets) {
@@ -1426,14 +1569,16 @@ var HubServer = class {
       }
     };
     this.telegramBot.onPermissionVerdict = (sessionId, requestId, behavior) => {
-      const channelWs = this.channelSockets.get(sessionId);
-      if (channelWs?.readyState === WebSocket.OPEN) {
-        const msg = { type: "permission_response", sessionId, requestId, behavior };
-        channelWs.send(JSON.stringify(msg));
+      if (this.forwardPermissionResponse({ sessionId, requestId, behavior })) {
         logger.info(`Telegram permission verdict [${requestId}]: ${behavior} -> session ${sessionId}`);
       }
       this.broadcastToDashboards({ type: "permission_response", sessionId, requestId, behavior });
     };
+    this.telegramBot.onChoiceVerdict = (sessionId, requestId, choiceId) => {
+      if (this.forwardPermissionResponse({ sessionId, requestId, choiceId })) {
+        logger.info(`Telegram choice [${requestId}]: ${choiceId} -> session ${sessionId}`);
+      }
+    };
     this.notifier.configure({ telegramBot: this.telegramBot });
     this.telegramBot.startPolling();
     logger.info("Telegram bot initialized");