filamentphp / filament

A collection of beautiful full-stack components for Laravel. The perfect starting point for your next app. Using Livewire, Alpine.js and Tailwind CSS.
https://filamentphp.com
MIT License
18.57k stars 2.9k forks source link

file-upload not reactive when change the acceptedFileTypes dynamically #4534

Closed egyjs closed 2 years ago

egyjs commented 2 years ago

Package

filament/filament

Package Version

v2.16.32

Laravel Version

v9.35.1

Livewire Version

No response

PHP Version

V8.1

Problem description

i have an issue my code:

FileUpload::make('file')
  ->acceptedFileTypes(function(Closure $get) {
      $type = $get('type');
      return match ($type) {
          'pdf' => ['application/pdf', 'application/x-pdf', 'application/acrobat', 'applications/vnd.pdf', 'text/pdf', 'text/x-pdf'],
          'video' => ['video/*'],
          default => [],
      };
  })
  ->visible(fn($get) => $get('type') !== 'quiz')
  ->required(),

also I have a reactive Radio Field

RadioButton::make('type')
  ->label(__('Type'))
  ->options([
      'video' => __('Video'),
      'pdf' => __('PDF'),
      'quiz' => __('Quiz'),
  ])
  ->descriptions([
      'video' => __('Video lesson'),
      'pdf' => __('PDF lesson'),
      'quiz' => __('Quiz'),
  ])
  ->default('video')
  ->reactive()
  ->required()
  ->columns(3),

, the issue is that: when i change the value of the radio Field, it wont change the acceptedFileTypes of the fileUpload Field

Expected behavior

when i change the value of the radio Field, it wont change the acceptedFileTypes of the fileUpload Field

Steps to reproduce

check file https://github.com/filamentphp/filament/blob/43e3337c72e5243f008e60a324122961261ed6dd/packages/forms/resources/views/components/file-upload.blade.php#L65

Reproduction repository

none

Relevant log output

No response

danharrin commented 2 years ago

Unfortunately this is a Livewire limitation that I am unable to fix at the moment. I am in contact with Caleb and I have proposed a solution for Livewire v3. Many methods on JS-based form fields are not reactive at the moment.

As a quick solution, you can skip acceptedFileTypes() and use rules(['']) to apply Laravel Validation rules to the field (mime type check?), which won't be passed onto Filepond. This will give you backend validation but nothing on the frontend.