Hand the agent a mockup's file, not a picture of it - #199
Conversation
The + on a board shot it and sent the PNG as an image block beside its path. The file is what the agent reads and edits, so the shot now stays the tile's and the transcript's, and the agent gets only "[Image #n] <absolute path to the .html>". Pictures, and the person's own shapes, still go as images. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Deploying super-prototyping with
|
| Latest commit: |
2ed1ab8
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://107400db.super-prototyping.pages.dev |
| Branch Preview URL: | https://fix-board-attach-by-path.super-prototyping.pages.dev |
![devin-ai-integration[bot]](https://avatars.githubusercontent.com/in/811515?s=60&v=4){kind=small}
| return community === undefined && | ||
| rest.length === 0 && | ||
| SAFE_NAME.test(slug) && | ||
| SAFE_NAME.test(file ?? "") | ||
| ? path.join(folderOf(boards, examplesDir, slug), file) |
There was a problem hiding this comment.
🔴 Attached mockup points at another project
After a tab switch, pageOf resolves an attached mockup against the project open at send time. The attachment keeps only slug/file.html, so the agent reads another project's board or a nonexistent file.
Learn more
A mockup is attached before its message is sent. attach sends only its slug and file name, while post sends whichever project is open when the message goes out. Resolving this name under the currently open project points to another file after switching projects.
Example: Attach shop/01-home.html in project A, switch to project B, and send "tighten #1". The agent receives B's board if B has the same slug and filename; otherwise it receives a path to a nonexistent board.
Recommended fix: Preserve the board's source project at attachment time and resolve the file from that project, including for queued messages.
Was this helpful? React with 👍 or 👎 to provide feedback.
| window.location.href, | ||
| ).href; | ||
| return dispatchAttach({ kind: "board", name, src }); | ||
| return dispatchAttach({ kind: "board", name, src, page: true }); |
There was a problem hiding this comment.
🔍 Add an Unreleased note for mockup attachments
The agent now receives a mockup's HTML file instead of its picture. Contributing rules require a line under ## Unreleased for user-visible changes, but this PR adds none.
Was this helpful? React with 👍 or 👎 to provide feedback.
| const pageOf = (name: string) => { | ||
| const [slug, file, ...rest] = name.split("/"); | ||
| return community === undefined && | ||
| rest.length === 0 && | ||
| SAFE_NAME.test(slug) && | ||
| SAFE_NAME.test(file ?? "") | ||
| ? path.join(folderOf(boards, examplesDir, slug), file) | ||
| : name; | ||
| }; |
There was a problem hiding this comment.
🔍 Inline the single-use path helper
pageOf has one call site in the adjacent image mapping. Repository rules ask for single-use helpers to be inlined.
Was this helpful? React with 👍 or 👎 to provide feedback.
The panel is one across tabs, so a tile attached in one project can be sent from another; it now carries where it was attached and the server resolves the file there. Inline the one-use helper, and add the release note. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 7d54b5d320
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| // A mockup's picture is kept for the panel, and the agent is pointed at its file, | ||
| // `<slug>/<file>.html` in whichever canvases folder holds that slug. A community | ||
| // project's is not on this machine, so it keeps the name `sp fetch` finds it by. | ||
| const pageOf = (name: string) => { |
There was a problem hiding this comment.
This newly added helper has only one call site (pageOf(i.name) in the held mapping), contrary to the repository's explicit rule that one-call helpers be inlined; move this resolution directly into the mapping to avoid the unnecessary jump and follow the mandated structure.
AGENTS.md reference: AGENTS.md:L128-L129
Useful? React with 👍 / 👎.
1 participant
Problem
Pressing + on a mockup (a
canvas-fileboard) had the server shoot it, and that PNG went to the agent as an image block ([Image #n] slug/file.html+ base64 image; Codex got the PNG's path). The mockup is an HTML file the agent reads, so the extra image only cost tokens.Fix
canvasAttach.tsxmarks a board's attachpage: true. Pictures and the person's own shapes are unchanged.ChatPanel.tsxkeeps the flag on the tile and posts it with the image. The shot is still taken and kept, because the composer tile and the transcript thumbnail draw it.server/agent.tsvalidates the flag and resolves<slug>/<file>.htmlto the board's absolute path withfolderOf(project or app canvases). For a community project it keeps the namesp fetchfinds it by.agents.ts: for a page, Claude gets only the text[Image #n] <path>, with no image block. Codex gets that path instead of the PNG's.Test
agents.test.tscovers a mockup for both agents.tsc -bandvitest runpass.🤖 Generated with Claude Code