Is there a way to preview anything else than the title of an item of a collection in a relationship

Hello !

I need a page where i can reorder a collection. The relationship field works perfectly, but i can't figure out if i can use other informations than the title of the related collection's item.

Some items share an identical title and i'd like to be able to tell them appart

Ideally I'd like to display for example a subtitle and a thumbnail image, like in the second screenshot.

Is it possible?

Thanks

i've made some progress by using a custom react component via an

which if basically just an img with a static url

I'm struggling to make use of the react hooks to fetch the data associated to the project pointed to by the

I can't get past this error generated from the

example from the docs

Using

fetches the IDs of all the related projects, but i can't figure out how to pass the current index to my component, similary to what the admin prop below does

Any guidance would be greatly appreciated 🙏

      admin: {
        components: {
          RowLabel: ({ data, index }) => {
            return data?.title || `Slide ${String(index).padStart(2, '0')}`;
          },
        },

The error generated from the example from the docs

Uncaught TypeError: payload_components_forms__WEBPACK_IMPORTED_MODULE_2__["default"] is not a function

The example from the docs

import { useField } from 'payload/components/forms'

type Props = { path: string }

const CustomTextField: React.FC<Props> = ({ path }) => {
  const { value, setValue } = useField<string>({ path })

  return <input onChange={e => setValue(e.target.value)} value={value.path} />
}