refactor(ui): always show icon-only app switcher, drop auto-compact

The toolbar app switcher used a ResizeObserver-based overflow detection
(useAutoCompact) to collapse app labels when space ran out. With the
number of managed apps growing, the labels are collapsed in practice
anyway, so remove the mechanism and render icons only. Buttons now carry
title/aria-label so app names remain discoverable via tooltip and
accessible to screen readers.
This commit is contained in:
Jason
2026-07-30 08:52:48 +08:00
parent 56fb46c093
commit f5f4281d06
3 changed files with 3 additions and 73 deletions
+2 -12
View File
@@ -15,7 +15,6 @@ interface AppSwitcherProps {
activeApp: AppId;
onSwitch: (app: AppId) => void;
visibleApps?: VisibleApps;
compact?: boolean;
}
const ALL_APPS: AppId[] = [
@@ -34,7 +33,6 @@ export function AppSwitcher({
activeApp,
onSwitch,
visibleApps,
compact,
}: AppSwitcherProps) {
const handleSwitch = (app: AppId) => {
if (app === activeApp) return;
@@ -80,6 +78,8 @@ export function AppSwitcher({
key={app}
type="button"
onClick={() => handleSwitch(app)}
title={appDisplayName[app]}
aria-label={appDisplayName[app]}
className={cn(
"group inline-flex items-center px-3 h-8 rounded-md text-sm font-medium transition-all duration-200",
isActive
@@ -115,16 +115,6 @@ export function AppSwitcher({
</span>
)}
</span>
<span
className={cn(
"transition-all duration-200 whitespace-nowrap overflow-hidden",
compact
? "max-w-0 opacity-0 ml-0"
: "max-w-[120px] opacity-100 ml-2",
)}
>
{appDisplayName[app]}
</span>
</button>
);
})}