feat(app): add filetree tooltips with diff labels

This commit is contained in:
David Hill
2026-01-27 16:04:31 +00:00
parent 82068955f7
commit 8ee5376f9b
2 changed files with 43 additions and 3 deletions

View File

@@ -8,6 +8,7 @@ import {
createMemo,
For,
Match,
Show,
splitProps,
Switch,
untrack,
@@ -221,8 +222,49 @@ export default function FileTree(props: {
const deep = () => deeps().get(node.path) ?? -1
const Wrapper = (p: ParentProps) => {
if (!tooltip()) return p.children
const parts = node.path.split("/")
const leaf = parts[parts.length - 1] ?? node.path
const head = parts.slice(0, -1).join("/")
const prefix = head ? `${head}/` : ""
const kind = () => (node.type === "file" ? kinds()?.get(node.path) : undefined)
const label = () => {
if (!marks()?.has(node.path)) return
const k = kind()
if (!k) return
if (k === "add") return "Additions"
if (k === "del") return "Deletions"
return "Modifications"
}
return (
<Tooltip forceMount={false} openDelay={2000} value={node.path} placement="right" class="w-full">
<Tooltip
forceMount={false}
openDelay={2000}
placement="bottom-start"
class="w-full"
contentStyle={{ "max-width": "480px", width: "fit-content" }}
value={
<div class="flex items-center min-w-0 whitespace-nowrap text-12-regular">
<span
class="min-w-0 truncate text-text-invert-base"
style={{ direction: "rtl", "unicode-bidi": "plaintext" }}
>
{prefix}
</span>
<span class="shrink-0 text-text-invert-strong">{leaf}</span>
<Show when={label()}>
{(t: () => string) => (
<>
<span class="mx-1 font-bold text-text-invert-strong"></span>
<span class="shrink-0 text-text-invert-strong">{t()}</span>
</>
)}
</Show>
</div>
}
>
{p.children}
</Tooltip>
)

View File

@@ -2664,7 +2664,6 @@ export default function Page() {
allowed={diffFiles()}
kinds={kinds()}
draggable={false}
tooltip={false}
onFileClick={(node) => focusReviewDiff(node.path)}
/>
</Show>
@@ -2681,7 +2680,6 @@ export default function Page() {
path=""
modified={diffFiles()}
kinds={kinds()}
tooltip={false}
onFileClick={(node) => openTab(file.tab(node.path))}
/>
</Tabs.Content>