Skip to content

Commit b666398

Browse files
committed
Tabs: Always show tooltip with volume name + full path
- Drop `overflowOnly: true` on tab buttons. The check tested the outer button's `scrollWidth`, but the ellipsis lives on the inner `.tab-label` (which has its own `overflow: hidden`), so the button never reported overflow and the tooltip never fired. - Enrich the tooltip text with the volume's display name (for example `Dropbox — /Users/david/Dropbox/Notes` or `External SSD — /Volumes/T7/photos`), so users can tell at a glance whether a tab is on a local disk, external drive, or cloud volume.
1 parent b7c3d96 commit b666398

1 file changed

Lines changed: 9 additions & 1 deletion

File tree

apps/desktop/src/lib/file-explorer/tabs/TabBar.svelte

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
import type { TabState, TabId } from './tab-types'
33
import { tooltip } from '$lib/tooltip/tooltip'
44
import { getFolderName } from '$lib/file-operations/transfer/transfer-dialog-utils'
5+
import { getVolumes } from '$lib/stores/volume-store.svelte'
56
67
interface Props {
78
tabs: TabState[]
@@ -32,6 +33,13 @@
3233
const isSingleTab = $derived(tabs.length === 1)
3334
const isAtMax = $derived(tabs.length >= maxTabs)
3435
36+
const volumeNameById = $derived(new Map(getVolumes().map((v) => [v.id, v.name])))
37+
38+
function tabTooltipText(tab: TabState): string {
39+
const volumeName = volumeNameById.get(tab.volumeId)
40+
return volumeName ? `${volumeName} — ${tab.path}` : tab.path
41+
}
42+
3543
function handleTabMouseDown(event: MouseEvent, tabId: TabId) {
3644
// Middle click
3745
if (event.button === 1) {
@@ -75,7 +83,7 @@
7583
class:after-active={isAfterActive}
7684
role="tab"
7785
aria-selected={isActive}
78-
use:tooltip={{ text: tab.path, overflowOnly: true }}
86+
use:tooltip={tabTooltipText(tab)}
7987
onmousedown={(e: MouseEvent) => {
8088
handleTabMouseDown(e, tab.id)
8189
}}

0 commit comments

Comments
 (0)