diff options
| author | Jay V <[email protected]> | 2025-06-05 16:41:44 -0400 |
|---|---|---|
| committer | Jay V <[email protected]> | 2025-06-05 16:41:44 -0400 |
| commit | 95069af03fa38e64144b11f9068ead7c00831064 (patch) | |
| tree | 5b1e6e9bdce7e6f89af3cabfe4fb82a8618f7b96 | |
| parent | 3e4ebb6e5deb037aa322af6bbcb47f56840c5e9e (diff) | |
| download | opencode-95069af03fa38e64144b11f9068ead7c00831064.tar.gz opencode-95069af03fa38e64144b11f9068ead7c00831064.zip | |
share write tool
| -rw-r--r-- | packages/web/src/components/Share.tsx | 75 | ||||
| -rw-r--r-- | packages/web/src/components/share.module.css | 1 |
2 files changed, 76 insertions, 0 deletions
diff --git a/packages/web/src/components/Share.tsx b/packages/web/src/components/Share.tsx index f667eba85..d79620025 100644 --- a/packages/web/src/components/Share.tsx +++ b/packages/web/src/components/Share.tsx @@ -22,6 +22,7 @@ import { IconChevronDown, IconCommandLine, IconChevronRight, + IconDocumentPlus, IconPencilSquare, IconRectangleStack, IconMagnifyingGlass, @@ -1087,6 +1088,80 @@ export default function Share(props: { api: string }) { ) }} </Match> + {/* Write tool */} + <Match + when={ + msg.role === "assistant" && + part.type === "tool-invocation" && + part.toolInvocation.toolName === "opencode_write" && + part + } + > + {(part) => { + const metadata = createMemo(() => msg.metadata?.tool[part().toolInvocation.toolCallId]) + const args = part().toolInvocation.args + const filePath = args.filePath + const content = args.content + const hasError = metadata()?.error + const result = part().toolInvocation.state === "result" && part().toolInvocation.result + + const duration = createMemo(() => + DateTime.fromMillis(metadata()?.time.end || 0).diff( + DateTime.fromMillis(metadata()?.time.start || 0), + ).toMillis(), + ) + + return ( + <div data-section="part" data-part-type="tool-write"> + <div data-section="decoration"> + <div title="Write file"> + <IconDocumentPlus width={18} height={18} /> + </div> + <div></div> + </div> + <div data-section="content"> + <div data-part-tool-body> + <span data-part-title data-size="md"> + <span data-element-label>Write</span> + <b>{filePath}</b> + </span> + <Switch> + <Match when={hasError}> + <div data-part-tool-result> + <TextPart + expand + text={result} + data-size="sm" + data-color="dimmed" + /> + </div> + </Match> + <Match when={content}> + <div data-part-tool-result> + <ResultsButton + showCopy="Show contents" + hideCopy="Hide contents" + results={results()} + onClick={() => showResults((e) => !e)} + /> + <Show when={results()}> + <div data-part-tool-code> + <CodeBlock + lang={getFileType(filePath)} + code={content} + /> + </div> + </Show> + </div> + </Match> + </Switch> + </div> + <ToolFooter time={duration()} /> + </div> + </div> + ) + }} + </Match> {/* Edit tool */} <Match when={ diff --git a/packages/web/src/components/share.module.css b/packages/web/src/components/share.module.css index fc038af6b..8f193fc0b 100644 --- a/packages/web/src/components/share.module.css +++ b/packages/web/src/components/share.module.css @@ -317,6 +317,7 @@ [data-part-type="tool-list"], [data-part-type="tool-glob"], [data-part-type="tool-read"], + [data-part-type="tool-write"], [data-part-type="tool-fetch"] { & > [data-section="content"] > [data-part-tool-body] { gap: 0.5rem; |