revert(ui): unable to search for nested fields in WhereBuilder field selection

This reverts commit 38186346f7.

packages/ui/src/elements/WhereBuilder/Condition/index.tsx

@@ -141,11 +141,6 @@ export const Condition: React.FC<Props> = (props) => {
           <div className={`${baseClass}__field`}>
             <ReactSelect
               disabled={disabled}
-              filterOption={(option, inputValue) =>
-                ((option?.data?.plainTextLabel as string) || option.label)
-                  .toLowerCase()
-                  .includes(inputValue.toLowerCase())
-              }
               isClearable={false}
               onChange={handleFieldChange}
               options={reducedFields.filter((field) => !field.field.admin.disableListFilter)}

packages/ui/src/elements/WhereBuilder/reduceFields.tsx

@@ -4,7 +4,6 @@ import type { ClientField } from 'payload'
 
 import { getTranslation } from '@payloadcms/translations'
 import { fieldAffectsData, fieldIsHiddenOrDisabled, fieldIsID, tabHasName } from 'payload/shared'
-import { renderToStaticMarkup } from 'react-dom/server'
 
 import type { ReducedField } from './types.js'
 
@@ -192,15 +191,10 @@ export const reduceFields = ({
           })
         : localizedLabel
 
-      // React elements in filter options are not searchable in React Select
-      // Extract plain text to make them filterable in dropdowns
-      const textFromLabel = extractTextFromReactNode(formattedLabel)
-
       const fieldPath = pathPrefix ? createNestedClientFieldPath(pathPrefix, field) : field.name
 
       const formattedField: ReducedField = {
         label: formattedLabel,
-        plainTextLabel: textFromLabel,
         value: fieldPath,
         ...fieldTypes[field.type],
         field,
@@ -213,29 +207,3 @@ export const reduceFields = ({
     return reduced
   }, [])
 }
-
-/**
- * Extracts plain text content from a React node by removing HTML tags.
- * Used to make React elements searchable in filter dropdowns.
- */
-const extractTextFromReactNode = (reactNode: React.ReactNode): string => {
-  if (!reactNode) {
-    return ''
-  }
-  if (typeof reactNode === 'string') {
-    return reactNode
-  }
-
-  const html = renderToStaticMarkup(reactNode)
-
-  // Handle different environments (server vs browser)
-  if (typeof document !== 'undefined') {
-    // Browser environment - use actual DOM
-    const div = document.createElement('div')
-    div.innerHTML = html
-    return div.textContent || ''
-  } else {
-    // Server environment - use regex to strip HTML tags
-    return html.replace(/<[^>]*>/g, '')
-  }
-}

packages/ui/src/elements/WhereBuilder/types.ts

@@ -23,7 +23,6 @@ export type ReducedField = {
     label: string
     value: Operator
   }[]
-  plainTextLabel?: string
   value: Value
 }
 

test/admin/e2e/list-view/e2e.spec.ts

@@ -393,24 +393,6 @@ describe('List View', () => {
       await expect(page.locator(tableRowLocator)).toHaveCount(2)
     })
 
-    test('should search for nested fields in field dropdown', async () => {
-      await page.goto(postsUrl.list)
-
-      await openListFilters(page, {})
-
-      const whereBuilder = page.locator('.where-builder')
-      await whereBuilder.locator('.where-builder__add-first-filter').click()
-      const conditionField = whereBuilder.locator('.condition__field')
-      await conditionField.click()
-      await conditionField.locator('input.rs__input').fill('Tab 1 > Title')
-
-      await expect(
-        conditionField.locator('.rs__menu-list').locator('div', {
-          hasText: exactText('Tab 1 > Title'),
-        }),
-      ).toBeVisible()
-    })
-
     test('should allow to filter in array field', async () => {
       await createArray()