admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

323 add object name inside the search (#9962)

Browse Source 
Closes https://github.com/twentyhq/core-team-issues/issues/323

Before:
<img width="495" alt="Capture d’écran 2025-01-31 à 18 11 56"
src="https://github.com/user-attachments/assets/dd1d3ac1-6c97-4398-b233-d323eeacdbb9"
/>

After:
<img width="500" alt="Capture d’écran 2025-01-31 à 18 09 58"
src="https://github.com/user-attachments/assets/68d23990-2d0b-437d-ad2e-a686cdb320e1"
/>
This commit is contained in:
Raphaël Bosi
2025-02-01 08:18:48 +01:00
committed by GitHub
parent 58aa86cc0c
commit d9b86475d3
7 changed files with 42 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
packages/twenty-ui/src/navigation/menu-item/components/MenuItemCommand.tsx
View File

@ -63,9 +63,24 @@ const StyledMenuItemCommandContainer = styled.div<{ isSelected?: boolean }>`
}
`;
const StyledDescription = styled.span`
color: ${({ theme }) => theme.font.color.light};
&::before {
content: '·';
margin: ${({ theme }) => theme.spacing(0, 1)};
}
`;
const StyledTextContainer = styled.div`
display: flex;
flex-direction: row;
`;
export type MenuItemCommandProps = {
LeftIcon?: IconComponent;
text: string;
description?: string;
hotKeys?: string[];
className?: string;
isSelected?: boolean;
@ -76,6 +91,7 @@ export type MenuItemCommandProps = {
export const MenuItemCommand = ({
LeftIcon,
text,
description,
hotKeys,
className,
isSelected,
@ -97,7 +113,10 @@ export const MenuItemCommand = ({
<LeftIcon size={theme.icon.size.sm} />
</StyledBigIconContainer>
)}
<StyledMenuItemLabelText>{text}</StyledMenuItemLabelText>
<StyledTextContainer>
<StyledMenuItemLabelText>{text}</StyledMenuItemLabelText>
{description && <StyledDescription>{description}</StyledDescription>}
</StyledTextContainer>
{RightComponent}
</StyledMenuItemLeftContent>
{!isMobile && <MenuItemCommandHotKeys hotKeys={hotKeys} />}

9
packages/twenty-ui/src/navigation/menu-item/components/__stories__/MenuItemCommand.stories.tsx
View File

@ -35,6 +35,15 @@ export const Default: Story = {
decorators: [ComponentDecorator],
};
export const WithDescription: Story = {
args: {
text: 'Menu item',
hotKeys: ['⌘', '1'],
description: 'Description',
},
decorators: [ComponentDecorator],
};
export const Catalog: CatalogStory<Story, typeof MenuItemCommand> = {
args: {
text: 'Menu item',