refactor(ui): trim header trigger labels and fix dropdown anchoring
OpenInAppButton and ProjectActionsButton now render icon-only triggers in the header instead of icon + text. Padding is tightened accordingly and the now-unused selectedButtonLabel / formatActionButtonLabel helpers are gone. With narrower triggers the previous center-aligned dropdown with translate -30px started overflowing the viewport on the left edge for ProjectActions. Switched ProjectActions dropdown to align="start" and OpenInApp dropdown to align="end" (matching their positions in the header) and removed the manual translate offset. Also fixed a long-standing inconsistency where clicking an already-running action in the ProjectActions dropdown re-ran it instead of stopping; the non-compact branch was missing toggleStopIfRunning=true that the compact branch already passed. MiniChat header now uses bg-sidebar to match the main desktop header palette.
This commit is contained in:
@@ -142,8 +142,9 @@ export const OpenInAppButton = ({ directory, className }: OpenInAppButtonProps)
|
||||
type="button"
|
||||
onClick={() => void handleOpen(selectedApp)}
|
||||
className={cn(
|
||||
'inline-flex h-full items-center gap-2 px-3 typography-ui-label font-medium',
|
||||
'text-foreground hover:bg-interactive-hover transition-colors'
|
||||
'inline-flex h-full items-center px-2.5 typography-ui-label font-medium',
|
||||
'text-foreground hover:bg-interactive-hover transition-colors',
|
||||
isScanning && 'animate-pulse'
|
||||
)}
|
||||
aria-label={t('openInApp.actions.openInAria', { app: selectedApp.label })}
|
||||
>
|
||||
@@ -152,9 +153,6 @@ export const OpenInAppButton = ({ directory, className }: OpenInAppButtonProps)
|
||||
iconDataUrl={selectedApp.iconDataUrl}
|
||||
fallbackIconDataUrl={selectedApp.fallbackIconDataUrl}
|
||||
/>
|
||||
<span className={cn('header-open-label', isScanning ? 'animate-pulse text-muted-foreground' : undefined)}>
|
||||
{t('openInApp.actions.open')}
|
||||
</span>
|
||||
</button>
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
@@ -171,9 +169,8 @@ export const OpenInAppButton = ({ directory, className }: OpenInAppButtonProps)
|
||||
</button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent
|
||||
align="center"
|
||||
align="end"
|
||||
className="w-56 max-h-[70vh] overflow-y-auto"
|
||||
style={{ translate: '-30px 0' }}
|
||||
>
|
||||
<DropdownMenuItem className="flex items-center gap-2" onClick={() => void handleCopyPath()}>
|
||||
<Icon name="file-copy" className="h-4 w-4" />
|
||||
|
||||
Reference in New Issue
Block a user