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"
/>
This commit is contained in:
Raphaël Bosi
2025-02-18 09:52:25 +01:00
committed by GitHub
parent 905cfedaf0
commit 270744eca6
34 changed files with 96 additions and 69 deletions

View File

@ -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,
});
};
};

View File

@ -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, {
title: activityObjectNameSingular,
Icon: IconList,
});
if (!isCommandMenuV2Enabled) {
openRightDrawer(RightDrawerPages.ViewRecord, {
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 });
}

View File

@ -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(
objectMetadataItem,
records,
totalCount,
);
const recordSelectionContextChip = totalCount
? {
text: getSelectedRecordsContextText(
objectMetadataItem,
records,
totalCount,
),
Icons: Avatars,
}
: undefined;
const contextChipsWithRecordSelection = [
recordSelectionContextChip,
...contextChips,
].filter(isDefined);
return (
<CommandMenuContextChipGroups
contextChips={[
{
text: selectedRecordsContextText,
Icons: Avatars,
},
...contextChips,
]}
contextChips={contextChipsWithRecordSelection}
/>
);
};

View File

@ -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 { IconDotsVertical, IconList, IconSearch } from 'twenty-ui';
import { capitalize, isDefined } from 'twenty-shared';
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 }) => {
return (recordId: string, objectNameSingular: string) => {
({ set, snapshot }) => {
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,
pageIcon: IconList,
pageTitle: isNewRecord
? t`New ${capitalizedObjectNameSingular}`
: capitalizedObjectNameSingular,
pageIcon: Icon,
});
};
},
[navigateCommandMenu],
[getIcon, navigateCommandMenu],
);
const openRecordsSearchPage = () => {

View File

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

View File

@ -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"

View File

@ -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 "العضو في فريقك المسئول عن إدارة حساب الشركة"

View File

@ -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"

View File

@ -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"

View File

@ -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"

View File

@ -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"

View File

@ -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 "Το μέλος της ομάδας σας υπεύθυνο για τη διαχείριση του λογαριασμού της εταιρείας"

View File

@ -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"

View File

@ -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"

View File

@ -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"

View File

@ -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 "חבר הצוות שלך אחראי על ניהול חשבון החברה"

View File

@ -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"

View File

@ -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"

View File

@ -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 "会社のアカウントを管理する責任のあるチームメンバー"

View File

@ -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 "회사 계정을 관리하는 팀원"

View File

@ -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"

View File

@ -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"

View File

@ -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"

View File

@ -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"

View File

@ -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"

View File

@ -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"

View File

@ -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 "Ваш член команды, ответственный за управление корпоративным аккаунтом"

View File

@ -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 "Ваш тимски члан задужен за управљање налогом компаније"

View File

@ -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"

View File

@ -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"

View File

@ -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 "Ваш колега з команди, відповідальний за управління обліковим записом компанії"

View File

@ -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"

View File

@ -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 "负责管理公司账户的团队成员"

View File

@ -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 "負責管理公司帳戶的團隊成員"