© 2026 Hedgehog Software, LLC

TwitterGitHubDiscord
More
CommunitiesDocsAboutTermsPrivacy
Search
Star
Setup for Free
FilamentF
Filament•2y ago•
3 replies
᲼Vitor

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
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);
        });
$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);
    }
public function mount()
    {
        $this->model->load('media');
        $this->form->fill($this->data);
    }
Jump to solution
Filament banner
FilamentJoin
A powerful open source UI framework for Laravel • Build and ship admin panels & apps fast with Livewire
20,307Members
Resources
Was this page helpful?

Similar Threads

Recent Announcements

Similar Threads

Custom page css not loading for SpatieMediaLibraryFileUpload
FilamentFFilament / ❓┊help
2y ago
Custom page layout for custom pages
FilamentFFilament / ❓┊help
3y ago
Action in custom page
FilamentFFilament / ❓┊help
17mo ago
table in custom page
FilamentFFilament / ❓┊help
3y ago