feat: create view from selected filters and sorts + switch to newly created view on view creation (#1301)

* feat: create view from selected filters and sorts

Closes #1292

* refactor: use selector to obtain table filters where query option

* refactor: activate exhaustive deps eslint rule for useRecoilCallback

* feat: switch to newly created view on view creation

Closes #1297

* refactor: code review

- use `useCallback` instead of `useRecoilCallback`
- rename `useTableViews` to `useViews`
- move filter-n-sort selectors to /states/selector subfolder

front/src/modules/people/hooks/useSetPeopleEntityTable.ts

@@ -132,6 +132,6 @@ export function useSetPeopleEntityTable() {
 
         set(isFetchingEntityTableDataState, false);
       },
-    [],
+    [currentLocation, resetTableRowSelection, tableContextScopeId],
   );
 }

front/src/modules/people/table/components/PeopleTable.tsx

@@ -1,20 +1,19 @@
-import { useCallback, useMemo } from 'react';
+import { useCallback } from 'react';
 
 import { peopleViewFields } from '@/people/constants/peopleViewFields';
 import { usePersonTableContextMenuEntries } from '@/people/hooks/usePeopleTableContextMenuEntries';
 import { usePersonTableActionBarEntries } from '@/people/hooks/usePersonTableActionBarEntries';
 import { useSpreadsheetPersonImport } from '@/people/hooks/useSpreadsheetPersonImport';
-import { filtersScopedState } from '@/ui/filter-n-sort/states/filtersScopedState';
-import { sortsOrderByScopedSelector } from '@/ui/filter-n-sort/states/sortsOrderByScopedSelector';
-import { turnFilterIntoWhereClause } from '@/ui/filter-n-sort/utils/turnFilterIntoWhereClause';
+import { filtersWhereScopedSelector } from '@/ui/filter-n-sort/states/selectors/filtersWhereScopedSelector';
+import { sortsOrderByScopedSelector } from '@/ui/filter-n-sort/states/selectors/sortsOrderByScopedSelector';
 import { EntityTable } from '@/ui/table/components/EntityTable';
 import { GenericEntityTableData } from '@/ui/table/components/GenericEntityTableData';
 import { useUpsertEntityTableItem } from '@/ui/table/hooks/useUpsertEntityTableItem';
 import { TableRecoilScopeContext } from '@/ui/table/states/recoil-scope-contexts/TableRecoilScopeContext';
 import { useRecoilScopedValue } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedValue';
 import { useTableViewFields } from '@/views/hooks/useTableViewFields';
-import { useTableViews } from '@/views/hooks/useTableViews';
 import { useViewFilters } from '@/views/hooks/useViewFilters';
+import { useViews } from '@/views/hooks/useViews';
 import { useViewSorts } from '@/views/hooks/useViewSorts';
 import {
   SortOrder,
@@ -30,12 +29,21 @@ export function PeopleTable() {
     sortsOrderByScopedSelector,
     TableRecoilScopeContext,
   );
+  const whereFilters = useRecoilScopedValue(
+    filtersWhereScopedSelector,
+    TableRecoilScopeContext,
+  );
+
   const [updateEntityMutation] = useUpdateOnePersonMutation();
   const upsertEntityTableItem = useUpsertEntityTableItem();
   const { openPersonSpreadsheetImport } = useSpreadsheetPersonImport();
 
   const objectId = 'person';
-  const { handleViewsChange } = useTableViews({ objectId });
+  const { handleViewsChange } = useViews({
+    availableFilters: peopleFilters,
+    availableSorts,
+    objectId,
+  });
   const { handleColumnsChange } = useTableViewFields({
     objectName: objectId,
     viewFieldDefinitions: peopleViewFields,
@@ -45,15 +53,6 @@ export function PeopleTable() {
   });
   const { persistSorts } = useViewSorts({ availableSorts });
 
-  const filters = useRecoilScopedValue(
-    filtersScopedState,
-    TableRecoilScopeContext,
-  );
-
-  const whereFilters = useMemo(() => {
-    return { AND: filters.map(turnFilterIntoWhereClause) };
-  }, [filters]) as any;
-
   const { setContextMenuEntries } = usePersonTableContextMenuEntries();
   const { setActionBarEntries } = usePersonTableActionBarEntries();