feat: inline prompt history area — scrollable session messages

The inline prompt now shows the current session's full message
history (user + assistant), scrollable, replacing the single-output
display from the previous commit. The user can scroll back through
prior exchanges in the same notebook's OpenCode session.

Server (opencode_bridge/):
  - New route: GET /opencode-bridge/session-messages?notebook=<path>
    - Resolves notebook to session via SessionManager.peek (no create).
    - If no session: {"messages": []} (no OpenCode call).
    - Else: GET /session/{id}/message on OpenCode Serve, project the
      raw {info, parts}[] into a frontend-friendly {role, content}[].
  - OpenCodeClient.list_session_messages(sid).
  - SessionManager.peek(notebook_path) -> Optional[str] (read without
    creating, to avoid spawning a session just to report emptiness).
  - Wired the new route in setup_route_handlers.

Client (src/):
  - types.ts: OpenCodeMessage { role, content } + OpenCodeMessagesResponse.
  - api/opencode_client.ts: callOpenCodeSessionMessages(notebook, serverSettings).
  - components/opencode_inline_prompt.ts:
    - Replaces the single .opencode-inline-output area with a
      scrollable .opencode-inline-history (max-height 320px, overflow-y
      auto, auto-scrolls to bottom on update).
    - setMessages(messages): renders user messages as plain text,
      assistant messages via marked.parse. No more setOutput/hideOutput.
  - components/opencode_cell_actions.ts:
    - _showPrompt now fires a _refreshHistory(notebookPath) which
      fetches and calls prompt.setMessages.
    - _handleResponse on success also calls _refreshHistory (the new
      assistant message appears as the last item in the history).
    - Cell source is still NOT replaced.
  - api/opencode_client module is mocked in the cell_actions test to
    avoid jsdom network calls.

style/base.css:
  - .opencode-inline-output* rules replaced with .opencode-inline-history
    (max-height 320px, overflow-y auto, border, padding) and
    .opencode-msg / .opencode-msg-user / .opencode-msg-assistant.
  - pre/code/p/h1-3 content styling scoped under .opencode-inline-history.

Tests:
  - pytest 37/37: FakeOpenCodeClient.list_session_messages + 3 new
    session_messages route tests (no session, projects messages, 400).
  - jest 29/29: setMessages renders user/assistant + history area tests.
  - FakeSessionManager.peek (returns None when session_id is falsy).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
tao.chen
2026-07-23 18:45:03 +08:00
co-authored by Claude Fable 5
parent 1d7f5da9d4
commit ce59502e97
10 changed files with 350 additions and 124 deletions
+35 -40
View File
@@ -75,48 +75,43 @@
cursor: default;
}
/* Markdown output area: hidden until setOutput() reveals it. */
.opencode-inline-prompt .opencode-inline-output {
display: none;
margin-top: 4px;
padding: 6px 8px;
/* Scrollable history of the current session's messages. The owning
cell action populates it via setMessages(). max-height keeps the
inline prompt compact; the user scrolls to see older messages. */
.opencode-inline-prompt .opencode-inline-history {
max-height: 320px;
overflow-y: auto;
margin: 4px 0;
padding: 4px 6px;
border: 1px solid var(--jp-border-color1, #c0c0c0);
border-radius: 3px;
background: var(--jp-layout-color2, #f7f7f7);
max-height: 320px;
overflow-y: auto;
}
.opencode-inline-prompt .opencode-inline-output-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 4px;
font-size: var(--jp-ui-font-size1);
font-weight: 600;
color: var(--jp-ui-font-color1, #333);
}
.opencode-inline-prompt .opencode-inline-output-close {
border: none;
background: transparent;
cursor: pointer;
font-size: var(--jp-ui-font-size1);
line-height: 1;
padding: 0 4px;
color: var(--jp-ui-font-color2, #666);
}
.opencode-inline-prompt .opencode-inline-output-close:hover {
color: var(--jp-ui-font-color0, #000);
}
.opencode-inline-prompt .opencode-inline-output-content {
font-size: var(--jp-ui-font-size1);
line-height: 1.45;
}
.opencode-inline-prompt .opencode-inline-output-content pre {
.opencode-inline-prompt .opencode-msg {
margin-bottom: 6px;
}
.opencode-inline-prompt .opencode-msg:last-child {
margin-bottom: 0;
}
.opencode-inline-prompt .opencode-msg-user {
white-space: pre-wrap;
padding: 4px 6px;
border-radius: 3px;
background: var(--jp-layout-color3, #eaeaea);
color: var(--jp-ui-font-color1, #333);
}
.opencode-inline-prompt .opencode-msg-assistant {
padding: 4px 6px;
color: var(--jp-ui-font-color0, #000);
}
.opencode-inline-prompt .opencode-inline-history pre {
background: var(--jp-layout-color1, #fff);
padding: 6px 8px;
border-radius: 3px;
@@ -124,18 +119,18 @@
margin: 4px 0;
}
.opencode-inline-prompt .opencode-inline-output-content code {
.opencode-inline-prompt .opencode-inline-history code {
font-family: var(--jp-code-font-family, monospace);
font-size: var(--jp-code-font-size, 13px);
}
.opencode-inline-prompt .opencode-inline-output-content p {
.opencode-inline-prompt .opencode-inline-history p {
margin: 2px 0;
}
.opencode-inline-prompt .opencode-inline-output-content h1,
.opencode-inline-prompt .opencode-inline-output-content h2,
.opencode-inline-prompt .opencode-inline-output-content h3 {
.opencode-inline-prompt .opencode-inline-history h1,
.opencode-inline-prompt .opencode-inline-history h2,
.opencode-inline-prompt .opencode-inline-history h3 {
margin: 6px 0 4px;
font-size: var(--jp-ui-font-size2, 14px);
}