I try to send PUT request through React Application using axios it doesn’t work

  const onSubmit = async (e) => {
    e.preventDefault();
    await axios.put(`http://localhost:8080/user/${id}`, user);
    navigate("/");
  };

Below is the ballerina backend code,

@http:ServiceConfig {
    cors: {
        allowOrigins: ["http://localhost:3000"],
        allowCredentials: true,
        allowHeaders: ["*"]
    }
}
service / on new http:Listener(8080) {

    resource function put user/[int id](NewUser newUser) returns http:Accepted|error {
        
        sql:ParameterizedQuery query = `UPDATE users SET name = ${newUser.name},
                                                            user_name = ${newUser.userName},
                                                            email = ${newUser.email},
                                                            mobile_number = ${newUser.mobileNumber}
                                                            WHERE id = ${id}
                                                            `;
        
        sql:ExecutionResult|sql:Error result = dbClient->execute(query);

        if result is sql:ExecutionResult {
            if result.affectedRowCount > 0 {
                return http:ACCEPTED;
            } else {
                return error("No user found with the id: " + id.toString());
            }
        } else {
            return error("Database error: " + result.message());
        } 
    }
}

Issue is When i try put request through command line it works well,
When try to send through react axious it shows bellow issues,

error 1

enter 2