When deleting uploaded images, it trigger the store button instead of performing delete action

I posted this previously, but after checking the code back and dig deeper, I found the delete button code and thus I’ll post the updated info here.
Uploading the images has no problem but when deleting the uploaded images, it triggers the store button instead. I recorded the error here, https://youtu.be/Eq3Y8s2G2GE . I am wondering why is this happening ? I tried to change things here and there but it is still the same. The following are my code. Please help.

Storing the images initially

public function store(Request $request)
    {
        $data = $this->validate($request, [
            'name' => 'required',
            'description' => 'required|max:150',
            'category_id' => 'required',
            'type_id' => 'required',
            'price' => 'required|numeric|min:0|not_in:0',
            'start_date' => 'required',
            'end_date' => 'required',
            'is_active' => 'required',
            'images.*' => 'image|max:2048', // max file size: 2MB
            'documents.*' => 'file|max:2048', // max file size: 2MB
        ]);

        $product = DB::table('products')
            ->insertGetId([
                'name' => $data['name'],
                'description' => $data['description'],
                'type_id' => $data['type_id'],
                'category_id' => $data['category_id'],
                'price' => $data['price'],
                'start_date' => $data['start_date'],
                'end_date' => $data['end_date'],
                'is_password' => $request['is_password'],
                'is_stamping' => $request['is_stamping'],
                'created_at' => now(),
            ]);

        // handle image uploads
        if ($request->hasFile('images')) {
            $i = 1;
            foreach ($request->file('images') as $image) {
                $name = $request['name'] . '-' . $i;
                $now = new DateTime();
                $fileName = Str::slug($request['name']) . '-' . $now->format('dmYHis') . '-' . $i . '.' . $image->getClientOriginalExtension();
                //$fileName = Str::slug($request['name']) . '-' . time() . '.' . $image->getClientOriginalExtension();
                $path = $image->storeAs('public/Product/Images', $fileName);
                DB::table('product_images')->insert([
                    'product_id' => $product,
                    'name' => $name,
                    'file_path' => Storage::url($path),
                    'created_at' => now(),
                ]);
                $i++;
            }
        }
}
        return Redirect::route('produk.index');
    }

Editing the uploaded images afterwards, deleting or adding more images

public function update(Request $request, $id)
    {
        $data = $this->validate($request, [
            'name' => 'required',
            'description' => 'required|max:150',
            'category_id' => 'required',
            'type_id' => 'required',
            'price' => 'required|numeric|min:0|not_in:0',
            'start_date' => 'required',
            'end_date' => 'required',
            'is_active' => 'required',
            'images.*' => 'image|max:2048', // max file size: 2MB
            'documents.*' => 'file|max:2048', // max file size: 2MB
        ]);

        DB::table('products')
            ->where('id', $id)
            ->update([
                'name' => $data['name'],
                'description' => $data['description'],
                'type_id' => $data['type_id'],
                'category_id' => $data['category_id'],
                'price' => $data['price'],
                'start_date' => $data['start_date'],
                'end_date' => $data['end_date'],
                'is_active' => $data['is_active'],
                'is_password' => $request['is_password'],
                'is_stamping' => $request['is_stamping'],
                'updated_at' => now(),
            ]);

        // handle image uploads
        if ($request->hasFile('images')) {
            //DB::table('product_images')->where('product_id', $id)->delete();
            //Storage::deleteDirectory('public/Product/Images/' . $id);
            foreach ($request->file('images') as $image) {
                $name = $request['name'] . '-' . $id;
                $now = new DateTime();
                $fileName = Str::slug($request['name']) . '-' . $now->format('dmYHis') . '-' . $id . '.' . $image->getClientOriginalExtension();
                $path = $image->store('public/Product/Images/' . $fileName);
                DB::table('product_images')->insert([
                    'product_id' => $id,
                    'file_path' => Storage::url($path),
                    'created_at' => now(),
                ]);
            }
        }
return Redirect::route('produk.index');
    }

The button that gets triggered,

const formik = useFormik({
        initialValues: {
            name: action === "create" ? "" : `${data.name}`,
            description: action === "create" ? "" : `${data.description}`,
            category_id: action === "create" ? "" : `${data.category_id}`,
            type_id: action === "create" ? "" : `${data.type_id}`,
            price: action === "create" ? "" : `${data.price}`,
            is_active: action === "create" ? "" : `${data.is_active}`,
            start_date: action === "create" ? "" : `${data.start_date}`,
            end_date: action === "create" ? "" : `${data.end_date}`,
            // is_password: action === "create" ? "" : `${data.is_password}`,
            // is_stamping: action === "create" ? "" : `${data.is_stamping}`,
        },
        validationSchema: validationSchema,

        onSubmit: async (values) => {
            try {
                switch (action) {
                    case "create":
                        await post(route("produk.store"));
                        Swal.fire({
                            text: "Maklumat produk berjaya disimpan",
                            icon: "success",
                        });
                        break;
                    case "update":
                        await put(route("produk.update", product.id), data);
                        Swal.fire({
                            text: "Maklumat produk berjaya dikemaskini",
                            icon: "success",
                        });
                        break;
                }
            } catch (error) {
                Swal.fire({
                    icon: "error",
                    title: "Oops...",
                    text: "Something went wrong!",
                });
            }
        },
    });

    return (
        <form method={"post"} onSubmit={formik.handleSubmit}>

                        ....................
FileUpload component where the delete button lies in it

<FileUpload
    uploadedFiles={product_images?.flatMap((file) => file)}
    product={product}
    action={action}
    setData={setData}
    onError={(error) => {
            Swal.fire({
            text: error,
            icon: "error",
    });
    }}
            name="images"
            buttonText="Muat Naik"
            allowedFileTypes={[
                "image/png",
                "image/jpg",
                "image/jpeg",
            ]}
    />

Delete button to remove file upload when adding product

    const removeFileUpload = (e, index) => {
        const updatedFileUpload = [...fileUpload];
        updatedFileUpload.splice(index, 1);
        setFileUpload(updatedFileUpload);
        setData(name, updatedFileUpload);
    };

Delete button to remove img when editing/updating product

return (
                   ...........
                    
        <button
           onClick={() => removeFileUpload(index)}
           className="outline-none border-none"
         >
           <FaTimes className="text-red-600" />
        </button>
.....