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

fix: group by sort options should have a checkmark when selected (#9038)

Browse Source 
Fix #8966 

This PR is adding a checkmark beside the selected sort option in the
`Options` dropdown menu.

<img width="225" alt="Screenshot 2024-12-12 at 12 03 18 PM"
src="https://github.com/user-attachments/assets/81783bc0-5aea-4f0d-9327-c70f3e70edb6"
/>
This commit is contained in:
Jérémy M
2024-12-12 12:18:53 +01:00
committed by GitHub
parent d7da73f0ec
commit 5f2a39d9e9
1 changed files with 9 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupSortContent.tsx
View File

@ -4,7 +4,7 @@ import {
IconHandMove,
IconSortAZ,
IconSortZA,
MenuItem,
MenuItemSelect,
} from 'twenty-ui';
import { useOptionsDropdown } from '@/object-record/object-options-dropdown/hooks/useOptionsDropdown';
@ -13,8 +13,8 @@ import { RecordGroupSort } from '@/object-record/record-group/types/RecordGroupS
import { recordIndexRecordGroupSortComponentState } from '@/object-record/record-index/states/recordIndexRecordGroupSortComponentState';
import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader';
import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
import { useRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentStateV2';
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
export const ObjectOptionsDropdownRecordGroupSortContent = () => {
const { currentContentId, onContentChange, closeDropdown } =
@ -24,7 +24,7 @@ export const ObjectOptionsDropdownRecordGroupSortContent = () => {
hiddenRecordGroupIdsComponentSelector,
);
const setRecordGroupSort = useSetRecoilComponentStateV2(
const [recordGroupSort, setRecordGroupSort] = useRecoilComponentStateV2(
recordIndexRecordGroupSortComponentState,
);
@ -51,24 +51,27 @@ export const ObjectOptionsDropdownRecordGroupSortContent = () => {
Sort
</DropdownMenuHeader>
<DropdownMenuItemsContainer>
<MenuItem
<MenuItemSelect
onClick={() => handleRecordGroupSortChange(RecordGroupSort.Manual)}
LeftIcon={IconHandMove}
text={RecordGroupSort.Manual}
selected={recordGroupSort === RecordGroupSort.Manual}
/>
<MenuItem
<MenuItemSelect
onClick={() =>
handleRecordGroupSortChange(RecordGroupSort.Alphabetical)
}
LeftIcon={IconSortAZ}
text={RecordGroupSort.Alphabetical}
selected={recordGroupSort === RecordGroupSort.Alphabetical}
/>
<MenuItem
<MenuItemSelect
onClick={() =>
handleRecordGroupSortChange(RecordGroupSort.ReverseAlphabetical)
}
LeftIcon={IconSortZA}
text={RecordGroupSort.ReverseAlphabetical}
selected={recordGroupSort === RecordGroupSort.ReverseAlphabetical}
/>
</DropdownMenuItemsContainer>
</>