Skip to content

Admin App Functionality

App Features

Multi-Page

For each resource: - Create a List page showing 7 user-friendly columns - Add pagination, sorting, and filtering - Link each row to a Display (Show) page

Multi-Resource

Each Display Page should: - Show all fields in a multi-column layout - Include a tab sheet (<TabbedShowLayout>) for each related resource using <ReferenceManyField> - Link child rows to their own display page

Example:
- Customer Display has tab for OrderList
- Each Order in the tab links to Order Display

Automatic Joins

For foreign keys: - Display joined value (e.g., product.name instead of product_id) - Use first string field from parent table containing name, title, or description

Primary key fields: - Display at the end of forms/lists

Lookups (Foreign Keys)

For foreign key fields: - Provide auto-complete dropdown (<ReferenceInput>) - For numeric foreign keys, use the joined string field as lookup text


Per-Resource Files (Required)

For each resource (Customer, Order, Product, Item): - Create a source file under src/, e.g., Customer.js - Each file must fully implement: - CustomerList - CustomerShow - CustomerCreate - CustomerEdit

Use: - <ReferenceField> for foreign key displays - <ReferenceInput> for foreign key input - <ReferenceManyField> for tabbed child lists - <TabbedShowLayout> for display pages

Do not leave any file empty.


App Wiring

In App.js: - Import each resource file - Register them in <Admin> using:

<Resource name="Customer" list={CustomerList} show={CustomerShow} edit={CustomerEdit} create={CustomerCreate} />