Skip to content

Commit

Permalink
Merge pull request #118 from AnWhiteM/pass
Browse files Browse the repository at this point in the history 
Update user info incl password
  • Loading branch information
@AnWhiteM
AnWhiteM authored Jun 19, 2024
2 parents 42e9459 + ff0a8ec commit 46f8c73
Show file tree
Hide file tree
Showing 2 changed files with 20 additions and 208 deletions.
227 changes: 20 additions & 207 deletions src/components/UserEditModal/UserEditModal.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,200 +14,11 @@ import css from "../UserEditModal/UserEditModal.module.css";
import svg from "../../img/icons.svg";

const ValidationSchema = Yup.object().shape({
name: Yup.string()
.min(4, "Too Short!")
.max(64, "Too Long!")
.required("Required"),
email: Yup.string().email("Must be a valid email!").required("Required"),
password: Yup.string()
.min(8, "Too short")
.max(64, "Too long")
.required("Required"),
name: Yup.string().min(4, "Too Short!").max(64, "Too Long!"),
email: Yup.string().email("Must be a valid email!"),
password: Yup.string().min(8, "Too short").max(64, "Too long"),
});

// export default function UserEditModal({ onClose }) {
// const user = useSelector(selectUser);
// const dispatch = useDispatch();

// // ссылка к скрытому тнпуту тип файл
// const fileInputRef = useRef(null);

// const handleMenuClick = (ev) => {
// ev.stopPropagation();
// };

// const handleButtonClick = () => {
// fileInputRef.current.click();
// };

// const handleFileChange = async (event) => {
// const file = event.target.files[0];
// if (file) {
// try {
// //создаем новый объект FormData для отправки файла на сервер
// const formData = new FormData();
// //добавляем выбранный файл в объект FormData
// formData.append("avatar", file);
// const response = await axios.put(
// "https://project06back.onrender.com/users/avatar",
// formData,
// {
// headers: {
// "Content-Type": "multipart/form-data",
// },
// }
// );
// const url = response.data.avatarURL;
// if (url) {
// // Установ новый URL аватара в стейт пользователя
// dispatch(updAvatarURL(url));
// }
// } catch (error) {
// console.log(error);
// }
// }
// };

// const handleSubmit = async (values) => {
// try {
// const sendInfo = {
// name: values.name,
// email: values.email,
// password: values.password,
// };
// await dispatch(updateUserInfo(sendInfo))
// .unwrap()
// .then((data) => {
// if (data === "") {
// toast.error(
// "You have not updated any details.Please review and update "
// );
// } else {
// toast.success("Profile updated successfully");
// onClose();
// }
// });
// } catch (error) {
// let statusCode = error.slice(-3);
// let nmb = parseInt(statusCode);

// if (nmb === 403) {
// toast.error("The password is invalid.Please try again");
// } else {
// toast.error("The error occured.Please try again");
// }
// }
// };

// return (
// <>
// <div className={css.backdrop} onClick={() => onClose()}>
// <div
// className={`${css.container} ${css.cont}`}
// onClick={(e) => handleMenuClick(e)}
// >
// <div className={css.wrap}>
// <button className={css.closeBtn} onClick={() => onClose()}>
// <svg
// width="18"
// height="18"
// stroke="currentColor"
// className={css.icon}
// >
// <use href={svg + "#icon-x-close"}></use>
// </svg>
// </button>
// </div>
// <p className={css.txt}>Edit Profile</p>
// <div className={css.avatarContainer}>
// <span
// className={`${css.avatarBig} ${css.avatar}`}
// style={
// user.avatarURL
// ? { backgroundImage: `url(${user.avatarURL})` }
// : {}
// }
// />

// <button
// type="button"
// className={css.plusBtn}
// onClick={() => handleButtonClick()}
// >
// <svg width="10" height="10" stroke="currentColor">
// <use href={svg + "#icon-plus"}></use>
// </svg>
// <input
// type="file"
// ref={fileInputRef}
// style={{ display: "none" }}
// onChange={(e) => handleFileChange(e)}
// />
// </button>
// </div>
// <div>
// <Formik
// initialValues={{
// avatarURL: user.avatarURL || "",
// name: user.name || "",
// email: user.email || "",
// password: "",
// }}
// onSubmit={handleSubmit}
// validationSchema={ValidationSchema}
// >
// <Form className={css.forma} autoComplete="off">
// <div className={css.formGroup}>
// <label htmlFor="name" className={css.formLabel} />
// <Field
// type="text"
// name="name"
// className={css.formInput}
// placeholder="Name"
// />
// <ErrorMessage
// name="name"
// component="span"
// className={css.error}
// />
// </div>
// <div className={css.formGroup}>
// <label htmlFor="email" className={css.formLabel} />
// <Field
// type="text"
// name="email"
// className={css.formInput}
// placeholder="Email"
// />
// <ErrorMessage
// name="email"
// component="span"
// className={css.error}
// />
// </div>
// <div className={css.formGroup}>
// <label htmlFor="password" className={css.formLabel} />

// <PasswordField />
// <ErrorMessage
// name="password"
// component="span"
// className={css.error}
// />
// </div>

// <button type="submit" className={css.btn}>
// Send
// </button>
// </Form>
// </Formik>
// </div>
// </div>
// </div>
// </>
// );
// }

export default function UserEditModal({ onClose }) {
const user = useSelector(selectUser);
const dispatch = useDispatch();
Expand Down Expand Up @@ -253,11 +64,19 @@ export default function UserEditModal({ onClose }) {

const handleSubmit = async (values) => {
try {
const sendInfo = {
name: values.name,
email: values.email,
password: values.password,
};
let sendInfo = {};

if (values.name !== user.name) {
sendInfo.name = values.name;
}
if (values.email !== user.email) {
sendInfo.email = values.email;
}

if (values.password !== "") {
sendInfo.password = values.password;
}

await dispatch(updateUserInfo(sendInfo))
.unwrap()
.then((data) => {
Expand All @@ -274,8 +93,8 @@ export default function UserEditModal({ onClose }) {
let statusCode = error.slice(-3);
let nmb = parseInt(statusCode);

if (nmb === 403) {
toast.error("The password is invalid.Please try again");
if (nmb === 409) {
toast.error("Email already in use. Please use a different email.");
} else {
toast.error("The error occured.Please try again");
}
Expand All @@ -302,10 +121,7 @@ export default function UserEditModal({ onClose }) {
</button>
</div>
<p className={css.txt}>Edit Profile</p>
<div
className={css.avatarContainer}
onClick={() => handleButtonClick()}
>
<div className={css.avatarContainer}>
<span
className={`${css.avatarBig} ${css.avatar}`}
style={
Expand All @@ -318,10 +134,7 @@ export default function UserEditModal({ onClose }) {
<button
type="button"
className={css.plusBtn}
onClick={(e) => {
e.stopPropagation();
handleButtonClick();
}}
onClick={() => handleButtonClick()}
>
<svg width="10" height="10" stroke="currentColor">
<use href={svg + "#icon-plus"}></use>
Expand Down
1 change: 0 additions & 1 deletion src/redux/auth/operations.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
// import { createAction } from "@reduxjs/toolkit";
import axios from "axios";
import { createAsyncThunk } from "@reduxjs/toolkit";

Expand Down

0 comments on commit 46f8c73

Please sign in to comment.