fix: disable api key beta (#6021)

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

@@ -16,8 +16,11 @@ const path = 'apiKey'
 const baseClass = 'api-key'
 const fieldBaseClass = 'field-type'
 
-export const APIKey: React.FC<{ readOnly?: boolean }> = ({ readOnly }) => {
-  const [initialAPIKey, setInitialAPIKey] = useState(null)
+export const APIKey: React.FC<{ enabled: boolean; readOnly?: boolean }> = ({
+  enabled,
+  readOnly,
+}) => {
+  const [initialAPIKey] = useState(uuidv4())
   const [highlightedField, setHighlightedField] = useState(false)
   const { t } = useTranslation()
   const config = useConfig()
@@ -70,14 +73,13 @@ export const APIKey: React.FC<{ readOnly?: boolean }> = ({ readOnly }) => {
   const { setValue, value } = fieldType
 
   useEffect(() => {
-    setInitialAPIKey(uuidv4())
-  }, [])
-
-  useEffect(() => {
-    if (!apiKeyValue) {
+    if (!apiKeyValue && enabled) {
       setValue(initialAPIKey)
     }
-  }, [apiKeyValue, setValue, initialAPIKey])
+    if (!enabled) {
+      setValue(null)
+    }
+  }, [apiKeyValue, enabled, setValue, initialAPIKey])
 
   useEffect(() => {
     if (highlightedField) {
@@ -87,6 +89,10 @@ export const APIKey: React.FC<{ readOnly?: boolean }> = ({ readOnly }) => {
     }
   }, [highlightedField])
 
+  if (!enabled) {
+    return null
+  }
+
   return (
     <React.Fragment>
       <div className={[fieldBaseClass, 'api-key', 'read-only'].filter(Boolean).join(' ')}>

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

@@ -151,7 +151,7 @@ export const Auth: React.FC<Props> = (props) => {
             name="enableAPIKey"
             readOnly={readOnly}
           />
-          {enableAPIKey?.value && <APIKey readOnly={readOnly} />}
+          <APIKey enabled={!!enableAPIKey?.value} readOnly={readOnly} />
         </div>
       )}
       {verify && (

packages/payload/src/auth/baseFields/apiKey.ts

@@ -17,7 +17,6 @@ export default [
         Field: () => null,
       },
     },
-    defaultValue: false,
     label: ({ t }) => t('authentication:enableAPIKey'),
   },
   {
@@ -44,15 +43,18 @@ export default [
     hooks: {
       beforeValidate: [
         ({ data, req, value }) => {
+          if (data.apiKey === false || data.apiKey === null) {
+            return null
+          }
+          if (data.enableAPIKey === false || data.enableAPIKey === null) {
+            return null
+          }
           if (data.apiKey) {
             return crypto
               .createHmac('sha1', req.payload.secret)
               .update(data.apiKey as string)
               .digest('hex')
           }
-          if (data.enableAPIKey === false) {
-            return null
-          }
           return value
         },
       ],