Files
bodyshop/client/src/components/profile-my/profile-my.component.jsx

59 lines
1.6 KiB
JavaScript

import { Button, Form, Input } from "antd";
import React from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { updateUserDetails } from "../../redux/user/user.actions";
import { selectCurrentUser } from "../../redux/user/user.selectors";
import { logImEXEvent } from "../../firebase/firebase.utils";
const mapStateToProps = createStructuredSelector({
currentUser: selectCurrentUser,
});
const mapDispatchToProps = (dispatch) => ({
updateUserDetails: (userDetails) => dispatch(updateUserDetails(userDetails)),
});
export default connect(
mapStateToProps,
mapDispatchToProps
)(function ProfileMyComponent({ currentUser, updateUserDetails }) {
const { t } = useTranslation();
const handleFinish = (values) => {
logImEXEvent("profile_update");
updateUserDetails({
displayName: values.displayName,
photoURL: values.photoURL,
});
};
return (
<div>
<Form
onFinish={handleFinish}
autoComplete={"no"}
initialValues={currentUser}>
<Form.Item
label={t("user.fields.displayname")}
rules={[
{
required: true,
message: t("general.validation.required"),
},
]}
name='displayName'>
<Input />
</Form.Item>
<Form.Item label={t("user.fields.photourl")} name='photoURL'>
<Input />
</Form.Item>
<Button type='primary' key='submit' htmlType='submit'>
{t("user.actions.updateprofile")}
</Button>
</Form>
</div>
);
});