fix(ui): exclude unnamed tab labels from filter and groupBy field options (#9965)

### What?

Currently when showing available columns to filter on and group by it
will show fields inside tabs prepended with the tab name and an angle
bracket as separator.

### Why?

This current label makes sense when the tab has a name and also acts
like a group. But in my opinion it does not make sense when tab does not
have a name and is only used for presentational purposes. This shows
very well with the SEO plugin where the SEO fields are inside a group
field, so when used as a tab as well the SEO is shown double.

This makes the naming consistent with how we show columns in the list
view where unnamed tab has its fields hoisted.

### How?

Check for tab name and only include the tab label as prefix when the tab
has a name

### Before - inconsistency between column name and filter name

![before
pages](https://github.com/user-attachments/assets/9ffe2eb5-0a03-461b-8aa6-86ffcc258ad0)
![before
tabs](https://github.com/user-attachments/assets/c556e4bc-b6ac-4082-a086-30f3a5b031cc)
<img width="1343" height="609" alt="before groupby"
src="https://github.com/user-attachments/assets/5f2a0f0a-4500-4a94-8dd7-bd78fb057caf"
/>

### After - consistency between column name and filter name

![after
pages](https://github.com/user-attachments/assets/d6d6d6a1-5d1c-45bd-8718-5950e3bb599e)
![after
tabs](https://github.com/user-attachments/assets/39048002-6064-4209-ba17-389329e4f3c0)
<img width="1328" height="613" alt="after groupby"
src="https://github.com/user-attachments/assets/a6a6f2c3-290a-4688-b658-30364871806f"
/>

Author: andershermansen

packages/ui/src/utilities/reduceFieldsToOptions.tsx

@@ -66,9 +66,11 @@ export const reduceFieldsToOptions = ({
         if (typeof tab.label !== 'boolean') {
           const localizedTabLabel = getTranslation(tab.label, i18n)
 
-          const labelWithPrefix = labelPrefix
-            ? labelPrefix + ' > ' + localizedTabLabel
-            : localizedTabLabel
+          const labelWithPrefix = tabHasName(tab)
+            ? labelPrefix
+              ? labelPrefix + ' > ' + localizedTabLabel
+              : localizedTabLabel
+            : labelPrefix
 
           // Make sure we handle nested tabs
           const tabPathPrefix =

test/access-control/e2e.spec.ts

@@ -1222,13 +1222,13 @@ describe('Access Control', () => {
 
         // Wait for dropdown options to load by waiting for the visible field
         const visibleOption = initialField.locator('.rs__option', {
-          hasText: 'Public Tab > Public Data',
+          hasText: 'Public Data',
         })
         await expect(visibleOption).toBeVisible()
 
         // Should hide secretInPublicTab field
         await expect(
-          initialField.locator('.rs__option', { hasText: 'Public Tab > Secret In Public Tab' }),
+          initialField.locator('.rs__option', { hasText: 'Secret In Public Tab' }),
         ).toBeHidden()
       })
 
@@ -1392,14 +1392,12 @@ describe('Access Control', () => {
 
         // Wait for dropdown options to load by waiting for the visible field
         const visibleOption = field.locator('.rs__option', {
-          hasText: 'Public Tab > Public Data',
+          hasText: 'Public Data',
         })
         await expect(visibleOption).toBeVisible()
 
         // Should hide secretInPublicTab field
-        await expect(
-          field.locator('.rs__option', { hasText: 'Public Tab > Secret In Public Tab' }),
-        ).toBeHidden()
+        await expect(field.locator('.rs__option', { hasText: 'Secret In Public Tab' })).toBeHidden()
       })
 
       test('should hide field with read: false inside named tab in groupBy dropdown', async () => {

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

@@ -91,10 +91,10 @@ describe('List View', () => {
     testInfo.setTimeout(TEST_TIMEOUT_LONG)
 
     process.env.SEED_IN_CONFIG_ONINIT = 'false' // Makes it so the payload config onInit seed is not run. Otherwise, the seed would be run unnecessarily twice for the initial test run - once for beforeEach and once for onInit
-    ;({ payload, serverURL } = await initPayloadE2ENoConfig<Config>({
-      dirname,
-      prebuild,
-    }))
+      ; ({ payload, serverURL } = await initPayloadE2ENoConfig<Config>({
+        dirname,
+        prebuild,
+      }))
 
     geoUrl = new AdminUrlUtil(serverURL, geoCollectionSlug)
     arrayUrl = new AdminUrlUtil(serverURL, arrayCollectionSlug)
@@ -427,11 +427,11 @@ describe('List View', () => {
       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 conditionField.locator('input.rs__input').fill('Title')
 
       await expect(
         conditionField.locator('.rs__menu-list').locator('div', {
-          hasText: exactText('Tab 1 > Title'),
+          hasText: exactText('Title'),
         }),
       ).toBeVisible()
     })
@@ -618,8 +618,7 @@ describe('List View', () => {
     test('should accept where query from complex, valid URL where parameter using the near operator', async () => {
       // We have one point collection with the point [5,-5] and one with [7,-7]. This where query should kick out the [5,-5] point
       await page.goto(
-        `${
-          new AdminUrlUtil(serverURL, 'geo').list
+        `${new AdminUrlUtil(serverURL, 'geo').list
         }?limit=10&page=1&where[or][0][and][0][point][near]=6,-7,200000`,
       )
 
@@ -696,7 +695,7 @@ describe('List View', () => {
 
       await addListFilter({
         page,
-        fieldLabel: 'Tab 1 > Title',
+        fieldLabel: 'Title',
         operatorLabel: 'equals',
         value: 'test',
       })
@@ -710,7 +709,7 @@ describe('List View', () => {
 
       const { whereBuilder } = await addListFilter({
         page,
-        fieldLabel: 'Tab 1 > Title',
+        fieldLabel: 'Title',
         operatorLabel: 'equals',
         value: 'Test',
       })
@@ -721,7 +720,7 @@ describe('List View', () => {
 
       await expect(
         secondLi.locator('.condition__field').locator('.rs__single-value'),
-      ).toContainText('Tab 1 > Title')
+      ).toContainText('Title')
 
       await expect(secondLi.locator('.condition__operator >> input')).toHaveValue('')
       await expect(secondLi.locator('.condition__value >> input')).toHaveValue('')
@@ -732,7 +731,7 @@ describe('List View', () => {
 
       const { whereBuilder } = await addListFilter({
         page,
-        fieldLabel: 'Tab 1 > Title',
+        fieldLabel: 'Title',
         operatorLabel: 'equals',
       })
 
@@ -781,7 +780,7 @@ describe('List View', () => {
 
       const { whereBuilder } = await addListFilter({
         page,
-        fieldLabel: 'Tab 1 > Title',
+        fieldLabel: 'Title',
         operatorLabel: 'equals',
         value: 'Test 1',
       })
@@ -797,11 +796,9 @@ describe('List View', () => {
       const secondValueField = secondLi.locator('.condition__value >> input')
       await secondConditionField.click()
 
-      await secondConditionField
-        .locator('.rs__option', { hasText: exactText('Tab 1 > Title') })
-        .click()
+      await secondConditionField.locator('.rs__option', { hasText: exactText('Title') }).click()
 
-      await expect(secondConditionField.locator('.rs__single-value')).toContainText('Tab 1 > Title')
+      await expect(secondConditionField.locator('.rs__single-value')).toContainText('Title')
       await secondOperatorField.click()
       await secondOperatorField.locator('.rs__option').locator('text=equals').click()
       await secondValueField.fill('Test 2')