airlock-bot 0.2.37 → 0.2.38

package/dist/configure-web/cli.js

@@ -1,5 +1,6 @@
 import { randomBytes } from 'crypto';
 import { existsSync, readFileSync, writeFileSync, copyFileSync } from 'fs';
+import { isIP } from 'net';
 import { parseArgs } from 'util';
 import Fastify from 'fastify';
 import { parse as parseYaml, stringify as stringifyYaml } from 'yaml';
@@ -25,6 +26,8 @@ Options:
   -c, --config <path>   Airlock config file (default: ./airlock.yaml)
   -p, --port <port>     Web UI port (default: 4177)
       --host <host>     Bind host (default: 127.0.0.1)
+      --insecure-remote-bind
+                         Allow binding the unauthenticated UI beyond loopback
   -h, --help            Show this help
 `;
 const RUN_HELP = `
@@ -37,6 +40,8 @@ Options:
   -c, --config <path>   Airlock config file (default: ./airlock.yaml)
   -p, --port <port>     Web UI port (default: 4177)
       --host <host>     Bind host (default: 127.0.0.1)
+      --insecure-remote-bind
+                         Allow binding the unauthenticated UI beyond loopback
   -h, --help            Show this help
 `;
 const DASHBOARD_HELP = `
@@ -49,7 +54,8 @@ Options:
   -c, --config <path>             Airlock config file (default: ./airlock.yaml)
   -p, --port <port>               Web UI port (default: 4177)
       --host <host>               Bind host (default: 127.0.0.1)
