@lazyingart/agintiflow 0.12.7 → 0.12.8

package/README.md

@@ -365,7 +365,7 @@ Package policy values:
 
 Toolchain commands such as `python3 plot.py`, `latexmk -pdf paper.tex`, and `pdflatex -interaction=nonstopmode -halt-on-error paper.tex` are allowlisted only when the shell tool is enabled. In Docker mode the project folder is mounted as `/workspace`; any file written to `/workspace/report.pdf` appears on the host as `<your-project>/report.pdf`. CLI runs print both the host workspace and the Docker mapping before execution. File and canvas tools accept both normal relative paths and Docker virtual paths like `/workspace/report.pdf`, while other absolute host paths remain blocked.
 
-The web chat mirrors the CLI session store. Enter sends, Ctrl+J inserts a newline, Tab submits/queues the message, and Esc stops the active run. CLI live input has two pending lanes: ASAP pipe messages (`→`) are written to `.sessions/<session-id>/inbox.jsonl` and drained before normal queued items at safe runner boundaries, while after-finish messages (`↳`) run as the next prompt once the current task fully finishes. Generated local sites should use the built-in `preview_workspace` or `open_workspace_file` tools; AgInTiFlow avoids transient localhost servers inside Docker because those containers stop between commands and their ports are not host-published.
+The web chat mirrors the CLI session store while keeping browser-native controls. Launch `aginti web` from the same project folder and it reads the same `.sessions/` history as `aginti` and `aginti resume`. In the web UI, Enter sends and Shift+Enter adds a newline. `Pipe to run` writes an ASAP message (`→`) to `.sessions/<session-id>/inbox.jsonl` so an active CLI or web agent can consume it at the next safe boundary. `Queue after finish` stores a browser-local next prompt (`↳`) and starts it after the current web run finishes; queued items have Edit and Remove buttons. Esc or Stop stops active web runs. Generated local sites should use the built-in `preview_workspace` or `open_workspace_file` tools; AgInTiFlow avoids transient localhost servers inside Docker because those containers stop between commands and their ports are not host-published.
 
 Safe preflight endpoints:
 
@@ -376,6 +376,7 @@ curl -X POST http://127.0.0.1:3210/api/sandbox/preflight \
   -d '{"sandboxMode":"docker-workspace","buildImage":true}'
 curl http://127.0.0.1:3210/api/workspace/changes
 curl "http://127.0.0.1:3210/api/sessions/<session-id>/artifacts"
