diff options
| author | Jay V <[email protected]> | 2025-06-04 20:14:14 -0400 |
|---|---|---|
| committer | Jay V <[email protected]> | 2025-06-04 20:14:14 -0400 |
| commit | 160428d2d4ea9fcceff9cbb41cea55c5f96221fe (patch) | |
| tree | fa36a42d7afbd004363cb60088de94acaf3fe721 /packages/web/src/components/Share.tsx | |
| parent | 0a1f9accd7f7a5ad1a7cb36e799a70ca109d3a67 (diff) | |
| download | opencode-160428d2d4ea9fcceff9cbb41cea55c5f96221fe.tar.gz opencode-160428d2d4ea9fcceff9cbb41cea55c5f96221fe.zip | |
share page glob
Diffstat (limited to 'packages/web/src/components/Share.tsx')
| -rw-r--r-- | packages/web/src/components/Share.tsx | 97 |
1 files changed, 96 insertions, 1 deletions
diff --git a/packages/web/src/components/Share.tsx b/packages/web/src/components/Share.tsx index a1b49a8de..b6bd7fd0d 100644 --- a/packages/web/src/components/Share.tsx +++ b/packages/web/src/components/Share.tsx @@ -25,6 +25,7 @@ import { IconMagnifyingGlass, IconWrenchScrewdriver, IconDocumentArrowDown, + IconDocumentMagnifyingGlass, } from "./icons" import DiffView from "./DiffView" import CodeBlock from "./CodeBlock" @@ -735,6 +736,100 @@ export default function Share(props: { api: string }) { </div> )} </Match> + {/* Grep tool */} + <Match + when={ + msg.role === "assistant" && + part.type === "tool-invocation" && + part.toolInvocation.toolName === "opencode_grep" && + part + } + > + {(part) => { + const metadata = createMemo(() => + msg.metadata?.tool[part().toolInvocation.toolCallId] + ) + const args = part().toolInvocation.args + const result = part().toolInvocation.state === "result" && part().toolInvocation.result + const matches = metadata()?.matches + + const { pattern, ...rest } = args + + 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-grep"> + <div data-section="decoration"> + <div title="Grep files"> + <IconDocumentMagnifyingGlass + 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>Grep</span> + <b>“{pattern}”</b> + </span> + <Show when={Object.keys(rest).length > 0}> + <div data-part-tool-args> + <For each={flattenToolArgs(rest)}> + {([name, value]) => ( + <> + <div></div> + <div>{name}</div> + <div>{value}</div> + </> + )} + </For> + </div> + </Show> + <Switch> + <Match when={matches > 0}> + <div data-part-tool-result> + <ResultsButton + showCopy={matches === 1 + ? "1 match" + : `${matches} matches` + } + hideCopy="Hide matches" + results={results()} + onClick={() => showResults((e) => !e)} + /> + <Show when={results()}> + <TextPart + expand + text={result} + data-size="sm" + data-color="dimmed" + /> + </Show> + </div> + </Match> + <Match when={result}> + <div data-part-tool-result> + <TextPart + expand + text={result} + data-size="sm" + data-color="dimmed" + /> + </div> + </Match> + </Switch> + </div> + <ToolFooter time={duration()} /> + </div> + </div> + ) + }} + </Match> {/* Glob tool */} <Match when={ @@ -762,7 +857,7 @@ export default function Share(props: { api: string }) { return ( <div data-section="part" data-part-type="tool-glob"> <div data-section="decoration"> - <div title="List files"> + <div title="Glob files"> <IconMagnifyingGlass width={18} height={18} /> </div> <div></div> |