bananas-commerce-admin
Version:
What's this, an admin for apes?
53 lines • 2.58 kB
JavaScript
import React from "react";
import { LoadingButton } from "@mui/lab";
import { FormControl, FormGroup, Stack, TextField, Typography } from "@mui/material";
import { useSnackbar } from "notistack";
import { useI18n } from "../../../contexts/I18nContext";
import { useUser } from "../../../contexts/UserContext";
const PasswordChangeForm = () => {
const { t } = useI18n();
const { enqueueSnackbar } = useSnackbar();
const [loading, setLoading] = React.useState(false);
const [fields, setFields] = React.useState({
"Old password": "",
Password: "",
"Password (again)": "",
});
const { changePassword } = useUser();
const onSubmit = async (event) => {
event.preventDefault();
setLoading(true);
try {
await changePassword(fields["Old password"], fields["Password"], fields["Password (again)"]);
enqueueSnackbar(t("Password changed successfully."), {
variant: "success",
});
setFields({
"Old password": "",
Password: "",
"Password (again)": "",
});
}
catch {
enqueueSnackbar(t("Incorrect authentication credentials."), {
variant: "error",
});
}
finally {
setLoading(false);
}
};
const onChange = (event) => {
setFields({
...fields,
[event.target.name]: event.target.value,
});
};
return (React.createElement(Stack, { component: "form", "data-testid": "change-password-form", gap: 2, sx: { maxWidth: 350 }, onSubmit: onSubmit },
React.createElement(Typography, { color: "grey.600", variant: "body2" }, t("Please enter your old password, for security’s sake, and then enter your new password twice so we can verify you typed it in correctly.")),
React.createElement(FormControl, { fullWidth: true, component: "fieldset" },
React.createElement(FormGroup, null, ["Old password", "Password", "Password (again)"].map((field) => (React.createElement(TextField, { key: field, fullWidth: true, required: true, autoComplete: field, color: "secondary", label: t(field), name: field, sx: { mt: 1.5 }, type: "password", value: fields[field], onChange: onChange }))))),
React.createElement(LoadingButton, { fullWidth: true, color: "primary", loading: loading, type: "submit", variant: "contained" }, t("Change my password"))));
};
export default PasswordChangeForm;
//# sourceMappingURL=PasswordChangeForm.js.map