From e1534be41b4f67791a500f0a030aaefe34185347 Mon Sep 17 00:00:00 2001
From: mihail323i21 <mihail323i21@gmail.com>
Date: Sat, 18 Nov 2023 02:11:47 +0500
Subject: [PATCH] =?UTF-8?q?=D0=B4=D0=BE=D0=B1=D0=B0=D0=B2=D0=BB=D1=8F?=
 =?UTF-8?q?=D0=B5=D1=82=20=D0=B0=D0=B2=D1=82=D0=BE=D1=80=D0=B8=D0=B7=D0=B0?=
 =?UTF-8?q?=D1=86=D0=B8=D1=8E=20=D0=BF=D0=BE=20=D0=B4=D0=B0=D0=BD=D0=BD?=
 =?UTF-8?q?=D1=8B=D0=BC=20=D0=B8=D0=B7=20=D1=84=D0=BE=D1=80=D0=BC=D1=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../authentication/Authentication.tsx         | 29 +++++--------------
 frontend/src/routes/AppRouter.tsx             |  5 ++++
 frontend/src/store/authStore.ts               | 28 ++++++++++++++++++
 3 files changed, 41 insertions(+), 21 deletions(-)

diff --git a/frontend/src/components/authentication/Authentication.tsx b/frontend/src/components/authentication/Authentication.tsx
index 06859e4..2ccf92c 100644
--- a/frontend/src/components/authentication/Authentication.tsx
+++ b/frontend/src/components/authentication/Authentication.tsx
@@ -1,11 +1,10 @@
 import React, {useState} from 'react';
-import {useNavigate} from "react-router-dom";
 import './../../styles/authentication.scss'
 import CustomButton from "../../UIComponents/customButton/CustomButton.tsx";
 import CustomCheckbox from "../../UIComponents/customCheckbox/CustomCheckbox.tsx";
 import authStore from "../../store/authStore.ts";
 import {observer} from "mobx-react-lite";
-import axios from "axios";
+import {useNavigate} from "react-router-dom";
 
 const Authentication: React.FC = observer(() => {
     const navigateTo = useNavigate()
@@ -15,22 +14,6 @@ const Authentication: React.FC = observer(() => {
         setIsPasswordShow(!isPasswordShows)
     }
 
-
-    const signIn = () => {
-        axios.post("http://localhost:8000/auth/login", {
-            username: "user@example.com",
-            password: "ashdjashdjsahjdhsadsa",
-        })
-            .then(() => authStore.signInUser())
-            .catch((reason) => alert(reason))
-
-        navigateTo('/map')
-    }
-
-    const onHandleChangePassword = (target: string) => {
-        authStore.changeUserPassword(target)
-    }
-
     return (
         <div className="auth-page">
             <form className="auth__form">
@@ -47,10 +30,10 @@ const Authentication: React.FC = observer(() => {
                     <div className="auth-data__field">
                         {isPasswordShows
                             ? <input type="text" className="password__input" value={authStore.userPassword}
-                                     onChange={(e) => onHandleChangePassword(e.target.value)}
+                                     onChange={(e) => authStore.changeUserPassword(e.target.value)}
                                      placeholder="Пароль"/>
                             : <input type="password" className="password__input" value={authStore.userPassword}
-                                     onChange={(e) => onHandleChangePassword(e.target.value)}
+                                     onChange={(e) => authStore.changeUserPassword(e.target.value)}
                                      placeholder="Пароль"/>}
 
                     </div>
@@ -58,7 +41,11 @@ const Authentication: React.FC = observer(() => {
                 <CustomCheckbox text="Показать пароль" id="is-remember"
                                 additionalClassName="is-remember-password__checkbox"
                                 handleOnChange={changeShowPassword}/>
-                <CustomButton additionalClassName="auth__btn" text="ВОЙТИ" handleOnClick={signIn}/>
+                <CustomButton additionalClassName="auth__btn" text="ВОЙТИ111" handleOnClick={() => {
+                    authStore.signIn().then(() => navigateTo('/map'))
+                }}/>
+                <CustomButton additionalClassName="auth__btn" text="ЗАРЕГИСТРИРОВАТЬСЯ"
+                              handleOnClick={authStore.signUp}/>
             </form>
             <CustomButton text="Вернуться обратно" handleOnClick={() => navigateTo('/')}></CustomButton>
         </div>
diff --git a/frontend/src/routes/AppRouter.tsx b/frontend/src/routes/AppRouter.tsx
index 9f6e4f0..5843c86 100644
--- a/frontend/src/routes/AppRouter.tsx
+++ b/frontend/src/routes/AppRouter.tsx
@@ -22,6 +22,11 @@ const AppRouter: React.FC = observer(() => {
     ]
 
     const privateRoutes: RouteType[] = [
+        {
+            id: 2,
+            element: <Authentication/>,
+            path: "/login",
+        },
         {
             id: 3,
             element: <MapMenu/>,
diff --git a/frontend/src/store/authStore.ts b/frontend/src/store/authStore.ts
index e98388f..53ff120 100644
--- a/frontend/src/store/authStore.ts
+++ b/frontend/src/store/authStore.ts
@@ -1,4 +1,6 @@
 import {makeAutoObservable} from "mobx";
+import axios from "axios";
+
 
 class AuthStore {
     isUserAuthorized: boolean = false
@@ -24,6 +26,32 @@ class AuthStore {
     changeUserPassword(newPassword: string) {
         this.userPassword = newPassword
     }
+
+    async signIn() {
+        this.signInUser()
+        axios.post("http://localhost:8000/auth/login", {
+            username: this.userLogin,
+            password: this.userPassword,
+        })
+            .then((resp) => {
+                console.log(resp.data)
+                this.signInUser()
+            })
+            .catch((reason) => {
+                alert(reason)
+                this.signOutUser()
+            })
+    }
+
+    signUp() {
+        axios.post("http://localhost:8000/auth/register", {
+            username: this.userLogin,
+            email: this.userLogin + "@example.com",
+            password: this.userPassword
+        })
+            .then(r => console.log(r.data))
+            .catch(reason => console.log(reason))
+    }
 }
 
 export default new AuthStore()