I've got a problem with sending POST request to a backend server (managed by Swagger UI). Below is the code snippet of POST function:

    const handleSubmit = (e: React.FormEvent) => {
        e.preventDefault();

        const employee: IEmployee = {
          age: newEmployeeData.age,
          id: newEmployeeData.id,
          name: newEmployeeData.name,
          position: newEmployeeData.position,
        };

        axios
          .post("http://34.140.193.23/api/employees", JSON.stringify(employee), {
            headers: {
              "Content-Type": "application/json",
            },
          })
         .then((res) => setEmployeesData([...employeesData, res.data]))
         .catch((error) => {
           console.log("Error:", error);
         });
    };

When I call handleSubmit function, it throws me an error to the console like this:

Failed to load resource: the server responded with a status of 400 ()
createError.js:16 Uncaught (in promise) Error: Request failed with status code 400
at createError (createError.js:16:1)
at settle (settle.js:17:1)
at XMLHttpRequest.onloadend (xhr.js:66:1)

When I try to debug in Sources panel in Chrome DevTools it doesn't even return value for res variable. To be precise, it doesn't run .then statement at all.

Backend server: http://34.140.193.23/swagger-ui/#/employee-controller

Am I missing something? Thank you a lot for your help.