Files, open beside the conversation
A third side panel, built the way the terminal is and filled the way the inspector is: tabs holding open files. Project files over SFTP in an agent chat; notes, skills, knowledge documents, this chat's text attachments and its own scratch document everywhere. Read with pygments, edited in a plain textarea, saved with a conflict check. A bug found on the way in, and the reason this needed its own read path. `ssh.read_file` ends in `clean_output`, which strips ANSI escapes and decodes with errors="replace" -- right for the output of a command, and fatal for an editor: open a file containing an escape byte, press Save, and you have silently rewritten it with the escapes gone and every undecodable byte replaced by U+FFFD. `read_text`/`write_text` decode strictly, report binary rather than mangling it, carry an mtime:size token for a file that moved underneath, and refuse an oversize write rather than truncating -- `write_file` truncates because a model is told how many bytes it wrote, and somebody pressing Save is not. The model-facing pair is untouched: what it returns is a contract a model has been shown. A truncated read opens read-only for the mirror-image reason. Six sources go through one dispatch table, for the reason tool_labels.py is a table: six independently written permission checks is how one ends up written slightly differently, and that failure looks like editing somebody else's note. A save on a project file bypasses agent/policy.py, which makes it the fourth documented exception to "the modes do not govern the keyboard" and the first that writes. Same argument as the terminal panel -- whoever owns the credential could write the file with scp -- but the consequence is larger and is now said out loud rather than left to be inferred. The model opens tabs from the file tools it was already calling, so no new schema and no tokens. It never brings one to the front: an agent reads forty files in a long reply, and taking the screen each time would drag somebody through all of them and lose any edit in progress. Only the strip is streamed, guarded on truthiness so the frame can never blank itself -- an empty one would close every open tab, the approval card you could press twice with the sign reversed. Both halves are settled on the server, which is why canvas.js needs no guard against a swap at all. No vendored editor. CodeMirror 6 needs a bundler, which is hard rule 1; CodeMirror 5 would be a larger payload than xterm on every page, and xterm is the one heavy dependency precisely because it loads only where it can be used. So: server-rendered highlighting for reading, a textarea for writing, and the panel says there is no colour while you type rather than pretending. Also here: a scratch document per chat, with `scratch_write` at RISK_READ on plan_update's argument, and a test pinning the three numbers that decide a panel's width -- LAYOUT_BOUNDS drops an unknown variable silently, so a panel missing from it has a drag handle that works and forgets. Driven under a DOM stub and against the running application. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,48 @@
|
||||
{% from "_macros.html" import icon %}
|
||||
{#
|
||||
The canvas panel: files, open beside the conversation.
|
||||
|
||||
Built the way the terminal panel is -- a child of .shell, `hidden` until a
|
||||
toggle removes it, its own drag handle, the shared panel head. Filled the way
|
||||
the *inspector* is, though: `hx-trigger="intersect once"`, because a hidden
|
||||
element never intersects, so a panel nobody opens costs one element and no
|
||||
round trip to somebody's machine. There is nothing heavy to construct here,
|
||||
which is the whole reason it does not need the terminal's lazy-build dance.
|
||||
|
||||
Everything shown inside came off somebody else's disk, or out of a model. It
|
||||
is rendered through pygments (which escapes), through render_markdown (the one
|
||||
path allowed to emit HTML), or into a <textarea>, whose contents Jinja escapes
|
||||
and which cannot contain markup by construction.
|
||||
#}
|
||||
<aside class="canvas" id="canvas" hidden aria-label="Canvas"
|
||||
data-canvas
|
||||
data-chat="{{ chat.id }}"
|
||||
data-resize-target>
|
||||
{# The left edge, dragged. A separator rather than a decoration: it takes
|
||||
focus and answers the arrow keys, or the panel is only resizable with a
|
||||
mouse and the grip is a focus trap that does nothing. #}
|
||||
<div class="panel-resize" data-resize="--canvas-width" data-resize-min="384"
|
||||
role="separator" aria-orientation="vertical" tabindex="0"
|
||||
aria-label="Resize the canvas">
|
||||
{{ icon("grip", "icon--sm") }}
|
||||
</div>
|
||||
|
||||
<div class="canvas__inner" id="canvas-inner"
|
||||
hx-get="/api/chats/{{ chat.id }}/canvas"
|
||||
hx-trigger="intersect once"
|
||||
hx-target="this" hx-swap="innerHTML">
|
||||
<div class="panel-head">
|
||||
<h2 class="panel-head__title">
|
||||
{{ icon("file-text", "icon--sm") }}
|
||||
<span>Canvas</span>
|
||||
</h2>
|
||||
<button class="btn btn--icon btn--sm" type="button" data-toggle="#canvas"
|
||||
aria-label="Close canvas">
|
||||
{{ icon("x", "icon--sm") }}
|
||||
</button>
|
||||
</div>
|
||||
<div class="canvas__body">
|
||||
<p class="canvas__empty">Opening…</p>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
Reference in New Issue
Block a user