feat(app): add filetree tooltips with diff labels
This commit is contained in:
@@ -8,6 +8,7 @@ import {
|
|||||||
createMemo,
|
createMemo,
|
||||||
For,
|
For,
|
||||||
Match,
|
Match,
|
||||||
|
Show,
|
||||||
splitProps,
|
splitProps,
|
||||||
Switch,
|
Switch,
|
||||||
untrack,
|
untrack,
|
||||||
@@ -221,8 +222,49 @@ export default function FileTree(props: {
|
|||||||
const deep = () => deeps().get(node.path) ?? -1
|
const deep = () => deeps().get(node.path) ?? -1
|
||||||
const Wrapper = (p: ParentProps) => {
|
const Wrapper = (p: ParentProps) => {
|
||||||
if (!tooltip()) return p.children
|
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 (
|
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}
|
{p.children}
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
)
|
)
|
||||||
|
|||||||
@@ -2664,7 +2664,6 @@ export default function Page() {
|
|||||||
allowed={diffFiles()}
|
allowed={diffFiles()}
|
||||||
kinds={kinds()}
|
kinds={kinds()}
|
||||||
draggable={false}
|
draggable={false}
|
||||||
tooltip={false}
|
|
||||||
onFileClick={(node) => focusReviewDiff(node.path)}
|
onFileClick={(node) => focusReviewDiff(node.path)}
|
||||||
/>
|
/>
|
||||||
</Show>
|
</Show>
|
||||||
@@ -2681,7 +2680,6 @@ export default function Page() {
|
|||||||
path=""
|
path=""
|
||||||
modified={diffFiles()}
|
modified={diffFiles()}
|
||||||
kinds={kinds()}
|
kinds={kinds()}
|
||||||
tooltip={false}
|
|
||||||
onFileClick={(node) => openTab(file.tab(node.path))}
|
onFileClick={(node) => openTab(file.tab(node.path))}
|
||||||
/>
|
/>
|
||||||
</Tabs.Content>
|
</Tabs.Content>
|
||||||
|
|||||||
Reference in New Issue
Block a user