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

^3.2

. Along with it I've updated

"filament/spatie-laravel-media-library-plugin": "^3.2"

"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);
    }

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()
    ]),

Tabs\Tab::make('Снимки')
    ->schema([
        SpatieMediaLibraryFileUpload::make('media')
            ->collection('products')
            ->disk('products')
            ->multiple()
            ->image()
            ->maxFiles(10)
            ->hiddenLabel()
    ]),

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

^3.2

. Along with it I've updated

"filament/spatie-laravel-media-library-plugin": "^3.2"

"filament/spatie-laravel-media-library-plugin": "^3.2"

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);
    }

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()
    ]),

Tabs\Tab::make('Снимки')
    ->schema([
        SpatieMediaLibraryFileUpload::make('media')
            ->collection('products')
            ->disk('products')
            ->multiple()
            ->image()
            ->maxFiles(10)
            ->hiddenLabel()
    ]),

Spatie Media Library blurred image preview

Spatie Media Library blurred image preview

Similar Threads

Similar Threads

Similar Threads