Filament•17mo ago

Reactive file upload firing garbled info for file names

I have a standard file upload field that has reactive() on it. I can access other form fields reactively, but when I try and access the "attachments" field on a reactive file upload (to get the name of the file that has just been uploaded), I get this:

Array ( [67c51498-b77e-4025-8604-ac2f3dce03e5] => Livewire\TemporaryUploadedFile Object ( [test:Symfony\Component\HttpFoundation\File\UploadedFile:private] => [originalName:Symfony\Component\HttpFoundation\File\UploadedFile:private] => 3I7PK9zxev1FgMWfi6jTWT3yW25qcV-metadGVzdHh4LnBkZg==-.pdf [mimeType:Symfony\Component\HttpFoundation\File\UploadedFile:private] => application/octet-stream [error:Symfony\Component\HttpFoundation\File\UploadedFile:private] => 0 [hashName:protected] => [storage:protected] => Illuminate\Filesystem\FilesystemAdapter Object ( [driver:protected] => League\Flysystem\Filesystem Object ( [config:League\Flysystem\Filesystem:private] => League\Flysystem\Config Object ( [options:League\Flysystem\Config:private] => Array ( ) ) [pathNormalizer:League\Flysystem\Filesystem:private] => League\Flysystem\WhitespacePathNormalizer Object ( ) [adapter:League\Flysystem\Filesystem:private] => League\Flysystem\Local\LocalFilesystemAdapter Object ( [prefixer:League\Flysystem\Local\LocalFilesystemAdapter:private] => League\Flysystem\PathPrefixer Object ( [prefix:League\Flysystem\PathPrefixer:private]....

Array ( [67c51498-b77e-4025-8604-ac2f3dce03e5] => Livewire\TemporaryUploadedFile Object ( [test:Symfony\Component\HttpFoundation\File\UploadedFile:private] => [originalName:Symfony\Component\HttpFoundation\File\UploadedFile:private] => 3I7PK9zxev1FgMWfi6jTWT3yW25qcV-metadGVzdHh4LnBkZg==-.pdf [mimeType:Symfony\Component\HttpFoundation\File\UploadedFile:private] => application/octet-stream [error:Symfony\Component\HttpFoundation\File\UploadedFile:private] => 0 [hashName:protected] => [storage:protected] => Illuminate\Filesystem\FilesystemAdapter Object ( [driver:protected] => League\Flysystem\Filesystem Object ( [config:League\Flysystem\Filesystem:private] => League\Flysystem\Config Object ( [options:League\Flysystem\Config:private] => Array ( ) ) [pathNormalizer:League\Flysystem\Filesystem:private] => League\Flysystem\WhitespacePathNormalizer Object ( ) [adapter:League\Flysystem\Filesystem:private] => League\Flysystem\Local\LocalFilesystemAdapter Object ( [prefixer:League\Flysystem\Local\LocalFilesystemAdapter:private] => League\Flysystem\PathPrefixer Object ( [prefix:League\Flysystem\PathPrefixer:private]....

etc. If I save and refresh the page, it correctly gives me:

Array ( [c7d2a2c1-2dbe-4fd3-b649-a8a5b373a507] => testxx.pdf )

Array ( [c7d2a2c1-2dbe-4fd3-b649-a8a5b373a507] => testxx.pdf )

What is going on here? It's like the reactive() is firing before the field has a chance to update itself properly? Does anyone know of a better way to achieve this? I just need to grab the file name for displaying in another field.

7 Replies

benshawukOP•17mo ago

Code for secondary field:

Forms\Components\Placeholder::make('asdasd')
                                ->content(function (callable $get) {
                                    print_r($get('attachments'));
                                }),

Forms\Components\Placeholder::make('asdasd')
                                ->content(function (callable $get) {
                                    print_r($get('attachments'));
                                }),

Dennis Koch•17mo ago

Looks like the temporary filename. Probably files are stored on save and not before.

benshawukOP•17mo ago

Yes, that makes sense. Can you think how else I might grab the file name at the point of upload? Maybe I need to look at tapping into Filepond's javascript callbacks instead?

Dennis Koch•17mo ago

No idea whether that's even possible. Sorry.

benshawukOP•17mo ago

No problem! Thanks anyway. It's good to understand what's happening at least. Is there a reactive() equivalent for "onSave()?" Like, refresh the form elements at the point of saving?

Dennis Koch•17mo ago

Maybe saveFilesUsing() or similar?

benshawukOP•17mo ago

OK.. not sure what that is. I can't see any reference to it in the documentation or source code. OK, I've kind of got this working. On my FileUpload component:

->afterStateUpdated(function ($record, $state) {
                                        if ($state instanceof \Illuminate\Http\UploadedFile) {
                                            $fileName = $state->getClientOriginalName();
                                            // Write the tmp file name to the database
                                            $record->update(['tmpfile' => $fileName]);
                                        }
                                    })

->afterStateUpdated(function ($record, $state) {
                                        if ($state instanceof \Illuminate\Http\UploadedFile) {
                                            $fileName = $state->getClientOriginalName();
                                            // Write the tmp file name to the database
                                            $record->update(['tmpfile' => $fileName]);
                                        }
                                    })

On form field component:

Forms\Components\Placeholder::make('asdasd')
                                ->content(function (callable $get) {
                                    $tmpfile = Document::where('id', $get('id'))->value('tmpfile');
                                    print_r($tmpfile);
                                }),

Forms\Components\Placeholder::make('asdasd')
                                ->content(function (callable $get) {
                                    $tmpfile = Document::where('id', $get('id'))->value('tmpfile');
                                    print_r($tmpfile);
                                }),

So, obviously I'm working around the fact that the file isn't immediately saved on upload by writing the tmp uploaded file name to an additional field in the DB. I can then call it back from the reactive() refresh.

Gaming

Programming

Reactive file upload firing garbled info for file names