FilamentF
Filament•8mo ago
Georgi Arnaudov

Spatie Media Library blurred image preview

What I am trying to do: Preview successfully uploaded image/s

What I did: I've upgraded filament admin panel to v3, more specifically ^3.2 . Along with it I've updated "filament/spatie-laravel-media-library-plugin": "^3.2". My theme compiles correctly and everything else worked like a charm.

My issue: The uploaded image/s are blurred, or the entire preview is cut out. The bug where the whole preview is cut out appears when I reload the page, visit some other tabs and then open the images tab.

Code:

Product model
public function registerMediaCollections(): void
    {
        $this
            ->addMediaCollection('products')
            ->useDisk('products');
    }

    public function registerMediaConversions(?Media $media = null): void
    {
        $this->addMediaConversion('thumb')
            ->width(240)
            ->height(270);

        $this->addMediaConversion('medium')
            ->width(400);
    }


Product resource:
Tabs\Tab::make('Снимки')
    ->schema([
        SpatieMediaLibraryFileUpload::make('media')
            ->collection('products')
            ->disk('products')
            ->multiple()
            ->image()
            ->maxFiles(10)
            ->hiddenLabel()
    ]),
Screenshot_2025-05-05_at_20.25.45.png
Screenshot_2025-05-05_at_20.26.11.png
Was this page helpful?