Auth pull request

ShareBookCode · Feb 16, 2025 · 381b23e · 381b23e
1 parent 0191d33
commit 381b23e
Show file tree

Hide file tree

Showing 14 changed files with 115 additions and 125 deletions.
diff --git a/locales/en/auth.json b/locales/en/auth.json
@@ -13,7 +13,6 @@
   "newPassword": "Enter your new password",
   "confirmPassword": "Confirm your password",
   "name": "Name",
-  "login": "@Username",
   "city": "City (optionally)",
 
   "buttonSignIn": "Sign In",
@@ -35,7 +34,6 @@
 
   "messageEmailEmpty": "Please input your email",
   "messageNameEmpty": "Please input your name",
-  "messageLoginEmpty": "Please input your login",
   "messagePasswordEmpty": "Please input your password",
   "messagePasswordLength": "Minimum 8 characters",
   "messagePasswordDontMatch": "The passwords don't match",

diff --git a/locales/ru/auth.json b/locales/ru/auth.json
@@ -13,7 +13,6 @@
   "newPassword": "Введите новый пароль",
   "confirmPassword": "Повторите пароль",
   "name": "Имя",
-  "login": "@Юзернейм",
   "city": "Город (необязательно)",
 
   "buttonSignIn": "Войти",
@@ -35,7 +34,6 @@
 
   "messageEmailEmpty": "Пожалуйста, введите свой e-mail",
   "messageNameEmpty": "Пожалуйста, введите своё имя",
-  "messageLoginEmpty": "Пожалуйста, введите свой логин",
   "messagePasswordEmpty": "Пожалуйста, введите свой пароль",
   "messagePasswordLength": "Минимум 8 символов",
   "messagePasswordDontMatch": "Пароли не совпадают",

diff --git a/openapi-config.json b/openapi-config.json
@@ -4,5 +4,9 @@
   "apiImport": "emptySplitApi",
   "outputFile": "./src/services/api/sharebookApi.ts",
   "exportName": "sharebookApi",
-  "hooks": true
+  "hooks": {
+    "queries": true,
+    "lazyQueries": true,
+    "mutations": true
+  }
 }
diff --git a/src/AppRouter.tsx b/src/AppRouter.tsx
@@ -1,4 +1,10 @@
-import { BrowserRouter, Route, Routes, StaticRouter } from "react-router";
+import {
+  BrowserRouter,
+  Navigate,
+  Route,
+  Routes,
+  StaticRouter,
+} from "react-router";
 import { Home } from "./pages/home/Home.tsx";
 import { HeaderComponent } from "./components/Header";
 import { Favourites } from "./pages/favourites/Favourites.tsx";
