feat: option to pre-fill login credentials automatically (#3021)

Co-authored-by: Dan Ribbens <dan.ribbens@gmail.com>

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`, {

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,
+              }}
             >
               <FormLoadingOverlayToggle
                 action="loading"

src/config/schema.ts

@@ -71,6 +71,7 @@ export default joi.object({
         joi.object().keys({
           email: joi.string(),
           password: joi.string(),
+          prefillOnly: joi.boolean(),
         }),
         joi.boolean(),
       ),

src/config/types.ts

@@ -10,11 +10,7 @@ import React from 'react';
 import { DestinationStream, LoggerOptions } from 'pino';
 import type { InitOptions as i18nInitOptions } from 'i18next';
 import { Payload } from '../payload';
-import {
-  AfterErrorHook,
-  CollectionConfig,
-  SanitizedCollectionConfig,
-} from '../collections/config/types';
+import { AfterErrorHook, CollectionConfig, SanitizedCollectionConfig } from '../collections/config/types';
 import { GlobalConfig, SanitizedGlobalConfig } from '../globals/config/types';
 import { PayloadRequest } from '../express/types';
 import { Where } from '../types';
@@ -289,10 +285,19 @@ export type Config = {
     inactivityRoute?: string;
     /** Automatically log in as a user when visiting the admin dashboard. */
     autoLogin?: false | {
-      /** The email address of the user to login as */
+      /**
+       * The email address of the user to login as
+       *
+       */
       email: string;
       /** The password of the user to login as */
       password: string;
+      /**
+       * If set to true, the login credentials will be prefilled but the user will still need to click the login button.
+       *
+       * @default false
+      */
+      prefillOnly?: boolean;
     }
     /**
      * Add extra and/or replace built-in components with custom components