Fix command menu context chip display on show page (#10267)

## New Company
### Before:
<img width="500" alt="Capture d’écran 2025-02-17 à 16 47 54"
src="https://github.com/user-attachments/assets/4573450d-14b1-41f0-9b86-24003f489fde"
/>

### After:
<img width="500" alt="Capture d’écran 2025-02-17 à 16 46 24"
src="https://github.com/user-attachments/assets/6622bd75-900a-451b-ac21-c98bddeee32d"
/>


## Task
### Before:
<img width="500" alt="Capture d’écran 2025-02-17 à 16 47 35"
src="https://github.com/user-attachments/assets/04b77faa-b628-4839-ab94-95c8570c1818"
/>

### After:
<img width="501" alt="Capture d’écran 2025-02-17 à 16 47 03"
src="https://github.com/user-attachments/assets/1577dea6-7541-497e-af6e-3a4559f1a913"
/>

packages/twenty-front/src/modules/activities/hooks/useOpenActivityRightDrawer.ts

@@ -1,5 +1,6 @@
 import { useRecoilState, useSetRecoilState } from 'recoil';
 
+import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu';
 import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
 import { viewableRecordIdState } from '@/object-record/record-right-drawer/states/viewableRecordIdState';
 import { viewableRecordNameSingularState } from '@/object-record/record-right-drawer/states/viewableRecordNameSingularState';
@@ -7,7 +8,6 @@ import { useRightDrawer } from '@/ui/layout/right-drawer/hooks/useRightDrawer';
 import { RightDrawerHotkeyScope } from '@/ui/layout/right-drawer/types/RightDrawerHotkeyScope';
 import { RightDrawerPages } from '@/ui/layout/right-drawer/types/RightDrawerPages';
 import { useSetHotkeyScope } from '@/ui/utilities/hotkey/hooks/useSetHotkeyScope';
-import { AppHotkeyScope } from '@/ui/utilities/hotkey/types/AppHotkeyScope';
 import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
 import { IconList } from 'twenty-ui';
 import { FeatureFlagKey } from '~/generated/graphql';
@@ -33,6 +33,8 @@ export const useOpenActivityRightDrawer = ({
     FeatureFlagKey.IsCommandMenuV2Enabled,
   );
 
+  const { openRecordInCommandMenu } = useCommandMenu();
+
   return (activityId: string) => {
     if (
       isRightDrawerOpen &&
@@ -43,16 +45,19 @@ export const useOpenActivityRightDrawer = ({
     }
 
     if (isCommandMenuV2Enabled) {
-      setHotkeyScope(AppHotkeyScope.CommandMenuOpen, { goto: false });
+      openRecordInCommandMenu({
+        recordId: activityId,
+        objectNameSingular,
+        isNewRecord: false,
+      });
     } else {
       setHotkeyScope(RightDrawerHotkeyScope.RightDrawer, { goto: false });
+      setViewableRecordId(activityId);
+      setViewableRecordNameSingular(objectNameSingular);
+      openRightDrawer(RightDrawerPages.ViewRecord, {
+        title: objectNameSingular,
+        Icon: IconList,
+      });
     }
-
-    setViewableRecordId(activityId);
-    setViewableRecordNameSingular(objectNameSingular);
-    openRightDrawer(RightDrawerPages.ViewRecord, {
-      title: objectNameSingular,
-      Icon: IconList,
-    });
   };
 };

packages/twenty-front/src/modules/activities/hooks/useOpenCreateActivityDrawer.ts

@@ -13,11 +13,11 @@ import { Note } from '@/activities/types/Note';
 import { NoteTarget } from '@/activities/types/NoteTarget';
 import { Task } from '@/activities/types/Task';
 import { TaskTarget } from '@/activities/types/TaskTarget';
+import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu';
 import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
 import { useCreateOneRecord } from '@/object-record/hooks/useCreateOneRecord';
 import { isNewViewableRecordLoadingState } from '@/object-record/record-right-drawer/states/isNewViewableRecordLoading';
 import { viewableRecordNameSingularState } from '@/object-record/record-right-drawer/states/viewableRecordNameSingularState';
-import { AppHotkeyScope } from '@/ui/utilities/hotkey/types/AppHotkeyScope';
 import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
 import { IconList } from 'twenty-ui';
 import { FeatureFlagKey } from '~/generated/graphql';
@@ -68,6 +68,8 @@ export const useOpenCreateActivityDrawer = ({
     FeatureFlagKey.IsCommandMenuV2Enabled,
   );
 
+  const { openRecordInCommandMenu } = useCommandMenu();
+
   const openCreateActivityDrawer = async ({
     targetableObjects,
     customAssignee,
@@ -76,10 +78,12 @@ export const useOpenCreateActivityDrawer = ({
     customAssignee?: WorkspaceMember;
   }) => {
     setIsNewViewableRecordLoading(true);
-    openRightDrawer(RightDrawerPages.ViewRecord, {
+    if (!isCommandMenuV2Enabled) {
-      title: activityObjectNameSingular,
+      openRightDrawer(RightDrawerPages.ViewRecord, {
-      Icon: IconList,
+        title: activityObjectNameSingular,
-    });
+        Icon: IconList,
+      });
+    }
     setViewableRecordId(null);
     setViewableRecordNameSingular(activityObjectNameSingular);
 
@@ -122,7 +126,11 @@ export const useOpenCreateActivityDrawer = ({
     }
 
     if (isCommandMenuV2Enabled) {
-      setHotkeyScope(AppHotkeyScope.CommandMenuOpen, { goto: false });
+      openRecordInCommandMenu({
+        recordId: activity.id,
+        objectNameSingular: activityObjectNameSingular,
+        isNewRecord: true,
+      });
     } else {
       setHotkeyScope(RightDrawerHotkeyScope.RightDrawer, { goto: false });
     }

packages/twenty-front/src/modules/command-menu/components/CommandMenuContextChipGroupsWithRecordSelection.tsx

@@ -3,6 +3,7 @@ import { CommandMenuContextRecordChipAvatars } from '@/command-menu/components/C
 import { getSelectedRecordsContextText } from '@/command-menu/utils/getRecordContextText';
 import { useFindManyRecordsSelectedInContextStore } from '@/context-store/hooks/useFindManyRecordsSelectedInContextStore';
 import { useObjectMetadataItemById } from '@/object-metadata/hooks/useObjectMetadataItemById';
+import { isDefined } from 'twenty-shared';
 import { CommandMenuContextChipProps } from './CommandMenuContextChip';
 
 export const CommandMenuContextChipGroupsWithRecordSelection = ({
@@ -21,7 +22,7 @@ export const CommandMenuContextChipGroupsWithRecordSelection = ({
       limit: 3,
     });
 
-  if (loading || !totalCount) {
+  if (loading) {
     return null;
   }
 
@@ -33,21 +34,25 @@ export const CommandMenuContextChipGroupsWithRecordSelection = ({
     />
   ));
 
-  const selectedRecordsContextText = getSelectedRecordsContextText(
+  const recordSelectionContextChip = totalCount
-    objectMetadataItem,
+    ? {
-    records,
+        text: getSelectedRecordsContextText(
-    totalCount,
+          objectMetadataItem,
-  );
+          records,
+          totalCount,
+        ),
+        Icons: Avatars,
+      }
+    : undefined;
+
+  const contextChipsWithRecordSelection = [
+    recordSelectionContextChip,
+    ...contextChips,
+  ].filter(isDefined);
 
   return (
     <CommandMenuContextChipGroups
-      contextChips={[
+      contextChips={contextChipsWithRecordSelection}
-        {
-          text: selectedRecordsContextText,
-          Icons: Avatars,
-        },
-        ...contextChips,
-      ]}
     />
   );
 };

packages/twenty-front/src/modules/command-menu/hooks/useCommandMenu.ts

@@ -1,9 +1,11 @@
 import { useRecoilCallback, useRecoilValue } from 'recoil';
 
 import { commandMenuSearchState } from '@/command-menu/states/commandMenuSearchState';
+import { objectMetadataItemFamilySelector } from '@/object-metadata/states/objectMetadataItemFamilySelector';
 import { useSelectableList } from '@/ui/layout/selectable-list/hooks/useSelectableList';
 import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
 import { AppHotkeyScope } from '@/ui/utilities/hotkey/types/AppHotkeyScope';
+import { IconDotsVertical, IconSearch, useIcons } from 'twenty-ui';
 
 import { useCopyContextStoreStates } from '@/command-menu/hooks/useCopyContextStoreAndActionMenuStates';
 import { useResetContextStoreStates } from '@/command-menu/hooks/useResetContextStoreStates';
@@ -24,9 +26,9 @@ import { ContextStoreViewType } from '@/context-store/types/ContextStoreViewType
 import { viewableRecordIdState } from '@/object-record/record-right-drawer/states/viewableRecordIdState';
 import { viewableRecordNameSingularState } from '@/object-record/record-right-drawer/states/viewableRecordNameSingularState';
 import { emitRightDrawerCloseEvent } from '@/ui/layout/right-drawer/utils/emitRightDrawerCloseEvent';
+import { t } from '@lingui/core/macro';
 import { useCallback } from 'react';
-import { isDefined } from 'twenty-shared';
+import { capitalize, isDefined } from 'twenty-shared';
-import { IconDotsVertical, IconList, IconSearch } from 'twenty-ui';
 import { isCommandMenuOpenedState } from '../states/isCommandMenuOpenedState';
 
 export const useCommandMenu = () => {
@@ -35,6 +37,7 @@ export const useCommandMenu = () => {
     setHotkeyScopeAndMemorizePreviousScope,
     goBackToPreviousHotkeyScope,
   } = usePreviousHotkeyScope();
+  const { getIcon } = useIcons();
 
   const mainContextStoreComponentInstanceId = useRecoilValue(
     mainContextStoreComponentInstanceIdState,
@@ -211,18 +214,44 @@ export const useCommandMenu = () => {
   }, []);
 
   const openRecordInCommandMenu = useRecoilCallback(
-    ({ set }) => {
+    ({ set, snapshot }) => {
-      return (recordId: string, objectNameSingular: string) => {
+      return ({
+        recordId,
+        objectNameSingular,
+        isNewRecord = false,
+      }: {
+        recordId: string;
+        objectNameSingular: string;
+        isNewRecord?: boolean;
+      }) => {
         set(viewableRecordNameSingularState, objectNameSingular);
         set(viewableRecordIdState, recordId);
+
+        const objectMetadataItem = snapshot
+          .getLoadable(
+            objectMetadataItemFamilySelector({
+              objectName: objectNameSingular,
+              objectNameType: 'singular',
+            }),
+          )
+          .getValue();
+
+        const Icon = objectMetadataItem?.icon
+          ? getIcon(objectMetadataItem.icon)
+          : getIcon('IconList');
+
+        const capitalizedObjectNameSingular = capitalize(objectNameSingular);
+
         navigateCommandMenu({
           page: CommandMenuPages.ViewRecord,
-          pageTitle: objectNameSingular,
+          pageTitle: isNewRecord
-          pageIcon: IconList,
+            ? t`New ${capitalizedObjectNameSingular}`
+            : capitalizedObjectNameSingular,
+          pageIcon: Icon,
         });
       };
     },
-    [navigateCommandMenu],
+    [getIcon, navigateCommandMenu],
   );
 
   const openRecordsSearchPage = () => {

packages/twenty-front/src/modules/object-record/record-table/hooks/useCreateNewTableRecords.ts

@@ -89,7 +89,11 @@ export const useCreateNewTableRecord = ({
 
       await createOneRecord({ id: recordId });
 
-      openRecordInCommandMenu(recordId, objectMetadataItem.nameSingular);
+      openRecordInCommandMenu({
+        recordId,
+        objectNameSingular: objectMetadataItem.nameSingular,
+        isNewRecord: true,
+      });
 
       openRecordTitleCell({
         recordId,

packages/twenty-server/src/engine/core-modules/i18n/locales/af-ZA.po

@@ -2253,4 +2253,3 @@ msgstr ""
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Jou spanlid verantwoordelik vir die bestuur van die maatskappy rekening"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/ar-SA.po

@@ -1584,7 +1584,9 @@ msgstr "مؤشر التزامن"
 
 #: src/modules/calendar/common/standard-objects/calendar-channel.workspace-entity.ts:269
 msgid "Sync Cursor. Used for syncing events from the calendar provider"
-msgstr "\n"
+msgstr ""
+"\n"
+""
 
 #: src/modules/messaging/common/standard-objects/message-channel.workspace-entity.ts:291
 #: src/modules/messaging/common/standard-objects/message-channel.workspace-entity.ts:292
@@ -2253,4 +2255,3 @@ msgstr ""
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "العضو في فريقك المسئول عن إدارة حساب الشركة"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/ca-ES.po

@@ -2253,4 +2253,3 @@ msgstr ""
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "El teu membre de l'equip responsable de la gestió del compte de l'empresa"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/cs-CZ.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Člen vašeho týmu odpovědný za správu firemního účtu"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/da-DK.po

@@ -1540,7 +1540,8 @@ msgstr "Køringer"
 #: src/modules/connected-account/standard-objects/connected-account.workspace-entity.ts:104
 #: src/modules/connected-account/standard-objects/connected-account.workspace-entity.ts:105
 msgid "Scopes"
-msgstr "R\n"
+msgstr ""
+"R\n"
 "ettigheder"
 
 #: src/engine/metadata-modules/constants/search-vector-field.constants.ts:5
@@ -2254,4 +2255,3 @@ msgstr ""
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Dit teammedlem ansvarlig for at forvalte virksomhedens konto"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/de-DE.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Ihr Teammitglied, das für die Verwaltung des Unternehmenskontos verantwortlich ist"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/el-GR.po

@@ -2253,4 +2253,3 @@ msgstr "Χ"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Το μέλος της ομάδας σας υπεύθυνο για τη διαχείριση του λογαριασμού της εταιρείας"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/es-ES.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Miembro de su equipo responsable de gestionar la cuenta de la empresa"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/fi-FI.po

@@ -2253,4 +2253,3 @@ msgstr ""
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Tiimin jäsen vastuussa yritystilin hallinnasta"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/fr-FR.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Le membre de votre équipe responsable de la gestion du compte entreprise"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/he-IL.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "חבר הצוות שלך אחראי על ניהול חשבון החברה"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/hu-HU.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Az Ön csapatának megbízott tagja, aki a cégfiókot kezeli"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/it-IT.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Il membro del team responsabile della gestione dell'account aziendale"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/ja-JP.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "会社のアカウントを管理する責任のあるチームメンバー"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/ko-KR.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "회사 계정을 관리하는 팀원"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/nl-NL.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Uw teamlid verantwoordelijk voor het beheer van het bedrijfsaccount"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/no-NO.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Ditt teammedlem ansvarlig for å administrere bedriftskontoen"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/pl-PL.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Twój członek zespołu odpowiedzialny za zarządzanie kontem firmy"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/pt-BR.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Seu membro da equipe responsável por gerenciar a conta da empresa"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/pt-PT.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "O membro da sua equipa responsável pela gestão da conta da empresa"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/ro-RO.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Membrul echipei dumneavoastră responsabil de gestionarea contului companiei"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/ru-RU.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Ваш член команды, ответственный за управление корпоративным аккаунтом"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/sr-Cyrl.po

@@ -2253,4 +2253,3 @@ msgstr "Х"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Ваш тимски члан задужен за управљање налогом компаније"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/sv-SE.po

@@ -1481,7 +1481,8 @@ msgstr "F\"or\"aldrade f\"argschema"
 
 #: src/modules/workspace-member/standard-objects/workspace-member.workspace-entity.ts:108
 msgid "Preferred language"
-msgstr "F\"or\"aldrat spr\n"
+msgstr ""
+"F\"or\"aldrat spr\n"
 "k"
 
 #: src/modules/opportunity/standard-objects/opportunity.workspace-entity.ts:223
@@ -1585,7 +1586,8 @@ msgstr "Synkkurs"
 
 #: src/modules/calendar/common/standard-objects/calendar-channel.workspace-entity.ts:269
 msgid "Sync Cursor. Used for syncing events from the calendar provider"
-msgstr "Synkkurs. Anv\"ands f\"or att synkronisera h\"andelser fr\n"
+msgstr ""
+"Synkkurs. Anv\"ands f\"or att synkronisera h\"andelser fr\n"
 "n kalenderleverant\"oren"
 
 #: src/modules/messaging/common/standard-objects/message-channel.workspace-entity.ts:291
@@ -2255,4 +2257,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Ditt teammedlem ansvarig för att hantera företagskontot"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/tr-TR.po

@@ -2253,4 +2253,3 @@ msgstr ""
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Şirket hesabını yönetmekten sorumlu ekip üyeniz"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/uk-UA.po

@@ -2253,4 +2253,3 @@ msgstr "Х"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Ваш колега з команди, відповідальний за управління обліковим записом компанії"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/vi-VN.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "Thành viên trong nhóm của bạn phụ trách quản lý tài khoản công ty"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/zh-CN.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "负责管理公司账户的团队成员"
-

packages/twenty-server/src/engine/core-modules/i18n/locales/zh-TW.po

@@ -2253,4 +2253,3 @@ msgstr "X"
 #: src/modules/company/standard-objects/company.workspace-entity.ts:179
 msgid "Your team member responsible for managing the company account"
 msgstr "負責管理公司帳戶的團隊成員"
-