vendure/docs/docs/reference/dashboard/extensions-api/define-dashboard-extension.md

---

title: "DefineDashboardExtension" isDefaultIndex: false

generated: true

import MemberInfo from '@site/src/components/MemberInfo'; import GenerationInfo from '@site/src/components/GenerationInfo'; import MemberDescription from '@site/src/components/MemberDescription';

defineDashboardExtension

The main entry point for extensions to the React-based dashboard. Every dashboard extension must contain a call to this function, usually in the entry point file that is referenced by the dashboard property of the plugin decorator.

Every type of customisation of the dashboard can be defined here, including:

• Navigation (nav sections and routes)
• Layout (action bar items and page blocks)
• Widgets
• Form components (custom form components, input components, and display components)
• Data tables
• Detail forms
• Login
• Custom history entries

Example

defineDashboardExtension({
 navSections: [],
 routes: [],
 pageBlocks: [],
 actionBarItems: [],
});

function defineDashboardExtension(extension: DashboardExtension): void

Parameters

extension

DashboardExtension`} />

DashboardExtension

This is the main interface for defining all extensions to the dashboard.

Every type of customisation of the dashboard can be defined here, including:

• Navigation (nav sections and routes)
• Layout (action bar items and page blocks)
• Widgets for the Insights page
• Form components
• Data tables
• Detail forms

• Login page customisation

  interface DashboardExtension {
  routes?: DashboardRouteDefinition[];
  navSections?: DashboardNavSectionDefinition[];
  pageBlocks?: DashboardPageBlockDefinition[];
  actionBarItems?: DashboardActionBarItem[];
  alerts?: DashboardAlertDefinition[];
  widgets?: DashboardWidgetDefinition[];
  customFormComponents?: DashboardCustomFormComponents;
  dataTables?: DashboardDataTableExtensionDefinition[];
  detailForms?: DashboardDetailFormExtensionDefinition[];
  login?: DashboardLoginExtensions;
  historyEntries?: DashboardHistoryEntryComponent[];
  }
  

### routes DashboardRouteDefinition[]`} /> Allows you to define custom routes such as list or detail views. ### navSections DashboardNavSectionDefinition[]`} /> Allows you to define custom nav sections for the dashboard. ### pageBlocks DashboardPageBlockDefinition[]`} /> Allows you to define custom page blocks for any page in the dashboard. ### actionBarItems DashboardActionBarItem[]`} /> Allows you to define custom action bar items for any page in the dashboard. ### alerts DashboardAlertDefinition[]`} /> Allows you to define custom alerts that can be displayed in the dashboard. ### widgets DashboardWidgetDefinition[]`} /> Allows you to define custom routes for the dashboard, which will render the given components and optionally also add a nav menu item. ### customFormComponents DashboardCustomFormComponents`} /> Unified registration for custom form custom field components. ### dataTables DashboardDataTableExtensionDefinition[]`} /> Allows you to customize aspects of existing data tables in the dashboard. ### detailForms DashboardDetailFormExtensionDefinition[]`} /> Allows you to customize the detail form for any page in the dashboard. ### login DashboardLoginExtensions`} /> Allows you to customize the login page with custom components. ### historyEntries DashboardHistoryEntryComponent[]`} /> Allows a custom component to be used to render a history entry item in the Order or Customer history lists.