Backup List
Snapshots, and whether any of them would actually restore. A backup nobody has restored is a hypothesis, so an untested one is drawn as a warning rather than as a success.
src/components/ui/backup-list.tsxAbout
From the component's own source, where it was written.
Snapshots, and whether any of them would actually restore.
**A backup nobody has restored is a hypothesis.** The column this component insists on is verified — an untested snapshot is drawn as a warning, not as a success, because the failure mode of backups is discovering at the worst possible moment that they have been silently empty for a month.
The age of the newest snapshot is stated in the header rather than left to be worked out from a list of timestamps, since "how much data would we lose" is the only question anyone brings to this screen.
Install
npx astralyx-ui add backup-list
Usage
import { BackupList } from '@/components/ui/backup-list'
<BackupList backups={backups} newestAge="6 hours ago" onRestore={restore} />Composer
Change the props and the source below follows.
Backups
newest 6 hours ago2 of 4 have never been test-restored.
- 7.8 GB4 Sep 03:00fullverified
- 393 MB3 Sep 03:00incrementalnever test-restored
- 380 MB2 Sep 03:00incrementalnever test-restored
- 1 Sep 03:00incrementalfailed
Ran out of disk on the backup host.
No props to configure.
<BackupList backups={backups} newestAge="6 hours ago" onRestore={restore} />Examples
One failed, two unverified
<BackupList backups={backups} onRestore={restore} />API
Generated from the source, so it cannot fall behind the code. One table per exported component, then hooks, functions and types.
BackupList
Snapshots, and whether any of them would actually restore.
Extends Omit<ComponentProps<'div'>, 'children'>.
| Prop | Type | Default | Description |
|---|---|---|---|
| backups | Backup[] | required | An empty list is rendered as a failure, not as an empty box. |
| onRestore | (backup: Backup) => void | — | — |
| newestAge | ReactNode | — | Stated in the header rather than left to be worked out from timestamps — “how much data would we lose” is the only question anyone brings here. |
| restoreLabel | string | 'Restore' | — |
| unverifiedLabel | string | 'never test-restored' | — |
| verifiedLabel | string | 'verified' | — |
| emptyLabel | string | 'No backups exist for this database.' | — |
| format | (bytes: number) => string | formatBytes | — |
| label | string | 'Backups' | — |
Types
Backup
| Field | Type | Description |
|---|---|---|
| id | string | — |
| createdAt | string | Already formatted — this component does not own your locale. |
| size? | number | Bytes. |
| kind? | 'full' | 'incremental' | 'snapshot' | — |
| verified? | boolean | A restore has actually been tested. Unverified is a warning, because the failure mode of backups is finding out at the worst moment that they have been empty for a month. |
| status? | 'complete' | 'running' | 'failed' | — |
| meta? | ReactNode | — |