perf(renderer): lazy mount closed menu controls

This commit is contained in:
777genius 2026-05-31 02:59:56 +03:00
parent f06a50f859
commit 808e5f73e4
4 changed files with 194 additions and 184 deletions

View file

@ -68,12 +68,12 @@ export const MoreMenu = ({
openTeamsTab, openTeamsTab,
} = useStore( } = useStore(
useShallow((s) => ({ useShallow((s) => ({
openCommandPalette: () => s.openCommandPalette(), openCommandPalette: s.openCommandPalette,
openExtensionsTab: () => s.openExtensionsTab(), openExtensionsTab: s.openExtensionsTab,
openSessionReport: (tabId: string) => s.openSessionReport(tabId), openSessionReport: s.openSessionReport,
openSchedulesTab: () => s.openSchedulesTab(), openSchedulesTab: s.openSchedulesTab,
openSettingsTab: () => s.openSettingsTab(), openSettingsTab: s.openSettingsTab,
openTeamsTab: () => s.openTeamsTab(), openTeamsTab: s.openTeamsTab,
})) }))
); );

View file

@ -1,4 +1,4 @@
import { useMemo } from 'react'; import { useMemo, useState } from 'react';
import { useAppTranslation } from '@features/localization/renderer'; import { useAppTranslation } from '@features/localization/renderer';
import { Button } from '@renderer/components/ui/button'; import { Button } from '@renderer/components/ui/button';
@ -46,6 +46,7 @@ export const KanbanFilterPopover = ({
onFilterChange, onFilterChange,
}: KanbanFilterPopoverProps): React.JSX.Element => { }: KanbanFilterPopoverProps): React.JSX.Element => {
const { t } = useAppTranslation('team'); const { t } = useAppTranslation('team');
const [open, setOpen] = useState(false);
const activeCount = useMemo(() => { const activeCount = useMemo(() => {
let count = 0; let count = 0;
if (filter.sessionId !== null) count += 1; if (filter.sessionId !== null) count += 1;
@ -83,7 +84,7 @@ export const KanbanFilterPopover = ({
}; };
return ( return (
<Popover> <Popover open={open} onOpenChange={setOpen}>
<Tooltip> <Tooltip>
<TooltipTrigger asChild> <TooltipTrigger asChild>
<PopoverTrigger asChild> <PopoverTrigger asChild>
@ -104,6 +105,7 @@ export const KanbanFilterPopover = ({
</TooltipTrigger> </TooltipTrigger>
<TooltipContent side="bottom">{t('kanban.filter.title')}</TooltipContent> <TooltipContent side="bottom">{t('kanban.filter.title')}</TooltipContent>
</Tooltip> </Tooltip>
{open ? (
<PopoverContent align="end" className="w-72 p-0"> <PopoverContent align="end" className="w-72 p-0">
{/* Session section */} {/* Session section */}
<div className="border-b border-[var(--color-border)] p-3"> <div className="border-b border-[var(--color-border)] p-3">
@ -209,6 +211,7 @@ export const KanbanFilterPopover = ({
</Button> </Button>
</div> </div>
</PopoverContent> </PopoverContent>
) : null}
</Popover> </Popover>
); );
}; };

View file

@ -1,3 +1,5 @@
import { useState } from 'react';
import { useAppTranslation } from '@features/localization/renderer'; import { useAppTranslation } from '@features/localization/renderer';
import { Button } from '@renderer/components/ui/button'; import { Button } from '@renderer/components/ui/button';
import { Popover, PopoverContent, PopoverTrigger } from '@renderer/components/ui/popover'; import { Popover, PopoverContent, PopoverTrigger } from '@renderer/components/ui/popover';
@ -53,10 +55,11 @@ export const KanbanSortPopover = ({
onSortChange, onSortChange,
}: KanbanSortPopoverProps): React.JSX.Element => { }: KanbanSortPopoverProps): React.JSX.Element => {
const { t } = useAppTranslation('team'); const { t } = useAppTranslation('team');
const [open, setOpen] = useState(false);
const isNonDefault = sort.field !== 'updatedAt'; const isNonDefault = sort.field !== 'updatedAt';
return ( return (
<Popover> <Popover open={open} onOpenChange={setOpen}>
<Tooltip> <Tooltip>
<TooltipTrigger asChild> <TooltipTrigger asChild>
<PopoverTrigger asChild> <PopoverTrigger asChild>
@ -77,6 +80,7 @@ export const KanbanSortPopover = ({
</TooltipTrigger> </TooltipTrigger>
<TooltipContent side="bottom">{t('kanban.sort.title')}</TooltipContent> <TooltipContent side="bottom">{t('kanban.sort.title')}</TooltipContent>
</Tooltip> </Tooltip>
{open ? (
<PopoverContent align="end" className="w-56 p-0"> <PopoverContent align="end" className="w-56 p-0">
<div className="p-3"> <div className="p-3">
<p className="mb-2 text-[11px] font-medium uppercase tracking-wider text-[var(--color-text-muted)]"> <p className="mb-2 text-[11px] font-medium uppercase tracking-wider text-[var(--color-text-muted)]">
@ -137,6 +141,7 @@ export const KanbanSortPopover = ({
</div> </div>
)} )}
</PopoverContent> </PopoverContent>
) : null}
</Popover> </Popover>
); );
}; };

View file

@ -206,6 +206,7 @@ const CancelTaskButton = ({
</TooltipTrigger> </TooltipTrigger>
<TooltipContent side="top">{t('kanban.taskCard.cancel')}</TooltipContent> <TooltipContent side="top">{t('kanban.taskCard.cancel')}</TooltipContent>
</Tooltip> </Tooltip>
{open ? (
<PopoverContent <PopoverContent
className="w-56 p-3" className="w-56 p-3"
side="top" side="top"
@ -232,6 +233,7 @@ const CancelTaskButton = ({
</Button> </Button>
</div> </div>
</PopoverContent> </PopoverContent>
) : null}
</Popover> </Popover>
); );
}; };