payloadcms/payload

useAsTitle field loses clickability when certain fields are in defaultColumns

Opened this issue · 2 comments

bndgnz commented

Describe the Bug

Bug Report: useAsTitle field loses clickability when certain fields are in defaultColumns

Environment:

  • Payload Version: [your version]
  • Next.js Version: 15.4.4
  • Node.js Version: [your version]

Bug Description:
When a field with a custom Cell component is included in the defaultColumns array, it breaks
the useAsTitle functionality - the title field renders as plain text instead of clickable
links.

Steps to Reproduce:

  1. Create a collection with useAsTitle: 'title'
  2. Add a field with custom Cell component to defaultColumns
  3. The title field loses its clickable link behavior

Expected Behavior:
The useAsTitle field should always render as clickable links regardless of other fields in
defaultColumns.

Actual Behavior:
Title renders as instead of when certain fields are in defaultColumns.

Minimal Reproduction:
export const TestCollection: CollectionConfig = {
admin: {
useAsTitle: 'title',
defaultColumns: ['imageField', 'title'], // This breaks title links
},
fields: [
{
name: 'title',
type: 'text',
required: true,
},
{
name: 'imageField',
type: 'text',
admin: {
components: {
Cell: '@/components/CustomCell#CustomCell',
},
},
},
],
}

Workaround:
Remove the problematic field from defaultColumns and add it manually via the column selector.

Link to the code that reproduces this issue

Private repo

Reproduction Steps

Bug Description:
When a field with a custom Cell component is placed before the useAsTitle field in the defaultColumns array, the title field
loses its clickable link behavior and renders as plain text instead of links.

Steps to Reproduce:

  1. Create a collection with useAsTitle: 'title'
  2. Add a field with custom Cell component before the title in defaultColumns
  3. The title field loses clickable links and renders as instead of

Key Finding:

  • ✅ Works: defaultColumns: ['title', 'imageField'] (Cell component after title)
  • ❌ Broken: defaultColumns: ['imageField', 'title'] (Cell component before title)

Expected Behavior:
The useAsTitle field should render as clickable links regardless of position relative to other fields in defaultColumns.

Actual Behavior:
Title renders as non-clickable when a field with custom Cell component appears before it in the array.

HTML Output When Broken:

Mike Lee & Patrick Reynolds Live on Waiheke Radio

HTML Output When Working:

Mike Lee & Patrick Reynolds Live on Waiheke Radio

Workaround:
Place the useAsTitle field first in defaultColumns array, before any fields with custom Cell components.

Which area(s) are affected? (Select all that apply)

Not sure

Environment Info

- Payload Version: 3.56.0
  - Next.js Version: 15.4.4
  - React Version: 19.1.0
  - Node.js Version: 22.19.0
  - Platform: Windows 11 Pro
github-actions commented

Please add a reproduction in order for us to be able to investigate.

Depending on the quality of reproduction steps, this issue may be closed if no reproduction is provided.

Why was this issue marked with the invalid-reproduction label?

To be able to investigate, we need access to a reproduction to identify what triggered the issue. We prefer a link to a public GitHub repository created with create-payload-app@latest -t blank or a forked/branched version of this repository with tests added (more info in the reproduction-guide).

To make sure the issue is resolved as quickly as possible, please make sure that the reproduction is as minimal as possible. This means that you should remove unnecessary code, files, and dependencies that do not contribute to the issue. Ensure your reproduction does not depend on secrets, 3rd party registries, private dependencies, or any other data that cannot be made public. Avoid a reproduction including a whole monorepo (unless relevant to the issue). The easier it is to reproduce the issue, the quicker we can help.

Please test your reproduction against the latest version of Payload to make sure your issue has not already been fixed.

I added a link, why was it still marked?

Ensure the link is pointing to a codebase that is accessible (e.g. not a private repository). "example.com", "n/a", "will add later", etc. are not acceptable links -- we need to see a public codebase. See the above section for accepted links.

Useful Resources

SneakSpiceak commented

I'm also experiencing the same behavior. Would love to see this fixed.