> ## Documentation Index
> Fetch the complete documentation index at: https://docs.upshiftcloud.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Éléments du menu de commande

> Exposez les composants frontaux comme actions rapides et entrées du menu de commande (Cmd+K) avec defineCommandMenuItem.

Un **élément de menu de commande** est le lien entre l’utilisateur et un [front component](https://docs.upshiftcloud.com/developers/extend/apps/layout/front-components.md). Il enregistre le composant dans le menu de commande (Cmd+K) de Upshift et, éventuellement, comme bouton d’action rapide épinglé dans le coin supérieur droit de la page.

```ts src/command-menu-items/open-dashboard.command-menu-item.ts theme={null}
import { defineCommandMenuItem } from 'twenty-sdk/define';

export default defineCommandMenuItem({
  universalIdentifier: 'a1b2c3d4-e5f6-7890-abcd-ef1234567890',
  label: 'Open Dashboard',
  shortLabel: 'Dashboard',
  isPinned: true,
  availabilityType: 'GLOBAL',
  frontComponentUniversalIdentifier: '74c526eb-cb68-4cf7-b05c-0dd8c288d948',
});
```

## Champs de configuration

| Champ | Obligatoire | Description |
| - | - | - |
| `universalIdentifier` | Oui | ID unique et stable pour la commande |
| `label` | Oui | Libellé complet affiché dans le menu de commande (Cmd+K) |
| `frontComponentUniversalIdentifier` | Oui | L'`universalIdentifier` du composant frontal que cette commande ouvre |
| `shortLabel` | Non | Libellé plus court affiché sur le bouton d'action rapide épinglé |
| `icon` | Non | **Obsolète** — ignoré au profit de l’icône de l’application ; la build émet un avertissement si elle est définie |
| `isPinned` | Non | Lorsque `true`, affiche la commande comme un bouton d'action rapide dans le coin supérieur droit de la page |
| `availabilityType` | Non | Contrôle l’emplacement d’apparition de la commande : `'GLOBAL'` (toujours disponible), `'GLOBAL_OBJECT_CONTEXT'` (uniquement sur les pages avec un contexte d’objet — pages d’index et d’enregistrement), `'RECORD_SELECTION'` (uniquement lorsque des enregistrements sont sélectionnés) ou `'FALLBACK'` (affichée lorsqu’aucune autre commande ne correspond) |
| `availabilityObjectUniversalIdentifier` | Non | Restreint la commande aux pages d’un type d’objet spécifique (p. ex., uniquement sur les enregistrements « Company ») |
| `conditionalAvailabilityExpression` | Non | Une expression booléenne qui contrôle dynamiquement la visibilité (voir ci-dessous) |

## Commandes sans interface

Un élément de menu de commande associé à un [headless front component](https://docs.upshiftcloud.com/developers/extend/apps/layout/front-components.md#headless-vs-non-headless) est la manière idiomatique de proposer une action en un clic — exécuter du code, naviguer, ou confirmer puis exécuter. La page Front Components couvre les [SDK Command components](https://docs.upshiftcloud.com/developers/extend/apps/layout/front-components.md) (`Command`, `CommandLink`, `CommandModal`, `CommandOpenSidePanelPage`) qui gèrent le modèle action-et-démontage.

Un flux typique : un composant headless affiche `<Command execute={...} />` (voir [l’exemple complet](https://docs.upshiftcloud.com/developers/extend/apps/layout/front-components.md)), et l’élément de menu de commande y pointe :

```ts src/command-menu-items/run-action.command-menu-item.ts theme={null}
import { defineCommandMenuItem } from 'twenty-sdk/define';

export default defineCommandMenuItem({
  universalIdentifier: 'f6a7b8c9-d0e1-2345-fabc-456789012345',
  label: 'Run my action',
  frontComponentUniversalIdentifier: 'e5f6a7b8-c9d0-1234-efab-345678901234',
});
```

## Expressions de disponibilité conditionnelle

Le champ `conditionalAvailabilityExpression` vous permet de contrôler quand une commande est visible en fonction du contexte de la page actuelle. Importez des variables typées et des opérateurs depuis `twenty-sdk` pour construire des expressions :

```ts src/command-menu-items/bulk-update.command-menu-item.ts theme={null}
import {
  defineCommandMenuItem,
  objectPermissions,
  everyEquals,
} from 'twenty-sdk/define';

export default defineCommandMenuItem({
  universalIdentifier: '...',
  label: 'Bulk Update',
  availabilityType: 'RECORD_SELECTION',
  frontComponentUniversalIdentifier: '...',
  conditionalAvailabilityExpression: everyEquals(
    objectPermissions,
    'canUpdateObjectRecords',
    true,
  ),
});
```

> [!NOTE]
>
> `RECORD_SELECTION` implique déjà une sélection non vide — utilisez `numberOfSelectedRecords` uniquement pour des décomptes spécifiques (par exemple `>= 2`).

### Variables de contexte

Elles représentent l’état actuel de la page :

| Variable | Type | Description |
| - | - | - |
| `pageType` | `string` | Type de page actuel (p. ex. `'RecordIndexPage'`, `'RecordShowPage'`) |
| `isInSidePanel` | `boolean` | Indique si le composant est rendu dans un panneau latéral |
| `numberOfSelectedRecords` | `number` | Nombre d'enregistrements actuellement sélectionnés |
| `isSelectAll` | `boolean` | Indique si "tout sélectionner" est actif |
| `selectedRecords` | `array` | Les objets d'enregistrement sélectionnés |
| `favoriteRecordIds` | `array` | IDs des enregistrements ajoutés aux favoris |
| `objectPermissions` | `object` | Autorisations pour le type d'objet actuel |
| `targetObjectReadPermissions` | `object` | Autorisations de lecture pour l'objet cible |
| `targetObjectWritePermissions` | `object` | Autorisations d'écriture pour l'objet cible |
| `featureFlags` | `object` | Drapeaux de fonctionnalité actifs |
| `objectMetadataItem` | `object` | Métadonnées du type d'objet actuel |
| `hasAnySoftDeleteFilterOnView` | `boolean` | Indique si la vue actuelle possède un filtre de suppression logique |

### Opérateurs

Combinez des variables en expressions booléennes :

| Opérateur | Description |
| - | - |
| `isDefined(value)` | `true` si la valeur n'est pas null/undefined |
| `isNonEmptyString(value)` | `true` si la valeur est une chaîne non vide |
| `includes(array, value)` | `true` si le tableau contient la valeur |
| `includesEvery(array, prop, value)` | `true` si la propriété de chaque élément inclut la valeur |
| `every(array, prop)` | `true` si la propriété est truthy sur chaque élément |
| `everyDefined(array, prop)` | `true` si la propriété est définie pour chaque élément |
| `everyEquals(array, prop, value)` | `true` si la propriété est égale à la valeur pour chaque élément |
| `some(array, prop)` | `true` si la propriété est truthy sur au moins un élément |
| `someDefined(array, prop)` | `true` si la propriété est définie sur au moins un élément |
| `someEquals(array, prop, value)` | `true` si la propriété est égale à la valeur sur au moins un élément |
| `someNonEmptyString(array, prop)` | `true` si la propriété est une chaîne non vide sur au moins un élément |
| `none(array, prop)` | `true` si la propriété est falsy sur chaque élément |
| `noneDefined(array, prop)` | `true` si la propriété est undefined sur chaque élément |
| `noneEquals(array, prop, value)` | `true` si la propriété n'est égale à la valeur sur aucun élément |


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.