SpatieMediaLibraryFileUpload in Custom Page

I have a customized page with a form, the media relationship is working fine, but the image is not displayed in the media input.

✅ APP_URL
Solution
SOLVED:

Inside the SpatieMediaLibraryFileUpload.php, first we need to load('media') record and after getMedia.

$this->loadStateFromRelationshipsUsing(static function (SpatieMediaLibraryFileUpload $component, HasMedia $record): void {
            /** @var Model&HasMedia $record */

            // Changed here
            $record->load('media')

            $media = $record->getMedia($component->getCollection() ?? 'default')
                ->when(
                    $component->hasMediaFilter(),
                    fn (Collection $media) => $component->filterMedia($media)
                )
                ->when(
                    !$component->isMultiple(),
                    fn (Collection $media): Collection => $media->take(1),
                )
                ->mapWithKeys(function (Media $media): array {
                    $uuid = $media->getAttributeValue('uuid');

                    return [$uuid => $uuid];
                })
                ->toArray();


            $component->state($media);
        });


To not change the package files directly, we can add the load in the mount() custom page method:

public function mount()
    {
        $this->model->load('media');
        $this->form->fill($this->data);
    }
Was this page helpful?