File Upload Preview Issue

What I am trying to do:
I want to display uploaded images in Filament’s FileUpload field clearly (not blurred or pixelated) when editing a record.

What I did:

Configured FileUpload::make('image') with .directory('question_game_images') and .disk('public').

Images are uploaded correctly and stored in the DB as relative paths (question_game_images/filename.png).

On edit, the image loads in the form preview, and when i open the image in new tap using openable() it shows with full resoultion.

My issue/the error:
The image preview inside the FileUpload form shows as very pixelated/blurred. It looks like Filament is rendering a low-resolution thumbnail instead of the original image.

also the image start with a very small preview window when i click on it , it expands to be like what it is in the attachments

Code:

Forms\Components\FileUpload::make('image')
                                ->label('Image')
                                ->directory('question_game_images')
                                ->image()
                                ->disk('public')
                                ->columnSpanFull()
                                ->downloadable(true)
                                ->openable()
                                ->visible(fn(Get $get) => $get('question_type') === 'image'),
                        ]),

Forms\Components\FileUpload::make('image')
                                ->label('Image')
                                ->directory('question_game_images')
                                ->image()
                                ->disk('public')
                                ->columnSpanFull()
                                ->downloadable(true)
                                ->openable()
                                ->visible(fn(Get $get) => $get('question_type') === 'image'),
                        ]),

File Upload Preview Issue

Forms\Components\FileUpload::make('image')
                                ->label('Image')
                                ->directory('question_game_images')
                                ->image()
                                ->disk('public')
                                ->columnSpanFull()
                                ->downloadable(true)
                                ->openable()
                                ->visible(fn(Get $get) => $get('question_type') === 'image'),
                        ]),

Forms\Components\FileUpload::make('image')
                                ->label('Image')
                                ->directory('question_game_images')
                                ->image()
                                ->disk('public')
                                ->columnSpanFull()
                                ->downloadable(true)
                                ->openable()
                                ->visible(fn(Get $get) => $get('question_type') === 'image'),
                        ]),

File Upload Preview Issue

File Upload Preview Issue

Similar Threads

Similar Threads

Similar Threads