perf(renderer): defer task context menu translations
This commit is contained in:
parent
68d07f56ad
commit
36f69f5ae4
1 changed files with 86 additions and 52 deletions
|
|
@ -24,8 +24,18 @@ export interface TaskContextMenuProps {
|
||||||
children: React.ReactNode;
|
children: React.ReactNode;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const TaskContextMenu = ({
|
type TaskContextMenuContentProps = Pick<
|
||||||
task: _task,
|
TaskContextMenuProps,
|
||||||
|
| 'isPinned'
|
||||||
|
| 'isArchived'
|
||||||
|
| 'onTogglePin'
|
||||||
|
| 'onToggleArchive'
|
||||||
|
| 'onMarkUnread'
|
||||||
|
| 'onRename'
|
||||||
|
| 'onDelete'
|
||||||
|
>;
|
||||||
|
|
||||||
|
const TaskContextMenuLazyContent = ({
|
||||||
isPinned,
|
isPinned,
|
||||||
isArchived,
|
isArchived,
|
||||||
onTogglePin,
|
onTogglePin,
|
||||||
|
|
@ -33,17 +43,10 @@ export const TaskContextMenu = ({
|
||||||
onMarkUnread,
|
onMarkUnread,
|
||||||
onRename,
|
onRename,
|
||||||
onDelete,
|
onDelete,
|
||||||
children,
|
}: TaskContextMenuContentProps): React.JSX.Element => {
|
||||||
}: TaskContextMenuProps): React.JSX.Element => {
|
|
||||||
const { t } = useAppTranslation('common');
|
const { t } = useAppTranslation('common');
|
||||||
const [open, setOpen] = useState(false);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ContextMenu onOpenChange={setOpen}>
|
|
||||||
<ContextMenuTrigger asChild>
|
|
||||||
<div className="w-full">{children}</div>
|
|
||||||
</ContextMenuTrigger>
|
|
||||||
{open ? (
|
|
||||||
<ContextMenuContent onCloseAutoFocus={(e) => e.preventDefault()}>
|
<ContextMenuContent onCloseAutoFocus={(e) => e.preventDefault()}>
|
||||||
<ContextMenuItem onSelect={onTogglePin}>
|
<ContextMenuItem onSelect={onTogglePin}>
|
||||||
{isPinned ? (
|
{isPinned ? (
|
||||||
|
|
@ -95,6 +98,37 @@ export const TaskContextMenu = ({
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</ContextMenuContent>
|
</ContextMenuContent>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export const TaskContextMenu = ({
|
||||||
|
task: _task,
|
||||||
|
isPinned,
|
||||||
|
isArchived,
|
||||||
|
onTogglePin,
|
||||||
|
onToggleArchive,
|
||||||
|
onMarkUnread,
|
||||||
|
onRename,
|
||||||
|
onDelete,
|
||||||
|
children,
|
||||||
|
}: TaskContextMenuProps): React.JSX.Element => {
|
||||||
|
const [open, setOpen] = useState(false);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<ContextMenu onOpenChange={setOpen}>
|
||||||
|
<ContextMenuTrigger asChild>
|
||||||
|
<div className="w-full">{children}</div>
|
||||||
|
</ContextMenuTrigger>
|
||||||
|
{open ? (
|
||||||
|
<TaskContextMenuLazyContent
|
||||||
|
isPinned={isPinned}
|
||||||
|
isArchived={isArchived}
|
||||||
|
onTogglePin={onTogglePin}
|
||||||
|
onToggleArchive={onToggleArchive}
|
||||||
|
onMarkUnread={onMarkUnread}
|
||||||
|
onRename={onRename}
|
||||||
|
onDelete={onDelete}
|
||||||
|
/>
|
||||||
) : null}
|
) : null}
|
||||||
</ContextMenu>
|
</ContextMenu>
|
||||||
);
|
);
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue