Show all uploading files in Tabular format with progress Circle

I am using the Formik Field Array property for file upload with data and showing those data in a tabular format with a progress bar/circle. I am using a state to save the data fetching from for loop and want to show those selected files in a table but after setting those data I am only getting single File of the last selected file of Field array. Why am I not getting all selected files?

 const [VideoStatus, setVideoStatus] = React.useState(false);
 const [fileData, setFileData] = React.useState([])
 const handleAddVideo = async (values) => {
        try {
            for (let i = 0; i < values.videos.length; i++) {
                setFileData(values.videos[i])
                console.log("Forloop  - ", fileData);
            }
            console.log("fileData - ", fileData);

            await values.videos.map(async (data) => {
                const formData = new FormData();
                formData.append('serial', data.serial)
                formData.append('title', data.title)
                formData.append('fileName', data.fileName);
                formData.append('teacher_id', data.teacher_id);
                formData.append('description', data.description);
                formData.append('date', data.date);
                formData.append("courseId", courseId);
                formData.append("moduleId", moduleId);
                formData.append("videStatus", radio);
                visible = {visible}
                setVideoStatus(true);

                // Calling the Route
                let response = await axios.post(`${ConfigData.SERVER_URL}/admin/video/videoupload`, formData,
                    {
                        headers: {
                            "Content-Type": "multipart/form-data",
                        },
                        onUploadProgress: data => {
                            //Set the progress value to show the progress bar
                            setProgress(Math.round((100 * data.loaded) / data.total))
                        },
                        withCredentials: true
                    })

                if (response.data.status == false) {
                    throw Error(response.data.message)
                }
                else {
                    // If Success Change the Status to Updated
                    console.log("*****Success*****");
                }
            })
        }
        catch (e) {
            // If Error Change the Status to False
            console.log(e);
        }
    }

    {
                    fileData &&
                        VideoStatus ?
                        <Table>
                            <thead>
                                <tr>
                                    <th scope="col">Sr No.</th>
                                    <th scope="col">Video Name</th>
                                    <th scope="col">Size</th>
                                    <th scope="col">Status</th>
                                </tr>
                            </thead>
                            <tbody>
    
                                {
                                    fileData ?
                                        <>
                                            <tr>
                                                <td>{incrementindex + 1}</td>
                                                <td>{fileData.fileName.name}</td>
                                                <td>{fileData.fileName.size}</td>
                                                <td> 

    {progress ?
                                                                                    
                                                       <ProgressBar now= 
                                                     {progress} label={`${progress}%`} />
                                                                                : null
                                                                            }</td>
                                            </tr>
                                        </> : console.log("Nothing")
    
    
                                }
                            </tbody>
                        </Table> : null
    
                }