Revert "fix: issues creating the first user (#5986)"

This reverts commit 0ede95f.

packages/next/src/views/CreateFirstUser/index.client.tsx

@@ -6,16 +6,16 @@ import { useComponentMap } from '@payloadcms/ui/providers/ComponentMap'
 import React from 'react'
 
 export const CreateFirstUserFields: React.FC<{
-  baseAuthFieldMap: FieldMap
+  createFirstUserFieldMap: FieldMap
   userSlug: string
-}> = ({ baseAuthFieldMap, userSlug }) => {
+}> = ({ createFirstUserFieldMap, userSlug }) => {
   const { getFieldMap } = useComponentMap()
 
   const fieldMap = getFieldMap({ collectionSlug: userSlug })
 
   return (
     <RenderFields
-      fieldMap={[...(baseAuthFieldMap || []), ...(fieldMap || [])]}
+      fieldMap={[...(createFirstUserFieldMap || []), ...(fieldMap || [])]}
       operation="create"
       path=""
       readOnly={false}

packages/next/src/views/CreateFirstUser/index.tsx

@@ -31,7 +31,7 @@ export const CreateFirstUserView: React.FC<AdminViewProps> = async ({ initPageRe
     },
   } = initPageResult
 
-  const baseAuthFields: Field[] = [
+  const fields: Field[] = [
     {
       name: 'email',
       type: 'email',
@@ -52,29 +52,16 @@ export const CreateFirstUserView: React.FC<AdminViewProps> = async ({ initPageRe
     },
   ]
 
-  const ssrAuthFields = [...baseAuthFields]
-
   const WithServerSideProps: WithServerSidePropsType = ({ Component, ...rest }) => {
     return <WithServerSidePropsGeneric Component={Component} payload={payload} {...rest} />
   }
 
-  const userFieldSchema = config.collections.find((c) => c.slug === userSlug)
-  ssrAuthFields.push(...userFieldSchema.fields)
-
-  const formState = await buildStateFromSchema({
-    fieldSchema: ssrAuthFields,
-    operation: 'create',
-    preferences: {
-      fields: undefined
-    },
-    req,
-  })
-
-  const baseAuthFieldMap = mapFields({
+  const createFirstUserFieldMap = mapFields({
     WithServerSideProps,
     config,
-    fieldSchema: baseAuthFields,
+    fieldSchema: fields,
     i18n,
+    parentPath: userSlug,
   }).map((field) => {
     // Transform field types for the password and confirm-password fields
     if (field.name === 'password') {
@@ -96,6 +83,13 @@ export const CreateFirstUserView: React.FC<AdminViewProps> = async ({ initPageRe
     return field
   })
 
+  const formState = await buildStateFromSchema({
+    fieldSchema: fields,
+    operation: 'create',
+    preferences: { fields: {} },
+    req,
+  })
+
   return (
     <React.Fragment>
       <h1>{req.t('general:welcome')}</h1>
@@ -107,7 +101,10 @@ export const CreateFirstUserView: React.FC<AdminViewProps> = async ({ initPageRe
         redirect={adminRoute}
         validationOperation="create"
       >
-        <CreateFirstUserFields baseAuthFieldMap={baseAuthFieldMap} userSlug={userSlug} />
+        <CreateFirstUserFields
+          createFirstUserFieldMap={createFirstUserFieldMap}
+          userSlug={userSlug}
+        />
         <FormSubmit>{req.t('general:create')}</FormSubmit>
       </Form>
     </React.Fragment>

packages/next/src/views/Edit/Default/Auth/index.tsx

@@ -105,7 +105,7 @@ export const Auth: React.FC<Props> = (props) => {
                 name="password"
                 required
               />
-              <ConfirmPassword disabled={readOnly} name="confirm-password" />
+              <ConfirmPassword disabled={readOnly} />
             </div>
           )}
 

packages/next/src/views/ResetPassword/index.tsx

@@ -85,7 +85,7 @@ export const ResetPassword: React.FC<AdminViewProps> = ({ initPageResult, params
             name="password"
             required
           />
-          <ConfirmPassword name="confirm-password" />
+          <ConfirmPassword />
           <HiddenInput forceUsePathFromProps name="token" value={token} />
           <FormSubmit>{i18n.t('authentication:resetPassword')}</FormSubmit>
         </Form>

packages/ui/src/fields/ConfirmPassword/index.tsx

@@ -1,47 +1,22 @@
 'use client'
-import type { Description, FormField, Validate } from 'payload/types'
+import type { FormField } from 'payload/types'
 
 import React, { useCallback } from 'react'
 
-import type { FormFieldBase } from '../shared/index.js'
-
 import { FieldError } from '../../forms/FieldError/index.js'
 import { FieldLabel } from '../../forms/FieldLabel/index.js'
 import { useFormFields } from '../../forms/Form/context.js'
 import { useField } from '../../forms/useField/index.js'
 import { useTranslation } from '../../providers/Translation/index.js'
 import { fieldBaseClass } from '../shared/index.js'
 import './index.scss'
-export type ConfirmPasswordFieldProps = FormFieldBase & {
-  autoComplete?: string
-  className?: string
-  description?: Description
+
+export type ConfirmPasswordFieldProps = {
   disabled?: boolean
-  label?: string
-  name: string
-  path?: string
-  required?: boolean
-  style?: React.CSSProperties
-  validate?: Validate
-  width?: string
 }
 
 export const ConfirmPassword: React.FC<ConfirmPasswordFieldProps> = (props) => {
-  const {
-    name,
-    CustomError,
-    CustomLabel,
-    autoComplete,
-    className,
-    disabled,
-    errorProps,
-    label,
-    labelProps,
-    path: pathFromProps,
-    required,
-    style,
-    width,
-  } = props
+  const { disabled } = props
 
   const password = useFormFields<FormField>(([fields]) => fields.password)
   const { t } = useTranslation()
@@ -61,8 +36,11 @@ export const ConfirmPassword: React.FC<ConfirmPasswordFieldProps> = (props) => {
     [password, t],
   )
 
-  const { formProcessing, path, setValue, showError, value } = useField({
-    path: pathFromProps || name,
+  const path = 'confirm-password'
+
+  const { setValue, showError, value } = useField({
+    disableFormData: true,
+    path,
     validate,
   })
 
@@ -80,9 +58,9 @@ export const ConfirmPassword: React.FC<ConfirmPasswordFieldProps> = (props) => {
       />
       <input
         autoComplete="off"
-        disabled={formProcessing || disabled}
-        id={`field-${path.replace(/\./g, '__')}`}
-        name={path}
+        disabled={!!disabled}
+        id="field-confirm-password"
+        name="confirm-password"
         onChange={setValue}
         type="password"
         value={(value as string) || ''}

packages/ui/src/fields/Email/index.tsx

@@ -65,7 +65,7 @@ const EmailField: React.FC<EmailFieldProps> = (props) => {
 
   const { path, setValue, showError, value } = useField({
     path: pathFromContext || pathFromProps || name,
-    validate: typeof validate === 'function' ? memoizedValidate : undefined,
+    validate: memoizedValidate,
   })
 
   return (

test/auth/config.ts

@@ -216,31 +216,29 @@ export default buildConfigWithDefaults({
     },
   ],
   onInit: async (payload) => {
-    if (process.env.SKIP_ON_INIT !== 'true') {
-      await payload.create({
-        collection: 'users',
-        data: {
-          custom: 'Hello, world!',
-          email: devUser.email,
-          password: devUser.password,
-        },
-      })
+    await payload.create({
+      collection: 'users',
+      data: {
+        custom: 'Hello, world!',
+        email: devUser.email,
+        password: devUser.password,
+      },
+    })
 
-      await payload.create({
-        collection: 'api-keys',
-        data: {
-          apiKey: uuid(),
-          enableAPIKey: true,
-        },
-      })
+    await payload.create({
+      collection: 'api-keys',
+      data: {
+        apiKey: uuid(),
+        enableAPIKey: true,
+      },
+    })
 
-      await payload.create({
-        collection: 'api-keys',
-        data: {
-          apiKey: uuid(),
-          enableAPIKey: true,
-        },
-      })
-    }
+    await payload.create({
+      collection: 'api-keys',
+      data: {
+        apiKey: uuid(),
+        enableAPIKey: true,
+      },
+    })
   },
 })

test/auth/e2e.spec.ts

@@ -1,16 +1,13 @@
 import type { Page } from '@playwright/test'
 
 import { expect, test } from '@playwright/test'
-import { devUser } from 'credentials.js'
 import path from 'path'
-import { wait } from 'payload/utilities'
 import { fileURLToPath } from 'url'
-import { v4 as uuid } from 'uuid'
 
 import type { PayloadTestSDK } from '../helpers/sdk/index.js'
 import type { Config } from './payload-types.js'
 
-import { initPageConsoleErrorCatch, saveDocAndAssert } from '../helpers.js'
+import { initPageConsoleErrorCatch, login, saveDocAndAssert } from '../helpers.js'
 import { AdminUrlUtil } from '../helpers/adminUrlUtil.js'
 import { initPayloadE2ENoConfig } from '../helpers/initPayloadE2ENoConfig.js'
 import { POLL_TOPASS_TIMEOUT } from '../playwright.config.js'
@@ -21,37 +18,25 @@ const dirname = path.dirname(filename)
 
 let payload: PayloadTestSDK<Config>
 
+/**
+ * TODO: Auth
+ *   create first user
+ *   unlock
+ *   log out
+ */
+
 const { beforeAll, describe } = test
 
 const headers = {
   'Content-Type': 'application/json',
 }
 
-const createFirstUser = async ({ page, serverURL }: { page: Page; serverURL: string }) => {
-  await page.goto(serverURL + '/admin/create-first-user')
-  await page.locator('#field-email').fill(devUser.email)
-  await page.locator('#field-password').fill(devUser.password)
-  await page.locator('#field-confirm-password').fill(devUser.password)
-  await page.locator('#field-custom').fill('Hello, world!')
-
-  await wait(500)
-
-  await page.locator('.form-submit > button').click()
-
-  await expect
-    .poll(() => page.url(), { timeout: POLL_TOPASS_TIMEOUT })
-    .not.toContain('create-first-user')
-}
-
 describe('auth', () => {
   let page: Page
   let url: AdminUrlUtil
   let serverURL: string
   let apiURL: string
 
-  // Allows for testing create-first-user
-  process.env.SKIP_ON_INIT = 'true'
-
   beforeAll(async ({ browser }) => {
     ;({ payload, serverURL } = await initPayloadE2ENoConfig<Config>({ dirname }))
     apiURL = `${serverURL}/api`
@@ -61,22 +46,11 @@ describe('auth', () => {
     page = await context.newPage()
     initPageConsoleErrorCatch(page)
 
-    await createFirstUser({ page, serverURL })
-
-    await payload.create({
-      collection: 'api-keys',
-      data: {
-        apiKey: uuid(),
-        enableAPIKey: true,
-      },
-    })
+    //await delayNetwork({ context, page, delay: 'Slow 4G' })
 
-    await payload.create({
-      collection: 'api-keys',
-      data: {
-        apiKey: uuid(),
-        enableAPIKey: true,
-      },
+    await login({
+      page,
+      serverURL,
     })
   })
 

test/fields-relationship/e2e.spec.ts

@@ -383,11 +383,9 @@ describe('fields - relationship', () => {
     })
 
     await page.goto(url.create)
-    // wait for relationship options to load
-    const relationFilterOptionsReq = page.waitForResponse(/api\/relation-filter-true/)
+
     // select relationshipMany field that relies on siblingData field above
     await page.locator('#field-relationshipManyFiltered .rs__control').click()
-    await relationFilterOptionsReq
 
     const options = page.locator('#field-relationshipManyFiltered .rs__menu')
     await expect(options).toContainText('truth')