Move filter and sort compoenets in a separate lib (#612)

* Move filter and sort compoenets in a separate lib

* Add SortAndFilterBar to the filter lib

* Abstract hotkeys scopes

* Fix hotkeys on filters

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
Emilien Chauvet
2023-07-11 20:42:15 -07:00
committed by GitHub
parent e8d77833a7
commit b5de2abd48
17 changed files with 213 additions and 174 deletions

View File

@ -1,14 +1,15 @@
import { ReactNode, useCallback, useState } from 'react';
import styled from '@emotion/styled';
import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope';
import { FilterDropdownButton } from '@/lib/filters-and-sorts/components/FilterDropdownButton';
import SortAndFilterBar from '@/lib/filters-and-sorts/components/SortAndFilterBar';
import { SortDropdownButton } from '@/lib/filters-and-sorts/components/SortDropdownButton';
import {
SelectedSortType,
SortType,
} from '@/lib/filters-and-sorts/interfaces/sorts/interface';
import { FilterDropdownButton } from './FilterDropdownButton';
import SortAndFilterBar from './SortAndFilterBar';
import { SortDropdownButton } from './SortDropdownButton';
import { TableContext } from '@/ui/tables/states/TableContext';
type OwnProps<SortField> = {
viewName: string;
@ -89,15 +90,20 @@ export function TableHeader<SortField>({
{viewName}
</StyledViewSection>
<StyledFilters>
<FilterDropdownButton />
<FilterDropdownButton
context={TableContext}
hotkeysScope={InternalHotkeysScope.TableHeaderDropdownButton}
/>
<SortDropdownButton<SortField>
isSortSelected={sorts.length > 0}
availableSorts={availableSorts || []}
onSortSelect={sortSelect}
hotkeysScope={InternalHotkeysScope.TableHeaderDropdownButton}
/>
</StyledFilters>
</StyledTableHeader>
<SortAndFilterBar
context={TableContext}
sorts={sorts}
onRemoveSort={sortUnselect}
onCancelClick={() => {