BuzzbeeSCD/openchamber
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #3127 from robertoberto/feat/quick-open-icon-in-tool-header

Browse Source 
feat(chat): add quick-open file icon in tool card header
This commit is contained in:
Bohdan Triapitsyn
2026-08-28 01:24:42 +03:00
committed by GitHub
parent 3d397b4ad4 14c40c9615
commit 5a439ea73d
12 changed files with 84 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui/src/components/chat/message/parts/ToolPart.tsx
+73 -1
View File
@@ -1966,6 +1966,7 @@ const ToolPartContent: React.FC<ToolPartProps> = ({
return null;
}, [descriptionPath, normalizedPartTool, stateWithData, input]);
const runtime = React.useContext(RuntimeAPIContext);
const mobileActions = useMobileAppActions();
const openApplyPatchFile = (file: Record<string, unknown>, event: React.MouseEvent<HTMLButtonElement>) => {
if (!runtime?.editor) {
@@ -2038,6 +2039,61 @@ const ToolPartContent: React.FC<ToolPartProps> = ({
handleMainClick(event);
};
// Quick-open target for the file-link icon in the tool header. Resolves the
// primary file path (and, for diff tools, the first changed line + diff) so
// the user can open the file in the side panel (web/desktop) or editor
// (VS Code) without expanding the tool card. Reuses the same path helpers as
// handleMainClick above; the difference is the web fallback — handleMainClick
// only opens when runtime.editor is available, this icon also falls back to
// useUIStore.openContextFile{AtLine} so the file opens in the right pane.
const quickOpenTarget = React.useMemo<{ absolutePath: string; line?: number; toolDiff?: string; toolName: string } | null>(() => {
if (isTaskTool) return null;
const toolName = normalizedPartTool || part.tool;
const filePath = getPrimaryToolPath(toolName, input, metadata);
if (typeof filePath !== 'string') return null;
const absolutePath = toAbsoluteFilePath(currentDirectory, filePath);
let line: number | undefined;
let toolDiff: string | undefined;
if (toolName === 'edit' || toolName === 'multiedit' || toolName === 'apply_patch') {
line = getFirstChangedLineFromMetadata(toolName, metadata, filePath);
toolDiff = getPrimaryDiffFromMetadata(toolName, metadata, filePath);
}
return { absolutePath, line, toolDiff, toolName };
}, [isTaskTool, normalizedPartTool, part.tool, input, metadata, currentDirectory]);
const openQuickTarget = () => {
if (!quickOpenTarget) return;
const { absolutePath, line, toolDiff, toolName } = quickOpenTarget;
if (runtime?.editor) {
if (runtime.runtime.isVSCode && toolDiff && (toolName === 'edit' || toolName === 'multiedit' || toolName === 'apply_patch')) {
const label = `${getRelativePath(absolutePath, currentDirectory)} (changes)`;
void runtime.editor.openDiff('', absolutePath, label, { line, patch: toolDiff });
return;
}
runtime.editor.openFile(absolutePath, line);
return;
}
const uiStore = useUIStore.getState();
if (typeof line === 'number' && Number.isFinite(line)) {
uiStore.openContextFileAtLine(currentDirectory, absolutePath, Math.max(1, Math.trunc(line)), 1);
} else {
uiStore.openContextFile(currentDirectory, absolutePath);
}
mobileActions?.openFiles();
};
const handleQuickOpen = (event: React.MouseEvent<HTMLButtonElement>) => {
event.stopPropagation();
openQuickTarget();
};
const handleQuickOpenKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>) => {
if (event.key !== 'Enter' && event.key !== ' ') return;
event.preventDefault();
event.stopPropagation();
openQuickTarget();
};
const iconStyle = !isTaskTool && isError ? TOOL_ERROR_ICON_STYLE : TOOL_NORMAL_ICON_STYLE;
const titleStyle = !isTaskTool && isError ? TOOL_ERROR_TITLE_STYLE : TOOL_NORMAL_TITLE_STYLE;
const shouldRenderTaskSummary = useDeferredExpandedContent(isTaskTool && (taskSummaryEntries.length > 0 || isActive || shouldTreatAsFinalized || !!taskSessionId));
@@ -2131,7 +2187,7 @@ const ToolPartContent: React.FC<ToolPartProps> = ({
{isExpanded ? <Icon name="arrow-down-s" className="h-3.5 w-3.5" /> : <Icon name="arrow-right-s" className="h-3.5 w-3.5" />}
</div>
</div>
<div className="flex items-center gap-2 min-w-0 flex-1">
<div className="flex items-center gap-1 min-w-0 flex-1">
<MinDurationShineText
active={Boolean(isActive && !isError)}
minDurationMs={300}
@@ -2141,6 +2197,22 @@ const ToolPartContent: React.FC<ToolPartProps> = ({
>
{displayName}
</MinDurationShineText>
{quickOpenTarget ? (
<button
type="button"
onClick={handleQuickOpen}
onKeyDown={handleQuickOpenKeyDown}
className={cn(
'flex-shrink-0 inline-flex h-4 w-4 items-center justify-center rounded transition-opacity hover:bg-[var(--surface-hover)]',
'opacity-0 group-hover/tool:opacity-60 hover:opacity-100 focus-visible:opacity-100',
)}
style={{ color: 'var(--tools-icon)' }}
title={t('chat.toolPart.openFile')}
aria-label={t('chat.toolPart.openFile')}
>
<Icon name="external-link" className="h-3 w-3" />
</button>
) : null}
</div>
{normalizedPartTool === 'bash' && typeof effectiveTimeStart === 'number' ? (
<span className={cn('flex-shrink-0 tabular-nums text-muted-foreground/80', TOOL_ROW_DESCRIPTION_CLASS)}>
packages/ui/src/lib/i18n/messages/de.ts
+1
View File
@@ -2156,6 +2156,7 @@ export const dict = {
'chat.toolPart.showRawJson': 'Rohe JSON anzeigen',
'chat.toolPart.showFormattedJson': 'Formatierte JSON anzeigen',
'chat.toolPart.showNavigableJson': 'Navigierbare JSON anzeigen',
'chat.toolPart.openFile': 'Datei öffnen',
'chat.toolPart.openFileAtFirstChange': 'Datei bei erster Änderung öffnen',
'chat.toolPart.openFileDiff': 'Datei-Unterschied öffnen',
'chat.toolPart.copyOutput': 'Ausgabe kopieren',
packages/ui/src/lib/i18n/messages/en.ts
+1
View File
@@ -2350,6 +2350,7 @@ export const dict = {
'chat.toolPart.showRawJson': 'Show raw JSON',
'chat.toolPart.showFormattedJson': 'Show formatted JSON',
'chat.toolPart.showNavigableJson': 'Show navigable JSON',
'chat.toolPart.openFile': 'Open file',
'chat.toolPart.openFileAtFirstChange': 'Open file at first change',
'chat.toolPart.openFileDiff': 'Open file diff',
'chat.toolPart.copyOutput': 'Copy output',
packages/ui/src/lib/i18n/messages/es.ts
+1
View File
@@ -2316,6 +2316,7 @@ export const dict: Record<I18nKey, string> = {
"chat.toolPart.showRawJson": "Mostrar JSON sin formato",
"chat.toolPart.showFormattedJson": "Mostrar JSON formateado",
"chat.toolPart.showNavigableJson": "Mostrar JSON navegable",
"chat.toolPart.openFile": "Abrir archivo",
"chat.toolPart.openFileAtFirstChange": "Abrir archivo en el primer cambio",
"chat.toolPart.openFileDiff": "Abrir diferencias del archivo",
"chat.toolPart.copyOutput": "Copiar salida",
packages/ui/src/lib/i18n/messages/fr.ts
+1
View File
@@ -3102,6 +3102,7 @@ export const dict = {
'chat.toolPart.showRawJson': 'Afficher le JSON brut',
'chat.toolPart.showFormattedJson': 'Afficher le JSON formaté',
'chat.toolPart.showNavigableJson': 'Afficher le JSON navigable',
'chat.toolPart.openFile': 'Ouvrir le fichier',
'chat.toolPart.openFileAtFirstChange': 'Ouvrir le fichier à la première modification',
'chat.toolPart.openFileDiff': 'Ouvrir les différences du fichier',
'chat.toolPart.copyOutput': 'Copier la sortie',
packages/ui/src/lib/i18n/messages/ja.ts
+1
View File
@@ -2351,6 +2351,7 @@ export const dict: Record<I18nKey, string> = {
'chat.toolPart.showRawJson': '生JSONを表示',
'chat.toolPart.showFormattedJson': '整形JSONを表示',
'chat.toolPart.showNavigableJson': 'ナビゲーション可能なJSONを表示',
'chat.toolPart.openFile': 'ファイルを開く',
'chat.toolPart.openFileAtFirstChange': '最初の変更箇所でファイルを開く',
'chat.toolPart.openFileDiff': 'ファイル差分を開く',
'chat.toolPart.copyOutput': '出力をコピー',
packages/ui/src/lib/i18n/messages/ko.ts
+1
View File
@@ -2350,6 +2350,7 @@ export const dict: Record<I18nKey, string> = {
'chat.toolPart.showRawJson': '원시 JSON 표시',
'chat.toolPart.showFormattedJson': '형식화된 JSON 표시',
'chat.toolPart.showNavigableJson': '탐색 가능한 JSON 표시',
'chat.toolPart.openFile': '파일 열기',
'chat.toolPart.openFileAtFirstChange': '첫 번째 변경 위치에서 파일 열기',
'chat.toolPart.openFileDiff': '파일 diff 열기',
'chat.toolPart.copyOutput': '출력 복사',
packages/ui/src/lib/i18n/messages/pl.ts
+1
View File
@@ -1433,6 +1433,7 @@ export const dict: Record<I18nKey, string> = {
'chat.toolPart.showRawJson': 'Pokaż surowy JSON',
'chat.toolPart.showFormattedJson': 'Pokaż sformatowany JSON',
'chat.toolPart.showNavigableJson': 'Pokaż nawigowalny JSON',
'chat.toolPart.openFile': 'Otwórz plik',
'chat.toolPart.openFileAtFirstChange': 'Otwórz plik przy pierwszej zmianie',
'chat.toolPart.openFileDiff': 'Otwórz różnice pliku',
'chat.toolPart.copyOutput': 'Kopiuj wyjście',
packages/ui/src/lib/i18n/messages/pt-BR.ts
+1
View File
@@ -2316,6 +2316,7 @@ export const dict: Record<I18nKey, string> = {
"chat.toolPart.showRawJson": "Mostrar JSON bruto",
"chat.toolPart.showFormattedJson": "Mostrar JSON formatado",
"chat.toolPart.showNavigableJson": "Mostrar JSON navegável",
"chat.toolPart.openFile": "Abrir arquivo",
"chat.toolPart.openFileAtFirstChange": "Abrir arquivo na primeira alteração",
"chat.toolPart.openFileDiff": "Abrir diferenças do arquivo",
"chat.toolPart.copyOutput": "Copiar saída",
packages/ui/src/lib/i18n/messages/uk.ts
+1
View File
@@ -2316,6 +2316,7 @@ export const dict: Record<I18nKey, string> = {
"chat.toolPart.showRawJson": "Показати сирий JSON",
"chat.toolPart.showFormattedJson": "Показати форматований JSON",
"chat.toolPart.showNavigableJson": "Показати навігаційний JSON",
"chat.toolPart.openFile": "Відкрити файл",
"chat.toolPart.openFileAtFirstChange": "Відкрити файл на першій зміні",
"chat.toolPart.openFileDiff": "Відкрити diff файлу",
"chat.toolPart.copyOutput": "Скопіювати вивід",
packages/ui/src/lib/i18n/messages/zh-CN.ts
+1
View File
@@ -2316,6 +2316,7 @@ export const dict: Record<I18nKey, string> = {
'chat.toolPart.showRawJson': '显示原始 JSON',
'chat.toolPart.showFormattedJson': '显示格式化 JSON',
'chat.toolPart.showNavigableJson': '显示可导航 JSON',
'chat.toolPart.openFile': '打开文件',
'chat.toolPart.openFileAtFirstChange': '在首次更改处打开文件',
'chat.toolPart.openFileDiff': '打开文件差异',
'chat.toolPart.copyOutput': '复制输出',
packages/ui/src/lib/i18n/messages/zh-TW.ts
+1
View File
@@ -2320,6 +2320,7 @@ export const dict: Record<I18nKey, string> = {
'chat.toolPart.showRawJson': '顯示原始 JSON',
'chat.toolPart.showFormattedJson': '顯示格式化 JSON',
'chat.toolPart.showNavigableJson': '顯示可導覽 JSON',
'chat.toolPart.openFile': '開啟檔案',
'chat.toolPart.openFileAtFirstChange': '在首次變更處開啟檔案',
'chat.toolPart.openFileDiff': '開啟檔案差異',
'chat.toolPart.copyOutput': '複製輸出',