الانتقال إلى المحتوى الرئيسي
تمثّل طبقة التخطيط في تطبيق Twenty كل ما يراه المستخدم: مكان ظهور التطبيق في الشريط الجانبي، العروض القائِمية التي يوفّرها، كيفية ترتيب صفحات تفاصيل السجل، وأي مكوّنات React مخصّصة يتم عرضها داخل تلك الصفحات.
   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    └─────────────────────┘

في هذا القسم

العروض

defineView — تكوينات قوائم محفوظة: الأعمدة الظاهرة، وعوامل التصفية، والمجموعات.

عناصر قائمة التنقّل

defineNavigationMenuItem — إدخالات في الشريط الجانبي تشير إلى العروض أو عناوين URL الخارجية.

تخطيطات الصفحات

definePageLayout وdefinePageLayoutTab — علامات التبويب والويدجتات في صفحة تفاصيل السجل.

المكوّنات الأمامية

defineFrontComponent — مكوّنات React معزولة (sandboxed) يتم عرضها داخل Twenty.

عناصر قائمة الأوامر

defineCommandMenuItem — تسجيل مكوّنات الواجهة الأمامية كإدخالات Cmd+K وإجراءات سريعة.

أين يظهر التطبيق

موضع الظهورما الذي يتحكّم فيهكيان
الشريط الجانبيإدخال مخصّص يربط بعرض محفوظ أو عنوان URL خارجيdefineNavigationMenuItem
قائمة السجلاتتكوين محفوظ لكائن — الأعمدة الظاهرة، والترتيب، وعوامل التصفية، والمجموعاتdefineView
صفحة تفاصيل السجلعلامات التبويب والويدجتات في صفحة السجل (لكائنك الخاص أو لكائن قياسي)definePageLayout, definePageLayoutTab
داخل أي مما سبقويدجت React مخصّص — أزرار، نماذج، لوحات بيانات، تكاملاتdefineFrontComponent
قائمة الأوامر (Cmd+K)إجراء سريع مُثبّت أو أمر مخفيdefineCommandMenuItem
تعمل مكوّنات الواجهة الأمامية داخل Web Worker معزول باستخدام Remote DOM — يتم عرضها بشكل أصيل داخل الصفحة (وليس داخل iframe)، لكنها لا تستطيع الوصول مباشرةً إلى صفحة المضيف أو إلى DOM. يحدث التواصل مع Twenty من خلال واجهة API للمضيف تعتمد تمرير الرسائل.