diff --git a/packages/web/src/components/Share.tsx b/packages/web/src/components/Share.tsx index e9104804..a76de4fc 100644 --- a/packages/web/src/components/Share.tsx +++ b/packages/web/src/components/Share.tsx @@ -18,7 +18,7 @@ import { IconOpenAI, IconGemini, IconOpencode, - IconAnthropic + IconAnthropic, } from "./icons/custom" import { IconFolder, @@ -87,10 +87,10 @@ function scrollToAnchor(id: string) { function stripWorkingDirectory(filePath: string, workingDir?: string) { if (workingDir === undefined) return filePath - const prefix = workingDir.endsWith('/') ? workingDir : workingDir + '/' + const prefix = workingDir.endsWith("/") ? workingDir : workingDir + "/" if (filePath === workingDir) { - return '' + return "" } if (filePath.startsWith(prefix)) { @@ -162,21 +162,25 @@ function formatErrorString(error: string): JSX.Element { {error.slice(errorMarker.length)} ) : ( -
{error}
+
+      {error}
+    
) } function getDiagnostics( diagnosticsByFile: Record, - currentFile: string + currentFile: string, ): JSX.Element[] { // Return a flat array of error diagnostics, in the format: // "Error [65:20] Property 'x' does not exist on type 'Y'" const result: JSX.Element[] = [] if ( - diagnosticsByFile === undefined || diagnosticsByFile[currentFile] === undefined - ) return result + diagnosticsByFile === undefined || + diagnosticsByFile[currentFile] === undefined + ) + return result for (const diags of Object.values(diagnosticsByFile)) { for (const d of diags) { @@ -188,12 +192,14 @@ function getDiagnostics( result.push(
-          Error
+          
+            Error
+          
           
             [{line}:{column}]
           
           {d.message}
-        
+ , ) } } @@ -279,7 +285,12 @@ interface TextPartProps extends JSX.HTMLAttributes { highlight?: boolean } function TextPart(props: TextPartProps) { - const [local, rest] = splitProps(props, ["text", "expand", "invert", "highlight"]) + const [local, rest] = splitProps(props, [ + "text", + "expand", + "invert", + "highlight", + ]) const [expanded, setExpanded] = createSignal(false) const [overflowed, setOverflowed] = createSignal(false) let preEl: HTMLPreElement | undefined @@ -440,7 +451,12 @@ interface TerminalPartProps extends JSX.HTMLAttributes { expand?: boolean } function TerminalPart(props: TerminalPartProps) { - const [local, rest] = splitProps(props, ["command", "result", "desc", "expand"]) + const [local, rest] = splitProps(props, [ + "command", + "result", + "desc", + "expand", + ]) const [expanded, setExpanded] = createSignal(false) const [overflowed, setOverflowed] = createSignal(false) let preEl: HTMLElement | undefined @@ -522,7 +538,7 @@ function AnchorIcon(props: AnchorProps) { > { + onClick={(e) => { e.preventDefault() const anchor = e.currentTarget @@ -569,7 +585,7 @@ export default function Share(props: { messages: Record }>({ info: props.info, messages: props.messages }) const messages = createMemo(() => - Object.values(store.messages).toSorted((a, b) => a.id?.localeCompare(b.id)) + Object.values(store.messages).toSorted((a, b) => a.id?.localeCompare(b.id)), ) const [connectionStatus, setConnectionStatus] = createSignal< [Status, string?] @@ -785,7 +801,7 @@ export default function Share(props: {
- v0.1.1 + v${store.info?.version} @@ -811,12 +827,12 @@ export default function Share(props: {
{data().created ? ( {DateTime.fromMillis(data().created || 0).toLocaleString( - DateTime.DATETIME_MED + DateTime.DATETIME_MED, )} ) : ( @@ -838,14 +854,13 @@ export default function Share(props: { {(msg, msgIndex) => ( {(part, partIndex) => { - if (( - part.type === "step-start" && - (partIndex() > 0 || !msg.metadata?.assistant) - ) || ( - msg.role === "assistant" && + if ( + (part.type === "step-start" && + (partIndex() > 0 || !msg.metadata?.assistant)) || + (msg.role === "assistant" && part.type === "tool-invocation" && - part.toolInvocation.toolName === "opencode_todoread" - )) + part.toolInvocation.toolName === "opencode_todoread") + ) return null const anchor = createMemo(() => `${msg.id}-${partIndex()}`) @@ -857,14 +872,20 @@ export default function Share(props: { ) const toolData = createMemo(() => { if ( - msg.role !== "assistant" || part.type !== "tool-invocation" - ) return {} + msg.role !== "assistant" || + part.type !== "tool-invocation" + ) + return {} - const metadata = msg.metadata?.tool[part.toolInvocation.toolCallId] + const metadata = + msg.metadata?.tool[part.toolInvocation.toolCallId] const args = part.toolInvocation.args - const result = part.toolInvocation.state === "result" && part.toolInvocation.result + const result = + part.toolInvocation.state === "result" && + part.toolInvocation.result const duration = DateTime.fromMillis( - metadata?.time.end || 0) + metadata?.time.end || 0, + ) .diff(DateTime.fromMillis(metadata?.time.start || 0)) .toMillis() @@ -927,14 +948,17 @@ export default function Share(props: { text={stripEnclosingTag(part().text)} /> - - {DateTime.fromMillis(data().completed || 0).toLocaleString( - DateTime.DATETIME_MED + ).toLocaleString( + DateTime.DATETIME_FULL_WITH_SECONDS, )} + > + {DateTime.fromMillis( + data().completed || 0, + ).toLocaleString(DateTime.DATETIME_MED)}
@@ -953,7 +977,8 @@ export default function Share(props: { const system = createMemo(() => { const prompts = assistant().system || [] return prompts.filter( - (p: string) => !p.startsWith("You are Claude Code") + (p: string) => + !p.startsWith("You are Claude Code"), ) }) return ( @@ -1079,13 +1104,17 @@ export default function Share(props: { Grep “{splitArgs().pattern}” - 0 - }> + 0 + } + >
- + {([name, value]) => ( <>
@@ -1133,7 +1162,9 @@ export default function Share(props: {
- + ) @@ -1209,7 +1240,9 @@ export default function Share(props: { - + ) @@ -1225,13 +1258,13 @@ export default function Share(props: { } > {(_part) => { - const path = createMemo( - () => toolData()?.args.path !== data().rootDir + const path = createMemo(() => + toolData()?.args.path !== data().rootDir ? stripWorkingDirectory( - toolData()?.args.path, - data().rootDir - ) - : toolData()?.args.path + toolData()?.args.path, + data().rootDir, + ) + : toolData()?.args.path, ) return ( @@ -1276,7 +1309,9 @@ export default function Share(props: { - + ) @@ -1292,11 +1327,11 @@ export default function Share(props: { } > {(_part) => { - const filePath = createMemo( - () => stripWorkingDirectory( + const filePath = createMemo(() => + stripWorkingDirectory( toolData()?.args.filePath, - data().rootDir - ) + data().rootDir, + ), ) const hasError = () => toolData()?.metadata?.error const preview = () => toolData()?.metadata?.preview @@ -1323,7 +1358,9 @@ export default function Share(props: {
- {formatErrorString(toolData()?.result)} + {formatErrorString( + toolData()?.result, + )}
@@ -1367,7 +1404,9 @@ export default function Share(props: { - + ) @@ -1383,19 +1422,19 @@ export default function Share(props: { } > {(_part) => { - const filePath = createMemo( - () => stripWorkingDirectory( + const filePath = createMemo(() => + stripWorkingDirectory( toolData()?.args.filePath, - data().rootDir - ) + data().rootDir, + ), ) const hasError = () => toolData()?.metadata?.error const content = () => toolData()?.args?.content const diagnostics = createMemo(() => getDiagnostics( toolData()?.metadata?.diagnostics, - toolData()?.args.filePath - ) + toolData()?.args.filePath, + ), ) return ( @@ -1423,7 +1462,9 @@ export default function Share(props: {
- {formatErrorString(toolData()?.result)} + {formatErrorString( + toolData()?.result, + )}
@@ -1449,7 +1490,9 @@ export default function Share(props: { - + ) @@ -1468,17 +1511,17 @@ export default function Share(props: { const diff = () => toolData()?.metadata?.diff const message = () => toolData()?.metadata?.message const hasError = () => toolData()?.metadata?.error - const filePath = createMemo( - () => stripWorkingDirectory( + const filePath = createMemo(() => + stripWorkingDirectory( toolData()?.args.filePath, - data().rootDir - ) + data().rootDir, + ), ) const diagnostics = createMemo(() => getDiagnostics( toolData()?.metadata?.diagnostics, - toolData()?.args.filePath - ) + toolData()?.args.filePath, + ), ) return ( @@ -1521,7 +1564,9 @@ export default function Share(props: { {diagnostics()}
- + ) @@ -1561,7 +1606,9 @@ export default function Share(props: { result={toolData()?.result} /> - + ) @@ -1573,20 +1620,18 @@ export default function Share(props: { msg.role === "assistant" && part.type === "tool-invocation" && part.toolInvocation.toolName === - "opencode_todowrite" && + "opencode_todowrite" && part } > {(_part) => { - const todos = createMemo( - () => sortTodosByStatus(toolData()?.args.todos) - ) - const starting = () => todos().every( - (t) => t.status === "pending" - ) - const finished = () => todos().every( - (t) => t.status === "completed" + const todos = createMemo(() => + sortTodosByStatus(toolData()?.args.todos), ) + const starting = () => + todos().every((t) => t.status === "pending") + const finished = () => + todos().every((t) => t.status === "completed") return (
- + ) @@ -1639,7 +1686,7 @@ export default function Share(props: { msg.role === "assistant" && part.type === "tool-invocation" && part.toolInvocation.toolName === - "opencode_webfetch" && + "opencode_webfetch" && part } > @@ -1670,7 +1717,9 @@ export default function Share(props: {
- {formatErrorString(toolData()?.result)} + {formatErrorString( + toolData()?.result, + )}
@@ -1694,7 +1743,9 @@ export default function Share(props: { - + ) @@ -1776,7 +1827,9 @@ export default function Share(props: { - + ) @@ -1820,9 +1873,7 @@ export default function Share(props: {
- - {part.type} - + {part.type}
- - {getStatusText(connectionStatus())} - + {getStatusText(connectionStatus())}
diff --git a/packages/web/src/pages/s/[id].astro b/packages/web/src/pages/s/[id].astro index 2b7cc8a9..62f0c39d 100644 --- a/packages/web/src/pages/s/[id].astro +++ b/packages/web/src/pages/s/[id].astro @@ -13,7 +13,7 @@ const data = await res.json(); let cost = 0; const models: Set = new Set(); -const version = "v0.1.1"; +const version = `v${data.info.version}`; Object.values(data.messages).forEach((d) => { const assistant = d.metadata?.assistant; if (assistant) {