fix: keep Windows header menu aligned
Moved the Windows app menu into the fixed titlebar controls Kept sidebar controls stable when opening and closing the sidebar Documented longer validation timeouts for workspace checks
This commit is contained in:
@@ -1417,16 +1417,6 @@ export const Header: React.FC<HeaderProps> = ({
|
||||
toggleSidebar();
|
||||
}, [blurActiveElement, isMobile, isSessionSwitcherOpen, setSessionSwitcherOpen, toggleSidebar]);
|
||||
|
||||
const handleOpenWindowsAppMenu = React.useCallback((event: React.MouseEvent<HTMLButtonElement>) => {
|
||||
const rect = event.currentTarget.getBoundingClientRect();
|
||||
void invokeDesktop('desktop_show_app_menu', {
|
||||
x: rect.left,
|
||||
y: rect.bottom,
|
||||
}).catch((error) => {
|
||||
console.warn('[header] failed to open app menu', error);
|
||||
});
|
||||
}, []);
|
||||
|
||||
const handleOpenDraftMiniChat = React.useCallback(() => {
|
||||
void invokeDesktop('desktop_open_draft_mini_chat_window', {
|
||||
directory: normalize(openDirectory || activeProject?.path || ''),
|
||||
@@ -2154,15 +2144,6 @@ export const Header: React.FC<HeaderProps> = ({
|
||||
className="app-region-no-drag shrink-0 self-stretch transition-[width] duration-200 ease-[cubic-bezier(0.22,1,0.36,1)] motion-reduce:transition-none"
|
||||
style={{ width: headerControlsSpacerWidth }}
|
||||
/>
|
||||
{isWindowsElectronDesktop ? (
|
||||
<HeaderIconActionButton
|
||||
title={t('header.actions.openAppMenu')}
|
||||
ariaLabel={t('header.actions.openAppMenuAria')}
|
||||
onClick={handleOpenWindowsAppMenu}
|
||||
className={`${desktopHeaderIconButtonClass} shrink-0`}
|
||||
Icon={'menu-2'}
|
||||
/>
|
||||
) : null}
|
||||
{/* Sidebar toggle + project actions live in the persistent
|
||||
TitlebarLeftControls overlay; the header reserves matching left space
|
||||
via padding (see headerStyle) when the sidebar is collapsed. */}
|
||||
|
||||
@@ -7,6 +7,7 @@ import { useI18n } from '@/lib/i18n';
|
||||
import { useProjectActionsContext } from '@/hooks/useProjectActionsContext';
|
||||
import { ProjectActionsButton } from '@/components/layout/ProjectActionsButton';
|
||||
import { formatShortcutForDisplay, getEffectiveShortcutCombo } from '@/lib/shortcuts';
|
||||
import { invokeDesktop } from '@/lib/desktop';
|
||||
|
||||
const ICON_BUTTON_CLASS =
|
||||
'app-region-no-drag inline-flex h-8 w-8 items-center justify-center gap-2 rounded-md typography-ui-label font-medium text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary hover:bg-interactive-hover transition-colors';
|
||||
@@ -31,6 +32,22 @@ export const TitlebarLeftControls: React.FC = () => {
|
||||
const clusterRef = React.useRef<HTMLDivElement | null>(null);
|
||||
|
||||
const toggleShortcut = formatShortcutForDisplay(getEffectiveShortcutCombo('toggle_sidebar', shortcutOverrides));
|
||||
const isWindowsElectronDesktop = React.useMemo(() => {
|
||||
if (typeof window === 'undefined') {
|
||||
return false;
|
||||
}
|
||||
return Boolean(window.__OPENCHAMBER_ELECTRON__) && window.__OPENCHAMBER_PLATFORM__ === 'win32';
|
||||
}, []);
|
||||
|
||||
const handleOpenWindowsAppMenu = React.useCallback((event: React.MouseEvent<HTMLButtonElement>) => {
|
||||
const rect = event.currentTarget.getBoundingClientRect();
|
||||
void invokeDesktop('desktop_show_app_menu', {
|
||||
x: rect.left,
|
||||
y: rect.bottom,
|
||||
}).catch((error) => {
|
||||
console.warn('[titlebar] failed to open app menu', error);
|
||||
});
|
||||
}, []);
|
||||
|
||||
React.useEffect(() => {
|
||||
if (typeof document === 'undefined') {
|
||||
@@ -71,6 +88,24 @@ export const TitlebarLeftControls: React.FC = () => {
|
||||
}}
|
||||
>
|
||||
<div ref={clusterRef} className="flex items-center gap-2">
|
||||
{isWindowsElectronDesktop ? (
|
||||
<Tooltip>
|
||||
<TooltipTrigger asChild>
|
||||
<button
|
||||
type="button"
|
||||
onClick={handleOpenWindowsAppMenu}
|
||||
aria-label={t('header.actions.openAppMenuAria')}
|
||||
className={cn(ICON_BUTTON_CLASS, 'shrink-0')}
|
||||
>
|
||||
<Icon name="menu-2" className="h-[18px] w-[18px]" />
|
||||
</button>
|
||||
</TooltipTrigger>
|
||||
<TooltipContent>
|
||||
<p>{t('header.actions.openAppMenu')}</p>
|
||||
</TooltipContent>
|
||||
</Tooltip>
|
||||
) : null}
|
||||
|
||||
<Tooltip>
|
||||
<TooltipTrigger asChild>
|
||||
<button
|
||||
|
||||
Reference in New Issue
Block a user