perf(renderer): lazy mount closed menu controls
This commit is contained in:
parent
f06a50f859
commit
808e5f73e4
4 changed files with 194 additions and 184 deletions
|
|
@ -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,
|
||||||
}))
|
}))
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -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>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -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>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -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>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue