20267f081a
* - fix command menu keyboard shortcuts - refactor command groups * - refactor the MenuItemCommand to use cmdk * - fixed matching commands multiple displays * - fixed array count problems react with boolean
54 lines
1.0 KiB
TypeScript
54 lines
1.0 KiB
TypeScript
import { useNavigate } from 'react-router-dom';
|
|
|
|
import { IconArrowUpRight } from '@/ui/icon';
|
|
import { IconComponent } from '@/ui/icon/types/IconComponent';
|
|
import { MenuItemCommand } from '@/ui/menu-item/components/MenuItemCommand';
|
|
|
|
import { useCommandMenu } from '../hooks/useCommandMenu';
|
|
|
|
export type CommandMenuItemProps = {
|
|
label: string;
|
|
to?: string;
|
|
key: string;
|
|
onClick?: () => void;
|
|
Icon?: IconComponent;
|
|
shortcuts?: Array<string>;
|
|
};
|
|
|
|
export const CommandMenuItem = ({
|
|
label,
|
|
to,
|
|
onClick,
|
|
Icon,
|
|
shortcuts,
|
|
}: CommandMenuItemProps) => {
|
|
const navigate = useNavigate();
|
|
const { closeCommandMenu } = useCommandMenu();
|
|
|
|
if (to && !Icon) {
|
|
Icon = IconArrowUpRight;
|
|
}
|
|
|
|
const onItemClick = () => {
|
|
closeCommandMenu();
|
|
|
|
if (onClick) {
|
|
onClick();
|
|
return;
|
|
}
|
|
if (to) {
|
|
navigate(to);
|
|
return;
|
|
}
|
|
};
|
|
|
|
return (
|
|
<MenuItemCommand
|
|
LeftIcon={Icon}
|
|
text={label}
|
|
command={shortcuts ? shortcuts.join(' then ') : ''}
|
|
onClick={onItemClick}
|
|
/>
|
|
);
|
|
};
|