-      --gateway-url <url>         Gateway URL (default: http://127.0.0.1:4111)
+      --insecure-remote-bind      Allow binding the unauthenticated dashboard beyond loopback
+      --gateway-url <url>         Gateway management API URL (default: http://127.0.0.1:4113)
       --gateway-secret <secret>   Gateway admin bearer token (default: AIRLOCK_GATEWAY_SECRET or AIRLOCK_API_SECRET)
   -h, --help                      Show this help
 `;
@@ -63,8 +69,9 @@ export async function runDashboard(argv) {
             config: { type: 'string', short: 'c', default: './airlock.yaml' },
             port: { type: 'string', short: 'p', default: '4177' },
             host: { type: 'string', default: '127.0.0.1' },
-            'gateway-url': { type: 'string', default: 'http://127.0.0.1:4111' },
+            'gateway-url': { type: 'string', default: 'http://127.0.0.1:4113' },
             'gateway-secret': { type: 'string' },
+            'insecure-remote-bind': { type: 'boolean', default: false },
             help: { type: 'boolean', short: 'h', default: false },
         },
         allowPositionals: false,
@@ -76,13 +83,14 @@ export async function runDashboard(argv) {
     const configPath = values.config ?? './airlock.yaml';
     const port = Number(values.port ?? '4177');
     const host = values.host ?? '127.0.0.1';
-    const gatewayUrl = values['gateway-url'] ?? 'http://127.0.0.1:4111';
+    const gatewayUrl = values['gateway-url'] ?? 'http://127.0.0.1:4113';
     const gatewaySecret = values['gateway-secret'] ??
         process.env['AIRLOCK_GATEWAY_SECRET'] ??
         process.env['AIRLOCK_API_SECRET'];
     if (!Number.isInteger(port) || port < 1 || port > 65535) {
         throw new Error(`Invalid --port: ${values.port}`);
     }
+    assertSafeWebBindHost(host, values['insecure-remote-bind'] === true);
     const app = createConfigureWebApp(configPath, {
         remoteGateway: { url: gatewayUrl, secret: gatewaySecret },
     });
@@ -98,6 +106,7 @@ export async function runConfigureWeb(argv, entrypoint = 'configure-web') {
             config: { type: 'string', short: 'c', default: './airlock.yaml' },
             port: { type: 'string', short: 'p', default: '4177' },
             host: { type: 'string', default: '127.0.0.1' },
+            'insecure-remote-bind': { type: 'boolean', default: false },
             help: { type: 'boolean', short: 'h', default: false },
         },
         allowPositionals: false,
@@ -112,11 +121,28 @@ export async function runConfigureWeb(argv, entrypoint = 'configure-web') {
     if (!Number.isInteger(port) || port < 1 || port > 65535) {
         throw new Error(`Invalid --port: ${values.port}`);
     }
+    assertSafeWebBindHost(host, values['insecure-remote-bind'] === true);
     const app = createConfigureWebApp(configPath);
     await app.listen({ host, port });
     console.log(`Airlock command center running at http://${host}:${port}`);
     console.log(`Editing ${configPath}`);
 }
+export function assertSafeWebBindHost(host, insecureRemoteBind) {
+    if (insecureRemoteBind || isLoopbackBindHost(host))
+        return;
+    throw new Error('--host binds the unauthenticated Airlock web UI beyond loopback. Use --insecure-remote-bind only when the port is protected by a private network, tunnel, or authenticated reverse proxy.');
+}
+function isLoopbackBindHost(host) {
+    const normalized = host.startsWith('[') && host.endsWith(']') ? host.slice(1, -1) : host;
+    if (normalized === 'localhost')
+        return true;
+    const ipVersion = isIP(normalized);
+    if (ipVersion === 6)
+        return normalized === '::1';
+    if (ipVersion !== 4)
+        return false;
+    return Number(normalized.split('.')[0]) === 127;
+}
 export function createConfigureWebApp(configPath, options = {}) {
     const app = Fastify({ logger: false });
     app.get('/', async (_request, reply) => {
@@ -152,6 +178,18 @@ export function createConfigureWebApp(configPath, options = {}) {
             };
         }
     });
+    app.get('/api/activity', async (_request, reply) => {
+        try {
+            if (options.remoteGateway) {
+                return await remoteGatewayJson(options.remoteGateway, '/activity');
+            }
+            return { events: [] };
+        }
+        catch (err) {
+            reply.code(500);
+            return { events: [], error: err instanceof Error ? err.message : String(err) };
+        }
+    });
     app.get('/api/tools', async (_request, reply) => {
         try {
             if (options.remoteGateway) {
@@ -483,7 +521,7 @@ async function rememberRemoteDecision(configPath, remoteGateway, code, remember,
         return { status: 400, error: 'Invalid remember mode' };
     }
     const pending = await remoteGatewayJson(remoteGateway, '/hitl/pending');
-    const request = pending.find((entry) => entry.code === code || entry.id === code);
+    const request = pending.find((entry) => entry.code === code);
     if (!request)
         return { status: 404, error: 'No pending request found for code' };
     const durationMs = typeof durationMsValue === 'string' && durationMsValue.trim()
@@ -1310,6 +1348,17 @@ const INDEX_HTML = `<!doctype html>
       border-color: #f1d99a;
       background: #fffaf0;
     }
+    .log-row.question {
+      border-color: #c8d7ef;
+      background: #f3f7ff;
+    }
+    .log-row.notification {
+      border-color: #c8d7ef;
+      background: #f7fbff;
+    }
+    .log-row.log {
+      background: #fbfcfe;
+    }
     .log-cell {
       min-width: 0;
       overflow-wrap: anywhere;
@@ -1873,8 +1922,9 @@ const INDEX_HTML = `<!doctype html>
       config: null,
       status: null,
       audit: { dbPath: '', entries: [], pending: [] },
-      livePending: {},
-      currentApprovalCode: '',
+      activityEvents: [],
+      livePendingById: {},
+      currentApprovalId: '',
       activityAgentId: '',
       auditFilters: { agent: '', tool: '', since: '', limit: '50' },
       tools: [],
@@ -1959,7 +2009,13 @@ const INDEX_HTML = `<!doctype html>
         for (const [key, value] of Object.entries(state.auditFilters)) {
           if (String(value || '').trim()) params.set(key, String(value).trim());
         }
-        state.audit = await api('/api/logs' + (params.toString() ? '?' + params.toString() : ''));
+        const [audit, activity] = await Promise.all([
+          api('/api/logs' + (params.toString() ? '?' + params.toString() : '')),
+          api('/api/activity')
+        ]);
+        state.audit = audit;
+        state.activityEvents = Array.isArray(activity.events) ? activity.events : [];
+        reconcileLivePendingWithSnapshot();
         render();
       } catch (error) {
         alert(error.message);
@@ -2046,26 +2102,41 @@ const INDEX_HTML = `<!doctype html>
     }
 
     function pendingApprovals(agentId = '') {
-      const byCode = new Map();
-      for (const request of Object.values(state.livePending || {})) {
-        const pending = normalizePending(request, true);
-        if (pending.code && (!agentId || pending.agentId === agentId)) byCode.set(pending.code, pending);
-      }
+      const byId = new Map();
       for (const request of state.audit.pending || []) {
         const pending = normalizePending(request, false);
-        if (pending.code && (!agentId || pending.agentId === agentId) && !byCode.has(pending.code)) byCode.set(pending.code, pending);
+        if (pending.id && (!agentId || pending.agentId === agentId)) byId.set(pending.id, pending);
+      }
+      for (const request of Object.values(state.livePendingById || {})) {
+        const pending = normalizePending(request, true);
+        if (pending.id && (!agentId || pending.agentId === agentId) && !byId.has(pending.id)) {
+          byId.set(pending.id, pending);
+        }
+      }
+      return Array.from(byId.values());
+    }
+
+    function reconcileLivePendingWithSnapshot() {
+      const snapshotIds = new Set(
+        (state.audit.pending || [])
+          .map((request) => normalizePending(request, false).id)
+          .filter(Boolean)
+      );
+      for (const id of Object.keys(state.livePendingById || {})) {
+        if (!snapshotIds.has(id)) delete state.livePendingById[id];
       }
-      return Array.from(byCode.values());
     }
 
     function normalizePending(request, live) {
       const args = live ? request.args : parseArgs(request.args);
+      const context = request.context || airlockContext(args);
       return {
         id: request.id || '',
         code: request.code || '',
         agentId: request.agentId || request.agent_id || '',
         tool: request.tool || '',
-        args,
+        args: stripAirlockContext(args),
+        context,
         status: request.status || 'pending',
         createdAt: request.createdAt || request.created_at || '',
         timeoutMs: request.timeoutMs || 0,
@@ -2084,19 +2155,37 @@ const INDEX_HTML = `<!doctype html>
       }
     }
 
+    function airlockContext(args) {
+      const raw = args && typeof args === 'object' ? args._airlock : undefined;
+      if (!raw || typeof raw !== 'object' || Array.isArray(raw)) return undefined;
+      const context = {};
+      if (typeof raw.reason === 'string' && raw.reason.trim()) context.reason = raw.reason.trim();
+      if (typeof raw.note === 'string' && raw.note.trim()) context.note = raw.note.trim();
+      return context.reason || context.note ? context : undefined;
+    }
+
+    function stripAirlockContext(args) {
+      if (!args || typeof args !== 'object' || Array.isArray(args) || !('_airlock' in args)) return args;
+      const clean = { ...args };
+      delete clean._airlock;
+      return clean;
+    }
+
     function renderActivity() {
       el('activitySurface').hidden = state.activeKind !== 'activity';
       renderActivityAgentFilter();
       const agentId = state.auditFilters.agent || state.activityAgentId || '';
       const pending = pendingApprovals(agentId);
       const entries = state.audit.entries || [];
+      const activity = activityEvents(agentId);
       const rows = [
         ...pending.map(pendingRow),
+        ...activity.map(activityRow),
         ...entries.map(auditRow)
       ];
       el('pendingBadge').textContent = 'pending ' + pending.length;
       el('activityMeta').textContent = state.audit.dbPath
-        ? 'Audit log: ' + state.audit.dbPath + (agentId ? ' · agent ' + agentId : '')
+        ? 'Activity events ' + activity.length + ' · Audit log: ' + state.audit.dbPath + (agentId ? ' · agent ' + agentId : '')
         : 'Audit log not loaded yet';
       el('activityList').innerHTML = rows.length
         ? rows.join('')
@@ -2104,7 +2193,7 @@ const INDEX_HTML = `<!doctype html>
       document.querySelectorAll('[data-pending-row]').forEach((row) => {
         row.addEventListener('click', (event) => {
           if (event.target.closest('[data-approval-action]')) return;
-          openApprovalModal(row.dataset.code);
+          openApprovalModal(row.dataset.id);
         });
       });
       document.querySelectorAll('[data-approval-action]').forEach((button) => {
@@ -2120,6 +2209,10 @@ const INDEX_HTML = `<!doctype html>
       });
     }
 
+    function activityEvents(agentId = '') {
+      return (state.activityEvents || []).filter((event) => !agentId || event.agentId === agentId);
+    }
+
     function renderActivityAgentFilter() {
       const agents = Object.keys(state.config.agents);
       if (!state.activityAgentId) state.activityAgentId = agents[0] || '';
@@ -2131,25 +2224,29 @@ const INDEX_HTML = `<!doctype html>
     }
 
     function pendingRow(entry) {
-      return '<div class="log-row pending" data-pending-row data-code="' + escapeHtml(entry.code) + '">' +
-        '<div class="log-cell"><strong>pending approval</strong><br>' + escapeHtml(formatTime(entry.createdAt)) + '</div>' +
+      const question = isUserQuestion(entry);
+      return '<div class="log-row pending' + (question ? ' question' : '') + '" data-pending-row data-id="' + escapeHtml(entry.id) + '" data-code="' + escapeHtml(entry.code) + '">' +
+        '<div class="log-cell"><strong>' + escapeHtml(question ? 'pending question' : 'pending approval') + '</strong><br>' + escapeHtml(formatTime(entry.createdAt)) + '</div>' +
         '<div class="log-cell">' + escapeHtml(entry.agentId) + '</div>' +
-        '<div class="log-cell">' + escapeHtml(entry.tool) + '<br><span class="subtle">code ' + escapeHtml(entry.code) + '</span></div>' +
-        '<div class="log-cell"><span class="tag tag-warn">' + escapeHtml(entry.status) + '</span></div>' +
-        '<pre class="log-args">' + escapeHtml(prettyJson(entry.args)) + '</pre>' +
-        '<div class="approval-actions">' + approvalButtons(entry.code) + '</div>' +
+        '<div class="log-cell">' + escapeHtml(question ? questionText(entry) : entry.tool) + '<br><span class="subtle">' + escapeHtml(question ? entry.tool : 'code ' + entry.code) + '</span></div>' +
+        '<div class="log-cell"><span class="tag tag-warn">' + escapeHtml(question ? 'question' : entry.status) + '</span></div>' +
+        '<pre class="log-args">' + escapeHtml(question ? questionPreview(entry) : approvalPreview(entry)) + '</pre>' +
+        '<div class="approval-actions">' + approvalButtons(entry.code, { remember: !question, approveLabel: question ? 'Confirm' : 'Approve' }) + '</div>' +
       '</div>';
     }
 
-    function approvalButtons(code) {
-      return '<button class="approve" data-approval-action="approve" data-code="' + escapeHtml(code) + '">Approve</button>' +
-        '<button class="approve" data-approval-action="approve" data-code="' + escapeHtml(code) + '" data-remember="temporary" data-duration="3600000">Allow 1h</button>' +
-        '<button class="approve" data-approval-action="approve" data-code="' + escapeHtml(code) + '" data-remember="always">Always Allow</button>' +
+    function approvalButtons(code, options = {}) {
+      const approveLabel = options.approveLabel || 'Approve';
+      const remember = options.remember !== false;
+      return '<button class="approve" data-approval-action="approve" data-code="' + escapeHtml(code) + '">' + escapeHtml(approveLabel) + '</button>' +
+        (remember ? '<button class="approve" data-approval-action="approve" data-code="' + escapeHtml(code) + '" data-remember="temporary" data-duration="3600000">Allow 1h</button>' : '') +
+        (remember ? '<button class="approve" data-approval-action="approve" data-code="' + escapeHtml(code) + '" data-remember="always">Always Allow</button>' : '') +
         '<button class="deny" data-approval-action="deny" data-code="' + escapeHtml(code) + '">Deny</button>';
     }
 
     async function actApproval(action, code, remember, durationMs) {
       if (!code) return;
+      const pending = findPendingApproval(code);
       const params = new URLSearchParams({ code });
       if (remember) params.set('remember', remember);
       if (durationMs) params.set('duration_ms', durationMs);
@@ -2164,7 +2261,7 @@ const INDEX_HTML = `<!doctype html>
         }
         throw new Error(message);
       }
-      delete state.livePending[code];
+      if (pending?.id) delete state.livePendingById[pending.id];
       closeApprovalModal();
       await Promise.all([refreshLogs(), refreshStatus()]);
       render();
@@ -2172,21 +2269,26 @@ const INDEX_HTML = `<!doctype html>
 
     function findPendingApproval(code) {
       const agentId = state.activeKind === 'activity' ? state.auditFilters.agent || '' : '';
-      return pendingApprovals(agentId).find((entry) => entry.code === code);
+      return pendingApprovals(agentId).find((entry) => entry.id === code || entry.code === code);
     }
 
-    function openApprovalModal(code) {
-      const pending = findPendingApproval(code);
+    function openApprovalModal(id) {
+      const pending = findPendingApproval(id);
       if (!pending) return;
-      state.currentApprovalCode = code;
-      el('approvalModalTitle').textContent = pending.tool;
+      state.currentApprovalId = pending.id;
+      const question = isUserQuestion(pending);
+      el('approvalModalTitle').textContent = question ? questionText(pending) : pending.tool;
       el('approvalModalMeta').textContent = 'agent ' + pending.agentId + ' · code ' + pending.code;
       el('approvalModalBody').innerHTML =
         '<div class="detail-label">Status</div><div>' + escapeHtml(pending.status) + '</div>' +
         '<div class="detail-label">Created</div><div>' + escapeHtml(formatTime(pending.createdAt)) + '</div>' +
         (pending.timeoutMs ? '<div class="detail-label">Timeout</div><div>' + Math.round(pending.timeoutMs / 1000) + 's</div>' : '') +
+        (requestReason(pending) ? '<div class="detail-label">Request reason</div><div>' + escapeHtml(requestReason(pending)) + '</div>' : '') +
+        (requestNote(pending) ? '<div class="detail-label">Request note</div><div>' + escapeHtml(requestNote(pending)) + '</div>' : '') +
+        (question ? '<div class="detail-label">Question</div><div>' + escapeHtml(questionText(pending)) + '</div>' : '') +
+        (question && questionContext(pending) ? '<div class="detail-label">Context</div><div>' + escapeHtml(questionContext(pending)) + '</div>' : '') +
         '<div class="detail-label">Arguments</div><pre class="log-args">' + escapeHtml(prettyJson(pending.args)) + '</pre>';
-      el('approvalModalFooter').innerHTML = approvalButtons(pending.code);
+      el('approvalModalFooter').innerHTML = approvalButtons(pending.code, { remember: !question, approveLabel: question ? 'Confirm' : 'Approve' });
       el('approvalModal').classList.add('open');
       el('approvalModalFooter').querySelectorAll('[data-approval-action]').forEach((button) => {
         button.addEventListener('click', () => {
@@ -2202,7 +2304,58 @@ const INDEX_HTML = `<!doctype html>
 
     function closeApprovalModal() {
       el('approvalModal').classList.remove('open');
-      state.currentApprovalCode = '';
+      state.currentApprovalId = '';
+    }
+
+    function isUserQuestion(entry) {
+      return entry.tool === 'airlock/ask_user';
+    }
+
+    function questionText(entry) {
+      const value = entry.args?.question ?? entry.args?.title ?? entry.args?.message;
+      return typeof value === 'string' && value.trim() ? value.trim() : 'Question from agent';
+    }
+
+    function questionContext(entry) {
+      const value = entry.args?.context ?? entry.args?.reason;
+      return typeof value === 'string' && value.trim() ? value.trim() : '';
+    }
+
+    function questionPreview(entry) {
+      const lines = ['question: ' + questionText(entry)];
+      const context = questionContext(entry);
+      if (context) lines.push('context: ' + context);
+      return lines.join('\\n');
+    }
+
+    function requestReason(entry) {
+      const value = entry.context?.reason;
+      return typeof value === 'string' && value.trim() ? value.trim() : '';
+    }
+
+    function requestNote(entry) {
+      const value = entry.context?.note;
+      return typeof value === 'string' && value.trim() ? value.trim() : '';
+    }
+
+    function approvalPreview(entry) {
+      const lines = [];
+      const reason = requestReason(entry);
+      const note = requestNote(entry);
+      if (reason) lines.push('request reason: ' + reason);
+      if (note) lines.push('request note: ' + note);
+      lines.push(prettyJson(entry.args));
+      return lines.join('\\n');
+    }
+
+    function activityRow(event) {
+      const tag = event.kind === 'notification' ? 'tag-warn' : resultTagClass(event.severity || 'info');
+      return '<div class="log-row ' + escapeHtml(event.kind) + '">' +
+        '<div class="log-cell"><strong>' + escapeHtml(event.kind) + '</strong><br>' + escapeHtml(formatTime(event.createdAt)) + '</div>' +
+        '<div class="log-cell">' + escapeHtml(event.agentId || '') + '</div>' +
+        '<div class="log-cell">' + escapeHtml(event.title || '') + '<br><span class="subtle">' + escapeHtml(event.body || '') + '</span></div>' +
+        '<div class="log-cell"><span class="tag ' + tag + '">' + escapeHtml(event.severity || 'info') + '</span></div>' +
+      '</div>';
     }
 
     function auditRow(entry) {
@@ -2874,17 +3027,31 @@ const INDEX_HTML = `<!doctype html>
       events.onmessage = (event) => {
         const message = JSON.parse(event.data);
         if (message.type === 'new') {
-          state.livePending[message.request.code] = message.request;
-          notifyApproval(message.request);
-          refreshLogs().catch(() => {});
-          render();
+          const request = message.request || {};
+          if (request.id) {
+            state.livePendingById[request.id] = request;
+            notifyApproval(request);
+            refreshLogs().catch(() => {});
+            render();
+          }
         }
         if (message.type === 'resolved') {
-          delete state.livePending[message.code];
+          if (message.id) {
+            delete state.livePendingById[message.id];
+          } else if (message.code) {
+            for (const [id, request] of Object.entries(state.livePendingById || {})) {
+              if (request && request.code === message.code) delete state.livePendingById[id];
+            }
+          }
           refreshLogs().catch(() => {});
           refreshStatus().catch(() => {});
           render();
         }
+        if (message.type === 'activity') {
+          upsertActivityEvent(message.event);
+          notifyActivity(message.event);
+          render();
+        }
       };
       events.onerror = () => {
         events.close();
@@ -2894,13 +3061,36 @@ const INDEX_HTML = `<!doctype html>
     function notifyApproval(request) {
       if (!el('approvalNotifs').checked) return;
       if (!('Notification' in window) || Notification.permission !== 'granted') return;
+      const pending = normalizePending(request, true);
+      const lines = ['agent: ' + pending.agentId, pending.code];
+      const reason = requestReason(pending);
+      if (reason) lines.push('request reason: ' + reason);
       new Notification('Airlock: ' + request.tool, {
-        body: 'agent: ' + request.agentId + '\\n' + request.code,
-        tag: request.code,
+        body: lines.join('\\n'),
+        tag: request.id || request.code,
+        silent: !el('approvalSound').checked
+      });
+    }
+
+    function notifyActivity(event) {
+      if (!event || event.kind !== 'notification') return;
+      if (!el('approvalNotifs').checked) return;
+      if (!('Notification' in window) || Notification.permission !== 'granted') return;
+      new Notification(event.title || 'Airlock notification', {
+        body: event.body || '',
+        tag: event.id,
         silent: !el('approvalSound').checked
       });
     }
 
+    function upsertActivityEvent(event) {
+      if (!event || !event.id) return;
+      state.activityEvents = [
+        event,
+        ...(state.activityEvents || []).filter((existing) => existing.id !== event.id)
+      ].slice(0, 200);
+    }
+
     async function checkVersion() {
       try {
         const current = await fetch('/version').then((response) => response.json());
@@ -2923,10 +3113,10 @@ const INDEX_HTML = `<!doctype html>
       return false;
     }
 
-    function firstPendingCode() {
+    function firstPendingApprovalId() {
       const agentId = state.activeKind === 'activity' ? state.auditFilters.agent || '' : '';
       const first = pendingApprovals(agentId)[0];
-      return first ? first.code : '';
+      return first ? first.id : '';
     }
 
     el('refreshTools').addEventListener('click', refreshTools);
@@ -2981,9 +3171,10 @@ const INDEX_HTML = `<!doctype html>
       if (target && ['INPUT', 'TEXTAREA', 'SELECT'].includes(target.tagName)) return;
       const key = event.key.toLowerCase();
       if (key !== 'a' && key !== 'd') return;
-      const code = state.currentApprovalCode || firstPendingCode();
-      if (!code) return;
-      actApproval(key === 'a' ? 'approve' : 'deny', code).catch((error) => alert(error.message));
+      const id = state.currentApprovalId || firstPendingApprovalId();
+      const pending = findPendingApproval(id);
+      if (!pending?.code) return;
+      actApproval(key === 'a' ? 'approve' : 'deny', pending.code).catch((error) => alert(error.message));
     });
 
     initApprovalSettings();