[COMMAND MENU ITEMS] Sync object metadata with navigation command menu items (#19456)

When an object is created or enabled we create a navigation command menu
item to that object. And when the object is disabled or deleted, we
remove this command menu item.

packages/twenty-front/src/modules/object-metadata/hooks/__mocks__/useCreateOneObjectMetadataItem.ts

@@ -1,5 +1,6 @@
 import {
   CreateOneObjectMetadataItemDocument,
+  FindManyCommandMenuItemsDocument,
   FindManyNavigationMenuItemsDocument,
   FindManyViewsDocument,
 } from '~/generated-metadata/graphql';
@@ -11,6 +12,8 @@ export const findManyViewsQuery = FindManyViewsDocument;
 export const findManyNavigationMenuItemsQuery =
   FindManyNavigationMenuItemsDocument;
 
+export const findManyCommandMenuItemsQuery = FindManyCommandMenuItemsDocument;
+
 export const variables = {
   input: {
     object: {

packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useCreateOneObjectMetadataItem.test.tsx

@@ -4,6 +4,7 @@ import { useCreateOneObjectMetadataItem } from '@/object-metadata/hooks/useCreat
 
 import { getJestMetadataAndApolloMocksWrapper } from '~/testing/jest/getJestMetadataAndApolloMocksWrapper';
 import {
+  findManyCommandMenuItemsQuery,
   findManyNavigationMenuItemsQuery,
   findManyViewsQuery,
   query,
@@ -12,7 +13,7 @@ import {
 } from '@/object-metadata/hooks/__mocks__/useCreateOneObjectMetadataItem';
 
 import { jestExpectSuccessfulMetadataRequestResult } from '@/object-metadata/hooks/__tests__/utils/jest-expect-metadata-request-status.util';
-import { GET_CURRENT_USER } from '@/users/graphql/queries/getCurrentUser';
+import { GetCurrentUserDocument } from '~/generated-metadata/graphql';
 import { mockedUserData } from '~/testing/mock-data/users';
 import {
   query as findManyObjectMetadataItemsQuery,
@@ -33,7 +34,7 @@ const mocks = [
   },
   {
     request: {
-      query: GET_CURRENT_USER,
+      query: GetCurrentUserDocument,
       variables: {},
     },
     result: jest.fn(() => ({
@@ -75,6 +76,17 @@ const mocks = [
       },
     })),
   },
+  {
+    request: {
+      query: findManyCommandMenuItemsQuery,
+      variables: {},
+    },
+    result: jest.fn(() => ({
+      data: {
+        commandMenuItems: [],
+      },
+    })),
+  },
 ];
 
 const Wrapper = getJestMetadataAndApolloMocksWrapper({

packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useDeleteOneObjectMetadataItem.test.tsx

@@ -11,6 +11,7 @@ import {
 import { jestExpectSuccessfulMetadataRequestResult } from '@/object-metadata/hooks/__tests__/utils/jest-expect-metadata-request-status.util';
 import { GET_CURRENT_USER } from '@/users/graphql/queries/getCurrentUser';
 import { FIND_ALL_VIEWS } from '@/views/graphql/queries/findAllViews';
+import { FindManyCommandMenuItemsDocument } from '~/generated-metadata/graphql';
 import { getJestMetadataAndApolloMocksWrapper } from '~/testing/jest/getJestMetadataAndApolloMocksWrapper';
 import { mockedUserData } from '~/testing/mock-data/users';
 import { mockedViews } from '~/testing/mock-data/generated/metadata/views/mock-views-data';
@@ -62,6 +63,17 @@ const mocks = [
       data: findManyObjectMetadataItemsResponseData,
     })),
   },
+  {
+    request: {
+      query: FindManyCommandMenuItemsDocument,
+      variables: {},
+    },
+    result: jest.fn(() => ({
+      data: {
+        commandMenuItems: [],
+      },
+    })),
+  },
 ];
 
 const Wrapper = getJestMetadataAndApolloMocksWrapper({

packages/twenty-front/src/modules/object-metadata/hooks/useCreateOneObjectMetadataItem.ts

@@ -2,6 +2,7 @@ import { useApolloClient, useMutation } from '@apollo/client/react';
 import {
   type CreateObjectInput,
   CreateOneObjectMetadataItemDocument,
+  FindManyCommandMenuItemsDocument,
   FindManyNavigationMenuItemsDocument,
   FindManyViewsDocument,
 } from '~/generated-metadata/graphql';
@@ -13,6 +14,7 @@ import { type FlatObjectMetadataItem } from '@/metadata-store/types/FlatObjectMe
 import { splitViewWithRelated } from '@/metadata-store/utils/splitViewWithRelated';
 import { type MetadataRequestResult } from '@/object-metadata/types/MetadataRequestResult.type';
 import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar';
+import { useLoadCurrentUser } from '@/users/hooks/useLoadCurrentUser';
 import { CombinedGraphQLErrors } from '@apollo/client/errors';
 import { t } from '@lingui/core/macro';
 import { CrudOperationType } from 'twenty-shared/types';
@@ -28,6 +30,7 @@ export const useCreateOneObjectMetadataItem = () => {
   const { enqueueErrorSnackBar } = useSnackBar();
   const { addToDraft, replaceDraft, applyChanges } =
     useUpdateMetadataStoreDraft();
+  const { loadCurrentUser } = useLoadCurrentUser();
 
   const createOneObjectMetadataItem = async (
     input: CreateObjectInput,
@@ -70,17 +73,22 @@ export const useCreateOneObjectMetadataItem = () => {
 
         applyChanges();
 
-        const [viewsResult, navItemsResult] = await Promise.all([
-          client.query({
-            query: FindManyViewsDocument,
-            variables: { objectMetadataId: createdObject.id },
-            fetchPolicy: 'network-only',
-          }),
-          client.query({
-            query: FindManyNavigationMenuItemsDocument,
-            fetchPolicy: 'network-only',
-          }),
-        ]);
+        const [viewsResult, navItemsResult, commandMenuItemsResult] =
+          await Promise.all([
+            client.query({
+              query: FindManyViewsDocument,
+              variables: { objectMetadataId: createdObject.id },
+              fetchPolicy: 'network-only',
+            }),
+            client.query({
+              query: FindManyNavigationMenuItemsDocument,
+              fetchPolicy: 'network-only',
+            }),
+            client.query({
+              query: FindManyCommandMenuItemsDocument,
+              fetchPolicy: 'network-only',
+            }),
+          ]);
 
         const fetchedViews = viewsResult.data?.getViews ?? [];
 
@@ -107,7 +115,14 @@ export const useCreateOneObjectMetadataItem = () => {
           navItemsResult.data?.navigationMenuItems ?? [],
         );
 
+        replaceDraft(
+          'commandMenuItems',
+          commandMenuItemsResult.data?.commandMenuItems ?? [],
+        );
+
         applyChanges();
+
+        await loadCurrentUser();
       }
 
       return {

packages/twenty-front/src/modules/object-metadata/hooks/useDeleteOneObjectMetadataItem.ts

@@ -1,5 +1,8 @@
-import { useMutation } from '@apollo/client/react';
-import { DeleteOneObjectMetadataItemDocument } from '~/generated-metadata/graphql';
+import { useApolloClient, useMutation } from '@apollo/client/react';
+import {
+  DeleteOneObjectMetadataItemDocument,
+  FindManyCommandMenuItemsDocument,
+} from '~/generated-metadata/graphql';
 
 import { useMetadataErrorHandler } from '@/metadata-error-handler/hooks/useMetadataErrorHandler';
 import { useUpdateMetadataStoreDraft } from '@/metadata-store/hooks/useUpdateMetadataStoreDraft';
@@ -14,9 +17,11 @@ export const useDeleteOneObjectMetadataItem = () => {
     DeleteOneObjectMetadataItemDocument,
   );
 
+  const client = useApolloClient();
   const { handleMetadataError } = useMetadataErrorHandler();
   const { enqueueErrorSnackBar } = useSnackBar();
-  const { removeFromDraft, applyChanges } = useUpdateMetadataStoreDraft();
+  const { removeFromDraft, replaceDraft, applyChanges } =
+    useUpdateMetadataStoreDraft();
 
   const deleteOneObjectMetadataItem = async (
     idToDelete: string,
@@ -35,6 +40,17 @@ export const useDeleteOneObjectMetadataItem = () => {
       removeFromDraft({ key: 'objectMetadataItems', itemIds: [idToDelete] });
       applyChanges();
 
+      const commandMenuItemsResult = await client.query({
+        query: FindManyCommandMenuItemsDocument,
+        fetchPolicy: 'network-only',
+      });
+
+      replaceDraft(
+        'commandMenuItems',
+        commandMenuItemsResult.data?.commandMenuItems ?? [],
+      );
+      applyChanges();
+
       return {
         status: 'successful',
         response,

packages/twenty-front/src/modules/object-metadata/hooks/useUpdateOneObjectMetadataItem.ts

@@ -1,6 +1,7 @@
-import { useMutation } from '@apollo/client/react';
+import { useApolloClient, useMutation } from '@apollo/client/react';
 import {
   type UpdateOneObjectInput,
+  FindManyCommandMenuItemsDocument,
   UpdateOneObjectMetadataItemDocument,
 } from '~/generated-metadata/graphql';
 
@@ -20,9 +21,11 @@ export const useUpdateOneObjectMetadataItem = () => {
     UpdateOneObjectMetadataItemDocument,
   );
 
+  const client = useApolloClient();
   const { handleMetadataError } = useMetadataErrorHandler();
   const { enqueueErrorSnackBar } = useSnackBar();
-  const { updateInDraft, applyChanges } = useUpdateMetadataStoreDraft();
+  const { updateInDraft, replaceDraft, applyChanges } =
+    useUpdateMetadataStoreDraft();
 
   const updateOneObjectMetadataItem = async ({
     idToUpdate,
@@ -52,6 +55,17 @@ export const useUpdateOneObjectMetadataItem = () => {
           objectData as FlatObjectMetadataItem,
         ]);
         applyChanges();
+
+        const commandMenuItemsResult = await client.query({
+          query: FindManyCommandMenuItemsDocument,
+          fetchPolicy: 'network-only',
+        });
+
+        replaceDraft(
+          'commandMenuItems',
+          commandMenuItemsResult.data?.commandMenuItems ?? [],
+        );
+        applyChanges();
       }
 
       return {