how to make asychronous multiple upload files with progress bar in laravel

I have a problem where during the file upload process the progress bar does not appear. and I also have a problem where during the file upload process I cannot add more files that I want to upload. how can I solve this? btw I use livewire for my laravel application

this is my view:

<div class="w-full lg:ps-64">
    <div class="p-4 sm:p-6 space-y-4 sm:space-y-6">
        <!-- Upload Files Section -->
        <div class="bg-neutral-800 shadow-md rounded-lg p-6 space-y-6">
            <h2 class="text-2xl font-bold text-neutral-100">Upload Files</h2>

            <!-- Success Message -->
            @if (session()->has('success'))
                <div class="p-4 text-lime-500 bg-neutral-700 rounded-lg">
                    {{ session('success') }}
                </div>
            @endif

            <!-- Upload Form -->
            <form wire:submit.prevent="store" class="space-y-6">
                <!-- File Input -->
                <div
                    class="relative border-2 border-dashed border-neutral-600 rounded-lg p-6 flex flex-col items-center justify-center transition hover:bg-neutral-700">
                    <input type="file" wire:model="files" multiple
                        class="absolute inset-0 opacity-0 cursor-pointer z-10">
                    <div class="text-center">
                        <div class="text-neutral-400 mb-2">


                            <i class="fas fa-cloud-upload-alt text-3xl"></i>
                        </div>
                        <p class="text-sm text-neutral-300">
                            <span class="text-neutral-100 font-medium cursor-pointer">Drop your file here</span> or
                            <span class="text-neutral-100 font-medium cursor-pointer">browse</span>
                        </p>
                        <p class="text-xs text-neutral-400 mt-1">Only SVG, PNG, JPG, and MP4 are allowed.</p>
                    </div>
                </div>

                <!-- Validation Error -->
                @error('files.*')
                    <span class="text-sm text-red-500">{{ $message }}</span>
                @enderror

                <!-- Selected Files -->
                @if ($files)
                    <div class="mt-4">
                        <p class="text-sm font-semibold text-neutral-300">Files to Upload:</p>
                        <ul class="space-y-2">
                            @foreach ($files as $index => $file)
                                <li class="flex items-center justify-between bg-neutral-700 p-3 rounded-lg shadow">
                                    <div>
                                        <p class="text-neutral-100 text-sm font-medium truncate">
                                            {{ $file->getClientOriginalName() }}
                                        </p>
                                        <p class="text-xs text-neutral-400">
                                            {{ round($file->getSize() / 1024, 2) }} KB
                                        </p>
                                    </div>
                                    <button type="button" wire:click="removeFile({{ $index }})"
                                        class="text-red-700 hover:text-red-500 transition">
                                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"
                                            class="size-6">
                                            <path fill-rule="evenodd"
                                                d="M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25Zm-1.72 6.97a.75.75 0 1 0-1.06 1.06L10.94 12l-1.72 1.72a.75.75 0 1 0 1.06 1.06L12 13.06l1.72 1.72a.75.75 0 1 0 1.06-1.06L13.06 12l1.72-1.72a.75.75 0 1 0-1.06-1.06L12 10.94l-1.72-1.72Z"
                                                clip-rule="evenodd" />
                                        </svg>

                                    </button>
                                </li>
                            @endforeach
                        </ul>
                    </div>
                @endif

                <!-- Upload Button -->
                <button type="submit"
                    class="w-full py-2 px-4 text-neutral-100 bg-neutral-700 hover:bg-neutral-600 rounded-lg font-medium transition">
                    Upload Files
                </button>
            </form>

            <!-- Progress Bar -->
            <div class="mt-6">
                <div wire:loading wire:target="store" class="w-full bg-neutral-700 rounded-full h-2 overflow-hidden">
                    <div wire:loading wire:target="store" class="bg-neutral-100 h-2 rounded-full animate-pulse"
                        id="progressBar"></div>
                </div>
                <p wire:loading wire:target="store" class="text-xs text-neutral-400 mt-2">Uploading files, please
                    wait...</p>
            </div>
        </div>
    </div>
</div>

and this is my controller:

<?php

namespace AppLivewire;

use AppModelsFile;
use LivewireComponent;
use LivewireWithFileUploads;
use IlluminateSupportFacadesRequest;
use IlluminateSupportFacadesStorage;

class UploadPage extends Component
{

    use WithFileUploads;

    public $files = [];

    public function removeFile($index)
    {
        array_splice($this->files, $index, 1);
    }

    public function store()
    {
        $this->validate([
            'files.*' => 'required|file|mimes:jpg,png,svg,mp4',
        ]);

        foreach ($this->files as $file) {

            sleep(1);

            $path = Storage::disk('r2')->put('uploads', $file);

            File::create([
                'name' => $file->getClientOriginalName(),
                'type' => $file->getMimeType(),
                'path' => $path,
            ]);
        }

        $this->files = [];
        session()->flash('success', 'Files uploaded successfully.');
    }

    public function render()
    {
        return view('livewire.upload-page');
    }
}

I want to know what is wrong with my code and how to solve the problem.