Switched current Sort Button with same used for filters and options ones (#5764)

I changed the Sort button used in the Header using
StyledHeaderDropdownButton component (the same used for Filter and
Options') instead of LightButton.
This PR aims to fix the issue: #5743

---------

Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
This commit is contained in:
RobertoSimonini1 2024-06-07 11:23:33 +02:00 committed by GitHub
parent c76bc4729d
commit e478c68734
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 10 additions and 6 deletions

1
.gitignore vendored
View File

@ -2,6 +2,7 @@
.DS_Store
/.idea
**/**/node_modules/
.cache
# yarn is the recommended package manager across the project
**/**/.package-lock.json

View File

@ -5,10 +5,11 @@ import { IconChevronDown, useIcons } from 'twenty-ui';
import { OBJECT_SORT_DROPDOWN_ID } from '@/object-record/object-sort-dropdown/constants/ObjectSortDropdownId';
import { useObjectSortDropdown } from '@/object-record/object-sort-dropdown/hooks/useObjectSortDropdown';
import { ObjectSortDropdownScope } from '@/object-record/object-sort-dropdown/scopes/ObjectSortDropdownScope';
import { LightButton } from '@/ui/input/button/components/LightButton';
import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader';
import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
import { StyledHeaderDropdownButton } from '@/ui/layout/dropdown/components/StyledHeaderDropdownButton';
import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem';
import { HotkeyScope } from '@/ui/utilities/hotkey/types/HotkeyScope';
@ -54,7 +55,6 @@ export const ObjectSortDropdownButton = ({
setSelectedSortDirection,
toggleSortDropdown,
resetState,
isSortSelected,
availableSortDefinitions,
handleAddSort,
objectSortDropdownSearchInputState,
@ -62,6 +62,8 @@ export const ObjectSortDropdownButton = ({
resetSearchInput,
} = useObjectSortDropdown();
const { isDropdownOpen } = useDropdown(OBJECT_SORT_DROPDOWN_ID);
const handleButtonClick = () => {
toggleSortDropdown();
};
@ -84,11 +86,12 @@ export const ObjectSortDropdownButton = ({
dropdownHotkeyScope={hotkeyScope}
dropdownOffset={{ y: 8 }}
clickableComponent={
<LightButton
title="Sort"
active={isSortSelected}
<StyledHeaderDropdownButton
isUnfolded={isDropdownOpen}
onClick={handleButtonClick}
/>
>
Sort
</StyledHeaderDropdownButton>
}
dropdownComponents={
<>