@@ -26,6 +32,7 @@ export function AppRouter({ location }: { location: string }) {
         <Route path="/createBook" element={<CreateBook />} />
         <Route path="/chats" element={<Chat />} />
         <Route path="/auth" element={<Auth />}>
+          <Route index element={<Navigate to="signUp" replace />} />
           <Route path="signIn" element={<SignIn />} />
           <Route path="signUp" element={<SignUp />} />
           <Route path="signUpName" element={<SignUpName />} />

diff --git a/src/index.css b/src/index.css
@@ -6,6 +6,10 @@ body {
    margin-top: 3px;
 }
 
+.ant-input-password-icon {
+  display: flex;
+}
+
 @font-face {
   font-family: "Literata-Medium";
   src: url("./fonts/Literata-Medium.woff") format("woff");

diff --git a/src/pages/auth/ForgotPassword/ForgotPassword.tsx b/src/pages/auth/ForgotPassword/ForgotPassword.tsx
@@ -1,19 +1,29 @@
-import { Button, Form, Input } from "antd";
+import { Button, Form, FormProps, Input } from "antd";
 import styles from "../auth.module.scss";
 import { SvgPasswordShow } from "../svg/SvgPasswordShow.tsx";
 import { SvgPasswordHide } from "../svg/SvgPasswordHide.tsx";
 import { useTranslation } from "react-i18next";
-import { useDisabledForm } from "../hooks/useDisabledForm.tsx";
+import { useSendResetPasswordEmailMutation } from "../../../services/api/sharebookApi.ts";
 
 export function ForgotPassword() {
   const { t } = useTranslation("auth");
-  const { form, disabledButton, handleFormChange } = useDisabledForm();
+  const [resetPassword] = useSendResetPasswordEmailMutation();
+
+  const onFinish: FormProps["onFinish"] = async (values) => {
+    console.log("Success:", values);
+    try {
+      await resetPassword({ e }).unwrap();
+      navigate("/");
+    } catch (err) {
+      console.log("err:", err);
+    }
+  };
 
   return (
     <div className={styles.containerContent}>
       <h1 className={styles.title}>{t("titleForgotPassword")}</h1>
       <div>
-        <Form autoComplete="off" form={form} onChange={handleFormChange}>
+        <Form onFinish={onFinish} autoComplete="off">
           <div className={styles.containerForm}>
             <Form.Item
               name="email"
@@ -92,7 +102,6 @@ export function ForgotPassword() {
             className={styles.buttonAuth}
             type="primary"
             htmlType="submit"
-            disabled={disabledButton}
           >
             {t("buttonResetPassword")}
           </Button>

diff --git a/src/pages/auth/GoToEmail/GoToEmail.tsx b/src/pages/auth/GoToEmail/GoToEmail.tsx
@@ -1,21 +1,16 @@
-import styles from "../auth.module.scss";
 import extraStyles from "./goToEmail.module.scss";
-import { Button } from "antd";
 import { useTranslation } from "react-i18next";
+import { useSearchParams } from "react-router";
 
 export function GoToEmail() {
   const { t } = useTranslation("auth");
+  const [searchParams] = useSearchParams();
 
   return (
     <div className={extraStyles.containerContent}>
       <h1 className={extraStyles.title}>
-        {t("titleGoToEmail")} {"[email protected]"}
+        {t("titleGoToEmail")} {searchParams.get("email")}
       </h1>
-      <div className={styles.containerForm}>
-        <Button className={styles.buttonAuth} type="primary" htmlType="submit">
-          {t("buttonRepeatLetter")}
-        </Button>
-      </div>
     </div>
   );
 }
diff --git a/src/pages/auth/GoToEmail/goToEmail.module.scss b/src/pages/auth/GoToEmail/goToEmail.module.scss
@@ -6,7 +6,6 @@
 }
 
 .title {
-	margin-bottom: 20px;
 	width: 538px;
 
 	font-family: 'Onest-SemiBold', sans-serif;

diff --git a/src/pages/auth/SignIn/SignIn.tsx b/src/pages/auth/SignIn/SignIn.tsx
@@ -7,13 +7,10 @@ import { SvgPasswordShow } from "../svg/SvgPasswordShow.tsx";
 import { useTranslation } from "react-i18next";
 import styles from "../auth.module.scss";
 import extraStyles from "./signIn.module.scss";
-import { useDisabledForm } from "../hooks/useDisabledForm.tsx";
 
 export function SignIn() {
   const { t } = useTranslation("auth");
   const navigate = useNavigate();
-  const { form, disabledButton, handleFormChange } = useDisabledForm();
-
   const [login, { isLoading }] = useAuthMutation();
 
   const onFinish: FormProps["onFinish"] = async (values) => {
@@ -31,19 +28,17 @@ export function SignIn() {
       <h1 className={styles.title}>{t("titleSignIn")}</h1>
       <div>
         <Form
-          form={form}
           initialValues={{ remember: true }}
           onFinish={onFinish}
           autoComplete="off"
-          onChange={handleFormChange}
         >
           <div className={styles.containerForm}>
             <Form.Item
-              name="login"
+              name="email"
               rules={[
                 {
                   required: true,
-                  message: t("messageLoginEmpty"),
+                  message: t("messageEmailEmpty"),
                 },
               ]}
             >
@@ -82,7 +77,6 @@ export function SignIn() {
             type="primary"
             htmlType="submit"
             loading={isLoading}
-            disabled={disabledButton}
           >
             {t("buttonSignIn")}
           </Button>

diff --git a/src/pages/auth/SignUp/SignUp.tsx b/src/pages/auth/SignUp/SignUp.tsx
@@ -3,14 +3,12 @@ import styles from "../auth.module.scss";
 import extraStyles from "./signUp.module.scss";
 import { Link, useNavigate, useSearchParams } from "react-router";
 import { useTranslation } from "react-i18next";
-import { useDisabledForm } from "../hooks/useDisabledForm.tsx";
 
 const regex =
   /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/;
 
 export function SignUp() {
   const { t } = useTranslation("auth");
-  const { form, disabledButton, handleFormChange } = useDisabledForm();
   const [searchParams] = useSearchParams();
   const navigate = useNavigate();
 
@@ -29,12 +27,10 @@ export function SignUp() {
       </h1>
       <div>
         <Form
-          form={form}
           preserve={false}
           initialValues={{ email: searchParams.get("email") }}
           autoComplete="off"
           onFinish={onFinish}
-          onChange={handleFormChange}
         >
           <div className={styles.containerForm}>
             <Form.Item
@@ -64,7 +60,6 @@ export function SignUp() {
             className={styles.buttonAuth}
             type="primary"
             htmlType="submit"
-            disabled={disabledButton}
           >
             {t("buttonNext")}
           </Button>

diff --git a/src/pages/auth/SignUpName/SignUpName.tsx b/src/pages/auth/SignUpName/SignUpName.tsx
@@ -2,35 +2,30 @@ import { Button, Form, FormProps, Input } from "antd";
 import styles from "../auth.module.scss";
 import { useNavigate, useSearchParams } from "react-router";
 import { useTranslation } from "react-i18next";
-import { useDisabledForm } from "../hooks/useDisabledForm.tsx";
 
 export function SignUpName() {
   const { t } = useTranslation("auth");
-  const { form, disabledButton, handleFormChange } = useDisabledForm();
   const [searchParams] = useSearchParams();
   const navigate = useNavigate();
 
   const onFinish: FormProps["onFinish"] = (values) => {
     searchParams.set("name", values.name);
-    searchParams.set("login", values.login);
-    searchParams.set("city", values.city);
+    if (values.city == null) searchParams.set("city", "");
+    else searchParams.set("city", values.city);
     navigate(`/auth/signUpPassword?${searchParams.toString()}`);
   };
 
   return (
     <div className={styles.containerContent}>
       <h1 className={styles.title}>{t("titleSignUp")}</h1>
       <Form
-        form={form}
         preserve={false}
         initialValues={{
           name: searchParams.get("name"),
-          login: searchParams.get("login"),
           city: searchParams.get("city"),
         }}
         autoComplete="off"
         onFinish={onFinish}
-        onChange={handleFormChange}
       >
         <div className={styles.containerForm}>
           <Form.Item
@@ -44,27 +39,11 @@ export function SignUpName() {
           >
             <Input placeholder={t("name")} />
           </Form.Item>
-          <Form.Item
-            name="login"
-            rules={[
-              {
-                required: true,
-                message: t("messageLoginEmpty"),
-              },
-            ]}
-          >
-            <Input placeholder={t("login")} />
-          </Form.Item>
           <Form.Item name="city">
             <Input placeholder={t("city")} />
           </Form.Item>
         </div>
-        <Button
-          className={styles.buttonAuth}
-          type="primary"
-          htmlType="submit"
-          disabled={disabledButton}
-        >
+        <Button className={styles.buttonAuth} type="primary" htmlType="submit">
           {t("buttonNext")}
         </Button>
       </Form>

diff --git a/src/pages/auth/SignUpPassword/SignUpPassword.tsx b/src/pages/auth/SignUpPassword/SignUpPassword.tsx
@@ -6,11 +6,9 @@ import { useRegisterUserMutation } from "../../../services/api/sharebookApi.ts";
 import { SvgPasswordShow } from "../svg/SvgPasswordShow.tsx";
 import { SvgPasswordHide } from "../svg/SvgPasswordHide.tsx";
 import { useTranslation } from "react-i18next";
-import { useDisabledForm } from "../hooks/useDisabledForm.tsx";
 
 export function SignUpPassword() {
   const { t } = useTranslation("auth");
-  const { form, disabledButton, handleFormChange } = useDisabledForm();
   const navigate = useNavigate();
   const [searchParams] = useSearchParams();
 
@@ -22,15 +20,15 @@ export function SignUpPassword() {
       const registerValues = {
         userRegistrationDto: {
           name: searchParams.get("name") || "",
-          login: searchParams.get("login") || "",
+          login: "test",
           password: values.password || "",
           passwordConfirm: values.passwordConfirm || "",
           email: searchParams.get("email") || "",
           city: searchParams.get("city") || "",
         },
       };
-      navigate(`/auth/goToEmail?${searchParams.toString()}`);
       await register(registerValues).unwrap();
+      navigate(`/auth/goToEmail?${searchParams.toString()}`);
     } catch (err) {
       console.log("err:", err);
     }
@@ -41,11 +39,9 @@ export function SignUpPassword() {
       <h1 className={styles.title}>{t("titleSignUp")}</h1>
       <div>
         <Form
-          form={form}
           initialValues={{ remember: true }}
           onFinish={onFinish}
           autoComplete="off"
-          onChange={handleFormChange}
         >
           <div className={styles.containerForm}>
             <Form.Item
@@ -116,7 +112,6 @@ export function SignUpPassword() {
             type="primary"
             htmlType="submit"
             loading={isLoading}
-            disabled={disabledButton}
           >
             {t("buttonNext")}
           </Button>

diff --git a/src/pages/auth/hooks/useDisabledForm.tsx b/src/pages/auth/hooks/useDisabledForm.tsx