All pages in the Dashboard follow this structure:
Following this structure ensures that:
Note that the ListPage and DetailPage
components internally use this same structure, so when using those top-level components you don't need to wrap them
in Page etc.
The PageLayout arranges its PageBlock children into columns based on each block's column prop:
main: the wider main content areaside: the narrower sidebarfull: spans the full width of the layout, above the main/side columnsFull-width blocks are always rendered above the main/side columns, regardless of their
order among the PageLayout children. This makes column="full" well-suited to wide content such
as data tables on list pages.
A PageBlock wraps its content in a bordered card. If you want a full-width block with no card
chrome — for example, a block that supplies its own container such as a DataTable — use the
FullWidthPageBlock component instead:
Once you have defined a page component, you'll need to make it accessible to users with:
Both of these are handled using the DashboardRouteDefinition API:
For a complete guide to the navigation options available, see the Navigation guide