---
title: Version History
description: A version timeline for one key with one-click restore - driven by useFiles and the versioning plugin; restore snapshots the current bytes first.
related:
  - /guides/restore-deleted-files-s3-r2
---

Lists the saved snapshots of a key's earlier contents (newest first) and restores any of them. The current file isn't a snapshot, so it isn't listed — the top row is the previous version. Backed by the [`versioning()`](/docs/plugins/versioning) plugin, so it needs a gateway whose `Files` instance is wrapped with it and whose `authorize` allow-lists the `versions` and `restoreVersion` operations.

<Component path="version-history/examples/version-history-basic" />

## Installation

<ComponentInstall name="version-history" />

## Usage

```tsx lineNumbers
import { useFiles } from "files-sdk/react";

import { VersionHistory } from "@/components/files-sdk/version-history";

export function History({ fileKey }: { fileKey: string }) {
  const files = useFiles({ endpoint: "/api/files" });

  return <VersionHistory files={files} fileKey={fileKey} />;
}
```

Restoring snapshots the current bytes first, so it's itself reversible — an "undo" you can undo. The gateway must expose the plugin verbs:

```ts
createFilesRouter({
  files: createFiles({ adapter, plugins: [versioning()] }),
  operations: ["versions", "restoreVersion"],
});
```

## Props

<AutoTypeTable
  path="registry/files-sdk/version-history/version-history.tsx"
  name="VersionHistoryProps"
/>