Удалил старые запросы к апи, переписал страницу тестов на новый конструктор запроса. Обновил библиотеки, в том числе реакт до последней версии, переписал устаревший код с библиотек.

src/components/Form/Form.js

@@ -1,22 +1,23 @@
-import React, { useState } from 'react'
+import React, {useEffect, useState} from 'react'
 import {useParams, useNavigate} from 'react-router-dom'
-import { Loader } from '../Loader/Loader'
+import {Loader} from '../Loader/Loader'
 import PhoneInput from 'react-phone-input-2'
 import 'react-phone-input-2/lib/style.css'
 import './form.scss'
 
-import { withSwalInstance } from 'sweetalert2-react'
-import swal from 'sweetalert2'
 import {apiRequest} from "../../api/request";
 
+import Swal from 'sweetalert2'
+import withReactContent from 'sweetalert2-react-content'
 
-const SweetAlert = withSwalInstance(swal);
+const SweetAlert = withReactContent(Swal);
 
 const Form = () => {
 
   const navigate = useNavigate();
 
   const urlParams = useParams();
+
   const [status, setStatus] = useState(null);
   const [data, setData] = useState({
     email: '',
@@ -25,9 +26,29 @@ const Form = () => {
   });
   const [isFetching, setIsFetching] = useState(false);
 
+  const handleModal = (status) => {
+    SweetAlert.fire({
+      text: status !== 200 || 201
+          ? 'Какие-то неполадки =('
+          : 'Форма отправлена',
+      preConfirm: () =>
+          status !== 200 || 201 ? () => {
+            setStatus(null)
+          } : () => {
+            setStatus(null);
+            navigate(`/candidate/${urlParams.id}`)
+          }
+    });
+  };
+
+  useEffect(() => {
+    if (status) {
+      handleModal(status)
+    }
+  }, [status]);
 
   const handleChange = (e) => {
-    const { id, value } = e.target;
+    const {id, value} = e.target;
 
     setData((prev) => ({
       ...prev,
@@ -41,11 +62,11 @@ const Form = () => {
     setIsFetching(true);
     const formData = new FormData();
     formData.append('profile_id', urlParams.id);
-    formData.append('email', data.email);
+    formData.append('Email', data.email);
     formData.append('phone', data.phone);
     formData.append('comment', data.comment);
 
-    apiRequest('/interview-request/create-interview-request',{
+    apiRequest('/interview-request/create-interview-request', {
       method: 'POST',
       params: {
         profile_id: urlParams.id,
@@ -59,49 +80,28 @@ const Form = () => {
   };
 
   return (
-    <>
-      {status && (
-        <SweetAlert
-          show={!!status}
-          text={
-            status.errors
-              ? status.errors[Object.keys(status.errors)[0]]
-              : 'Форма отправлена'
-          }
-          onConfirm={
-            status.errors
-              ? () => {
-                  setStatus(null)
-                }
-              : () => {
-                  setStatus(null);
-                  navigate(`/candidate/${urlParams.id}`)
-                }
-          }
-        />
-      )}
       <div className='row'>
         <div className='col-sm-12'>
           <form className='form' id='test'>
             <label htmlFor='email'>Емейл:</label>
             <input
-              onChange={handleChange}
-              id='email'
-              name='Email'
-              type='email'
-              placeholder='Емейл'
-              value={data.email}
+                onChange={handleChange}
+                id='email'
+                name='Email'
+                type='email'
+                placeholder='Емейл'
+                value={data.email}
             />
 
             <label htmlFor='phone'>Номер телефона:</label>
             <PhoneInput
-              id='phone'
-              name='Phone'
-              country={'ru'}
-              value={data.phone}
-              onChange={(e) =>
-                handleChange({ target: { value: e, id: 'phone' } })
-              }
+                id='phone'
+                name='Phone'
+                country={'ru'}
+                value={data.phone}
+                onChange={(e) =>
+                    handleChange({target: {value: e, id: 'phone'}})
+                }
             />
             {/* <input
               onChange={handleChange}
@@ -113,22 +113,21 @@ const Form = () => {
             /> */}
 
             <textarea
-              onChange={handleChange}
-              id='comment'
-              rows='5'
-              cols='40'
-              name='Comment'
-              placeholder='Оставьте комментарий'
-              value={data.comment}
+                onChange={handleChange}
+                id='comment'
+                rows='5'
+                cols='40'
+                name='Comment'
+                placeholder='Оставьте комментарий'
+                value={data.comment}
             ></textarea>
 
             <button onClick={handleSubmit} className='form__btn' type='submit'>
-              {isFetching ? <Loader /> : 'Отправить'}
+              {isFetching ? <Loader/> : 'Отправить'}
             </button>
           </form>
         </div>
       </div>
-    </>
   )
 };