From 1b9e1df7dda1d6791378a3a0d103d5ac719aa69a Mon Sep 17 00:00:00 2001 From: EseAlli Date: Wed, 3 Nov 2021 23:18:21 +0100 Subject: [PATCH 1/2] login and signup page for admin dashboard --- src/App.js | 12 +++ src/styles/components/_textinput.scss | 20 +++-- src/styles/views/_admin.scss | 46 +++++++++++ src/styles/views/_index.scss | 2 +- src/views/admin/AuthPage.jsx | 22 +++++ src/views/admin/LoginForm.jsx | 100 +++++++++++++++++++++++ src/views/admin/SignUpForm.jsx | 111 ++++++++++++++++++++++++++ 7 files changed, 307 insertions(+), 6 deletions(-) create mode 100644 src/styles/views/_admin.scss create mode 100644 src/views/admin/AuthPage.jsx create mode 100644 src/views/admin/LoginForm.jsx create mode 100644 src/views/admin/SignUpForm.jsx diff --git a/src/App.js b/src/App.js index 9fa91b9..c510d32 100644 --- a/src/App.js +++ b/src/App.js @@ -10,6 +10,8 @@ import Resources from "../src/views/resources/resources"; import ForgotPassword from "./views/Auth/ForgotPassword"; import ResetPassword from "./views/Auth/ResetPassword"; import Admin from "./views/admin/joint"; +import AdminLogin from "./views/admin/LoginForm" +import AdminSignup from "./views/admin/SignUpForm" import { ProtectedRoute, GuestRoute } from './components/routes'; @@ -20,6 +22,16 @@ function App() { + + +
+
+ +
+
{children}
+
+
+
+ + ); +} + +export default AuthPage; diff --git a/src/views/admin/LoginForm.jsx b/src/views/admin/LoginForm.jsx new file mode 100644 index 0000000..33c313a --- /dev/null +++ b/src/views/admin/LoginForm.jsx @@ -0,0 +1,100 @@ +import React, { useState } from "react"; +import Auth from "./AuthPage"; +import {signin} from "../Auth/AuthService"; +import { useHistory } from "react-router-dom"; +import { useUserContext } from "../../context/AuthContext" + +const LoginForm = () => { + const initialState = { + email: "", + password: "" + } + const [state, setState] = useState(initialState); + const { setToken, setUser } = useUserContext() + const [errorMsg, setErrorMsg] = useState(" ") + const [loading, setLoading] = useState(false) + const history = useHistory(); + + const [showPassword, setShowPassword] = useState(false) + + const togglePassword = () => { + setShowPassword(!showPassword) + } + + const handleChange = (e) => { + const { name, value } = e.target; + console.log(state) + setState({ ...state, [name]: value }); + }; + + const handleSubmit = (event) => { + setLoading(true) + event.preventDefault() + signin(state).then((response) => { + if(response.data){ + const {data} = response?.data + if (data.message){ + setToken(data.token) + setUser(data.user) + history.push(`/dashboard`); + } + setLoading(false) + } + else{ + setErrorMsg("Could not Sign User In, Check Credentials") + setLoading(false) + } + }); + }; + + return ( + +
+
+

Log In

+

Enter your assigned SCA email address to gain access to the platform.

+
+
+
{errorMsg}
+ + + {/*
+ + +
*/} + + +
+

+ Don't have access? + + Request Access + +

+
+ +
+ + ); +}; + +export default LoginForm; diff --git a/src/views/admin/SignUpForm.jsx b/src/views/admin/SignUpForm.jsx new file mode 100644 index 0000000..f517f2f --- /dev/null +++ b/src/views/admin/SignUpForm.jsx @@ -0,0 +1,111 @@ +import React, { useState } from "react"; +import Auth from "./AuthPage"; +import {signup} from "../Auth/AuthService"; +import { useHistory } from "react-router-dom"; + +import { useUserContext } from "../../context/AuthContext"; + +const SignUpForm = () => { + const initialState = { + email: "", + } + + const [state, setState] = useState(initialState); + const { setToken, setUser } = useUserContext() + const [errorMsg, setErrorMsg] = useState('') + const history = useHistory(); + const [loading, setLoading] = useState(false) + + const [showPassword, setShowPassword] = useState(false) + + const togglePassword = () => { + setShowPassword(!showPassword) + } + + const handleChange = (e) => { + const { name, value } = e.target; + setState({ ...state, [name]: value }); + }; + + + const handleSubmit = (event) => { + event.preventDefault() + setLoading(true) + signup(state).then((response) => { + if(response.data){ + const { data } = response.data + if (data.message) { + setToken(data.token) + setUser(data.user) + history.push(`/dashboard`); + } + setLoading(false) + } + else{ + console.log(response) + setErrorMsg("Could not Create Account, Check Credentials") + setLoading(false) + } + }) + .catch((error) => { + console.log(error); + setLoading(false) + setErrorMsg(error) + }) + }; + return ( + +
+
+

Request Access

+

Enter your assigned SCA email address and why you’ll like to gain access to the platform.

+
+
{errorMsg}
+
+ + + {/*
+ + +
*/} + + + + + +
+

+ Already have an account ? + + Login + +

+
+ +
+ + ); +}; + +export default SignUpForm; From b07817c9badc7e5fa55b26b48adaf1b376194d2d Mon Sep 17 00:00:00 2001 From: maryam-olabisi Date: Thu, 4 Nov 2021 01:32:24 +0100 Subject: [PATCH 2/2] tiny fixes --- src/views/admin/SignUpForm.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/views/admin/SignUpForm.jsx b/src/views/admin/SignUpForm.jsx index f517f2f..5a91189 100644 --- a/src/views/admin/SignUpForm.jsx +++ b/src/views/admin/SignUpForm.jsx @@ -88,11 +88,11 @@ const SignUpForm = () => { /> */} - - +