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

fix: context menu padding (#7918)

Browse Source 
This pull request addresses the issue #7915 regarding the lack of
padding in the right-click record menu. This PR add padding to context
menu and reuse the existing component used for the filter/sort feature.


![image](https://github.com/user-attachments/assets/4534eba5-a7de-4142-9d5f-ff0aee86a526)

![image](https://github.com/user-attachments/assets/1690890e-cb18-4879-9a9b-3153cd6aeb26)

---------

Co-authored-by: Félix Malfait <felix@twenty.com>
This commit is contained in:
Vardhaman Bhandari
2024-10-23 18:43:14 +05:30
committed by GitHub
parent 25a8638e4e
commit a55423642a
1 changed files with 14 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
packages/twenty-front/src/modules/action-menu/components/RecordIndexActionMenuDropdown.tsx
View File

@ -8,6 +8,7 @@ import { ActionMenuComponentInstanceContext } from '@/action-menu/states/context
import { recordIndexActionMenuDropdownPositionComponentState } from '@/action-menu/states/recordIndexActionMenuDropdownPositionComponentState'; import { recordIndexActionMenuDropdownPositionComponentState } from '@/action-menu/states/recordIndexActionMenuDropdownPositionComponentState';
import { ActionMenuDropdownHotkeyScope } from '@/action-menu/types/ActionMenuDropdownHotKeyScope'; import { ActionMenuDropdownHotkeyScope } from '@/action-menu/types/ActionMenuDropdownHotKeyScope';
import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem'; import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem';
import { useAvailableComponentInstanceIdOrThrow } from '@/ui/utilities/state/component-state/hooks/useAvailableComponentInstanceIdOrThrow'; import { useAvailableComponentInstanceIdOrThrow } from '@/ui/utilities/state/component-state/hooks/useAvailableComponentInstanceIdOrThrow';
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2'; import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
@ -73,15 +74,19 @@ export const RecordIndexActionMenuDropdown = () => {
}} }}
data-select-disable data-select-disable
dropdownMenuWidth={width} dropdownMenuWidth={width}
dropdownComponents={actionMenuEntries.map((item, index) => ( dropdownComponents={
<MenuItem <DropdownMenuItemsContainer>
key={index} {actionMenuEntries.map((item, index) => (
LeftIcon={item.Icon} <MenuItem
onClick={item.onClick} key={index}
accent={item.accent} LeftIcon={item.Icon}
text={item.label} onClick={item.onClick}
/> accent={item.accent}
))} text={item.label}
/>
))}
</DropdownMenuItemsContainer>
}
/> />
</StyledContainerActionMenuDropdown> </StyledContainerActionMenuDropdown>
); );