Autosave

Extending on Payload's Draft functionality, you can configure your collections and globals to autosave changes as drafts, and publish only you're ready. The Admin UI will automatically adapt to autosaving progress at an interval that you define, and will store all autosaved changes as a new Draft version. Never lose your work - and publish changes to the live document only when you're ready.

Autosave Enabled If Autosave is enabled, drafts will be created automatically as the document is modified and the Admin UI adds an indicator describing when the document was last saved to the top right of the sidebar.

Options

Collections and Globals both support the same options for configuring autosave. You can either set versions.drafts.autosave to true, or pass an object to configure autosave properties.

Drafts Autosave OptionsDescription
intervalDefine an interval in milliseconds to automatically save progress while documents are edited. Document updates are "debounced" at this interval. Defaults to 800.

Example config with versions, drafts, and autosave enabled:

1
import { CollectionConfig } from 'payload/types'
2
3
export const Pages: CollectionConfig = {
4
slug: 'pages',
5
access: {
6
read: ({ req }) => {
7
// If there is a user logged in,
8
// let them retrieve all documents
9
if (req.user) return true
10
11
// If there is no user,
12
// restrict the documents that are returned
13
// to only those where `_status` is equal to `published`
14
return {
15
_status: {
16
equals: 'published',
17
},
18
}
19
},
20
},
21
versions: {
22
drafts: {
23
autosave: true,
24
25
// Alternatively, you can specify an `interval`:
26
// autosave: {
27
// interval: 1500,
28
// },
29
},
30
},
31
//.. the rest of the Pages config here
32
}

Autosave API

When autosave is enabled, all update operations within Payload expose a new argument called autosave. When set to true, Payload will treat the incoming draft update as an autosave. This is primarily used by the Admin UI, but there may be some cases where you are building an app for your users and wish to implement autosave in your own app. To do so, use the autosave argument in your update operations.

How autosaves are stored

If we created a new version for each autosave, you'd quickly find a ton of autosaves that clutter up your _versions collection within the database. That would be messy quick because autosave is typically set to save a document at ~800ms intervals.

Next

Uploads