Pine/deepseek-harness
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases 1 Wiki Activity

style(ui-trajectory): align presentation render tree

Browse Source
This commit is contained in:
imccyu
2026-08-11 00:04:51 +08:00
parent 2695f31edb
commit 98a4cc6569
3 changed files with 225 additions and 225 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/client/ui-trajectory/src/client/TrajectoryTable.tsx
+216 -216
View File
@@ -2214,241 +2214,241 @@ export function TrajectoryTable({
cell={record.cell} cell={record.cell}
> >
{({ displayText, listDisplayText, resultText, toolCallOnly, toolCallText }) => { {({ displayText, listDisplayText, resultText, toolCallOnly, toolCallText }) => {
const isCollapsedSummary = record.collapsedSummary !== undefined const isCollapsedSummary = record.collapsedSummary !== undefined
const isRequestOnly = record.cell.requestOnly === true const isRequestOnly = record.cell.requestOnly === true
const isInitialSystem = record.cell.kind === 'system' const isInitialSystem = record.cell.kind === 'system'
&& record.cell.index === allRecords[0]?.cell.index && record.cell.index === allRecords[0]?.cell.index
const request = record.groupStart const request = record.groupStart
&& !isCollapsedSummary && !isCollapsedSummary
&& (record.turn === null || !collapsedTurns.has(record.turn)) && (record.turn === null || !collapsedTurns.has(record.turn))
? requestNumbers.get(requestKey(record.turn, record.group)) ? requestNumbers.get(requestKey(record.turn, record.group))
: undefined : undefined
const requestInfo = request === undefined const requestInfo = request === undefined
? undefined ? undefined
: sessionRequestNumbers?.find(candidate => candidate.number === request) : sessionRequestNumbers?.find(candidate => candidate.number === request)
const requestStatus = requestInfo?.status const requestStatus = requestInfo?.status
?? (record.cell.isError === true ? 'error' : undefined) ?? (record.cell.isError === true ? 'error' : undefined)
const requestRunIndex = requestBoundaryRuns.get(record.cell.index) ?? 0 const requestRunIndex = requestBoundaryRuns.get(record.cell.index) ?? 0
const requestBoundaryStyle: RequestBoundaryStyle = { const requestBoundaryStyle: RequestBoundaryStyle = {
'--request-boundary-offset': `${requestRunIndex * 8}px`, '--request-boundary-offset': `${requestRunIndex * 8}px`,
} }
const requestLabel = request === undefined const requestLabel = request === undefined
? undefined ? undefined
: `Request #${request}${requestInfo?.purpose === 'compaction' ? ' · Compaction' : ''}` : `Request #${request}${requestInfo?.purpose === 'compaction' ? ' · Compaction' : ''}`
const requestSelected = request !== undefined const requestSelected = request !== undefined
&& selectedRequest?.turn === record.turn && selectedRequest?.turn === record.turn
&& selectedRequest.group === record.group && selectedRequest.group === record.group
const sectionActive = record.turn === null const sectionActive = record.turn === null
? activeSection === record.section ? activeSection === record.section
: activeTurn === record.turn : activeTurn === record.turn
return ( return (
<tr <tr
tabIndex={isRequestOnly ? -1 : 0} tabIndex={isRequestOnly ? -1 : 0}
aria-rowindex={position + 1} aria-rowindex={position + 1}
aria-label={isCollapsedSummary aria-label={isCollapsedSummary
? `Collapsed ${record.collapsedSummaryKind} summary, ${record.collapsedSummary}` ? `Collapsed ${record.collapsedSummaryKind} summary, ${record.collapsedSummary}`
: isRequestOnly : isRequestOnly
? `Request ${request ?? ''}, compaction` ? `Request ${request ?? ''}, compaction`
: `${request === undefined ? '' : `Request ${request}, `}${KIND_LABEL[record.cell.kind]}, ${listDisplayText || 'no content'}`} : `${request === undefined ? '' : `Request ${request}, `}${KIND_LABEL[record.cell.kind]}, ${listDisplayText || 'no content'}`}
aria-selected={!isCollapsedSummary && !isRequestOnly && selectedIndex === record.cell.index} aria-selected={!isCollapsedSummary && !isRequestOnly && selectedIndex === record.cell.index}
data-kind={record.cell.kind} data-kind={record.cell.kind}
data-trajectory-row-key={trajectoryVirtualRecordKey(record)} data-trajectory-row-key={trajectoryVirtualRecordKey(record)}
data-virtual-position={virtualizationEnabled ? position : undefined} data-virtual-position={virtualizationEnabled ? position : undefined}
data-record-index={!isCollapsedSummary && !isRequestOnly data-record-index={!isCollapsedSummary && !isRequestOnly
? record.cell.index ? record.cell.index
: undefined} : undefined}
data-request-only={isRequestOnly || undefined} data-request-only={isRequestOnly || undefined}
data-terminal-request-boundary={terminalRequestBoundary || undefined} data-terminal-request-boundary={terminalRequestBoundary || undefined}
data-group-start={record.groupStart || undefined} data-group-start={record.groupStart || undefined}
data-turn-start={record.turnStart || undefined} data-turn-start={record.turnStart || undefined}
data-error={record.cell.isError || undefined} data-error={record.cell.isError || undefined}
data-running={stateOf(record) === 'running' || undefined} data-running={stateOf(record) === 'running' || undefined}
data-turn-end={record.turnEnd || undefined} data-turn-end={record.turnEnd || undefined}
data-collapsed-summary={record.collapsedSummaryKind} data-collapsed-summary={record.collapsedSummaryKind}
data-selected={!isCollapsedSummary && selectedIndex === record.cell.index || undefined} data-selected={!isCollapsedSummary && selectedIndex === record.cell.index || undefined}
data-timeline-focus={isCollapsedSummary || timelineFocusIndexes === null data-timeline-focus={isCollapsedSummary || timelineFocusIndexes === null
? undefined ? undefined
: timelineFocusIndexes.has(record.cell.index) ? 'inside' : 'outside'} : timelineFocusIndexes.has(record.cell.index) ? 'inside' : 'outside'}
onClick={isRequestOnly onClick={isRequestOnly
? undefined ? undefined
: isCollapsedSummary : isCollapsedSummary
? () => { ? () => {
if (record.collapsedSummaryKind === 'turn' && record.turn !== null) { if (record.collapsedSummaryKind === 'turn' && record.turn !== null) {
onToggleTurn(record.turn)
} else onToggleAssistant(trajectoryRecordId(record.cell))
}
: () => { selectRecord(record.cell.index) }}
onDoubleClick={(event) => {
if (isCollapsedSummary || isRequestOnly) return
if (record.turn !== null && collapsedTurns.has(record.turn)) {
event.preventDefault()
onToggleTurn(record.turn) onToggleTurn(record.turn)
} else onToggleAssistant(trajectoryRecordId(record.cell)) return
} }
: () => { selectRecord(record.cell.index) }} if (
onDoubleClick={(event) => { record.cell.kind === 'message'
if (isCollapsedSummary || isRequestOnly) return
if (record.turn !== null && collapsedTurns.has(record.turn)) {
event.preventDefault()
onToggleTurn(record.turn)
return
}
if (
record.cell.kind === 'message'
&& assistantToolCalls(allRecords, record.cell.index).length > 0 && assistantToolCalls(allRecords, record.cell.index).length > 0
) { ) {
event.preventDefault() event.preventDefault()
onToggleAssistant(trajectoryRecordId(record.cell)) onToggleAssistant(trajectoryRecordId(record.cell))
return return
} }
if (!record.turnStart) return if (!record.turnStart) return
if (record.turn === null) return if (record.turn === null) return
if (allRecords.filter(candidate => if (allRecords.filter(candidate =>
candidate.turn === record.turn candidate.turn === record.turn
&& candidate.cell.requestOnly !== true && candidate.cell.requestOnly !== true
&& candidate.cell.kind !== 'system').length <= 1) return && candidate.cell.kind !== 'system').length <= 1) return
event.preventDefault() event.preventDefault()
onToggleTurn(record.turn)
}}
onKeyDown={(event) => {
if (isRequestOnly) return
if (event.key !== 'Enter' && event.key !== ' ') return
event.preventDefault()
if (isCollapsedSummary) {
if (record.collapsedSummaryKind === 'turn' && record.turn !== null) {
onToggleTurn(record.turn) onToggleTurn(record.turn)
} else onToggleAssistant(trajectoryRecordId(record.cell)) }}
return onKeyDown={(event) => {
} if (isRequestOnly) return
selectRecord(record.cell.index) if (event.key !== 'Enter' && event.key !== ' ') return
}} event.preventDefault()
> if (isCollapsedSummary) {
<td className={css.event}> if (record.collapsedSummaryKind === 'turn' && record.turn !== null) {
{request !== undefined && ( onToggleTurn(record.turn)
<button } else onToggleAssistant(trajectoryRecordId(record.cell))
type="button" return
className={requestSelected }
? `${css.requestBoundaryControl} ${css.requestBoundaryControlActive}` selectRecord(record.cell.index)
: css.requestBoundaryControl} }}
aria-label={requestLabel} >
aria-pressed={requestSelected} <td className={css.event}>
data-label={requestLabel} {request !== undefined && (
data-request-run-index={requestRunIndex} <button
data-request-status={requestStatus} type="button"
style={requestBoundaryStyle} className={requestSelected
onClick={(event) => { ? `${css.requestBoundaryControl} ${css.requestBoundaryControlActive}`
event.stopPropagation() : css.requestBoundaryControl}
selectRequest({ aria-label={requestLabel}
turn: record.turn, aria-pressed={requestSelected}
group: record.group, data-label={requestLabel}
...(requestInfo?.seq === undefined ? {} : { seq: requestInfo.seq }), data-request-run-index={requestRunIndex}
}) data-request-status={requestStatus}
}} style={requestBoundaryStyle}
onDoubleClick={(event) => { event.stopPropagation() }} onClick={(event) => {
/> event.stopPropagation()
)} selectRequest({
{record.turn !== null turn: record.turn,
group: record.group,
...(requestInfo?.seq === undefined ? {} : { seq: requestInfo.seq }),
})
}}
onDoubleClick={(event) => { event.stopPropagation() }}
/>
)}
{record.turn !== null
&& activeTurn === record.turn && activeTurn === record.turn
&& !isInitialSystem && ( && !isInitialSystem && (
<span className={css.turnRail} aria-hidden="true" /> <span className={css.turnRail} aria-hidden="true" />
)} )}
{!isCollapsedSummary && selectedIndex === record.cell.index && ( {!isCollapsedSummary && selectedIndex === record.cell.index && (
<span className={css.selectionRail} aria-hidden="true" /> <span className={css.selectionRail} aria-hidden="true" />
)} )}
{!isCollapsedSummary {!isCollapsedSummary
&& !isRequestOnly && !isRequestOnly
&& record.turnStart && ( && record.turnStart && (
<span
className={sectionActive
? `${css.turnLabel} ${css.turnLabelActive}`
: css.turnLabel}
aria-label={sectionLabel(record.turn)}
>
{record.turn === null
? sectionLabel(record.turn)
: (
<>
<span className={css.turnLabelFull} aria-hidden="true">
{sectionLabel(record.turn)}
</span>
<span className={css.turnLabelCompact} aria-hidden="true">
#{record.turn}
</span>
</>
)}
</span>
)}
<div className={css.eventInner}>
{!isCollapsedSummary && !isRequestOnly && (
<span
className={css.kindSlot}
>
<span <span
className={`${css.kindTag} ${ className={sectionActive
record.cell.kind === 'system' ? `${css.turnLabel} ${css.turnLabelActive}`
? css.systemNeutral : css.turnLabel}
: record.cell.kind === 'context' aria-label={sectionLabel(record.turn)}
? css.contextGreen
: record.cell.kind === 'compacted'
? css.compacted
: record.cell.kind === 'tool'
? css.toolAmber
: record.cell.kind === 'message'
? css.assistantVioletBright
: record.cell.kind === 'subtool'
? css.subtoolAmber
: css[record.cell.kind]
}`}
data-role-kind={record.cell.kind}
> >
<Tooltip {record.turn === null
label={KIND_LABEL[record.cell.kind]} ? sectionLabel(record.turn)
side="right" : (
> <>
<span className={css.kindTagIcon} aria-hidden="true"> <span className={css.turnLabelFull} aria-hidden="true">
{KIND_ICON[record.cell.kind]} {sectionLabel(record.turn)}
</span> </span>
</Tooltip> <span className={css.turnLabelCompact} aria-hidden="true">
<span className={css.kindTagLabel}> #{record.turn}
{KIND_LABEL[record.cell.kind]} </span>
</span> </>
</span> )}
</span>
)}
</div>
</td>
<td className={css.content}>
{isRequestOnly
? null
: record.collapsedSummary !== undefined
? (
<span className={css.collapsedTurnContent} title={record.collapsedSummary}>
<span className={css.collapsedTurnEllipsis}>…</span>
<span className={css.collapsedTurnText}>{record.collapsedSummary}</span>
</span>
)
: (
<span
className={resultText === undefined ? css.contentText : css.resultPreview}
title={resultText === undefined
? listDisplayText
: `${listDisplayText} → ${resultText}`}
>
<span className={resultText === undefined ? undefined : css.resultRequest}>
<RecordListText
displayText={displayText}
toolCallOnly={toolCallOnly}
toolCallText={toolCallText}
/>
</span>
{resultText !== undefined && (
<span className={record.cell.isError ? `${css.inlineResult} ${css.error}` : css.inlineResult}>
<span className={css.arrow}>→</span>
<span className={resultText === 'No output'
? `${css.inlineResultText} ${css.noOutputText}`
: css.inlineResultText}
>
{resultText}
</span>
</span>
)}
</span> </span>
)} )}
</td> <div className={css.eventInner}>
</tr> {!isCollapsedSummary && !isRequestOnly && (
) <span
className={css.kindSlot}
>
<span
className={`${css.kindTag} ${
record.cell.kind === 'system'
? css.systemNeutral
: record.cell.kind === 'context'
? css.contextGreen
: record.cell.kind === 'compacted'
? css.compacted
: record.cell.kind === 'tool'
? css.toolAmber
: record.cell.kind === 'message'
? css.assistantVioletBright
: record.cell.kind === 'subtool'
? css.subtoolAmber
: css[record.cell.kind]
}`}
data-role-kind={record.cell.kind}
>
<Tooltip
label={KIND_LABEL[record.cell.kind]}
side="right"
>
<span className={css.kindTagIcon} aria-hidden="true">
{KIND_ICON[record.cell.kind]}
</span>
</Tooltip>
<span className={css.kindTagLabel}>
{KIND_LABEL[record.cell.kind]}
</span>
</span>
</span>
)}
</div>
</td>
<td className={css.content}>
{isRequestOnly
? null
: record.collapsedSummary !== undefined
? (
<span className={css.collapsedTurnContent} title={record.collapsedSummary}>
<span className={css.collapsedTurnEllipsis}>…</span>
<span className={css.collapsedTurnText}>{record.collapsedSummary}</span>
</span>
)
: (
<span
className={resultText === undefined ? css.contentText : css.resultPreview}
title={resultText === undefined
? listDisplayText
: `${listDisplayText} → ${resultText}`}
>
<span className={resultText === undefined ? undefined : css.resultRequest}>
<RecordListText
displayText={displayText}
toolCallOnly={toolCallOnly}
toolCallText={toolCallText}
/>
</span>
{resultText !== undefined && (
<span className={record.cell.isError ? `${css.inlineResult} ${css.error}` : css.inlineResult}>
<span className={css.arrow}>→</span>
<span className={resultText === 'No output'
? `${css.inlineResultText} ${css.noOutputText}`
: css.inlineResultText}
>
{resultText}
</span>
</span>
)}
</span>
)}
</td>
</tr>
)
}} }}
</RecordPresentation> </RecordPresentation>
))} ))}
packages/client/ui-trajectory/src/client/layout.ts
+2 -2
View File
@@ -943,8 +943,8 @@ function expandSubCalls(
callId: sub.callId, callId: sub.callId,
...(settled ...(settled
? (sub.call !== null ? (sub.call !== null
? summarizeCall(sub.call.name, sub.call.argsRaw) ? summarizeCall(sub.call.name, sub.call.argsRaw)
: resultAsText(resultPreview)) : resultAsText(resultPreview))
: summarizeCall(sub.name, sub.argsRaw)), : summarizeCall(sub.name, sub.argsRaw)),
...(settled ...(settled
? (sub.call !== null ? { inputDetail: sub.call.argsRaw } : {}) ? (sub.call !== null ? { inputDetail: sub.call.argsRaw } : {})
packages/client/ui-trajectory/src/client/trajectory-search-index.ts
+7 -7
View File
@@ -97,13 +97,13 @@ export class TrajectorySearchIndex {
const entry = previous !== undefined && sameSources(previous.sources, sources) const entry = previous !== undefined && sameSources(previous.sources, sources)
? previous ? previous
: { : {
sources, sources,
text: [ text: [
...sources, ...sources,
markdownPreview(cell), markdownPreview(cell),
resultPreview(cell), resultPreview(cell),
].join('\n').toLocaleLowerCase(), ].join('\n').toLocaleLowerCase(),
} }
this.entries.set(id, entry) this.entries.set(id, entry)
seen.add(id) seen.add(id)
} }