dreampiler/kandev
1
0
Fork 0
Code Issues 46 Pull Requests Actions 93 Packages Projects Releases Wiki Activity

feat(editors): truncate file path in editor toolbar with hover-scroll (#1029)

Browse Source
This commit is contained in:
Carlos Florêncio
2026-05-23 10:52:45 +01:00
committed by GitHub
parent 9ddb271e7f
commit 43d6a2bf7b
2 changed files with 12 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/components/editors/codemirror/codemirror-code-editor.tsx
+6 -3
View File
@@ -3,6 +3,7 @@
import { useRef } from "react";
import CodeMirror, { type ReactCodeMirrorRef } from "@uiw/react-codemirror";
import { Button } from "@kandev/ui/button";
import { ScrollOnOverflow } from "@kandev/ui/scroll-on-overflow";
import {
IconDeviceFloppy,
IconLoader2,
@@ -228,10 +229,12 @@ function CodeMirrorToolbar({
return (
<PanelHeaderBarSplit
left={
<div className="flex items-center gap-2 text-xs text-muted-foreground">
<span className="font-mono">{toRelativePath(path, worktreePath)}</span>
<div className="flex min-w-0 items-center gap-2 text-xs text-muted-foreground">
<ScrollOnOverflow className="min-w-0 font-mono">
{toRelativePath(path, worktreePath)}
</ScrollOnOverflow>
{isDirty && diffStats && (
<span className="text-xs text-yellow-500">
<span className="shrink-0 text-xs text-yellow-500">
{formatDiffStats(diffStats.additions, diffStats.deletions)}
</span>
)}
apps/web/components/editors/monaco/monaco-editor-toolbar.tsx
+6 -3
View File
@@ -1,6 +1,7 @@
"use client";
import { Button } from "@kandev/ui/button";
import { ScrollOnOverflow } from "@kandev/ui/scroll-on-overflow";
import { Tooltip, TooltipContent, TooltipTrigger } from "@kandev/ui/tooltip";
import {
IconDeviceFloppy,
@@ -68,10 +69,12 @@ function ToolbarLeft({
diffStats: { additions: number; deletions: number } | null;
}) {
return (
<div className="flex items-center gap-2 text-xs text-muted-foreground">
<span className="font-mono">{toRelativePath(path, worktreePath)}</span>
<div className="flex min-w-0 items-center gap-2 text-xs text-muted-foreground">
<ScrollOnOverflow className="min-w-0 font-mono">
{toRelativePath(path, worktreePath)}
</ScrollOnOverflow>
{isDirty && diffStats && (
<span className="text-xs text-yellow-500">
<span className="shrink-0 text-xs text-yellow-500">
{formatDiffStats(diffStats.additions, diffStats.deletions)}
</span>
)}