History Entries

The Customer and Order detail pages have a special history timeline, which show a summary of all significant changes and activity relating to that customer or order.

History entries are defined by DashboardHistoryEntryComponent, and the component should be wrapped in HistoryEntry.

Example

Following the backend example of a custom history entry given in the HistoryService docs, we can define a corresponding component to render this entry in the customer history timeline:

Tsx

import { defineDashboardExtension, HistoryEntry } from '@vendure/dashboard';import { IdCard } from 'lucide-react';defineDashboardExtension({    historyEntries: [        {            type: 'CUSTOMER_TAX_ID_VERIFICATION',            component: ({ entry, entity }) => {                return (                    <HistoryEntry                        entry={entry}                        title={'Tax ID verified'}                        timelineIconClassName={'bg-success text-success-foreground'}                        timelineIcon={<IdCard />}                    >                        <div className="text-xs">Approval reference: {entry.data.ref}</div>                    </HistoryEntry>                );            },        },    ],});

This will then appear in the customer history timeline: