fix(richtext-lexical): toggling between internal and custom links does not update fields (#11074)

Fixes https://github.com/payloadcms/payload/issues/11062

In https://github.com/payloadcms/payload/pull/9869 we fixed a bug where `data` passed to lexical fields did not reflect the document data. Our LinkFeature, however, was depending on this incorrect behavior. This PR updates the LinkFeature field conditions to depend on the `siblingData` instead of `data`

packages/richtext-lexical/src/features/link/server/baseFields.ts

@@ -4,9 +4,12 @@ import type {
   RadioField,
   SanitizedConfig,
   TextField,
+  TextFieldSingleValidation,
   User,
 } from 'payload'
 
+import type { LinkFields } from '../nodes/types.js'
+
 import { validateUrl, validateUrlMinimal } from '../../../lexical/utils/url.js'
 
 export const getBaseFields = (
@@ -80,15 +83,14 @@ export const getBaseFields = (
       },
       label: ({ t }) => t('fields:enterURL'),
       required: true,
-      // @ts-expect-error - TODO: fix this
+      validate: ((value: string, options) => {
-      validate: (value: string, options) => {
+        if ((options?.siblingData as LinkFields)?.linkType === 'internal') {
-        if (options?.siblingData?.linkType === 'internal') {
           return // no validation needed, as no url should exist for internal links
         }
         if (!validateUrlMinimal(value)) {
           return 'Invalid URL'
         }
-      },
+      }) as TextFieldSingleValidation,
     },
   ]
 
@@ -99,14 +101,16 @@ export const getBaseFields = (
       value: 'internal',
     })
     ;(baseFields[2] as TextField).admin = {
-      condition: ({ linkType }) => linkType !== 'internal',
+      condition: (_data, _siblingData) => {
+        return _siblingData.linkType !== 'internal'
+      },
     }
 
     baseFields.push({
       name: 'doc',
       admin: {
-        condition: ({ linkType }) => {
+        condition: (_data, _siblingData) => {
-          return linkType === 'internal'
+          return _siblingData.linkType === 'internal'
         },
       },
       // when admin.hidden is a function we need to dynamically call hidden with the user to know if the collection should be shown

templates/website/src/fields/defaultLexical.ts

@@ -1,4 +1,4 @@
-import { Config } from 'payload'
+import { Config, type TextFieldSingleValidation } from 'payload'
 import {
   BoldFeature,
   ItalicFeature,
@@ -6,6 +6,7 @@ import {
   ParagraphFeature,
   lexicalEditor,
   UnderlineFeature,
+  type LinkFields,
 } from '@payloadcms/richtext-lexical'
 
 export const defaultLexical: Config['editor'] = lexicalEditor({
@@ -29,16 +30,16 @@ export const defaultLexical: Config['editor'] = lexicalEditor({
               name: 'url',
               type: 'text',
               admin: {
-                condition: ({ linkType }) => linkType !== 'internal',
+                condition: (_data, siblingData) => siblingData?.linkType !== 'internal',
               },
               label: ({ t }) => t('fields:enterURL'),
               required: true,
-              validate: (value: any, options: any) => {
+              validate: ((value, options) => {
-                if (options?.siblingData?.linkType === 'internal') {
+                if ((options?.siblingData as LinkFields)?.linkType === 'internal') {
                   return true // no validation needed, as no url should exist for internal links
                 }
                 return value ? true : 'URL is required'
-              },
+              }) as TextFieldSingleValidation,
             },
           ]
         },

templates/with-vercel-website/src/fields/defaultLexical.ts

@@ -1,4 +1,4 @@
-import { Config } from 'payload'
+import { Config, type TextFieldSingleValidation } from 'payload'
 import {
   BoldFeature,
   ItalicFeature,
@@ -6,6 +6,7 @@ import {
   ParagraphFeature,
   lexicalEditor,
   UnderlineFeature,
+  type LinkFields,
 } from '@payloadcms/richtext-lexical'
 
 export const defaultLexical: Config['editor'] = lexicalEditor({
@@ -29,16 +30,16 @@ export const defaultLexical: Config['editor'] = lexicalEditor({
               name: 'url',
               type: 'text',
               admin: {
-                condition: ({ linkType }) => linkType !== 'internal',
+                condition: (_data, siblingData) => siblingData?.linkType !== 'internal',
               },
               label: ({ t }) => t('fields:enterURL'),
               required: true,
-              validate: (value: any, options: any) => {
+              validate: ((value, options) => {
-                if (options?.siblingData?.linkType === 'internal') {
+                if ((options?.siblingData as LinkFields)?.linkType === 'internal') {
                   return true // no validation needed, as no url should exist for internal links
                 }
                 return value ? true : 'URL is required'
-              },
+              }) as TextFieldSingleValidation,
             },
           ]
         },