When you click on the button, the data is not added - reactjs

Question

I'm doing an app CRUD with React
I added a method POST data to REST API created in Node using Axios for add a New user and the form is made with Material UI.
With the method handleChange is handled OnChange event of the Form Input with Hooks style that set the state off the object.
The handleChange function in turn calls setUser which updates the user state with the new value.
But when filling the form and clicking on the Add button nothing happens, it does not throw an error but does not add the data,
Any idea why this happen?
import React, { useState } from "react";
import axios from 'axios';
function UserAdd(props) {
const initialState = { name: '', lastname: '', age:0 }
const [user, setUser] = useState(initialState)
function handleChange(event) {
setUser({...user, [event.target.name]: event.target.value})
}
function handleSubmit(event) {
event.preventDefault();
const data={name:user.name, lastname: user.lastname, age: user.age}
if(!user.name || !user.lastname || !user.age) return
async function postUser() {
try {
const response = await axios.post('/api/addUser', data);
props.history.push(`/user/${response.data._id}`);
} catch(error) {
console.log('error', error);
}
}
postUser();
}
function handleCancel() {
props.history.push("/users");
}
return (
<div style={{ padding: 16, margin: 'auto', maxWidth: 1000 }}>
<Typography variant="h4" align="center" component="h1" gutterBottom>
Add User
</Typography>
<form onSubmit={handleSubmit} className={classes.container} >
<TextField
name="name"
label="Name"
className={classes.textField}
value={user.name}
onChange={handleChange}
margin="normal"
variant="outlined"
/>
<TextField
name="lastname"
label="Lastname "
className={classes.textField}
value={user.lastname}
onChange={handleChange}
margin="normal"
variant="outlined"
/>
<TextField
name="age"
label="Age"
className={classes.textField}
value={user.age}
onChange={handleChange}
margin="normal"
variant="outlined"
/>
<Grid item style={{ marginTop: 30 }}>
<Button
variant="contained"
color="primary"
type="submit">
Add
</Button>
</Grid>
<Grid item style={{ marginTop: 30 }}>
<Button
onClick={handleCancel}
variant="contained"
type="cancel">
Cancel
</Button>
</Grid>
</form>
</div>
);
}
export default UserAdd
API Method
router.post('/api/addUser',async(req,res)=>{
try {
const {name,lastname, age}=req.body;
await pool.request()
.input('name', sql.VarChar(20), name)
.input('lastname', sql.VarChar(35), lastname)
.input('age', sql.Int (100), age)
.execute('AddUser')
res.send(req.body)
} catch (error) {
res.json({message:error.message})
}
});

Answer 1

I recreated you code snippet in codesandbox while omitting styles and not relevant elements.
https://codesandbox.io/s/wizardly-perlman-ydh20
but changed await post to alert. And form submitting is working. So the problem is most likely in post implementation.