Files
twenty/packages/twenty-server/test/integration/metadata/suites/command-menu-item/successful-command-menu-item-update.integration-spec.ts
T
Raphaël Bosi e8f8189167 [COMMAND MENU ITEMS] Add engine component key (#18554)
## PR Description

In the process of migrating all the existing commands to the backend, we
stumbled across a couple of problems that made us reconsider the full
migration. This PR introduces a way for command menu items to bypass
front components and to directly reference a frontend component from
twenty front.

It:
- Introduces a `engineFrontComponentKey` field on `CommandMenuItem` as
an alternative to `frontComponentId` and `workflowVersionId`, allowing
command menu items to reference frontend components by key directly
rather than requiring a FrontComponent entity
- Updates the DB constraint to allow exactly one of `workflowVersionId`,
`frontComponentId`, or `engineFrontComponentKey`

### All standard command menu items from the frontend which use
`standardFrontComponentKey`

These are all commands that execute a GraphQL query or a mutation.
Two mains concerned have been raised that made us go with this
(temporary) architecture instead:
- If those commands are part of the standard application, they can only
alter objects from that application and not custom objects.
- We would need to implement a way to trigger optimistic rendering from
the front components, which might take some time to implement.

List:
- Create new record
- Delete (single record)
- Delete records (multiple)
- Restore record
- Restore records (multiple)
- Permanently destroy record
- Permanently destroy records (multiple)
- Add to favorites
- Remove from favorites
- Merge records
- Duplicate Dashboard
- Save Dashboard
- Save Page Layout
- Activate Workflow
- Deactivate Workflow
- Discard Draft (workflow)
- Test Workflow
- Tidy up workflow
- Duplicate Workflow
- Stop (workflow run)
- Use as draft (workflow version)

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
2026-03-12 13:14:45 +01:00

172 lines
5.2 KiB
TypeScript

import { faker } from '@faker-js/faker';
import { createCommandMenuItem } from 'test/integration/metadata/suites/command-menu-item/utils/create-command-menu-item.util';
import { deleteCommandMenuItem } from 'test/integration/metadata/suites/command-menu-item/utils/delete-command-menu-item.util';
import { findManyObjectMetadata } from 'test/integration/metadata/suites/object-metadata/utils/find-many-object-metadata.util';
import { updateCommandMenuItem } from 'test/integration/metadata/suites/command-menu-item/utils/update-command-menu-item.util';
import { updateFeatureFlag } from 'test/integration/metadata/suites/utils/update-feature-flag.util';
import { jestExpectToBeDefined } from 'test/utils/jest-expect-to-be-defined.util.test';
import { FeatureFlagKey } from 'twenty-shared/types';
import { CommandMenuItemAvailabilityType } from 'src/engine/metadata-modules/command-menu-item/enums/command-menu-item-availability-type.enum';
describe('CommandMenuItem update should succeed', () => {
let createdCommandMenuItemId: string;
let companyObjectMetadataId: string;
let personObjectMetadataId: string;
beforeAll(async () => {
await updateFeatureFlag({
featureFlag: FeatureFlagKey.IS_COMMAND_MENU_ITEM_ENABLED,
value: true,
expectToFail: false,
});
const { objects } = await findManyObjectMetadata({
expectToFail: false,
input: {
filter: {},
paging: { first: 1000 },
},
gqlFields: `
id
nameSingular
`,
});
jestExpectToBeDefined(objects);
const companyObjectMetadata = objects.find(
(object: { nameSingular: string }) => object.nameSingular === 'company',
);
const personObjectMetadata = objects.find(
(object: { nameSingular: string }) => object.nameSingular === 'person',
);
jestExpectToBeDefined(companyObjectMetadata);
jestExpectToBeDefined(personObjectMetadata);
companyObjectMetadataId = companyObjectMetadata.id;
personObjectMetadataId = personObjectMetadata.id;
});
afterAll(async () => {
await updateFeatureFlag({
featureFlag: FeatureFlagKey.IS_COMMAND_MENU_ITEM_ENABLED,
value: false,
expectToFail: false,
});
});
beforeEach(async () => {
const workflowVersionId = faker.string.uuid();
const { data } = await createCommandMenuItem({
expectToFail: false,
input: {
workflowVersionId,
label: 'Original Label',
icon: 'IconOriginal',
isPinned: false,
availabilityType: CommandMenuItemAvailabilityType.GLOBAL,
},
});
createdCommandMenuItemId = data.createCommandMenuItem.id;
});
afterEach(async () => {
if (createdCommandMenuItemId) {
await deleteCommandMenuItem({
expectToFail: false,
input: { id: createdCommandMenuItemId },
});
createdCommandMenuItemId = undefined as unknown as string;
}
});
it('should update the label', async () => {
const { data } = await updateCommandMenuItem({
expectToFail: false,
input: {
id: createdCommandMenuItemId,
label: 'Updated Label',
},
});
expect(data.updateCommandMenuItem).toMatchObject({
id: createdCommandMenuItemId,
label: 'Updated Label',
});
});
it('should update the icon', async () => {
const { data } = await updateCommandMenuItem({
expectToFail: false,
input: {
id: createdCommandMenuItemId,
icon: 'IconUpdated',
},
});
expect(data.updateCommandMenuItem).toMatchObject({
id: createdCommandMenuItemId,
icon: 'IconUpdated',
});
});
it('should update isPinned', async () => {
const { data } = await updateCommandMenuItem({
expectToFail: false,
input: {
id: createdCommandMenuItemId,
isPinned: true,
},
});
expect(data.updateCommandMenuItem).toMatchObject({
id: createdCommandMenuItemId,
isPinned: true,
});
});
it('should update availabilityType and availabilityObjectMetadataId', async () => {
const { data } = await updateCommandMenuItem({
expectToFail: false,
input: {
id: createdCommandMenuItemId,
availabilityType: CommandMenuItemAvailabilityType.RECORD_SELECTION,
availabilityObjectMetadataId: companyObjectMetadataId,
},
});
expect(data.updateCommandMenuItem).toMatchObject({
id: createdCommandMenuItemId,
availabilityType: CommandMenuItemAvailabilityType.RECORD_SELECTION,
availabilityObjectMetadataId: companyObjectMetadataId,
});
});
it('should update multiple fields at once', async () => {
const { data } = await updateCommandMenuItem({
expectToFail: false,
input: {
id: createdCommandMenuItemId,
label: 'Fully Updated Label',
icon: 'IconNew',
isPinned: true,
availabilityType: CommandMenuItemAvailabilityType.RECORD_SELECTION,
availabilityObjectMetadataId: personObjectMetadataId,
},
});
expect(data.updateCommandMenuItem).toMatchObject({
id: createdCommandMenuItemId,
label: 'Fully Updated Label',
icon: 'IconNew',
isPinned: true,
availabilityType: CommandMenuItemAvailabilityType.RECORD_SELECTION,
availabilityObjectMetadataId: personObjectMetadataId,
});
});
});