twentyhq/twenty
1
1
Fork 0
mirror of https://github.com/twentyhq/twenty.git synced 2024-12-18 17:12:53 +03:00
Code Issues Packages Projects Releases Wiki Activity

refactor: extract render into methods (#81)

Browse Source
This commit is contained in:
Sammy Teillet 2023-04-26 17:38:05 +02:00 committed by GitHub
parent 04051e737f
commit 884080a9da
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 74 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
front/src/components/table/table-header/FilterDropdownButton.tsx
View File

@ -53,17 +53,7 @@ export function FilterDropdownButton({
setSelectedFilterOperand(filterOperands[0]);
}, []);
return (
<DropdownButton
label="Filter"
isActive={filters.length > 0}
isUnfolded={isUnfolded}
setIsUnfolded={setIsUnfolded}
resetState={resetState}
>
{selectedFilter
? isOptionUnfolded
? filterOperands.map((filterOperand, index) => (
const renderSelectOptionItems = filterOperands.map((filterOperand, index) => (
<DropdownButton.StyledDropdownItem
key={`select-filter-operand-${index}`}
onClick={() => {
@ -73,8 +63,24 @@ export function FilterDropdownButton({
>
{filterOperand.label}
</DropdownButton.StyledDropdownItem>
))
: [
));
const renderSelectFilterITems = availableFilters.map((filter, index) => (
<DropdownButton.StyledDropdownItem
key={`select-filter-${index}`}
onClick={() => {
setSelectedFilter(filter);
}}
>
<DropdownButton.StyledIcon>
{filter.icon && <FontAwesomeIcon icon={filter.icon} />}
</DropdownButton.StyledIcon>
{filter.label}
</DropdownButton.StyledDropdownItem>
));
function renderFilterDropdown(selectedFilter: FilterType) {
return [
<DropdownButton.StyledDropdownTopOption
key={'selected-filter'}
onClick={() => setSelectedFilter(undefined)}
@ -115,20 +121,22 @@ export function FilterDropdownButton({
{value}
</DropdownButton.StyledDropdownItem>
)),
]
: availableFilters.map((filter, index) => (
<DropdownButton.StyledDropdownItem
key={`select-filter-${index}`}
onClick={() => {
setSelectedFilter(filter);
}}
];
}
return (
<DropdownButton
label="Filter"
isActive={filters.length > 0}
isUnfolded={isUnfolded}
setIsUnfolded={setIsUnfolded}
resetState={resetState}
>
<DropdownButton.StyledIcon>
{filter.icon && <FontAwesomeIcon icon={filter.icon} />}
</DropdownButton.StyledIcon>
{filter.label}
</DropdownButton.StyledDropdownItem>
))}
{selectedFilter
? isOptionUnfolded
? renderSelectOptionItems
: renderFilterDropdown(selectedFilter)
: renderSelectFilterITems}
</DropdownButton>
);
}