File upload doesn't work property if it's after a hidden step (form wizard)

[sprtk-ches]

Package

filament/filament

Package Version

v3.2.14

Laravel Version

10.42.0

Livewire Version

v3.4.1

PHP Version

8.2.15

Problem description

If you have a wizard with a hidden step, and you conditionally show that step, the file upload after that hidden step will not work property and with throw the following JS error

Uncaught (in promise) TypeError: this.pond is null

This issue was introduced in version 3.1.24 (I believe this was the PR https://github.com/filamentphp/filament/pull/10371)

Expected behavior

The file upload works properly even if it's after a hidden-step-turned-visible

Steps to reproduce

1. Create a form with a wizard and 3 steps
2. Add a file upload component in step 3
3. Make step 2 conditionally hidden
4. Toggle the 2nd step's visibility status
5. Open the browser console, go to step 3 and try to upload a file
6. You will see an error in the console

Here is a simple form that can reproduce this

Wizard::make([
    Wizard\Step::make('Step 1')
        ->schema([
            Toggle::make('something')
                ->label('Show step 2')
                ->live()
        ]),
    Wizard\Step::make('Hidden step')
        ->visible(fn (Get $get) => $get('something'))
        ->schema([]), // nothing to do here
    Wizard\Step::make('Step 3')
        ->schema([
            FileUpload::make('media')
                ->hint('Open the browser console and try to upload a file')
        ])
])

Reproduction repository

https://github.com/sprtk-ches/laravel-filament

Relevant log output

Uncaught (in promise) TypeError: this.pond is null
    B http://filament.local/js/filament/forms/components/file-upload.js?v=3.2.14.0:40
    i http://filament.local/js/filament/forms/components/file-upload.js?v=3.2.14.0:1
    setTimeout handler*Ml http://filament.local/js/filament/forms/components/file-upload.js?v=3.2.14.0:1
    i http://filament.local/js/filament/forms/components/file-upload.js?v=3.2.14.0:1
    i http://filament.local/js/filament/forms/components/file-upload.js?v=3.2.14.0:1
    fire http://filament.local/js/filament/forms/components/file-upload.js?v=3.2.14.0:1
    b http://filament.local/js/filament/forms/components/file-upload.js?v=3.2.14.0:2
    E http://filament.local/js/filament/forms/components/file-upload.js?v=3.2.14.0:2
    setTimeout handler*yd/E/</< http://filament.local/js/filament/forms/components/file-upload.js?v=3.2.14.0:2
    E http://filament.local/js/filament/forms/components/file-upload.js?v=3.2.14.0:2
    E http://filament.local/js/filament/forms/components/file-upload.js?v=3.2.14.0:2
    _write http://filament.local/js/filament/forms/components/file-upload.js?v=3.2.14.0:2
    <anonymous> http://filament.local/js/filament/forms/components/file-upload.js?v=3.2.14.0:2
    <anonymous> http://filament.local/js/filament/forms/components/file-upload.js?v=3.2.14.0:2
    d http://filament.local/js/filament/forms/components/file-upload.js?v=3.2.14.0:1
...
file-upload.js:40:85386

Donate 💰 to fund this issue

• You can donate funding to this issue. We receive the money once the issue is completed & confirmed by you.
• 100% of the funding will be distributed between the Filament core team to run all aspects of the project.
• Thank you in advance for helping us make maintenance sustainable!

[sprtk-ches]

Here is an example of how it looks

https://github.com/filamentphp/filament/assets/145474359/ed8ea22c-5722-4c87-b2ff-df811d75e0bf

[nils-kt]

After the update, I get this errror: Undefined variable $getUploadingMessage

[williamengbjerg]

After the update, I get this errror: Undefined variable $getUploadingMessage

Same here 👀

@nils-kt For me, the issue related to the $getUploadingMessage error was resolved by uninstalling/removing the package image-optimizer

[nils-kt]

@williamengbjerg confirmed! Can you create a issue (joshembling/image-optimizer)? I'm on the go right now and can't formulate the issue perfectly because of that. @joshembling

[williamengbjerg]

@williamengbjerg confirmed! Can you create a issue (joshembling/image-optimizer)? I'm on the go right now and can't formulate the issue perfectly because of that. @joshembling

Good idea. I submitted the issue

[joshembling]

Hi @nils-kt @williamengbjerg

This has now been fixed

https://github.com/joshembling/image-optimizer/issues/9#issuecomment-1913643317