Sammy/t 134 i see all filters in the dropdown (#78)

* feature: add filter dropdown

* test: add story for FilterDropdown

* feature: display filterOperand on top of dropdown

* feature: display filter operand

* feature: fix index and display selected filter

* refactor: set TopOption button inside dropdown file

* feature: move availableFilters outside the fitler component

* refactor: make the available sorts and filter optionnal

* refactor: rename availableSorts

* feature: add a resetState property on onOutsideClick

* feature: add filters and set  filters on Dropdown component

* feature: set filters on click in dropdown

* test: verify button is active after filters are set

* feature: display sorts and filters

* refactor: move SelectedFilters in SortAndFilter

* refactor: move SelectedFilters in dedicated file

* refactor: remove Id and use Key

front/src/components/table/table-header/SortDropdownButton.tsx

@@ -1,19 +1,18 @@
 import { useCallback, useState } from 'react';
 import DropdownButton from './DropdownButton';
-import { SelectedSortType, SortType } from './SortAndFilterBar';
+import { SelectedSortType, SortType } from './interface';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { faAngleDown } from '@fortawesome/pro-regular-svg-icons';
 
 type OwnProps<SortField> = {
   sorts: SelectedSortType<SortField>[];
   setSorts: (sorts: SelectedSortType<SortField>[]) => void;
-  sortsAvailable: SortType<SortField>[];
+  availableSorts: SortType<SortField>[];
 };
 
 const options: Array<SelectedSortType<string>['order']> = ['asc', 'desc'];
 
 export function SortDropdownButton<SortField extends string>({
-  sortsAvailable,
+  availableSorts,
   setSorts,
   sorts,
 }: OwnProps<SortField>) {
@@ -32,12 +31,18 @@ export function SortDropdownButton<SortField extends string>({
     [setSorts, selectedSortDirection],
   );
 
+  const resetState = useCallback(() => {
+    setIsOptionUnfolded(false);
+    setSelectedSortDirection('asc');
+  }, []);
+
   return (
     <DropdownButton
       label="Sort"
       isActive={sorts.length > 0}
       isUnfolded={isUnfolded}
       setIsUnfolded={setIsUnfolded}
+      resetState={resetState}
     >
       {isOptionUnfolded
         ? options.map((option, index) => (
@@ -58,9 +63,9 @@ export function SortDropdownButton<SortField extends string>({
             >
               {selectedSortDirection === 'asc' ? 'Ascending' : 'Descending'}
 
-              <FontAwesomeIcon icon={faAngleDown} />
+              <DropdownButton.StyledDropdownTopOptionAngleDown />
             </DropdownButton.StyledDropdownTopOption>,
-            ...sortsAvailable.map((sort, index) => (
+            ...availableSorts.map((sort, index) => (
               <DropdownButton.StyledDropdownItem
                 key={index + 1}
                 onClick={() => {