Add search records actions to the command menu (#9892)

Closes https://github.com/twentyhq/core-team-issues/issues/253 and
https://github.com/twentyhq/core-team-issues/issues/256.

- Created `CommandMenuList`, a component used at the root level of the
command menu and inside the search page of the command menu
- Refactored record agnostic actions
- Added shortcuts to the action menu entries (`/` key for the search)
and updated the design of the shortcuts
- Reordered actions at the root level of the command menu


https://github.com/user-attachments/assets/e1339cc4-ef5d-45c5-a159-6817a54b92e9
This commit is contained in:
Raphaël Bosi
2025-01-29 18:23:40 +01:00
committed by GitHub
parent 03f3ccd060
commit ce296fae4f
52 changed files with 1539 additions and 1361 deletions

View File

@ -66,8 +66,7 @@ const StyledMenuItemCommandContainer = styled.div<{ isSelected?: boolean }>`
export type MenuItemCommandProps = {
LeftIcon?: IconComponent;
text: string;
firstHotKey?: string;
secondHotKey?: string;
hotKeys?: string[];
className?: string;
isSelected?: boolean;
onClick?: () => void;
@ -77,8 +76,7 @@ export type MenuItemCommandProps = {
export const MenuItemCommand = ({
LeftIcon,
text,
firstHotKey,
secondHotKey,
hotKeys,
className,
isSelected,
onClick,
@ -102,12 +100,7 @@ export const MenuItemCommand = ({
<StyledMenuItemLabelText>{text}</StyledMenuItemLabelText>
{RightComponent}
</StyledMenuItemLeftContent>
{!isMobile && (
<MenuItemCommandHotKeys
firstHotKey={firstHotKey}
secondHotKey={secondHotKey}
/>
)}
{!isMobile && <MenuItemCommandHotKeys hotKeys={hotKeys} />}
</StyledMenuItemCommandContainer>
);
};