diff --git a/docs/admin/overview.mdx b/docs/admin/overview.mdx index c67a3b7027..c042974b00 100644 --- a/docs/admin/overview.mdx +++ b/docs/admin/overview.mdx @@ -25,7 +25,7 @@ _Screenshot of the Admin panel while editing a document from an example `AllFiel All options for the Admin panel are defined in your base Payload config file. | Option | Description | -| --------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | +|-----------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| | `user` | The `slug` of a Collection that you want be used to log in to the Admin dashboard. [More](/docs/admin/overview#the-admin-user-collection) | | `buildPath` | Specify an absolute path for where to store the built Admin panel bundle used in production. Defaults to `path.resolve(process.cwd(), 'build')`. | | `meta` | Base meta data to use for the Admin panel. Included properties are `titleSuffix`, `ogImage`, and `favicon`. | @@ -35,6 +35,7 @@ All options for the Admin panel are defined in your base Payload config file. | `scss` | Absolute path to a Sass variables / mixins stylesheet meant to override Payload styles to make for an easy re-skinning of the Admin panel. [More](/docs/admin/customizing-css#overriding-scss-variables). | | `dateFormat` | Global date format that will be used for all dates in the Admin panel. Any valid [date-fns](https://date-fns.org/) format pattern can be used. | | `avatar` | Set account profile picture. Options: `gravatar`, `default` or a custom React component. | +| `autoLogin` | Used to automate admin log-in for dev and demonstration convenience. [More](/docs/authentication/config). | | `components` | Component overrides that affect the entirety of the Admin panel. [More](/docs/admin/components) | | `webpack` | Customize the Webpack config that's used to generate the Admin panel. [More](/docs/admin/webpack) | | **`logoutRoute`** | The route for the `logout` page. | diff --git a/docs/authentication/config.mdx b/docs/authentication/config.mdx index 585dde866e..92b6d0a315 100644 --- a/docs/authentication/config.mdx +++ b/docs/authentication/config.mdx @@ -249,3 +249,39 @@ If you pass a strategy to the `strategy` property directly, the `name` property However, if you pass a function to `strategy`, `name` is a required property. In either case, Payload will prefix the strategy name with the collection `slug` that the strategy is passed to. + + +### Admin autologin + +For testing and demo purposes you may want to skip forcing the admin user to login in order to access the panel. +The `admin.autologin` property is used to configure the how visitors are handled when accessing the admin panel. +The default is that all users will have to login and this should not be enabled for environments where data needs to protected. + +#### autoLogin Options + +| Option | Description | +| -------------------------- |---------------------------------------------------------------------------------------------------------------------------------------------------------------| +| **`email`** | The email address of the user to login as | +| **`password`** | The password of the user to login as | +| **`prefillOnly`** | If set to true, the login credentials will be prefilled but the user will still need to click the login button. | + +The recommended way to use this feature is behind an environment variable to ensure it is disabled when in production. + +**Example:** + +```ts + +export default buildConfig({ + admin: { + user: 'users', + // highlight-start + autoLogin: process.env.PAYLOAD_PUBLIC_ENABLE_AUTOLOGIN === 'true' ? { + email: 'test@example.com', + password: 'test', + prefillOnly: true, + } : false, + // highlight-end + }, + collections: [ /** */], +}) +``` diff --git a/src/admin/components/utilities/Auth/index.tsx b/src/admin/components/utilities/Auth/index.tsx index 8c7663dc02..f225734a4a 100644 --- a/src/admin/components/utilities/Auth/index.tsx +++ b/src/admin/components/utilities/Auth/index.tsx @@ -144,7 +144,7 @@ export const AuthProvider: React.FC<{ children: React.ReactNode }> = ({ children setUser(json.user); } else if (json?.token) { setToken(json.token); - } else if (autoLogin) { + } else if (autoLogin && autoLogin.prefillOnly !== true) { // auto log-in with the provided autoLogin credentials. This is used in dev mode // so you don't have to log in over and over again const autoLoginResult = await requests.post(`${serverURL}${api}/${userSlug}/login`, { diff --git a/src/admin/components/views/Login/index.tsx b/src/admin/components/views/Login/index.tsx index 02bb399e37..346977a11b 100644 --- a/src/admin/components/views/Login/index.tsx +++ b/src/admin/components/views/Login/index.tsx @@ -26,6 +26,7 @@ const Login: React.FC = () => { admin: { user: userSlug, logoutRoute, + autoLogin, components: { beforeLogin, afterLogin, @@ -103,6 +104,10 @@ const Login: React.FC = () => { onSuccess={onSuccess} method="post" action={`${serverURL}${api}/${userSlug}/login`} + initialData={{ + email: autoLogin && autoLogin.prefillOnly ? autoLogin.email : undefined, + password: autoLogin && autoLogin.prefillOnly ? autoLogin.password : undefined, + }} >