> ## Documentation Index > Fetch the complete documentation index at: https://docs.twenty.com/llms.txt > Use this file to discover all available pages before exploring further. # Vues > Livrez des vues enregistrées préconfigurées — ordre des colonnes, filtres, groupes — pour les objets de votre application. Une **vue** est une configuration enregistrée pour la façon dont les enregistrements d’un objet sont affichés : quels champs apparaissent, leur ordre, s’ils sont visibles, ainsi que les filtres ou groupes appliqués. Utilisez `defineView()` pour livrer des vues préconfigurées avec votre application — généralement une vue d’index par défaut pour chaque objet personnalisé que vous créez. ```ts src/views/example-view.ts theme={null} import { defineView, ViewKey } from 'twenty-sdk/define'; import { EXAMPLE_OBJECT_UNIVERSAL_IDENTIFIER } from '../objects/example-object'; import { NAME_FIELD_UNIVERSAL_IDENTIFIER } from '../objects/example-object'; export default defineView({ universalIdentifier: 'a1b2c3d4-e5f6-7890-abcd-ef1234567890', name: 'All example items', objectUniversalIdentifier: EXAMPLE_OBJECT_UNIVERSAL_IDENTIFIER, icon: 'IconList', key: ViewKey.INDEX, position: 0, fields: [ { universalIdentifier: 'f926bdb7-6af7-4683-9a09-adbca56c29f0', fieldMetadataUniversalIdentifier: NAME_FIELD_UNIVERSAL_IDENTIFIER, position: 0, isVisible: true, size: 200, }, ], }); ``` ## Points clés * `objectUniversalIdentifier` spécifie à quel objet cette vue s'applique. Il peut s’agir d’un objet personnalisé que vous avez défini ou d’un objet Twenty standard. * `key: ViewKey.INDEX` marque la vue comme la vue de liste principale de l’objet (celle qu’un élément de navigation `OBJECT` ouvre). * `fields` contrôle les colonnes affichées et leur ordre. Chaque champ référence un `fieldMetadataUniversalIdentifier`. Pour faire référence à un champ système créé automatiquement tel que `createdAt`, voir [Ciblage des champs système](/l/fr/developers/extend/apps/data/system-fields). * Vous pouvez également définir `filters`, `filterGroups`, `sorts`, `groups` et `fieldGroups` pour des configurations plus avancées. * `position` contrôle l’ordre lorsqu’il existe plusieurs vues pour le même objet. ## Propriétés optionnelles | Propriété | Valeurs | Description | | ----------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `type` | `ViewType.TABLE` (par défaut), `ViewType.KANBAN`, `ViewType.CALENDAR` | Comment les enregistrements sont disposés. (`FIELDS_WIDGET`, `TABLE_WIDGET`, `KANBAN_WIDGET` et `CALENDAR_WIDGET` existent également mais sont utilisés en interne par les widgets de mise en page.) | | `visibility` | `ViewVisibility.WORKSPACE` (par défaut), `ViewVisibility.UNLISTED` | Indique si la vue est affichée pour l’ensemble de l’espace de travail ou masquée des sélecteurs. | | `openRecordIn` | `ViewOpenRecordIn.SIDE_PANEL` (par défaut), `ViewOpenRecordIn.RECORD_PAGE` | Définit où s’ouvre un enregistrement lors d’un clic. | | `tris` | `{ fieldMetadataUniversalIdentifier, direction: ViewSortDirection.ASC \| DESC }[]` | Ordre de tri par défaut. | | `isCompact` | `boolean` | Affichage compact des lignes. | | `mainGroupByFieldMetadataUniversalIdentifier` + `shouldHideEmptyGroups` | — | Regrouper les enregistrements (par exemple, les colonnes kanban) par un champ. | | `kanbanAggregateOperation`, `kanbanAggregateOperationFieldMetadataUniversalIdentifier`, `kanbanColumnWidth` | `AggregateOperations.*` | Agrégats et dimensionnement des colonnes Kanban. | | `calendarLayout`, `calendarFieldMetadataUniversalIdentifier`, `calendarEndFieldMetadataUniversalIdentifier` | `ViewCalendarLayout.DAY` / `WEEK` / `MONTH` | Vues de calendrier : disposition, champ de date qui positionne les enregistrements et champ de date de fin facultatif. | Tous les enums ci-dessus sont exportés depuis `twenty-sdk/define`. ## Filtres Une vue peut être livrée avec des filtres préappliqués. Chaque filtre possède trois coordonnées : le **champ** faisant l’objet du filtrage, l’**opérateur** (comment comparer) et la **valeur** (par rapport à quoi comparer). Les trois doivent être alignées : l’utilisation d’un opérateur qui ne s’applique pas à un type de champ sera rejetée au moment de la synchronisation. ```ts theme={null} import { ViewFilterOperand } from 'twenty-sdk/define'; filters: [ { universalIdentifier: '...', fieldMetadataUniversalIdentifier: STATUS_FIELD_UNIVERSAL_IDENTIFIER, operand: ViewFilterOperand.IS, value: ['ACTIVE'], }, ], ``` ### Opérateurs pris en charge par type de champ | Type de champ | Opérandes pris en charge | | -------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------ | | `TEXT`, `EMAILS`, `FULL_NAME`, `ADDRESS`, `LINKS`, `PHONES`, `RAW_JSON`, `FILES`, `ACTOR`, `ARRAY` | `CONTAINS`, `DOES_NOT_CONTAIN`, `IS_EMPTY`, `IS_NOT_EMPTY` | | `ACTOR.source`, `ACTOR.workspaceMemberId` | `IS`, `IS_NOT`, `IS_EMPTY`, `IS_NOT_EMPTY` | | `SELECT` | `IS`, `IS_NOT`, `IS_EMPTY`, `IS_NOT_EMPTY` | | `MULTI_SELECT` | `CONTAINS`, `DOES_NOT_CONTAIN`, `IS_EMPTY`, `IS_NOT_EMPTY` | | `RELATION` | `IS`, `IS_NOT`, `IS_EMPTY`, `IS_NOT_EMPTY` | | `NUMBER` | `IS`, `IS_NOT`, `GREATER_THAN_OR_EQUAL`, `LESS_THAN_OR_EQUAL`, `IS_EMPTY`, `IS_NOT_EMPTY` | | `RATING` | `IS`, `GREATER_THAN_OR_EQUAL`, `LESS_THAN_OR_EQUAL`, `IS_EMPTY`, `IS_NOT_EMPTY` | | `CURRENCY`, `CURRENCY.amountMicros` | `GREATER_THAN_OR_EQUAL`, `LESS_THAN_OR_EQUAL`, `IS`, `IS_NOT`, `IS_EMPTY`, `IS_NOT_EMPTY` | | `CURRENCY.currencyCode` | `IS`, `IS_NOT`, `IS_EMPTY`, `IS_NOT_EMPTY` | | `DATE`, `DATE_TIME` | `IS`, `IS_RELATIVE`, `IS_IN_PAST`, `IS_IN_FUTURE`, `IS_TODAY`, `IS_BEFORE`, `IS_AFTER`, `IS_EMPTY`, `IS_NOT_EMPTY` | | `BOOLEAN` | `IS` | | `UUID` | `IS`, `IS_NOT`, `IS_EMPTY`, `IS_NOT_EMPTY` | | `TS_VECTOR` | `VECTOR_SEARCH` | > Les types de champs avec des noms similaires peuvent utiliser des opérandes complètement différents — `SELECT` et `MULTI_SELECT` étant un cas courant. ### Forme de valeur par opérande Le champ `value` est toujours une valeur sérialisable en JSON, mais sa forme attendue dépend de l’opérande : | Famille d’opérandes | Forme de la valeur | Exemple | | ----------------------------------------------------------- | ------------------------------------ | ------------------------ | | `IS`, `IS_NOT` sur `SELECT` | tableau de clés d’option (chaînes) | `['ACTIVE', 'PENDING']` | | `CONTAINS`, `DOES_NOT_CONTAIN` sur `MULTI_SELECT` | tableau de clés d’option (chaînes) | `['TAG_A']` | | `IS`, `IS_NOT` sur `RELATION` | tableau d’ID d’enregistrement (UUID) | `['c5a1...']` | | `CONTAINS`, `DOES_NOT_CONTAIN` sur les champs de type texte | chaîne | `'acme'` | | `IS`, `IS_NOT` sur `NUMBER` | chaîne (la valeur) | `'5'` | | `IS` sur `RATING` / `UUID` | chaîne (la valeur) | `'5'` | | `GREATER_THAN_OR_EQUAL`, `LESS_THAN_OR_EQUAL` | chaîne (la borne) | `'10'` | | `IS`, `IS_BEFORE`, `IS_AFTER` sur `DATE` / `DATE_TIME` | chaîne ISO 8601 | `'2025-01-01T00:00:00Z'` | | `IS_EMPTY`, `IS_NOT_EMPTY` | chaîne vide | `''` | | `IS` sur `BOOLEAN` | `'true'` ou `'false'` | `'true'` | ## Comment les vues apparaissent dans l’interface utilisateur Une vue seule n’est pas accessible à partir de la barre latérale. Pour la faire apparaître là, associez-la à un [élément de menu de navigation](/l/fr/developers/extend/apps/layout/navigation-menu-items) de type `VIEW` qui pointe vers le `universalIdentifier` de la vue. C’est le modèle canonique : chaque objet personnalisé livre généralement une vue par défaut + une entrée de barre latérale qui l’ouvre.