The best way to manage images with Livewire + Filepond?

I’ve currently got file-uploads implemented via Filepond as per the screencasts that are available. However, I’ve now come to a more real-world situation where I’m trying to also show files that are already uploaded in an “edit” state.

I figured I could just output them on the page and have a button to remove it or something, but this becomes a bit more complicated when you try and keep all the images in sync, e.g Remove this image that exists, but upload this new image that does. Click submit and do those actions. It’s a bit trickier than you’d expect, and the wire:model stuff via filepond is a bit weird when it comes to prepopulating it with files.

I’m a bit stuck and not really sure where to go from here. So I’m wondering if perhaps I’m going about this wrong and there is a different approach I should take that is easier to deal with?

Hopefully someone can share! Thanks!