From 4d5aa62ca25b51aadc36de84297e8c39a035b9d8 Mon Sep 17 00:00:00 2001
From: ariari04 <anime.beksultan@gmail.com>
Date: Fri, 27 Sep 2024 15:40:07 +0600
Subject: [PATCH] Fix bugs

---
 .../ChangePassword/ChangePassword.tsx         | 51 ++++++++++---------
 .../ChangePasswordInput.tsx                   |  7 +--
 src/widgets/forms/ProfileForm/ProfileForm.tsx |  4 +-
 .../forms/ProfileForm/icons/eye-off.svg       | 15 ++++++
 .../forms/ProfileForm/icons/eye-on.svg        | 15 ++++++
 5 files changed, 60 insertions(+), 32 deletions(-)
 create mode 100644 src/widgets/forms/ProfileForm/icons/eye-off.svg
 create mode 100644 src/widgets/forms/ProfileForm/icons/eye-on.svg

diff --git a/src/widgets/forms/ProfileForm/ChangePassword/ChangePassword.tsx b/src/widgets/forms/ProfileForm/ChangePassword/ChangePassword.tsx
index c61442b..70cc993 100644
--- a/src/widgets/forms/ProfileForm/ChangePassword/ChangePassword.tsx
+++ b/src/widgets/forms/ProfileForm/ChangePassword/ChangePassword.tsx
@@ -19,7 +19,7 @@ const ChangePassword: React.FC<IChangePasswordProps> = ({
   closeWindow,
 }: IChangePasswordProps) => {
   const session = useSession();
-  const [error, setError] = useState<string>("");
+  const [errorServer, setErrorServer] = useState<string>("");
   const [loader, setLoader] = useState<boolean>(false);
   const [success, setSuccess] = useState<boolean>(false);
 
@@ -47,31 +47,34 @@ const ChangePassword: React.FC<IChangePasswordProps> = ({
   const onSubmit = async (data: FormFields) => {
     try {
       console.log(data);
-      //   console.log("cfvgbhnj");
-      //   setError("");
-      //   setLoader(true);
+      setErrorServer("");
+      setLoader(true);
 
-      //   const Authorization = `Bearer ${session.data?.access_token}`;
-      //   const config = {
-      //     headers: {
-      //       Authorization,
-      //     },
-      //   };
-      //   const res = await apiInstance.patch(
-      //     "/auth/password_change/",
-      //     data,
-      //     config
-      //   );
+      const Authorization = `Bearer ${session.data?.access_token}`;
+      const config = {
+        headers: {
+          Authorization,
+        },
+      };
+      const res = await apiInstance.patch(
+        "/auth/password_change/",
+        data,
+        config
+      );
 
-      //   if ([200, 201].includes(res.status)) return setSuccess(true);
+      if ([200, 201].includes(res.status)) return setSuccess(true);
     } catch (error: unknown) {
-      //   if (error instanceof AxiosError) {
-      //     if (error.response?.status === 400) {
-      //       setError("Некорректный старый пароль или недопустимый новый пароль");
-      //     }
-      //   } else {
-      //     setError("Произошла непредвиденная ошибка");
-      //   }
+      if (error instanceof AxiosError) {
+        if (error.response?.status === 400) {
+          setErrorServer(
+            "Некорректный старый пароль или недопустимый новый пароль"
+          );
+        } else if (error.response?.status === 401) {
+          setErrorServer("Вы не авторизованы");
+        }
+      } else {
+        setErrorServer("Произошла непредвиденная ошибка");
+      }
     } finally {
       setLoader(false);
     }
@@ -112,7 +115,7 @@ const ChangePassword: React.FC<IChangePasswordProps> = ({
               placeholder="Повторите новый пароль"
               label="Потвердить новый пароль"
             />
-            {error ? <p className="text-red-500">{error}</p> : null}
+            {errorServer && <p className="text-red-500">{errorServer}</p>}
             {success ? (
               <p className="text-light-blue">Вы успешно поменяли пароль!</p>
             ) : null}
diff --git a/src/widgets/forms/ProfileForm/ChangePassword/ChangePasswordInput/ChangePasswordInput.tsx b/src/widgets/forms/ProfileForm/ChangePassword/ChangePasswordInput/ChangePasswordInput.tsx
index 78c9644..66af67f 100644
--- a/src/widgets/forms/ProfileForm/ChangePassword/ChangePasswordInput/ChangePasswordInput.tsx
+++ b/src/widgets/forms/ProfileForm/ChangePassword/ChangePasswordInput/ChangePasswordInput.tsx
@@ -25,10 +25,7 @@ const ChangePasswordInput: React.FC<Props> = ({
     register,
     formState: { errors },
   } = useFormContext();
-  console.log(name);
-
   const errorText = errors[name]?.message as string;
-
   const [isOpen, setIsOpen] = useState<boolean>(false);
   return (
     <div className={cn("flex flex-col gap-2", className)}>
@@ -40,14 +37,14 @@ const ChangePasswordInput: React.FC<Props> = ({
       )}
       <div
         className={`py-[10px] px-[14px] flex items-center justify-between border border-gray-300 rounded-md shadow-sm bg-gray-200${
-          errorText ? "-with-error" : ""
+          errorText && "border-red-500"
         }`}
       >
         <input
           {...register(name)}
           {...props}
           type={isOpen ? "text" : "password"}
-          className="w-full text-[14px] placeholder:leading-6 bg-gray-200"
+          className="w-full text-[14px] placeholder:leading-6 bg-gray-100"
         />
         <button onClick={() => setIsOpen((prev) => !prev)} type="button">
           <Image src={isOpen ? eye_on : eye_off} alt="Eye Icon" />
diff --git a/src/widgets/forms/ProfileForm/ProfileForm.tsx b/src/widgets/forms/ProfileForm/ProfileForm.tsx
index 78118aa..09a871f 100644
--- a/src/widgets/forms/ProfileForm/ProfileForm.tsx
+++ b/src/widgets/forms/ProfileForm/ProfileForm.tsx
@@ -176,9 +176,6 @@ const ProfileForm: React.FC<IProfileFormProps> = ({
             </button>
           </div>
         </div>
-
-        {openPopup && <ChangePassword closeWindow={setOpenPopup} />}
-
         {error ? <p>{error}</p> : null}
 
         <button
@@ -192,6 +189,7 @@ const ProfileForm: React.FC<IProfileFormProps> = ({
         </button>
         <LogoutButton className="sm:block lg:flex-none" />
       </form>
+      {openPopup && <ChangePassword closeWindow={setOpenPopup} />}
     </>
   );
 };
diff --git a/src/widgets/forms/ProfileForm/icons/eye-off.svg b/src/widgets/forms/ProfileForm/icons/eye-off.svg
new file mode 100644
index 0000000..99bfa55
--- /dev/null
+++ b/src/widgets/forms/ProfileForm/icons/eye-off.svg
@@ -0,0 +1,15 @@
+<svg width="24.000000" height="24.000000" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+	<desc>
+			Created with Pixso.
+	</desc>
+	<defs>
+		<clipPath id="clip1668_50526">
+			<rect id="eye-off" width="24.000000" height="24.000000" fill="white" fill-opacity="0"/>
+		</clipPath>
+	</defs>
+	<rect id="eye-off" width="24.000000" height="24.000000" fill="#FFFFFF" fill-opacity="0"/>
+	<g clip-path="url(#clip1668_50526)">
+		<path id="Vector" d="M17.9404 17.9404C16.2305 19.2432 14.1494 19.9648 12 20C5 20 1 12 1 12C2.24414 9.68164 3.96875 7.65625 6.05957 6.05957M9.90039 4.24023C10.5879 4.0791 11.293 3.99805 12 4C19 4 23 12 23 12C22.3926 13.1357 21.6689 14.2051 20.8398 15.1904M14.1201 14.1201C13.8457 14.415 13.5137 14.6514 13.1465 14.8154C12.7783 14.9795 12.3809 15.0674 11.9785 15.0742C11.5752 15.0811 11.1748 15.0078 10.8018 14.8564C10.4277 14.7061 10.0889 14.4814 9.80371 14.1963C9.51855 13.9111 9.29395 13.5723 9.14355 13.1982C8.99219 12.8252 8.91895 12.4248 8.92578 12.0215C8.93262 11.6191 9.02051 11.2217 9.18457 10.8535C9.34863 10.4863 9.58496 10.1543 9.87988 9.87988" stroke="#979797" stroke-opacity="1.000000" stroke-width="2.000000" stroke-linejoin="round"/>
+		<path id="Vector" d="M1 1L23 23" stroke="#979797" stroke-opacity="1.000000" stroke-width="2.000000" stroke-linejoin="round" stroke-linecap="round"/>
+	</g>
+</svg>
diff --git a/src/widgets/forms/ProfileForm/icons/eye-on.svg b/src/widgets/forms/ProfileForm/icons/eye-on.svg
new file mode 100644
index 0000000..feb18f7
--- /dev/null
+++ b/src/widgets/forms/ProfileForm/icons/eye-on.svg
@@ -0,0 +1,15 @@
+<svg width="24.000000" height="24.000000" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+	<desc>
+			Created with Pixso.
+	</desc>
+	<defs>
+		<clipPath id="clip1668_50161">
+			<rect id="eye" width="24.000000" height="24.000000" fill="white" fill-opacity="0"/>
+		</clipPath>
+	</defs>
+	<rect id="eye" width="24.000000" height="24.000000" fill="#FFFFFF" fill-opacity="0"/>
+	<g clip-path="url(#clip1668_50161)">
+		<path id="Vector" d="M12 4C19 4 23 12 23 12C23 12 19 20 12 20C5 20 1 12 1 12C1 12 5 4 12 4Z" stroke="#979797" stroke-opacity="1.000000" stroke-width="2.000000" stroke-linejoin="round"/>
+		<path id="Vector" d="M12 15C10.3428 15 9 13.6572 9 12C9 10.3428 10.3428 9 12 9C13.6572 9 15 10.3428 15 12C15 13.6572 13.6572 15 12 15Z" stroke="#979797" stroke-opacity="1.000000" stroke-width="2.000000" stroke-linejoin="round"/>
+	</g>
+</svg>