+curl "http://127.0.0.1:3210/api/sessions/<session-id>/inbox"
 ```
 
 These endpoints report Docker/image/workspace readiness, recent sandbox logs, file-change provenance, and renderable artifact metadata without returning API keys or npm tokens. Artifact content is loaded on demand through guarded session/workspace reads.

package/docs/agent-runtime-pipe.md

@@ -7,10 +7,12 @@ AgInTiFlow keeps CLI and web runs equivalent by using the project folder as the
 - Web settings database: `<project>/.sessions/web-state.sqlite`.
 - Runtime inbox: `<project>/.sessions/<session-id>/inbox.jsonl`.
 
-When a run is active, the web chat and `aginti queue <session-id> "..."` append messages to the inbox instead of trying to mutate the running process directly. The runner drains the inbox at safe boundaries: before each model step and after tool execution. This mirrors the event-queue style used by mature agent UIs while keeping the backend decoupled from any specific frontend.
+When a run is active, the web chat and `aginti queue <session-id> "..."` append messages to the inbox instead of trying to mutate the running process directly. The web API exposes `GET /api/sessions/:id/inbox`, `POST /api/sessions/:id/inbox`, `PATCH /api/sessions/:id/inbox/:itemId`, and `DELETE /api/sessions/:id/inbox/:itemId` so browser users can inspect, edit, or remove pending pipe messages before the runner consumes them. The runner drains the inbox at safe boundaries: before each model step and after tool execution. This mirrors the event-queue style used by mature agent UIs while keeping the backend decoupled from any specific frontend.
 
 The interactive CLI keeps the input panel visible while a run is working. Enter sends the current draft as an ASAP pipe message and displays it as `→`; the runner drains those messages before normal inbox items. Tab stores the draft as an after-finish queue item and displays it as `↳`; those prompts run only after the current run completes. Alt+Up moves the last pending `→` message back into the editor, and Shift+Left moves the last pending `↳` message back into the editor. The current command cwd is rendered below the input panel in both idle and running states.
 
+The web UI uses a related but browser-appropriate pattern. Enter sends and Shift+Enter adds a newline. `Pipe to run` writes an ASAP inbox item shared with CLI. `Queue after finish` keeps a browser-local next prompt and starts it after the current web-owned run finishes. Both lanes render in a pending panel with Edit and Remove buttons instead of terminal-only keybindings.
+
 Runs can be stopped without corrupting session state. The CLI listens for Esc or Ctrl+C during an active run, and the web UI exposes a Stop button plus Esc. Both paths send an abort signal, persist `session.stopped`, and leave the session resumable through `aginti resume <session-id>`.
 
 Default execution is Docker workspace mode with package installs approved inside the sandbox. The project is mounted at `/workspace`; persistent agent toolchain folders are mounted at `/aginti-home`, `/aginti-cache`, and `/aginti-env` from `~/.agintiflow/docker/`. Python, conda, and other language-level environments should be installed under `/aginti-env` so they survive across runs. Apt/apk package changes are ephemeral unless the Docker image is rebuilt.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lazyingart/agintiflow",
-  "version": "0.12.7",
+  "version": "0.12.8",
   "type": "module",
   "description": "AgInTiFlow is a resumable Playwright website-control agent with OpenAI-compatible tool calling.",
   "license": "Apache-2.0",

package/public/app.js

@@ -122,8 +122,18 @@ const translations = {
     sendingStatus: "Sending...",
     runningStatus: "Running...",
     queuedStatus: "Queued for the running agent.",
+    queuedAsapStatus: "Piped into the shared session inbox.",
+    queuedAfterFinishStatus: "Queued for the next web run.",
     failedContinue: "Failed to continue the conversation.",
-    chatShortcutHelp: "Enter sends · Ctrl+J inserts a newline · Tab queues while the agent is running",
+    chatShortcutHelp: "Enter sends · Shift+Enter adds a newline · use buttons for pipe/queue control",
+    pipeMessageButton: "Pipe to run",
+    queueAfterFinishButton: "Queue after finish",
+    pendingMessagesTitle: "Pending messages",
+    asapQueueLabel: "ASAP pipe",
+    afterFinishQueueLabel: "After finish",
+    editQueuedMessage: "Edit",
+    removeQueuedMessage: "Remove",
+    queuedConsumedHint: "ASAP pipe messages are shared with CLI and consumed at the next safe agent boundary.",
     conversationMenuLabel: "Manage conversations",
     manageConversationsTitle: "Manage conversations",
     manageConversationsHelp: "Rename, auto-rename, or delete saved chat history.",
@@ -671,7 +681,10 @@ const sessionSelectEl = document.querySelector("#session-select");
 const chatThreadEl = document.querySelector("#chat-thread");
 const chatFormEl = document.querySelector("#chat-form");
 const chatInputEl = document.querySelector("#chat-input");
+const chatPendingEl = document.querySelector("#chat-pending");
 const chatStatusEl = document.querySelector("#chat-status");
+const pipeMessageButton = document.querySelector("#pipe-message");
+const queueAfterFinishButton = document.querySelector("#queue-after-finish");
 const manageSessionsButton = document.querySelector("#manage-sessions");
 const openArtifactsButton = document.querySelector("#open-artifacts");
 const artifactBadgeEl = document.querySelector("#artifact-badge");
@@ -714,6 +727,9 @@ let pollTimer = null;
 let saveTimer = null;
 let lastChatEntries = [];
 let lastSessions = [];
+let pendingInboxItems = [];
+let pendingAfterFinishItems = [];
+let flushingAfterFinish = false;
 let lastKeyStatus = null;
 let lastWrappers = [];
 let lastSandbox = null;
@@ -1270,6 +1286,233 @@ function renderChat(chatEntries) {
   chatThreadEl.scrollTop = chatThreadEl.scrollHeight;
 }
 
+function afterFinishQueueKey(sessionId = currentSessionId) {
+  return `agintiflow.web.afterFinishQueue.${sessionId || "none"}`;
+}
+
+function loadAfterFinishQueue(sessionId = currentSessionId) {
+  if (!sessionId) return [];
+  try {
+    const parsed = JSON.parse(localStorage.getItem(afterFinishQueueKey(sessionId)) || "[]");
+    return Array.isArray(parsed) ? parsed.filter((item) => item?.id && item?.content) : [];
+  } catch {
+    return [];
+  }
+}
+
+function saveAfterFinishQueue(sessionId = currentSessionId) {
+  if (!sessionId) return;
+  localStorage.setItem(afterFinishQueueKey(sessionId), JSON.stringify(pendingAfterFinishItems));
+}
+
+function newLocalQueueId() {
+  if (globalThis.crypto?.randomUUID) return `after-${globalThis.crypto.randomUUID()}`;
+  return `after-${Date.now()}-${Math.random().toString(16).slice(2)}`;
+}
+
+function compactMessage(content, limit = 220) {
+  const text = String(content || "").replace(/\s+/g, " ").trim();
+  return text.length > limit ? `${text.slice(0, limit - 1)}...` : text;
+}
+
+function renderPendingMessages() {
+  if (!chatPendingEl) return;
+  const inboxItems = pendingInboxItems || [];
+  const afterItems = pendingAfterFinishItems || [];
+  if (inboxItems.length === 0 && afterItems.length === 0) {
+    chatPendingEl.hidden = true;
+    chatPendingEl.innerHTML = "";
+    return;
+  }
+
+  const section = (label, items, kind) => {
+    if (!items.length) return "";
+    return `
+      <div class="pending-section">
+        <div class="pending-label">${escapeHtml(label)}</div>
+        ${items
+          .map(
+            (item) => `
+              <div class="pending-item">
+                <div class="pending-copy">
+                  <span class="pending-kind ${kind}">${kind === "asap" ? "→" : "↳"}</span>
+                  <span>${escapeHtml(compactMessage(item.content))}</span>
+                </div>
+                <div class="pending-actions">
+                  <button type="button" class="mini-button" data-edit-${kind}="${escapeHtml(item.id)}">${t(
+                    "editQueuedMessage"
+                  )}</button>
+                  <button type="button" class="mini-button danger" data-remove-${kind}="${escapeHtml(item.id)}">${t(
+                    "removeQueuedMessage"
+                  )}</button>
+                </div>
+              </div>
+            `
+          )
+          .join("")}
+      </div>
+    `;
+  };
+
+  chatPendingEl.hidden = false;
+  chatPendingEl.innerHTML = `
+    <div class="pending-header">
+      <strong>${t("pendingMessagesTitle")}</strong>
+      <span>${t("queuedConsumedHint")}</span>
+    </div>
+    ${section(t("asapQueueLabel"), inboxItems, "asap")}
+    ${section(t("afterFinishQueueLabel"), afterItems, "after")}
+  `;
+}
+
+async function refreshInbox() {
+  if (!currentSessionId) {
+    pendingInboxItems = [];
+    pendingAfterFinishItems = [];
+    renderPendingMessages();
+    return;
+  }
+
+  pendingAfterFinishItems = loadAfterFinishQueue(currentSessionId);
+  const response = await fetch(`/api/sessions/${encodeURIComponent(currentSessionId)}/inbox`);
+  if (!response.ok) {
+    pendingInboxItems = [];
+    renderPendingMessages();
+    return;
+  }
+  const data = await response.json();
+  pendingInboxItems = data.items || [];
+  renderPendingMessages();
+}
+
+async function updateInboxItem(itemId, content) {
+  const response = await fetch(`/api/sessions/${encodeURIComponent(currentSessionId)}/inbox/${encodeURIComponent(itemId)}`, {
+    method: "PATCH",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify({ content }),
+  });
+  const data = await response.json().catch(() => ({}));
+  if (!response.ok) throw new Error(data.error || t("failedContinue"));
+  await refreshInbox();
+}
+
+async function removeInboxItem(itemId) {
+  const response = await fetch(`/api/sessions/${encodeURIComponent(currentSessionId)}/inbox/${encodeURIComponent(itemId)}`, {
+    method: "DELETE",
+  });
+  const data = await response.json().catch(() => ({}));
+  if (!response.ok) throw new Error(data.error || t("failedContinue"));
+  await refreshInbox();
+}
+
+function editAfterFinishItem(itemId) {
+  const item = pendingAfterFinishItems.find((candidate) => candidate.id === itemId);
+  if (!item) return;
+  pendingAfterFinishItems = pendingAfterFinishItems.filter((candidate) => candidate.id !== itemId);
+  saveAfterFinishQueue();
+  chatInputEl.value = item.content;
+  chatInputEl.focus();
+  renderPendingMessages();
+}
+
+function removeAfterFinishItem(itemId) {
+  pendingAfterFinishItems = pendingAfterFinishItems.filter((candidate) => candidate.id !== itemId);
+  saveAfterFinishQueue();
+  renderPendingMessages();
+}
+
+function queueAfterFinishFromInput() {
+  if (!currentSessionId) {
+    chatStatusEl.textContent = t("selectSessionFirst");
+    return;
+  }
+  const content = chatInputEl.value.trim();
+  if (!content) {
+    chatStatusEl.textContent = t("messageRequired");
+    return;
+  }
+  pendingAfterFinishItems = [
+    ...pendingAfterFinishItems,
+    {
+      id: newLocalQueueId(),
+      content,
+      timestamp: new Date().toISOString(),
+      source: "web",
+    },
+  ];
+  saveAfterFinishQueue();
+  chatInputEl.value = "";
+  chatStatusEl.textContent = t("queuedAfterFinishStatus");
+  renderPendingMessages();
+}
+
+async function pipeMessageFromInput() {
+  if (!currentSessionId) {
+    chatStatusEl.textContent = t("selectSessionFirst");
+    return;
+  }
+  const content = chatInputEl.value.trim();
+  if (!content) {
+    chatStatusEl.textContent = t("messageRequired");
+    return;
+  }
+
+  chatStatusEl.textContent = t("sendingStatus");
+  const response = await fetch(`/api/sessions/${encodeURIComponent(currentSessionId)}/inbox`, {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify({ content, priority: "asap" }),
+  });
+  const data = await response.json().catch(() => ({}));
+  if (!response.ok) {
+    chatStatusEl.textContent = data.error || t("failedContinue");
+    return;
+  }
+  chatInputEl.value = "";
+  chatStatusEl.textContent = t("queuedAsapStatus");
+  pendingInboxItems = data.item ? [...pendingInboxItems, data.item] : pendingInboxItems;
+  renderPendingMessages();
+  await refreshInbox();
+}
+
+async function flushAfterFinishQueue() {
+  if (!currentSessionId || flushingAfterFinish || currentRunStatus === "running" || pendingAfterFinishItems.length === 0) return;
+  flushingAfterFinish = true;
+  const next = pendingAfterFinishItems[0];
+  pendingAfterFinishItems = pendingAfterFinishItems.slice(1);
+  saveAfterFinishQueue();
+  renderPendingMessages();
+
+  try {
+    const response = await fetch(`/api/sessions/${encodeURIComponent(currentSessionId)}/messages`, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({
+        ...formPayload(),
+        content: next.content,
+      }),
+    });
+    const data = await response.json().catch(() => ({}));
+    if (!response.ok) throw new Error(data.error || t("failedContinue"));
+    currentSessionId = data.sessionId;
+    currentRunStatus = data.queued ? currentRunStatus : "running";
+    updateStopRunButton();
+    chatStatusEl.textContent = data.queued ? t("queuedStatus") : t("runningStatus");
+    await refreshSessions();
+    await refreshChat();
+    if (pollTimer) clearInterval(pollTimer);
+    pollTimer = setInterval(refreshRun, 1500);
+    await refreshRun();
+  } catch (error) {
+    pendingAfterFinishItems = [next, ...pendingAfterFinishItems];
+    saveAfterFinishQueue();
+    renderPendingMessages();
+    chatStatusEl.textContent = error instanceof Error ? error.message : String(error);
+  } finally {
+    flushingAfterFinish = false;
+  }
+}
+
 function artifactReadKey(sessionId = currentSessionId) {
   return `agintiflow.artifacts.readIds.${sessionId || "none"}`;
 }
@@ -1682,6 +1925,7 @@ async function refreshRun() {
   runMetaEl.textContent = `${run.status} · ${run.sessionId}`;
   renderLogs(run);
   await refreshArtifacts({ loadSelected: artifactTunnelDialog?.open });
+  await refreshInbox();
 
   if (run.status === "finished" || run.status === "failed" || run.status === "stopped") {
     clearInterval(pollTimer);
@@ -1690,6 +1934,7 @@ async function refreshRun() {
     await refreshSessions();
     await refreshWorkspaceChanges();
     await refreshArtifacts({ loadSelected: artifactTunnelDialog?.open });
+    if (run.status === "finished") await flushAfterFinishQueue();
   }
 }
 
@@ -1711,6 +1956,9 @@ async function stopCurrentRun() {
 
 async function refreshChat() {
   if (!currentSessionId) {
+    pendingInboxItems = [];
+    pendingAfterFinishItems = [];
+    renderPendingMessages();
     renderChat([]);
     return;
   }
@@ -1722,6 +1970,9 @@ async function refreshChat() {
   }
 
   const data = await response.json();
+  pendingInboxItems = data.inbox || [];
+  pendingAfterFinishItems = loadAfterFinishQueue(currentSessionId);
+  renderPendingMessages();
   renderChat(data.chat || []);
 }
 
@@ -2019,24 +2270,54 @@ form.addEventListener("input", schedulePreferenceSave);
 form.addEventListener("change", schedulePreferenceSave);
 
 chatInputEl.addEventListener("keydown", (event) => {
-  if (event.key === "j" && event.ctrlKey && !event.metaKey && !event.altKey) {
+  if (event.key === "Enter" && !event.shiftKey && !event.ctrlKey && !event.metaKey && !event.altKey) {
     event.preventDefault();
-    const start = chatInputEl.selectionStart ?? chatInputEl.value.length;
-    const end = chatInputEl.selectionEnd ?? chatInputEl.value.length;
-    chatInputEl.value = `${chatInputEl.value.slice(0, start)}\n${chatInputEl.value.slice(end)}`;
-    chatInputEl.selectionStart = chatInputEl.selectionEnd = start + 1;
+    chatFormEl.requestSubmit();
+  }
+});
+
+pipeMessageButton?.addEventListener("click", () => {
+  pipeMessageFromInput().catch((error) => {
+    chatStatusEl.textContent = String(error);
+  });
+});
+
+queueAfterFinishButton?.addEventListener("click", queueAfterFinishFromInput);
+
+chatPendingEl?.addEventListener("click", (event) => {
+  const target = event.target.closest("button");
+  if (!target) return;
+
+  const editAsap = target.dataset.editAsap;
+  const removeAsap = target.dataset.removeAsap;
+  const editAfter = target.dataset.editAfter;
+  const removeAfter = target.dataset.removeAfter;
+
+  if (editAsap) {
+    const item = pendingInboxItems.find((candidate) => candidate.id === editAsap);
+    const next = prompt(t("editQueuedMessage"), item?.content || "");
+    if (next !== null) {
+      updateInboxItem(editAsap, next).catch((error) => {
+        chatStatusEl.textContent = String(error);
+      });
+    }
     return;
   }
 
-  if (event.key === "Tab") {
-    event.preventDefault();
-    chatFormEl.requestSubmit();
+  if (removeAsap) {
+    removeInboxItem(removeAsap).catch((error) => {
+      chatStatusEl.textContent = String(error);
+    });
     return;
   }
 
-  if (event.key === "Enter" && !event.shiftKey && !event.ctrlKey && !event.metaKey && !event.altKey) {
-    event.preventDefault();
-    chatFormEl.requestSubmit();
+  if (editAfter) {
+    editAfterFinishItem(editAfter);
+    return;
+  }
+
+  if (removeAfter) {
+    removeAfterFinishItem(removeAfter);
   }
 });
 
@@ -2108,10 +2389,13 @@ sessionSelectEl.addEventListener("change", async () => {
   currentSessionId = sessionSelectEl.value;
   if (!currentSessionId) {
     currentRunStatus = "";
+    pendingInboxItems = [];
+    pendingAfterFinishItems = [];
     updateStopRunButton();
     runMetaEl.textContent = "";
     setLogs(t("noRunSelected"), "empty");
     renderChat([]);
+    renderPendingMessages();
     artifactItems = [];
     selectedArtifactId = "";
     renderArtifactShell();
@@ -2158,18 +2442,8 @@ chatFormEl.addEventListener("submit", async (event) => {
   updateStopRunButton();
   chatInputEl.value = "";
   chatStatusEl.textContent = data.queued ? t("queuedStatus") : t("runningStatus");
-  if (data.queued) {
-    renderChat([
-      ...lastChatEntries,
-      {
-        role: "user",
-        content,
-        at: new Date().toISOString(),
-      },
-    ]);
-  }
   await refreshSessions();
-  if (!data.queued) await refreshChat();
+  await refreshChat();
   await refreshWorkspaceChanges();
   await refreshArtifacts({ loadSelected: artifactTunnelDialog?.open });
 

package/public/index.html

@@ -313,10 +313,15 @@
               placeholder="Continue the selected conversation here."
             ></textarea>
             <p class="chat-shortcuts subtle" data-i18n="chatShortcutHelp">
-              Enter sends · Ctrl+J inserts a newline · Tab queues while the agent is running
+              Enter sends · Shift+Enter adds a newline · use buttons for pipe/queue control
             </p>
+            <div id="chat-pending" class="chat-pending" hidden></div>
             <div class="actions">
               <button type="submit" data-i18n="sendMessageButton">Send message</button>
+              <button id="pipe-message" type="button" class="secondary" data-i18n="pipeMessageButton">Pipe to run</button>
+              <button id="queue-after-finish" type="button" class="secondary" data-i18n="queueAfterFinishButton">
+                Queue after finish
+              </button>
               <span id="chat-status" class="subtle"></span>
             </div>
           </form>

package/public/styles.css

@@ -742,6 +742,108 @@ button.danger {
   line-height: 1.35;
 }
 
+.chat-pending {
+  display: grid;
+  gap: 10px;
+  padding: 10px;
+  border: 1px solid rgba(15, 118, 110, 0.16);
+  border-radius: 14px;
+  background:
+    linear-gradient(135deg, rgba(240, 253, 250, 0.9), rgba(255, 251, 235, 0.72)),
+    rgba(255, 255, 255, 0.78);
+}
+
+.pending-header {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px 12px;
+  align-items: baseline;
+  justify-content: space-between;
+  color: var(--muted);
+  font-size: 0.78rem;
+}
+
+.pending-header strong,
+.pending-label {
+  color: var(--ink);
+}
+
+.pending-section {
+  display: grid;
+  gap: 7px;
+}
+
+.pending-label {
+  font-size: 0.74rem;
+  font-weight: 800;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+}
+
+.pending-item {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto;
+  gap: 8px;
+  align-items: center;
+  padding: 8px 10px;
+  border: 1px solid rgba(15, 118, 110, 0.12);
+  border-radius: 12px;
+  background: rgba(255, 255, 255, 0.82);
+}
+
+.pending-copy {
+  min-width: 0;
+  display: flex;
+  gap: 8px;
+  align-items: flex-start;
+  color: var(--ink);
+  font-size: 0.86rem;
+  line-height: 1.35;
+}
+
+.pending-kind {
+  flex: 0 0 auto;
+  display: inline-grid;
+  width: 20px;
+  height: 20px;
+  place-items: center;
+  border-radius: 999px;
+  font-size: 0.82rem;
+  font-weight: 900;
+}
+
+.pending-kind.asap {
+  color: #075985;
+  background: rgba(14, 165, 233, 0.14);
+}
+
+.pending-kind.after {
+  color: #92400e;
+  background: rgba(245, 158, 11, 0.16);
+}
+
+.pending-actions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  justify-content: flex-end;
+}
+
+.mini-button {
+  min-height: auto;
+  padding: 5px 8px;
+  border-radius: 9px;
+  font-size: 0.76rem;
+  background: rgba(15, 118, 110, 0.08);
+  color: #0f766e;
+  box-shadow: none;
+}
+
+.mini-button.danger {
+  color: #b91c1c;
+  background: rgba(239, 68, 68, 0.08);
+}
+
 .modal {
   width: min(720px, calc(100% - 28px));
   max-width: 100%;
@@ -1152,6 +1254,14 @@ button.danger {
     grid-template-columns: 1fr;
   }
 
+  .pending-item {
+    grid-template-columns: 1fr;
+  }
+
+  .pending-actions {
+    justify-content: flex-start;
+  }
+
   .panel {
     padding: 15px;
   }

package/scripts/smoke-web-api.js

@@ -4,6 +4,7 @@ import fs from "node:fs/promises";
 import os from "node:os";
 import path from "node:path";
 import { fileURLToPath } from "node:url";
+import { SessionStore } from "../src/session-store.js";
 
 const repoRoot = path.resolve(path.dirname(fileURLToPath(import.meta.url)), "..");
 const runtimeDir = await fs.mkdtemp(path.join(os.tmpdir(), "agintiflow-api-smoke-"));
@@ -165,6 +166,38 @@ try {
 
   const chat = await fetchJson(`/api/sessions/${encodeURIComponent(runStart.sessionId)}/chat`);
   if (!Array.isArray(chat.chat) || chat.chat.length < 2) throw new Error("chat history was not persisted");
+  if (!Array.isArray(chat.inbox)) throw new Error("chat endpoint did not include shared inbox state");
+
+  const queued = await fetchJson(`/api/sessions/${encodeURIComponent(runStart.sessionId)}/inbox`, {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify({ content: "continue from web inbox smoke", priority: "asap" }),
+  });
+  if (!queued.item?.id || queued.item.priority !== "asap") throw new Error("inbox queue endpoint did not return an ASAP item");
+
+  const inbox = await fetchJson(`/api/sessions/${encodeURIComponent(runStart.sessionId)}/inbox`);
+  if (!inbox.items?.some((item) => item.id === queued.item.id)) throw new Error("inbox endpoint did not list queued item");
+
+  const edited = await fetchJson(
+    `/api/sessions/${encodeURIComponent(runStart.sessionId)}/inbox/${encodeURIComponent(queued.item.id)}`,
+    {
+      method: "PATCH",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ content: "edited web inbox smoke" }),
+    }
+  );
+  if (!edited.item?.content.includes("edited web inbox smoke")) throw new Error("inbox edit endpoint did not persist content");
+
+  const deletedInbox = await fetchJson(
+    `/api/sessions/${encodeURIComponent(runStart.sessionId)}/inbox/${encodeURIComponent(queued.item.id)}`,
+    {
+      method: "DELETE",
+    }
+  );
+  if (!deletedInbox.ok) throw new Error("inbox delete endpoint failed");
+  const inboxStore = new SessionStore(path.join(runtimeDir, ".sessions"), runStart.sessionId);
+  const remainingInbox = await inboxStore.loadInbox();
+  if (remainingInbox.some((item) => item.id === queued.item.id)) throw new Error("inbox delete endpoint left item on disk");
 
   const renamed = await fetchJson(`/api/sessions/${encodeURIComponent(runStart.sessionId)}`, {
     method: "PATCH",
@@ -248,6 +281,10 @@ try {
           "/api/sandbox/preflight",
           "/api/runs",
           "/api/sessions/:id/chat",
+          "/api/sessions/:id/inbox",
+          "POST /api/sessions/:id/inbox",
+          "PATCH /api/sessions/:id/inbox/:itemId",
+          "DELETE /api/sessions/:id/inbox/:itemId",
           "PATCH /api/sessions/:id",
           "POST /api/sessions/:id/auto-title",
           "DELETE /api/sessions/:id",

package/web.js

@@ -349,16 +349,49 @@ async function loadChat(sessionId) {
 
   if (!state && !meta) return null;
 
+  const inbox = await store.loadInbox().catch(() => []);
   return {
     sessionId,
     goal: state?.goal || meta?.goal || "",
     title: meta?.title || "",
     provider: state?.provider || meta?.provider || "",
     model: state?.model || meta?.model || "",
+    status: meta?.status || "",
+    inbox,
     chat: deriveChatFromState(state, meta),
   };
 }
 
+function pushActiveInboxLog(sessionId, message, data = {}) {
+  const active = runs.get(sessionId);
+  if (active?.status !== "running") return;
+  active.logs.push({
+    at: new Date().toISOString(),
+    kind: "event",
+    message,
+    data,
+  });
+  active.updatedAt = new Date().toISOString();
+  db.upsertSession(active);
+}
+
+async function loadInboxSession(sessionId) {
+  if (!isSafeSessionId(sessionId)) {
+    return { error: "Invalid session id.", status: 400 };
+  }
+
+  const data = await loadChat(sessionId);
+  if (!data) {
+    return { error: "Session not found.", status: 404 };
+  }
+
+  return { store: sessionStore(sessionId), data };
+}
+
+function queuedMessagePreview(content) {
+  return String(content || "").replace(/\s+/g, " ").trim().slice(0, 180);
+}
+
 function normalizeSessionTitle(title) {
   return String(title || "")
     .replace(/[\u0000-\u001f\u007f]/g, " ")
@@ -687,6 +720,128 @@ app.get("/api/sessions/:sessionId/chat", async (req, res) => {
   res.json(data);
 });
 
+app.get("/api/sessions/:sessionId/inbox", async (req, res) => {
+  const loaded = await loadInboxSession(req.params.sessionId);
+  if (loaded.error) {
+    res.status(loaded.status || 500).json({ error: loaded.error });
+    return;
+  }
+
+  res.json({
+    ok: true,
+    sessionId: req.params.sessionId,
+    items: loaded.data.inbox || [],
+  });
+});
+
+app.post("/api/sessions/:sessionId/inbox", async (req, res) => {
+  const loaded = await loadInboxSession(req.params.sessionId);
+  if (loaded.error) {
+    res.status(loaded.status || 500).json({ error: loaded.error });
+    return;
+  }
+
+  const content = String(req.body?.content || "").trim();
+  if (!content) {
+    res.status(400).json({ error: "Message content is required." });
+    return;
+  }
+
+  const priority = req.body?.priority === "normal" ? "normal" : "asap";
+  const item = await loaded.store.appendInbox(content, { source: "web", priority });
+  await loaded.store
+    .appendEvent("conversation.queued_input", {
+      itemId: item?.id,
+      priority,
+      source: "web",
+      preview: queuedMessagePreview(content),
+    })
+    .catch(() => {});
+  pushActiveInboxLog(req.params.sessionId, "conversation.queued_input", {
+    itemId: item?.id,
+    priority,
+    source: "web",
+    preview: queuedMessagePreview(content),
+  });
+
+  res.json({ ok: true, sessionId: req.params.sessionId, item });
+});
+
+app.patch("/api/sessions/:sessionId/inbox/:itemId", async (req, res) => {
+  const loaded = await loadInboxSession(req.params.sessionId);
+  if (loaded.error) {
+    res.status(loaded.status || 500).json({ error: loaded.error });
+    return;
+  }
+
+  const content = String(req.body?.content || "").trim();
+  if (!content) {
+    res.status(400).json({ error: "Message content is required." });
+    return;
+  }
+
+  const items = await loaded.store.loadInbox();
+  const index = items.findIndex((item) => item.id === req.params.itemId);
+  if (index < 0) {
+    res.status(404).json({ error: "Queued message not found. It may already have been consumed by the agent." });
+    return;
+  }
+
+  const item = {
+    ...items[index],
+    content,
+    updatedAt: new Date().toISOString(),
+    editedBy: "web",
+  };
+  items[index] = item;
+  await loaded.store.saveInbox(items);
+  await loaded.store
+    .appendEvent("conversation.queued_input_edited", {
+      itemId: item.id,
+      source: "web",
+      preview: queuedMessagePreview(content),
+    })
+    .catch(() => {});
+  pushActiveInboxLog(req.params.sessionId, "conversation.queued_input_edited", {
+    itemId: item.id,
+    source: "web",
+    preview: queuedMessagePreview(content),
+  });
+
+  res.json({ ok: true, sessionId: req.params.sessionId, item });
+});
+
+app.delete("/api/sessions/:sessionId/inbox/:itemId", async (req, res) => {
+  const loaded = await loadInboxSession(req.params.sessionId);
+  if (loaded.error) {
+    res.status(loaded.status || 500).json({ error: loaded.error });
+    return;
+  }
+
+  const items = await loaded.store.loadInbox();
+  const item = items.find((candidate) => candidate.id === req.params.itemId);
+  if (!item) {
+    res.status(404).json({ error: "Queued message not found. It may already have been consumed by the agent." });
+    return;
+  }
+
+  await loaded.store.saveInbox(items.filter((candidate) => candidate.id !== req.params.itemId));
+  await loaded.store
+    .appendEvent("conversation.queued_input_removed", {
+      itemId: item.id,
+      source: "web",
+      preview: queuedMessagePreview(item.content),
+    })
+    .catch(() => {});
+  pushActiveInboxLog(req.params.sessionId, "conversation.queued_input_removed", {
+    itemId: item.id,
+    source: "web",
+    preview: queuedMessagePreview(item.content),
+  });
+
+  res.json({ ok: true, sessionId: req.params.sessionId, itemId: item.id });
+});
+
 app.patch("/api/sessions/:sessionId", async (req, res) => {
   const sessionId = req.params.sessionId;
   if (!isSafeSessionId(sessionId)) {
@@ -795,17 +950,24 @@ app.post("/api/sessions/:sessionId/messages", async (req, res) => {
   const active = runs.get(sessionId);
   if (active?.status === "running") {
     const store = sessionStore(sessionId);
-    await store.appendInbox(content, { source: "web" });
-    await store.appendEvent("conversation.queued_input", { prompt: content, source: "web" }).catch(() => {});
+    const item = await store.appendInbox(content, { source: "web", priority: "asap" });
+    await store
+      .appendEvent("conversation.queued_input", {
+        itemId: item?.id,
+        priority: "asap",
+        source: "web",
+        preview: queuedMessagePreview(content),
+      })
+      .catch(() => {});
     active.logs.push({
       at: new Date().toISOString(),
       kind: "event",
       message: "conversation.queued_input",
-      data: { prompt: content, source: "web" },
+      data: { itemId: item?.id, priority: "asap", source: "web", preview: queuedMessagePreview(content) },
     });
     active.updatedAt = new Date().toISOString();
     db.upsertSession(active);
-    res.json({ sessionId, queued: true });
+    res.json({ sessionId, queued: true, item });
     return;
   }