DetailPage

Auto-generates a detail page with a form based on the provided query and mutation documents.

For more control over the layout, you would use the more low-level Page component.

Signature

function DetailPage<T extends TypedDocumentNode<any, any>, C extends TypedDocumentNode<any, any>, U extends TypedDocumentNode<any, any>>(props: DetailPageProps<T, C, U>): void

Parameters

props

parameterDetailPageProps<T, C, U>

@vendure/dashboard Sourcev3.3.0

Props to configure the DetailPage component.

Signature

interface DetailPageProps<T extends TypedDocumentNode<any, any>, C extends TypedDocumentNode<any, any>, U extends TypedDocumentNode<any, any>, EntityField extends keyof ResultOf<T> = DetailEntityPath<T>> {    entityName?: string;    pageId: string;    route: AnyRoute;    title: (entity: ResultOf<T>[EntityField]) => string;    queryDocument: T;    createDocument?: C;    updateDocument: U;    setValuesForUpdate: (entity: ResultOf<T>[EntityField]) => VariablesOf<U>['input'];}

entityName

propertystring

The name of the entity. If not provided, it will be inferred from the query document.

pageId

propertystring

A unique identifier for the page.

route

propertyAnyRoute

The Tanstack Router route used to navigate to this page.

title

property(entity: ResultOf<T>[EntityField]) => string

The title of the page.

queryDocument

propertyT

The query document used to fetch the entity.

createDocument

propertyC

The mutation document used to create the entity.

updateDocument

propertyU

The mutation document used to update the entity.

setValuesForUpdate

property(entity: ResultOf<T>[EntityField]) => VariablesOf<U>['input']

A function that sets the values for the update input type based on the entity.