Hey, i have some troubles updating the data of my users? Someone knows whats wrong?
import React, { useState } from 'react';
import { useAuth0 } from '@auth0/auth0-react';
import { useHistory } from 'react-router-dom';
function ProfileEditorButton() {
const { user, getAccessTokenSilently, updateUser } = useAuth0();
const history = useHistory();
const [formValues, setFormValues] = useState({
name: user.name || '',
email: user.email || '',
});
const [showForm, setShowForm] = useState(false);
const [error, setError] = useState(null);
const handleInputChange = (event) => {
const { name, value } = event.target;
setFormValues({ ...formValues, [name]: value });
}
const handleSubmit = async (event) => {
event.preventDefault();
setError(null);
try {
const accessToken = await getAccessTokenSilently();
await updateUser({ ...formValues }, accessToken);
setShowForm(false);
history.push('/profile');
} catch (error) {
console.error(error);
setError(error);
}
}
return (
<>
{error && (
<div>An error occurred: {error.message}</div>
)}
{!showForm && (
<button type="button" onClick={() => setShowForm(true)}>
Edit profile
</button>
)}
{showForm && (
<form onSubmit={handleSubmit}>
<label htmlFor="name">Name:</label>
<input type="text" name="name" value={formValues.name} onChange={handleInputChange} />
<br />
<label htmlFor="email">Email:</label>
<input type="email" name="email" value={formValues.email} onChange={handleInputChange} />
<br />
<button type="submit">Update profile</button>
<button type="button" onClick={() => setShowForm(false)}>Cancel</button>
</form>
)}
</>
);
}
export default ProfileEditorButton;