Migrate to a monorepo structure (#2909)

2023-12-10 18:10:54 +01:00
parent a70a9281eb
commit 5bdca9de6c
2304 changed files with 37152 additions and 25869 deletions
--- a/packages/twenty-front/src/modules/views/hooks/internal/useViewFields.ts
+++ b/packages/twenty-front/src/modules/views/hooks/internal/useViewFields.ts
@ -0,0 +1,155 @@
+import { useApolloClient } from '@apollo/client';
+import { useRecoilCallback } from 'recoil';
+
+import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { ViewField } from '@/views/types/ViewField';
+import { getViewScopedStatesFromSnapshot } from '@/views/utils/getViewScopedStatesFromSnapshot';
+import { getViewScopedStateValuesFromSnapshot } from '@/views/utils/getViewScopedStateValuesFromSnapshot';
+
+export const useViewFields = (viewScopeId: string) => {
+  const { updateOneRecordMutation, createOneRecordMutation } =
+    useObjectMetadataItem({
+      objectNameSingular: 'viewField',
+    });
+
+  const { modifyRecordFromCache } = useObjectMetadataItem({
+    objectNameSingular: 'view',
+  });
+
+  const apolloClient = useApolloClient();
+
+  const persistViewFields = useRecoilCallback(
+    ({ snapshot, set }) =>
+      async (viewFieldsToPersist: ViewField[], viewId?: string) => {
+        const {
+          viewObjectMetadataId,
+          currentViewId,
+          savedViewFieldsByKey,
+          onViewFieldsChange,
+          views,
+        } = getViewScopedStateValuesFromSnapshot({
+          snapshot,
+          viewScopeId,
+          viewId,
+        });
+
+        const {
+          isPersistingViewState,
+          currentViewFieldsState,
+          savedViewFieldsState,
+        } = getViewScopedStatesFromSnapshot({
+          snapshot,
+          viewScopeId,
+          viewId,
+        });
+
+        const viewIdToPersist = viewId ?? currentViewId;
+
+        if (!currentViewId || !savedViewFieldsByKey || !viewObjectMetadataId) {
+          return;
+        }
+
+        const _createViewFields = (viewFieldsToCreate: ViewField[]) => {
+          if (!viewFieldsToCreate.length) {
+            return;
+          }
+
+          return Promise.all(
+            viewFieldsToCreate.map((viewField) =>
+              apolloClient.mutate({
+                mutation: createOneRecordMutation,
+                variables: {
+                  input: {
+                    fieldMetadataId: viewField.fieldMetadataId,
+                    viewId: viewIdToPersist,
+                    isVisible: viewField.isVisible,
+                    size: viewField.size,
+                    position: viewField.position,
+                  },
+                },
+              }),
+            ),
+          );
+        };
+
+        const _updateViewFields = (viewFieldsToUpdate: ViewField[]) => {
+          if (!viewFieldsToUpdate.length) {
+            return;
+          }
+
+          return Promise.all(
+            viewFieldsToUpdate.map((viewField) =>
+              apolloClient.mutate({
+                mutation: updateOneRecordMutation,
+                variables: {
+                  idToUpdate: viewField.id,
+                  input: {
+                    isVisible: viewField.isVisible,
+                    size: viewField.size,
+                    position: viewField.position,
+                  },
+                },
+              }),
+            ),
+          );
+        };
+
+        const viewFieldsToCreate = viewFieldsToPersist.filter(
+          (viewField) => !savedViewFieldsByKey[viewField.fieldMetadataId],
+        );
+
+        const viewFieldsToUpdate = viewFieldsToPersist.filter(
+          (viewFieldToPersit) =>
+            savedViewFieldsByKey[viewFieldToPersit.fieldMetadataId] &&
+            (savedViewFieldsByKey[viewFieldToPersit.fieldMetadataId].size !==
+              viewFieldToPersit.size ||
+              savedViewFieldsByKey[viewFieldToPersit.fieldMetadataId]
+                .position !== viewFieldToPersit.position ||
+              savedViewFieldsByKey[viewFieldToPersit.fieldMetadataId]
+                .isVisible !== viewFieldToPersit.isVisible),
+        );
+
+        set(isPersistingViewState, true);
+
+        await _createViewFields(viewFieldsToCreate);
+
+        await _updateViewFields(viewFieldsToUpdate);
+
+        set(isPersistingViewState, false);
+        set(currentViewFieldsState, viewFieldsToPersist);
+        set(savedViewFieldsState, viewFieldsToPersist);
+
+        const existingView = views.find((view) => view.id === viewIdToPersist);
+
+        if (!existingView) {
+          return;
+        }
+
+        modifyRecordFromCache(viewIdToPersist ?? '', {
+          viewFields: () => ({
+            edges: viewFieldsToPersist.map((viewField) => ({
+              node: viewField,
+              cursor: '',
+            })),
+            pageInfo: {
+              hasNextPage: false,
+              hasPreviousPage: false,
+              startCursor: '',
+              endCursor: '',
+            },
+          }),
+        });
+
+        onViewFieldsChange?.(viewFieldsToPersist);
+      },
+    [
+      viewScopeId,
+      modifyRecordFromCache,
+      apolloClient,
+      createOneRecordMutation,
+      updateOneRecordMutation,
+    ],
+  );
+
+  return { persistViewFields };
+};
--- a/packages/twenty-front/src/modules/views/hooks/internal/useViewFilters.ts
+++ b/packages/twenty-front/src/modules/views/hooks/internal/useViewFilters.ts
@ -0,0 +1,252 @@
+import { useApolloClient } from '@apollo/client';
+import { produce } from 'immer';
+import { useRecoilCallback } from 'recoil';
+
+import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { Filter } from '@/object-record/object-filter-dropdown/types/Filter';
+import { savedViewFiltersScopedFamilyState } from '@/views/states/savedViewFiltersScopedFamilyState';
+import { ViewFilter } from '@/views/types/ViewFilter';
+import { getViewScopedStateValuesFromSnapshot } from '@/views/utils/getViewScopedStateValuesFromSnapshot';
+
+import { useViewScopedStates } from './useViewScopedStates';
+
+export const useViewFilters = (viewScopeId: string) => {
+  const {
+    updateOneRecordMutation,
+    createOneRecordMutation,
+    deleteOneRecordMutation,
+  } = useObjectMetadataItem({
+    objectNameSingular: 'viewFilter',
+  });
+
+  const { modifyRecordFromCache } = useObjectMetadataItem({
+    objectNameSingular: 'view',
+  });
+
+  const apolloClient = useApolloClient();
+
+  const { currentViewFiltersState } = useViewScopedStates({
+    viewScopeId: viewScopeId,
+  });
+
+  const persistViewFilters = useRecoilCallback(
+    ({ snapshot, set }) =>
+      async (viewId?: string) => {
+        const {
+          currentViewId,
+          currentViewFilters,
+          savedViewFiltersByKey,
+          views,
+        } = getViewScopedStateValuesFromSnapshot({
+          snapshot,
+          viewScopeId,
+        });
+
+        if (!currentViewId) {
+          return;
+        }
+        if (!currentViewFilters) {
+          return;
+        }
+        if (!savedViewFiltersByKey) {
+          return;
+        }
+
+        const createViewFilters = (viewFiltersToCreate: ViewFilter[]) => {
+          if (!viewFiltersToCreate.length) return;
+
+          return Promise.all(
+            viewFiltersToCreate.map((viewFilter) =>
+              apolloClient.mutate({
+                mutation: createOneRecordMutation,
+                variables: {
+                  input: {
+                    fieldMetadataId: viewFilter.fieldMetadataId,
+                    viewId: viewId ?? currentViewId,
+                    value: viewFilter.value,
+                    displayValue: viewFilter.displayValue,
+                    operand: viewFilter.operand,
+                  },
+                },
+              }),
+            ),
+          );
+        };
+
+        const updateViewFilters = (viewFiltersToUpdate: ViewFilter[]) => {
+          if (!viewFiltersToUpdate.length) return;
+
+          return Promise.all(
+            viewFiltersToUpdate.map((viewFilter) =>
+              apolloClient.mutate({
+                mutation: updateOneRecordMutation,
+                variables: {
+                  idToUpdate: viewFilter.id,
+                  input: {
+                    value: viewFilter.value,
+                    displayValue: viewFilter.displayValue,
+                    operand: viewFilter.operand,
+                  },
+                },
+              }),
+            ),
+          );
+        };
+
+        const deleteViewFilters = (viewFilterIdsToDelete: string[]) => {
+          if (!viewFilterIdsToDelete.length) return;
+
+          return Promise.all(
+            viewFilterIdsToDelete.map((viewFilterId) =>
+              apolloClient.mutate({
+                mutation: deleteOneRecordMutation,
+                variables: {
+                  idToDelete: viewFilterId,
+                },
+              }),
+            ),
+          );
+        };
+
+        const filtersToCreate = currentViewFilters.filter(
+          (filter) => !savedViewFiltersByKey[filter.fieldMetadataId],
+        );
+        await createViewFilters(filtersToCreate);
+
+        const filtersToUpdate = currentViewFilters.filter(
+          (filter) =>
+            savedViewFiltersByKey[filter.fieldMetadataId] &&
+            (savedViewFiltersByKey[filter.fieldMetadataId].operand !==
+              filter.operand ||
+              savedViewFiltersByKey[filter.fieldMetadataId].value !==
+                filter.value),
+        );
+        await updateViewFilters(filtersToUpdate);
+
+        const filterKeys = currentViewFilters.map(
+          (filter) => filter.fieldMetadataId,
+        );
+        const filterKeysToDelete = Object.keys(savedViewFiltersByKey).filter(
+          (previousFilterKey) => !filterKeys.includes(previousFilterKey),
+        );
+        const filterIdsToDelete = filterKeysToDelete.map(
+          (filterKeyToDelete) =>
+            savedViewFiltersByKey[filterKeyToDelete].id ?? '',
+        );
+        await deleteViewFilters(filterIdsToDelete);
+        set(
+          savedViewFiltersScopedFamilyState({
+            scopeId: viewScopeId,
+            familyKey: viewId ?? currentViewId,
+          }),
+          currentViewFilters,
+        );
+
+        const existingViewId = viewId ?? currentViewId;
+        const existingView = views.find((view) => view.id === existingViewId);
+
+        if (!existingView) {
+          return;
+        }
+
+        modifyRecordFromCache(existingViewId, {
+          viewFilters: () => ({
+            edges: currentViewFilters.map((viewFilter) => ({
+              node: viewFilter,
+              cursor: '',
+            })),
+            pageInfo: {
+              hasNextPage: false,
+              hasPreviousPage: false,
+              startCursor: '',
+              endCursor: '',
+            },
+          }),
+        });
+      },
+    [
+      apolloClient,
+      createOneRecordMutation,
+      deleteOneRecordMutation,
+      modifyRecordFromCache,
+      updateOneRecordMutation,
+      viewScopeId,
+    ],
+  );
+
+  const upsertViewFilter = useRecoilCallback(
+    ({ snapshot, set }) =>
+      (filterToUpsert: Filter) => {
+        const { currentViewId, savedViewFiltersByKey, onViewFiltersChange } =
+          getViewScopedStateValuesFromSnapshot({
+            snapshot,
+            viewScopeId,
+          });
+
+        if (!currentViewId) {
+          return;
+        }
+
+        if (!savedViewFiltersByKey) {
+          return;
+        }
+
+        const existingSavedFilterId =
+          savedViewFiltersByKey[filterToUpsert.fieldMetadataId]?.id;
+
+        set(currentViewFiltersState, (filters) => {
+          const newViewFilters = produce(filters, (filtersDraft) => {
+            const existingFilterIndex = filtersDraft.findIndex(
+              (filter) =>
+                filter.fieldMetadataId === filterToUpsert.fieldMetadataId,
+            );
+
+            if (existingFilterIndex === -1 && filterToUpsert.value !== '') {
+              filtersDraft.push({
+                ...filterToUpsert,
+                id: existingSavedFilterId,
+              });
+              return filtersDraft;
+            }
+
+            if (filterToUpsert.value === '') {
+              filtersDraft.splice(existingFilterIndex, 1);
+              return filtersDraft;
+            }
+
+            filtersDraft[existingFilterIndex] = {
+              ...filterToUpsert,
+              id: existingSavedFilterId,
+            };
+          });
+          onViewFiltersChange?.(newViewFilters);
+          return newViewFilters;
+        });
+      },
+    [currentViewFiltersState, viewScopeId],
+  );
+
+  const removeViewFilter = useRecoilCallback(
+    ({ snapshot, set }) =>
+      (fieldMetadataId: string) => {
+        const { currentViewId, currentViewFilters, onViewFiltersChange } =
+          getViewScopedStateValuesFromSnapshot({
+            snapshot,
+            viewScopeId,
+          });
+
+        if (!currentViewId) {
+          return;
+        }
+
+        const newViewFilters = currentViewFilters.filter((filter) => {
+          return filter.fieldMetadataId !== fieldMetadataId;
+        });
+        set(currentViewFiltersState, newViewFilters);
+        onViewFiltersChange?.(newViewFilters);
+      },
+    [currentViewFiltersState, viewScopeId],
+  );
+
+  return { persistViewFilters, removeViewFilter, upsertViewFilter };
+};
--- a/packages/twenty-front/src/modules/views/hooks/internal/useViewScopedStates.ts
+++ b/packages/twenty-front/src/modules/views/hooks/internal/useViewScopedStates.ts
@ -0,0 +1,86 @@
+import { useRecoilState } from 'recoil';
+
+import { useAvailableScopeIdOrThrow } from '@/ui/utilities/recoil-scope/scopes-internal/hooks/useAvailableScopeId';
+import { getScopedState } from '@/ui/utilities/recoil-scope/utils/getScopedState';
+
+import { UNDEFINED_FAMILY_ITEM_ID } from '../../constants';
+import { ViewScopeInternalContext } from '../../scopes/scope-internal-context/ViewScopeInternalContext';
+import { currentViewIdScopedState } from '../../states/currentViewIdScopedState';
+import { getViewScopedStates } from '../../utils/internal/getViewScopedStates';
+
+export const useViewScopedStates = (args?: { viewScopeId?: string }) => {
+  const { viewScopeId } = args ?? {};
+
+  const scopeId = useAvailableScopeIdOrThrow(
+    ViewScopeInternalContext,
+    viewScopeId,
+  );
+
+  // View
+  const [currentViewId] = useRecoilState(
+    getScopedState(currentViewIdScopedState, scopeId),
+  );
+
+  const viewId = currentViewId ?? UNDEFINED_FAMILY_ITEM_ID;
+
+  const {
+    availableFieldDefinitionsState,
+    availableFilterDefinitionsState,
+    availableSortDefinitionsState,
+    canPersistFiltersSelector,
+    canPersistSortsSelector,
+    currentViewFieldsState,
+    currentViewFiltersState,
+    currentViewIdState,
+    currentViewSelector,
+    currentViewSortsState,
+    entityCountInCurrentViewState,
+    isViewBarExpandedState,
+    isPersistingViewState,
+    onViewFieldsChangeState,
+    onViewFiltersChangeState,
+    onViewSortsChangeState,
+    savedViewFieldsByKeySelector,
+    savedViewFieldsState,
+    savedViewFiltersByKeySelector,
+    savedViewFiltersState,
+    savedViewSortsByKeySelector,
+    savedViewSortsState,
+    viewEditModeState,
+    viewObjectMetadataIdState,
+    viewTypeState,
+    viewsState,
+  } = getViewScopedStates({
+    viewScopeId: scopeId,
+    viewId,
+  });
+
+  return {
+    availableFieldDefinitionsState,
+    availableFilterDefinitionsState,
+    availableSortDefinitionsState,
+    canPersistFiltersSelector,
+    canPersistSortsSelector,
+    currentViewFieldsState,
+    currentViewFiltersState,
+    currentViewIdState,
+    currentViewSelector,
+    currentViewSortsState,
+    entityCountInCurrentViewState,
+    isViewBarExpandedState,
+    isPersistingViewState,
+    onViewFieldsChangeState,
+    onViewFiltersChangeState,
+    onViewSortsChangeState,
+    savedViewFieldsByKeySelector,
+    savedViewFieldsState,
+    savedViewFiltersByKeySelector,
+    savedViewFiltersState,
+    savedViewSortsByKeySelector,
+    savedViewSortsState,
+    viewEditModeState,
+    viewObjectMetadataIdState,
+    viewTypeState,
+    viewsState,
+  };
+};
--- a/packages/twenty-front/src/modules/views/hooks/internal/useViewSorts.ts
+++ b/packages/twenty-front/src/modules/views/hooks/internal/useViewSorts.ts
@ -0,0 +1,230 @@
+import { useApolloClient } from '@apollo/client';
+import { produce } from 'immer';
+import { useRecoilCallback } from 'recoil';
+
+import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { Sort } from '@/object-record/object-sort-dropdown/types/Sort';
+import { savedViewSortsScopedFamilyState } from '@/views/states/savedViewSortsScopedFamilyState';
+import { ViewSort } from '@/views/types/ViewSort';
+import { getViewScopedStateValuesFromSnapshot } from '@/views/utils/getViewScopedStateValuesFromSnapshot';
+
+import { useViewScopedStates } from './useViewScopedStates';
+
+export const useViewSorts = (viewScopeId: string) => {
+  const {
+    updateOneRecordMutation,
+    createOneRecordMutation,
+    deleteOneRecordMutation,
+  } = useObjectMetadataItem({
+    objectNameSingular: 'viewSort',
+  });
+
+  const { modifyRecordFromCache } = useObjectMetadataItem({
+    objectNameSingular: 'view',
+  });
+  const apolloClient = useApolloClient();
+
+  const { currentViewSortsState } = useViewScopedStates({
+    viewScopeId: viewScopeId,
+  });
+
+  const persistViewSorts = useRecoilCallback(
+    ({ snapshot, set }) =>
+      async (viewId?: string) => {
+        const { currentViewId, currentViewSorts, savedViewSortsByKey, views } =
+          getViewScopedStateValuesFromSnapshot({
+            snapshot,
+            viewScopeId,
+          });
+
+        if (!currentViewId) {
+          return;
+        }
+
+        if (!currentViewSorts) {
+          return;
+        }
+        if (!savedViewSortsByKey) {
+          return;
+        }
+
+        const createViewSorts = (viewSortsToCreate: ViewSort[]) => {
+          if (!viewSortsToCreate.length) return;
+
+          return Promise.all(
+            viewSortsToCreate.map((viewSort) =>
+              apolloClient.mutate({
+                mutation: createOneRecordMutation,
+                variables: {
+                  input: {
+                    fieldMetadataId: viewSort.fieldMetadataId,
+                    viewId: viewId ?? currentViewId,
+                    direction: viewSort.direction,
+                  },
+                },
+              }),
+            ),
+          );
+        };
+
+        const updateViewSorts = (viewSortsToUpdate: ViewSort[]) => {
+          if (!viewSortsToUpdate.length) return;
+
+          return Promise.all(
+            viewSortsToUpdate.map((viewSort) =>
+              apolloClient.mutate({
+                mutation: updateOneRecordMutation,
+                variables: {
+                  idToUpdate: viewSort.id,
+                  input: {
+                    direction: viewSort.direction,
+                  },
+                },
+              }),
+            ),
+          );
+        };
+
+        const deleteViewSorts = (viewSortIdsToDelete: string[]) => {
+          if (!viewSortIdsToDelete.length) return;
+
+          return Promise.all(
+            viewSortIdsToDelete.map((viewSortId) =>
+              apolloClient.mutate({
+                mutation: deleteOneRecordMutation,
+                variables: {
+                  idToDelete: viewSortId,
+                },
+              }),
+            ),
+          );
+        };
+
+        const sortsToCreate = currentViewSorts.filter(
+          (sort) => !savedViewSortsByKey[sort.fieldMetadataId],
+        );
+
+        await createViewSorts(sortsToCreate);
+
+        const sortsToUpdate = currentViewSorts.filter(
+          (sort) =>
+            savedViewSortsByKey[sort.fieldMetadataId] &&
+            savedViewSortsByKey[sort.fieldMetadataId].direction !==
+              sort.direction,
+        );
+        await updateViewSorts(sortsToUpdate);
+
+        const sortKeys = currentViewSorts.map((sort) => sort.fieldMetadataId);
+        const sortKeysToDelete = Object.keys(savedViewSortsByKey).filter(
+          (previousSortKey) => !sortKeys.includes(previousSortKey),
+        );
+        const sortIdsToDelete = sortKeysToDelete.map(
+          (sortKeyToDelete) => savedViewSortsByKey[sortKeyToDelete].id ?? '',
+        );
+        await deleteViewSorts(sortIdsToDelete);
+        set(
+          savedViewSortsScopedFamilyState({
+            scopeId: viewScopeId,
+            familyKey: viewId ?? currentViewId,
+          }),
+          currentViewSorts,
+        );
+        const existingViewId = viewId ?? currentViewId;
+        const existingView = views.find((view) => view.id === existingViewId);
+
+        if (!existingView) {
+          return;
+        }
+
+        modifyRecordFromCache(existingViewId, {
+          viewSorts: () => ({
+            edges: currentViewSorts.map((viewSort) => ({
+              node: viewSort,
+              cursor: '',
+            })),
+            pageInfo: {
+              hasNextPage: false,
+              hasPreviousPage: false,
+              startCursor: '',
+              endCursor: '',
+            },
+          }),
+        });
+      },
+    [
+      apolloClient,
+      createOneRecordMutation,
+      deleteOneRecordMutation,
+      modifyRecordFromCache,
+      updateOneRecordMutation,
+      viewScopeId,
+    ],
+  );
+
+  const upsertViewSort = useRecoilCallback(
+    ({ snapshot, set }) =>
+      (sortToUpsert: Sort) => {
+        const { currentViewId, onViewSortsChange, savedViewSortsByKey } =
+          getViewScopedStateValuesFromSnapshot({
+            snapshot,
+            viewScopeId,
+          });
+
+        if (!currentViewId) {
+          return;
+        }
+
+        if (!savedViewSortsByKey) {
+          return;
+        }
+
+        const existingSavedSortId =
+          savedViewSortsByKey[sortToUpsert.fieldMetadataId]?.id;
+
+        set(currentViewSortsState, (sorts) => {
+          const newViewSorts = produce(sorts, (sortsDraft) => {
+            const existingSortIndex = sortsDraft.findIndex(
+              (sort) => sort.fieldMetadataId === sortToUpsert.fieldMetadataId,
+            );
+
+            if (existingSortIndex === -1) {
+              sortsDraft.push({ ...sortToUpsert, id: existingSavedSortId });
+              return sortsDraft;
+            }
+
+            sortsDraft[existingSortIndex] = {
+              ...sortToUpsert,
+              id: existingSavedSortId,
+            };
+          });
+          onViewSortsChange?.(newViewSorts);
+          return newViewSorts;
+        });
+      },
+    [currentViewSortsState, viewScopeId],
+  );
+
+  const removeViewSort = useRecoilCallback(
+    ({ snapshot, set }) =>
+      (fieldMetadataId: string) => {
+        const { currentViewId, onViewSortsChange, currentViewSorts } =
+          getViewScopedStateValuesFromSnapshot({
+            snapshot,
+            viewScopeId,
+          });
+
+        if (!currentViewId) {
+          return;
+        }
+
+        const newViewSorts = currentViewSorts.filter((filter) => {
+          return filter.fieldMetadataId !== fieldMetadataId;
+        });
+        set(currentViewSortsState, newViewSorts);
+        onViewSortsChange?.(newViewSorts);
+      },
+    [currentViewSortsState, viewScopeId],
+  );
+
+  return { persistViewSorts, upsertViewSort, removeViewSort };
+};
--- a/packages/twenty-front/src/modules/views/hooks/internal/useViews.ts
+++ b/packages/twenty-front/src/modules/views/hooks/internal/useViews.ts
@ -0,0 +1,78 @@
+import { useApolloClient } from '@apollo/client';
+import { useRecoilCallback } from 'recoil';
+
+import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { GraphQLView } from '@/views/types/GraphQLView';
+import { getViewScopedStateValuesFromSnapshot } from '@/views/utils/getViewScopedStateValuesFromSnapshot';
+
+export const useViews = (scopeId: string) => {
+  const {
+    updateOneRecordMutation: updateOneMutation,
+    createOneRecordMutation: createOneMutation,
+    deleteOneRecordMutation: deleteOneMutation,
+    findManyRecordsQuery: findManyQuery,
+  } = useObjectMetadataItem({
+    objectNameSingular: 'view',
+  });
+
+  const apolloClient = useApolloClient();
+
+  const createView = useRecoilCallback(
+    ({ snapshot }) =>
+      async (view: Pick<GraphQLView, 'id' | 'name'>) => {
+        const { viewObjectMetadataId, viewType } =
+          getViewScopedStateValuesFromSnapshot({
+            snapshot,
+            viewScopeId: scopeId,
+          });
+
+        if (!viewObjectMetadataId || !viewType) {
+          return;
+        }
+        await apolloClient.mutate({
+          mutation: createOneMutation,
+          variables: {
+            input: {
+              id: view.id,
+              name: view.name,
+              objectMetadataId: viewObjectMetadataId,
+              type: viewType,
+            },
+          },
+          refetchQueries: [findManyQuery],
+        });
+      },
+    [scopeId, apolloClient, createOneMutation, findManyQuery],
+  );
+
+  const updateView = async (view: GraphQLView) => {
+    await apolloClient.mutate({
+      mutation: updateOneMutation,
+      variables: {
+        idToUpdate: view.id,
+        input: {
+          id: view.id,
+          name: view.name,
+        },
+      },
+      refetchQueries: [findManyQuery],
+    });
+  };
+
+  const deleteView = async (viewId: string) => {
+    await apolloClient.mutate({
+      mutation: deleteOneMutation,
+      variables: {
+        idToDelete: viewId,
+      },
+      refetchQueries: [findManyQuery],
+    });
+  };
+
+  return {
+    createView,
+    deleteView,
+    isFetchingViews: false,
+    updateView,
+  };
+};