payload icon indicating copy to clipboard operation
payload copied to clipboard

feat: add the ability to link existing documents in the join field

Open illright opened this issue 9 months ago • 1 comments

What?

This PR adds a new button to the Join field UI to take an existing document from the joined collection and link it to this joining document instead.

the join field UI with two buttons titled 'Choose from existing' and 'Add new'

Why?

This is a custom functionality that I needed as part of my own usage of Payload. I found the integration to be a bit difficult — I had to modify the label component and extend it in width up to the Add new button to give an impression of a second action. Not to mention that after sending a PATCH request to do the linking, I had to call window.location.reload() because I couldn't come up with a better way to invalidate the table from within a custom component.

Since the new functionality was mostly using existing Payload components, I figured I'd try to contribute it back in case you decide that it's useful.

How?

This uses the ListDrawer element to display a slide-out panel to browse existing documents that can be linked to the current document.

[!NOTE] This PR is still not finished — after selection, the document isn't actually being linked. I wanted to get your input on whether this contribution is welcome, and if so, what would be the best way to implement the linking? The only thing I can think of is a fetch call, but perhaps there's a better way to do updates from inside Payload client components

illright avatar Apr 07 '25 22:04 illright

We've been looking for exactly this kind of functionality when managing any kind of bidirectional relationships we have in our collections. This would be a nice feature to have and makes a lot of sense IMO as you can already create and link there 🙏

thomas-coldwell avatar Oct 21 '25 17:10 thomas-coldwell