laravel livewire upload image error validation - php

Question

i have the same problem in this issue:
Laravel Livewire File Upload Not Validating and is returning a Livewire\TemporaryUploadedFile instance
i want upload my image path in database product, but i have some error
first in validate file image, missing field image or image required
same error in edit edit view,
but if i push second time the button il all ok and work
this is my controller:
public function store()
{
$data= $this->validate([
'name' => 'required',
// 'detail' => 'required',
//'giac' => 'required',
'classe' => 'required',
'photo' => 'required|image|mimes:jpg,jpeg,png,svg,gif|max:2024', // 1MB Max
]);
// $this->photo->store('documents');
$data['photo']= $this->photo->store('documents');
$filename = $this->photo->store('documents','public');
$data['photo'] = $filename;
$this->photo = $filename;
Product::updateOrCreate(['id' => $this->product_id], [
'name' => $this->name,
// 'detail' => $this->detail,
'giac' =>$this->giac,
'photo' =>$this->photo
]);
//$this->reset();
session()->flash('message',
$this->product_id ? 'Product Updated Successfully.' : 'Product Created Successfully.');
$this->closeModal();
$this->resetInputFields();
}
this is my blade file:
<div class="fixed z-10 inset-0 overflow-y-auto ease-out duration-400">
<div class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
<div class="fixed inset-0 transition-opacity">
<div class="absolute inset-0 bg-gray-500 opacity-75"></div>
</div>
<!-- This element is to trick the browser into centering the modal contents. -->
<span class="hidden sm:inline-block sm:align-middle sm:h-screen"></span>?
<div class="inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full" role="dialog" aria-modal="true" aria-labelledby="modal-headline">
<form>
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
<div class="">
<div class="mb-4">
<label for="exampleFormControlInput1" class="block text-gray-700 text-sm font-bold mb-2">Codice:</label>
<input type="text" class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="exampleFormControlInput1" placeholder="Enter Name" wire:model="minsan">
#error('minsan') <span class="text-red-500">{{ $message }}</span>#enderror
</div>
<div class="mb-4">
<label for="exampleFormControlInput1" class="block text-gray-700 text-sm font-bold mb-2">Giacenza:</label>
<input type="text" class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="exampleFormControlInput1" placeholder="Enter Name" wire:model="giac">
#error('giac') <span class="text-red-500">{{ $message }}</span>#enderror
</div>
<div class="mb-4">
<label for="exampleFormControlInput1" class="block text-gray-700 text-sm font-bold mb-2">Descrizione:</label>
<input type="text" class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="exampleFormControlInput1" placeholder="Enter Name" wire:model="name">
#error('name') <span class="text-red-500">{{ $message }}</span>#enderror
</div>
<div class="mb-4">
<label for="exampleFormControlInput1" class="block text-gray-700 text-sm font-bold mb-2">Classe:</label>
<input type="text" class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="exampleFormControlInput1" placeholder="Enter Name" wire:model="classe">
#error('classe') <span class="text-red-500">{{ $message }}</span>#enderror
</div>
<form wire:submit.prevent="uploadImage" enctype="multipart/form-data">
<input type="file" wire:model="photo">
#error('photo') <span class="text-red-500">{{ $message }}</span> #enderror
</form>
</div>
</div>
<div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
<span class="flex w-full rounded-md shadow-sm sm:ml-3 sm:w-auto">
<button wire:click.prevent="store()" type="button" class="inline-flex justify-center w-full rounded-md border border-transparent px-4 py-2 bg-green-600 text-base leading-6 font-medium text-white shadow-sm hover:bg-green-500 focus:outline-none focus:border-green-700 focus:shadow-outline-green transition ease-in-out duration-150 sm:text-sm sm:leading-5">
Salva
</button>
</span>
<span class="mt-3 flex w-full rounded-md shadow-sm sm:mt-0 sm:w-auto">
<button wire:click="closeModal()" type="button" class="inline-flex justify-center w-full rounded-md border border-gray-300 px-4 py-2 bg-white text-base leading-6 font-medium text-gray-700 shadow-sm hover:text-gray-500 focus:outline-none focus:border-blue-300 focus:shadow-outline-blue transition ease-in-out duration-150 sm:text-sm sm:leading-5">
Cancel
</button>
</span>
</form>
</div>
</div>
</div>
</div>
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Livewire\Crud;
use App\Http\Livewire\Products;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Route::get('/products', Products::class)->name('products.index');
Route::post('/products', Products::class)->name('products.index');