Přejít na hlavní obsah
Vrstva rozvržení aplikace Twenty zahrnuje vše, co uživatel vidí: kde se aplikace zobrazuje v postranním panelu, jaká seznamová zobrazení obsahuje, jak jsou uspořádány její stránky s podrobnostmi záznamů a které vlastní komponenty Reactu se na těchto stránkách vykreslují.
   Sidebar               Record list            Record detail page
   ───────               ───────────            ──────────────────
   [📋 My View]    ────▶ ┌──────────┐          ┌─────────────────────┐
   [📋 Drafts ]          │ Companies│          │ Tabs: [Overview ]   │
   [📋 Inbox  ]          │ ──────── │          │       [Notes    ]   │
        ▲                │  Apple   │          │       [Hello    ]◀──── definePageLayoutTab
        │                │  Acme    │          │                     │   adds a tab...
        └ defineNavi-    │  …       │          │  ┌────────────────┐ │
          gationMenu-    └────▲─────┘          │  │                │ │
          Item points         │                │  │   React UI     │◀── …with a
          to a defineView     │                │  │  (sandboxed in │ │   defineFrontComponent
                              └ defineView     │  │   a Worker)    │ │   widget inside
                                picks columns  │  └────────────────┘ │
                                and filters    └─────────────────────┘

V této části

Zobrazení

defineView — uložené konfigurace seznamu: viditelné sloupce, filtry, skupiny.

Položky navigační nabídky

defineNavigationMenuItem — položky v postranním panelu odkazující na zobrazení nebo externí adresy URL.

Rozvržení stránek

definePageLayout a definePageLayoutTab — karty a widgety na stránce s podrobnostmi záznamu.

Frontendové komponenty

defineFrontComponent — sandboxované komponenty Reactu, které se vykreslují uvnitř Twenty.

Položky příkazové nabídky

defineCommandMenuItem — zaregistruje frontendové komponenty jako položky Cmd+K a rychlé akce.

Kde se aplikace zobrazuje

UmístěníCo řídíEntita
Postranní panelVlastní položka odkazující na uložené zobrazení nebo externí adresu URLdefineNavigationMenuItem
Seznam záznamůUložené nastavení pro objekt — viditelné sloupce, pořadí, filtry, skupinydefineView
Stránka s podrobnostmi záznamuKarty a widgety na stránce záznamu (vašeho vlastního objektu nebo standardního)definePageLayout, definePageLayoutTab
Uvnitř kteréhokoli z výše uvedenýchVlastní widget Reactu — tlačítka, formuláře, přehledové panely, integracedefineFrontComponent
Příkazová nabídka (Cmd+K)Připnutá rychlá akce nebo skrytý příkazdefineCommandMenuItem
Frontendové komponenty běží uvnitř izolovaného Web Workeru pomocí Remote DOM — vykreslují se na stránce nativně (ne uvnitř iframe), ale nemají přímý přístup k hostitelské stránce ani DOM. Komunikace s Twenty probíhá prostřednictvím hostitelského API pro předávání zpráv.