feat: delete views from views dropdown (#1234)

Closes #1129

Co-authored-by: Charles Bochet <charlesBochet@users.noreply.github.com>

front/src/modules/views/graphql/mutations/deleteView.ts

@@ -0,0 +1,9 @@
+import { gql } from '@apollo/client';
+
+export const DELETE_VIEWS = gql`
+  mutation DeleteViews($where: ViewWhereInput!) {
+    deleteManyView(where: $where) {
+      count
+    }
+  }
+`;

front/src/modules/views/hooks/useTableViewFields.ts

@@ -131,6 +131,8 @@ export const useTableViewFields = ({
 
   const handleColumnsChange = useCallback(
     async (nextColumns: ViewFieldDefinition<ViewFieldMetadata>[]) => {
+      setColumns(nextColumns);
+
       const viewFieldsToCreate = nextColumns.filter(
         (nextColumn) => !columnsById[nextColumn.id],
       );
@@ -144,7 +146,7 @@ export const useTableViewFields = ({
       );
       await updateViewFields(viewFieldsToUpdate);
     },
-    [columnsById, createViewFields, updateViewFields],
+    [columnsById, createViewFields, setColumns, updateViewFields],
   );
 
   return { handleColumnsChange };

front/src/modules/views/hooks/useTableViews.ts

@@ -11,6 +11,7 @@ import { useRecoilScopedState } from '@/ui/utilities/recoil-scope/hooks/useRecoi
 import { useRecoilScopedValue } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedValue';
 import {
   useCreateViewsMutation,
+  useDeleteViewsMutation,
   useGetViewsQuery,
   useUpdateViewMutation,
   ViewType,
@@ -34,6 +35,7 @@ export const useTableViews = ({
 
   const [createViewsMutation] = useCreateViewsMutation();
   const [updateViewMutation] = useUpdateViewMutation();
+  const [deleteViewsMutation] = useDeleteViewsMutation();
 
   const createViews = useCallback(
     (views: TableView[]) => {
@@ -72,6 +74,22 @@ export const useTableViews = ({
     [updateViewMutation],
   );
 
+  const deleteViews = useCallback(
+    (viewIds: string[]) => {
+      if (!viewIds.length) return;
+
+      return deleteViewsMutation({
+        variables: {
+          where: {
+            id: { in: viewIds },
+          },
+        },
+        refetchQueries: [getOperationName(GET_VIEWS) ?? ''],
+      });
+    },
+    [deleteViewsMutation],
+  );
+
   useGetViewsQuery({
     variables: {
       where: {
@@ -90,6 +108,8 @@ export const useTableViews = ({
 
   const handleViewsChange = useCallback(
     async (nextViews: TableView[]) => {
+      setViews(nextViews);
+
       const viewsToCreate = nextViews.filter(
         (nextView) => !viewsById[nextView.id],
       );
@@ -101,8 +121,14 @@ export const useTableViews = ({
           viewsById[nextView.id].name !== nextView.name,
       );
       await updateViewFields(viewsToUpdate);
+
+      const nextViewIds = nextViews.map((nextView) => nextView.id);
+      const viewIdsToDelete = Object.keys(viewsById).filter(
+        (previousViewId) => !nextViewIds.includes(previousViewId),
+      );
+      return deleteViews(viewIdsToDelete);
     },
-    [createViews, updateViewFields, viewsById],
+    [createViews, deleteViews, setViews, updateViewFields, viewsById],
   );
 
   return { handleViewsChange };

front/src/modules/views/hooks/useViewSorts.ts

@@ -136,10 +136,12 @@ export const useViewSorts = <SortField>({
     [currentViewId, deleteViewSortsMutation],
   );
 
-  const updateSorts = useCallback(
+  const handleSortsChange = useCallback(
     async (nextSorts: SelectedSortType<SortField>[]) => {
       if (!currentViewId) return;
 
+      setSorts(nextSorts);
+
       const sortsToCreate = nextSorts.filter(
         (nextSort) => !sortsByKey[nextSort.key],
       );
@@ -162,10 +164,11 @@ export const useViewSorts = <SortField>({
       createViewSorts,
       currentViewId,
       deleteViewSorts,
+      setSorts,
       sortsByKey,
       updateViewSorts,
     ],
   );
 
-  return { updateSorts };
+  return { handleSortsChange };
 };