refactor: rename ui/filter-n-sort to ui/view-bar (#1475)

Closes #1473

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>

front/src/modules/ui/board/components/BoardHeader.tsx

@@ -8,13 +8,13 @@ import {
 import styled from '@emotion/styled';
 
 import { DropdownRecoilScopeContext } from '@/ui/dropdown/states/recoil-scope-contexts/DropdownRecoilScopeContext';
-import { FilterDropdownButton } from '@/ui/filter-n-sort/components/FilterDropdownButton';
-import SortAndFilterBar from '@/ui/filter-n-sort/components/SortAndFilterBar';
-import { SortDropdownButton } from '@/ui/filter-n-sort/components/SortDropdownButton';
-import { FiltersHotkeyScope } from '@/ui/filter-n-sort/types/FiltersHotkeyScope';
-import { SelectedSortType, SortType } from '@/ui/filter-n-sort/types/interface';
 import { TopBar } from '@/ui/top-bar/TopBar';
 import { RecoilScope } from '@/ui/utilities/recoil-scope/components/RecoilScope';
+import { FilterDropdownButton } from '@/ui/view-bar/components/FilterDropdownButton';
+import { SortDropdownButton } from '@/ui/view-bar/components/SortDropdownButton';
+import ViewBarDetails from '@/ui/view-bar/components/ViewBarDetails';
+import { FiltersHotkeyScope } from '@/ui/view-bar/types/FiltersHotkeyScope';
+import { SelectedSortType, SortType } from '@/ui/view-bar/types/interface';
 
 import type { BoardColumnDefinition } from '../types/BoardColumnDefinition';
 import { BoardOptionsHotkeyScope } from '../types/BoardOptionsHotkeyScope';
@@ -102,7 +102,7 @@ export function BoardHeader<SortField>({
           </>
         }
         bottomComponent={
-          <SortAndFilterBar
+          <ViewBarDetails
             context={context}
             sorts={sorts}
             onRemoveSort={sortUnselect}

front/src/modules/ui/board/components/EntityBoard.tsx

@@ -11,13 +11,13 @@ import { PageHotkeyScope } from '@/types/PageHotkeyScope';
 import { BoardHeader } from '@/ui/board/components/BoardHeader';
 import { StyledBoard } from '@/ui/board/components/StyledBoard';
 import { BoardColumnIdContext } from '@/ui/board/contexts/BoardColumnIdContext';
-import { SelectedSortType } from '@/ui/filter-n-sort/types/interface';
 import { IconList } from '@/ui/icon';
 import { DragSelect } from '@/ui/utilities/drag-select/components/DragSelect';
 import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
 import { useListenClickOutsideByClassName } from '@/ui/utilities/pointer-event/hooks/useListenClickOutside';
 import { RecoilScope } from '@/ui/utilities/recoil-scope/components/RecoilScope';
 import { ScrollWrapper } from '@/ui/utilities/scroll/components/ScrollWrapper';
+import { SelectedSortType } from '@/ui/view-bar/types/interface';
 import {
   PipelineProgress,
   PipelineProgressOrderByWithRelationInput,

front/src/modules/ui/board/types/BoardOptions.ts

@@ -1,5 +1,5 @@
-import { FilterDefinitionByEntity } from '@/ui/filter-n-sort/types/FilterDefinitionByEntity';
-import { SortType } from '@/ui/filter-n-sort/types/interface';
+import { FilterDefinitionByEntity } from '@/ui/view-bar/types/FilterDefinitionByEntity';
+import { SortType } from '@/ui/view-bar/types/interface';
 import { PipelineProgress } from '~/generated/graphql';
 import { PipelineProgressOrderByWithRelationInput as PipelineProgresses_Order_By } from '~/generated/graphql';
 

front/src/modules/ui/table/components/EntityTable.tsx

@@ -1,7 +1,6 @@
 import { useRef } from 'react';
 import styled from '@emotion/styled';
 
-import { SortType } from '@/ui/filter-n-sort/types/interface';
 import { DragSelect } from '@/ui/utilities/drag-select/components/DragSelect';
 import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
 import {
@@ -9,6 +8,7 @@ import {
   useListenClickOutsideByClassName,
 } from '@/ui/utilities/pointer-event/hooks/useListenClickOutside';
 import { ScrollWrapper } from '@/ui/utilities/scroll/components/ScrollWrapper';
+import { SortType } from '@/ui/view-bar/types/interface';
 
 import { EntityUpdateMutationContext } from '../contexts/EntityUpdateMutationHookContext';
 import { useLeaveTableFocus } from '../hooks/useLeaveTableFocus';

front/src/modules/ui/table/components/GenericEntityTableData.tsx

@@ -2,8 +2,8 @@ import { useEffect } from 'react';
 
 import { useOptimisticEffect } from '@/apollo/optimistic-effect/hooks/useOptimisticEffect';
 import { OptimisticEffect } from '@/apollo/optimistic-effect/types/OptimisticEffect';
-import { FilterDefinition } from '@/ui/filter-n-sort/types/FilterDefinition';
 import { useSetEntityTableData } from '@/ui/table/hooks/useSetEntityTableData';
+import { FilterDefinition } from '@/ui/view-bar/types/FilterDefinition';
 import { SortOrder } from '~/generated/graphql';
 
 export function GenericEntityTableData({

front/src/modules/ui/table/hooks/useSetEntityTableData.ts

@@ -1,12 +1,12 @@
 import { useRecoilCallback } from 'recoil';
 
-import { availableFiltersScopedState } from '@/ui/filter-n-sort/states/availableFiltersScopedState';
-import { FilterDefinition } from '@/ui/filter-n-sort/types/FilterDefinition';
 import { useResetTableRowSelection } from '@/ui/table/hooks/useResetTableRowSelection';
 import { TableRecoilScopeContext } from '@/ui/table/states/recoil-scope-contexts/TableRecoilScopeContext';
 import { tableEntitiesFamilyState } from '@/ui/table/states/tableEntitiesFamilyState';
 import { tableRowIdsState } from '@/ui/table/states/tableRowIdsState';
 import { useContextScopeId } from '@/ui/utilities/recoil-scope/hooks/useContextScopeId';
+import { availableFiltersScopedState } from '@/ui/view-bar/states/availableFiltersScopedState';
+import { FilterDefinition } from '@/ui/view-bar/types/FilterDefinition';
 
 import { isFetchingEntityTableDataState } from '../states/isFetchingEntityTableDataState';
 import { numberOfTableRowsState } from '../states/numberOfTableRowsState';

front/src/modules/ui/table/options/components/TableOptionsDropdownContent.tsx

@@ -9,16 +9,16 @@ import { StyledDropdownMenu } from '@/ui/dropdown/components/StyledDropdownMenu'
 import { StyledDropdownMenuItemsContainer } from '@/ui/dropdown/components/StyledDropdownMenuItemsContainer';
 import { StyledDropdownMenuSeparator } from '@/ui/dropdown/components/StyledDropdownMenuSeparator';
 import { useDropdownButton } from '@/ui/dropdown/hooks/useDropdownButton';
-import { filtersScopedState } from '@/ui/filter-n-sort/states/filtersScopedState';
-import { savedFiltersScopedState } from '@/ui/filter-n-sort/states/savedFiltersScopedState';
-import { savedSortsScopedState } from '@/ui/filter-n-sort/states/savedSortsScopedState';
-import { sortsScopedState } from '@/ui/filter-n-sort/states/sortsScopedState';
 import { IconChevronLeft, IconFileImport, IconTag } from '@/ui/icon';
 import { MenuItem } from '@/ui/menu-item/components/MenuItem';
 import { tableColumnsScopedState } from '@/ui/table/states/tableColumnsScopedState';
 import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
 import { useContextScopeId } from '@/ui/utilities/recoil-scope/hooks/useContextScopeId';
 import { useRecoilScopedValue } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedValue';
+import { filtersScopedState } from '@/ui/view-bar/states/filtersScopedState';
+import { savedFiltersScopedState } from '@/ui/view-bar/states/savedFiltersScopedState';
+import { savedSortsScopedState } from '@/ui/view-bar/states/savedSortsScopedState';
+import { sortsScopedState } from '@/ui/view-bar/states/sortsScopedState';
 
 import { TableRecoilScopeContext } from '../../states/recoil-scope-contexts/TableRecoilScopeContext';
 import { savedTableColumnsScopedState } from '../../states/savedTableColumnsScopedState';

front/src/modules/ui/table/options/components/TableUpdateViewButtonGroup.tsx

@@ -7,18 +7,18 @@ import { Button } from '@/ui/button/components/Button';
 import { ButtonGroup } from '@/ui/button/components/ButtonGroup';
 import { StyledDropdownMenuItemsContainer } from '@/ui/dropdown/components/StyledDropdownMenuItemsContainer';
 import { useDropdownButton } from '@/ui/dropdown/hooks/useDropdownButton';
-import { DropdownMenuContainer } from '@/ui/filter-n-sort/components/DropdownMenuContainer';
-import { filtersScopedState } from '@/ui/filter-n-sort/states/filtersScopedState';
-import { savedFiltersScopedState } from '@/ui/filter-n-sort/states/savedFiltersScopedState';
-import { savedSortsScopedState } from '@/ui/filter-n-sort/states/savedSortsScopedState';
-import { canPersistFiltersScopedSelector } from '@/ui/filter-n-sort/states/selectors/canPersistFiltersScopedSelector';
-import { canPersistSortsScopedSelector } from '@/ui/filter-n-sort/states/selectors/canPersistSortsScopedSelector';
-import { sortsScopedState } from '@/ui/filter-n-sort/states/sortsScopedState';
 import { IconChevronDown, IconPlus } from '@/ui/icon';
 import { MenuItem } from '@/ui/menu-item/components/MenuItem';
 import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
 import { useContextScopeId } from '@/ui/utilities/recoil-scope/hooks/useContextScopeId';
 import { useRecoilScopedValue } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedValue';
+import { DropdownMenuContainer } from '@/ui/view-bar/components/DropdownMenuContainer';
+import { filtersScopedState } from '@/ui/view-bar/states/filtersScopedState';
+import { savedFiltersScopedState } from '@/ui/view-bar/states/savedFiltersScopedState';
+import { savedSortsScopedState } from '@/ui/view-bar/states/savedSortsScopedState';
+import { canPersistFiltersScopedSelector } from '@/ui/view-bar/states/selectors/canPersistFiltersScopedSelector';
+import { canPersistSortsScopedSelector } from '@/ui/view-bar/states/selectors/canPersistSortsScopedSelector';
+import { sortsScopedState } from '@/ui/view-bar/states/sortsScopedState';
 
 import { TableRecoilScopeContext } from '../../states/recoil-scope-contexts/TableRecoilScopeContext';
 import { savedTableColumnsScopedState } from '../../states/savedTableColumnsScopedState';

front/src/modules/ui/table/options/components/TableViewsDropdownButton.tsx

@@ -6,11 +6,6 @@ import { useRecoilCallback, useSetRecoilState } from 'recoil';
 import { StyledDropdownMenuItemsContainer } from '@/ui/dropdown/components/StyledDropdownMenuItemsContainer';
 import { StyledDropdownMenuSeparator } from '@/ui/dropdown/components/StyledDropdownMenuSeparator';
 import { useDropdownButton } from '@/ui/dropdown/hooks/useDropdownButton';
-import DropdownButton from '@/ui/filter-n-sort/components/DropdownButton';
-import { filtersScopedState } from '@/ui/filter-n-sort/states/filtersScopedState';
-import { savedFiltersScopedState } from '@/ui/filter-n-sort/states/savedFiltersScopedState';
-import { savedSortsScopedState } from '@/ui/filter-n-sort/states/savedSortsScopedState';
-import { sortsScopedState } from '@/ui/filter-n-sort/states/sortsScopedState';
 import {
   IconChevronDown,
   IconList,
@@ -31,6 +26,11 @@ import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousH
 import { useContextScopeId } from '@/ui/utilities/recoil-scope/hooks/useContextScopeId';
 import { useRecoilScopedState } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedState';
 import { useRecoilScopedValue } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedValue';
+import DropdownButton from '@/ui/view-bar/components/DropdownButton';
+import { filtersScopedState } from '@/ui/view-bar/states/filtersScopedState';
+import { savedFiltersScopedState } from '@/ui/view-bar/states/savedFiltersScopedState';
+import { savedSortsScopedState } from '@/ui/view-bar/states/savedSortsScopedState';
+import { sortsScopedState } from '@/ui/view-bar/states/sortsScopedState';
 import { assertNotNull } from '~/utils/assert';
 
 import { TableRecoilScopeContext } from '../../states/recoil-scope-contexts/TableRecoilScopeContext';

front/src/modules/ui/table/table-header/components/TableHeader.tsx

@@ -2,19 +2,19 @@ import { useCallback } from 'react';
 import { useRecoilValue } from 'recoil';
 
 import { DropdownRecoilScopeContext } from '@/ui/dropdown/states/recoil-scope-contexts/DropdownRecoilScopeContext';
-import { FilterDropdownButton } from '@/ui/filter-n-sort/components/FilterDropdownButton';
-import SortAndFilterBar from '@/ui/filter-n-sort/components/SortAndFilterBar';
-import { SortDropdownButton } from '@/ui/filter-n-sort/components/SortDropdownButton';
-import { canPersistFiltersScopedSelector } from '@/ui/filter-n-sort/states/selectors/canPersistFiltersScopedSelector';
-import { canPersistSortsScopedSelector } from '@/ui/filter-n-sort/states/selectors/canPersistSortsScopedSelector';
-import { sortsScopedState } from '@/ui/filter-n-sort/states/sortsScopedState';
-import { FiltersHotkeyScope } from '@/ui/filter-n-sort/types/FiltersHotkeyScope';
-import { SelectedSortType, SortType } from '@/ui/filter-n-sort/types/interface';
 import { TopBar } from '@/ui/top-bar/TopBar';
 import { RecoilScope } from '@/ui/utilities/recoil-scope/components/RecoilScope';
 import { useContextScopeId } from '@/ui/utilities/recoil-scope/hooks/useContextScopeId';
 import { useRecoilScopedState } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedState';
 import { useRecoilScopedValue } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedValue';
+import { FilterDropdownButton } from '@/ui/view-bar/components/FilterDropdownButton';
+import { SortDropdownButton } from '@/ui/view-bar/components/SortDropdownButton';
+import ViewBarDetails from '@/ui/view-bar/components/ViewBarDetails';
+import { canPersistFiltersScopedSelector } from '@/ui/view-bar/states/selectors/canPersistFiltersScopedSelector';
+import { canPersistSortsScopedSelector } from '@/ui/view-bar/states/selectors/canPersistSortsScopedSelector';
+import { sortsScopedState } from '@/ui/view-bar/states/sortsScopedState';
+import { FiltersHotkeyScope } from '@/ui/view-bar/types/FiltersHotkeyScope';
+import { SelectedSortType, SortType } from '@/ui/view-bar/types/interface';
 
 import { TableOptionsDropdown } from '../../options/components/TableOptionsDropdown';
 import { TableUpdateViewButtonGroup } from '../../options/components/TableUpdateViewButtonGroup';
@@ -114,7 +114,7 @@ export function TableHeader<SortField>({
           </>
         }
         bottomComponent={
-          <SortAndFilterBar
+          <ViewBarDetails
             canPersistView={
               canPersistTableColumns || canPersistFilters || canPersistSorts
             }

front/src/modules/ui/view-bar/components/FilterDropdownDateSearchInput.tsx

@@ -1,11 +1,11 @@
 import { Context } from 'react';
 import styled from '@emotion/styled';
 
-import { useUpsertFilter } from '@/ui/filter-n-sort/hooks/useUpsertFilter';
-import { filterDefinitionUsedInDropdownScopedState } from '@/ui/filter-n-sort/states/filterDefinitionUsedInDropdownScopedState';
-import { selectedOperandInDropdownScopedState } from '@/ui/filter-n-sort/states/selectedOperandInDropdownScopedState';
 import DatePicker from '@/ui/input/date/components/DatePicker';
 import { useRecoilScopedState } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedState';
+import { useUpsertFilter } from '@/ui/view-bar/hooks/useUpsertFilter';
+import { filterDefinitionUsedInDropdownScopedState } from '@/ui/view-bar/states/filterDefinitionUsedInDropdownScopedState';
+import { selectedOperandInDropdownScopedState } from '@/ui/view-bar/states/selectedOperandInDropdownScopedState';
 
 export function FilterDropdownDateSearchInput({
   context,

front/src/modules/ui/view-bar/components/FilterDropdownEntitySearchInput.tsx

@@ -1,10 +1,10 @@
 import { ChangeEvent, Context } from 'react';
 
 import { DropdownMenuInput } from '@/ui/dropdown/components/DropdownMenuInput';
-import { filterDefinitionUsedInDropdownScopedState } from '@/ui/filter-n-sort/states/filterDefinitionUsedInDropdownScopedState';
-import { filterDropdownSearchInputScopedState } from '@/ui/filter-n-sort/states/filterDropdownSearchInputScopedState';
-import { selectedOperandInDropdownScopedState } from '@/ui/filter-n-sort/states/selectedOperandInDropdownScopedState';
 import { useRecoilScopedState } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedState';
+import { filterDefinitionUsedInDropdownScopedState } from '@/ui/view-bar/states/filterDefinitionUsedInDropdownScopedState';
+import { filterDropdownSearchInputScopedState } from '@/ui/view-bar/states/filterDropdownSearchInputScopedState';
+import { selectedOperandInDropdownScopedState } from '@/ui/view-bar/states/selectedOperandInDropdownScopedState';
 
 export function FilterDropdownEntitySearchInput({
   context,

front/src/modules/ui/view-bar/components/FilterDropdownEntitySearchSelect.tsx

@@ -1,15 +1,15 @@
 import { useEffect } from 'react';
 
-import { useFilterCurrentlyEdited } from '@/ui/filter-n-sort/hooks/useFilterCurrentlyEdited';
-import { useRemoveFilter } from '@/ui/filter-n-sort/hooks/useRemoveFilter';
-import { useUpsertFilter } from '@/ui/filter-n-sort/hooks/useUpsertFilter';
-import { filterDefinitionUsedInDropdownScopedState } from '@/ui/filter-n-sort/states/filterDefinitionUsedInDropdownScopedState';
-import { filterDropdownSelectedEntityIdScopedState } from '@/ui/filter-n-sort/states/filterDropdownSelectedEntityIdScopedState';
-import { selectedOperandInDropdownScopedState } from '@/ui/filter-n-sort/states/selectedOperandInDropdownScopedState';
 import { EntitiesForMultipleEntitySelect } from '@/ui/input/relation-picker/components/MultipleEntitySelect';
 import { SingleEntitySelectBase } from '@/ui/input/relation-picker/components/SingleEntitySelectBase';
 import { EntityForSelect } from '@/ui/input/relation-picker/types/EntityForSelect';
 import { useRecoilScopedState } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedState';
+import { useFilterCurrentlyEdited } from '@/ui/view-bar/hooks/useFilterCurrentlyEdited';
+import { useRemoveFilter } from '@/ui/view-bar/hooks/useRemoveFilter';
+import { useUpsertFilter } from '@/ui/view-bar/hooks/useUpsertFilter';
+import { filterDefinitionUsedInDropdownScopedState } from '@/ui/view-bar/states/filterDefinitionUsedInDropdownScopedState';
+import { filterDropdownSelectedEntityIdScopedState } from '@/ui/view-bar/states/filterDropdownSelectedEntityIdScopedState';
+import { selectedOperandInDropdownScopedState } from '@/ui/view-bar/states/selectedOperandInDropdownScopedState';
 
 export function FilterDropdownEntitySearchSelect({
   entitiesForSelect,

front/src/modules/ui/view-bar/components/MultipleFiltersDropdownButton.tsx

@@ -1,13 +1,13 @@
 import { Context, useCallback, useState } from 'react';
 
 import { StyledDropdownMenuSeparator } from '@/ui/dropdown/components/StyledDropdownMenuSeparator';
-import { filterDefinitionUsedInDropdownScopedState } from '@/ui/filter-n-sort/states/filterDefinitionUsedInDropdownScopedState';
-import { filterDropdownSearchInputScopedState } from '@/ui/filter-n-sort/states/filterDropdownSearchInputScopedState';
-import { filtersScopedState } from '@/ui/filter-n-sort/states/filtersScopedState';
-import { isFilterDropdownOperandSelectUnfoldedScopedState } from '@/ui/filter-n-sort/states/isFilterDropdownOperandSelectUnfoldedScopedState';
-import { selectedOperandInDropdownScopedState } from '@/ui/filter-n-sort/states/selectedOperandInDropdownScopedState';
 import { useSetHotkeyScope } from '@/ui/utilities/hotkey/hooks/useSetHotkeyScope';
 import { useRecoilScopedState } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedState';
+import { filterDefinitionUsedInDropdownScopedState } from '@/ui/view-bar/states/filterDefinitionUsedInDropdownScopedState';
+import { filterDropdownSearchInputScopedState } from '@/ui/view-bar/states/filterDropdownSearchInputScopedState';
+import { filtersScopedState } from '@/ui/view-bar/states/filtersScopedState';
+import { isFilterDropdownOperandSelectUnfoldedScopedState } from '@/ui/view-bar/states/isFilterDropdownOperandSelectUnfoldedScopedState';
+import { selectedOperandInDropdownScopedState } from '@/ui/view-bar/states/selectedOperandInDropdownScopedState';
 
 import { isViewBarExpandedScopedState } from '../states/isViewBarExpandedScopedState';
 import { FiltersHotkeyScope } from '../types/FiltersHotkeyScope';

front/src/modules/ui/view-bar/components/SingleEntityFilterDropdownButton.tsx

@@ -3,12 +3,12 @@ import React from 'react';
 import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
 
-import { filterDefinitionUsedInDropdownScopedState } from '@/ui/filter-n-sort/states/filterDefinitionUsedInDropdownScopedState';
-import { filterDropdownSearchInputScopedState } from '@/ui/filter-n-sort/states/filterDropdownSearchInputScopedState';
-import { selectedOperandInDropdownScopedState } from '@/ui/filter-n-sort/states/selectedOperandInDropdownScopedState';
 import { IconChevronDown } from '@/ui/icon';
 import { useSetHotkeyScope } from '@/ui/utilities/hotkey/hooks/useSetHotkeyScope';
 import { useRecoilScopedState } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedState';
+import { filterDefinitionUsedInDropdownScopedState } from '@/ui/view-bar/states/filterDefinitionUsedInDropdownScopedState';
+import { filterDropdownSearchInputScopedState } from '@/ui/view-bar/states/filterDropdownSearchInputScopedState';
+import { selectedOperandInDropdownScopedState } from '@/ui/view-bar/states/selectedOperandInDropdownScopedState';
 
 import { StyledHeaderDropdownButton } from '../../dropdown/components/StyledHeaderDropdownButton';
 import { availableFiltersScopedState } from '../states/availableFiltersScopedState';

front/src/modules/ui/view-bar/components/ViewBarDetails.tsx

@@ -98,7 +98,7 @@ const StyledAddFilterContainer = styled.div`
   z-index: 5;
 `;
 
-function SortAndFilterBar<SortField>({
+function ViewBarDetails<SortField>({
   canPersistView,
   context,
   sorts,
@@ -217,4 +217,4 @@ function SortAndFilterBar<SortField>({
   );
 }
 
-export default SortAndFilterBar;
+export default ViewBarDetails;