diff --git a/src/pages/Login.tsx b/src/pages/Login.tsx
index 8ed712f3..9d075f98 100644
--- a/src/pages/Login.tsx
+++ b/src/pages/Login.tsx
@@ -1,155 +1,197 @@
-import axios from 'axios';
-import { useState, useContext, useEffect } from 'react';
-import { useNavigate, Link } from 'react-router-dom';
-import { AuthContext } from '../context/auth';
+import axios from "axios";
+import { useState, useContext, useEffect } from "react";
+import { useNavigate, Link } from "react-router-dom";
+import { AuthContext } from "../context/auth";
import {
- Box,
- Typography,
- TextField,
- Button,
- CircularProgress,
-} from '@mui/material';
+ Box,
+ Typography,
+ TextField,
+ Button,
+ CircularProgress,
+} from "@mui/material";
import { useGlobalInfoStore } from "../context/globalInfo";
import { apiUrl } from "../apiConfig";
const Login = () => {
- const [form, setForm] = useState({
- email: '',
- password: '',
- });
- const [loading, setLoading] = useState(false);
- const { notify } = useGlobalInfoStore();
- const { email, password } = form;
+ const [form, setForm] = useState({
+ email: "",
+ password: "",
+ });
+ const [loading, setLoading] = useState(false);
+ const { notify } = useGlobalInfoStore();
+ const { email, password } = form;
- const { state, dispatch } = useContext(AuthContext);
- const { user } = state;
+ const { state, dispatch } = useContext(AuthContext);
+ const { user } = state;
- const navigate = useNavigate();
+ const navigate = useNavigate();
- useEffect(() => {
- if (user) {
- navigate('/');
- }
- }, [user, navigate]);
+ useEffect(() => {
+ if (user) {
+ navigate("/");
+ }
+ }, [user, navigate]);
- const handleChange = (e: any) => {
- const { name, value } = e.target;
- setForm({ ...form, [name]: value });
- };
+ const handleChange = (e: any) => {
+ const { name, value } = e.target;
+ setForm({ ...form, [name]: value });
+ };
- const submitForm = async (e: any) => {
- e.preventDefault();
- setLoading(true);
- try {
- const { data } = await axios.post(`${apiUrl}/auth/login`, { email, password });
- dispatch({ type: 'LOGIN', payload: data });
- notify('success', 'Welcome to Maxun!');
- window.localStorage.setItem('user', JSON.stringify(data));
- navigate('/');
- } catch (err: any) {
- notify('error', err.response.data || 'Login Failed. Please try again.');
- setLoading(false);
- }
- };
+ const submitForm = async (e: any) => {
+ e.preventDefault();
+ setLoading(true);
+ try {
+ const { data } = await axios.post(`${apiUrl}/auth/login`, {
+ email,
+ password,
+ });
+ dispatch({ type: "LOGIN", payload: data });
+ notify("success", "Welcome to Maxun!");
+ window.localStorage.setItem("user", JSON.stringify(data));
+ navigate("/");
+ } catch (err: any) {
+ notify("error", err.response.data || "Login Failed. Please try again.");
+ setLoading(false);
+ }
+ };
- return (
-
+
+
+ Welcome Back!
+
+
+
+
+
-
-
-
- Don’t have an account?{' '}
-
- Register
-
-
-
-
-
- );
+
+ Don’t have an account?{" "}
+
+ Register
+
+
+
+
+ );
};
export default Login;
diff --git a/src/pages/Register.tsx b/src/pages/Register.tsx
index c5bdbde0..59006c76 100644
--- a/src/pages/Register.tsx
+++ b/src/pages/Register.tsx
@@ -1,124 +1,202 @@
-import { useState, useContext, useEffect } from 'react';
-import { useNavigate, Link } from 'react-router-dom';
-import axios from 'axios';
-import { AuthContext } from '../context/auth';
-import { TextField, Button, CircularProgress, Typography, Box, Container } from '@mui/material';
+import { useState, useContext, useEffect } from "react";
+import { useNavigate, Link } from "react-router-dom";
+import axios from "axios";
+import { AuthContext } from "../context/auth";
+import {
+ TextField,
+ Button,
+ CircularProgress,
+ Typography,
+ Box,
+ Container,
+} from "@mui/material";
import { useGlobalInfoStore } from "../context/globalInfo";
import { apiUrl } from "../apiConfig";
const Register = () => {
- const [form, setForm] = useState({
- email: '',
- password: '',
- });
- const [loading, setLoading] = useState(false);
- const { notify } = useGlobalInfoStore();
- const { email, password } = form;
+ const [form, setForm] = useState({
+ email: "",
+ password: "",
+ });
+ const [loading, setLoading] = useState(false);
+ const { notify } = useGlobalInfoStore();
+ const { email, password } = form;
- const { state, dispatch } = useContext(AuthContext);
- const { user } = state;
- const navigate = useNavigate();
+ const { state, dispatch } = useContext(AuthContext);
+ const { user } = state;
+ const navigate = useNavigate();
- useEffect(() => {
- if (user !== null) navigate('/');
- }, [user, navigate]);
+ useEffect(() => {
+ if (user !== null) navigate("/");
+ }, [user, navigate]);
- const handleChange = (e: any) => {
- const { name, value } = e.target;
- setForm({ ...form, [name]: value });
- };
+ const handleChange = (e: any) => {
+ const { name, value } = e.target;
+ setForm({ ...form, [name]: value });
+ };
- const submitForm = async (e: any) => {
- e.preventDefault();
- setLoading(true);
- try {
- const { data } = await axios.post(`${apiUrl}/auth/register`, {
- email,
- password,
- });
- dispatch({
- type: 'LOGIN',
- payload: data,
- });
- notify('success', 'Welcome to Maxun!');
- window.localStorage.setItem('user', JSON.stringify(data));
- navigate('/');
- } catch (err: any) {
- notify('error', err.response.data || 'Registration Failed. Please try again.');
- } finally {
- setLoading(false);
- }
- };
+ const submitForm = async (e: any) => {
+ e.preventDefault();
+ setLoading(true);
+ try {
+ const { data } = await axios.post(`${apiUrl}/auth/register`, {
+ email,
+ password,
+ });
+ dispatch({
+ type: "LOGIN",
+ payload: data,
+ });
+ notify("success", "Welcome to Maxun!");
+ window.localStorage.setItem("user", JSON.stringify(data));
+ navigate("/");
+ } catch (err: any) {
+ notify(
+ "error",
+ err.response.data || "Registration Failed. Please try again."
+ );
+ } finally {
+ setLoading(false);
+ }
+ };
- return (
-
+
+
+ Create an account
+
+
+
+
-
- );
+ {loading ? (
+ <>
+
+ Loading
+
+ ) : (
+ "Register"
+ )}
+
+
+ Already have an account?{" "}
+
+ Login
+
+
+
+
+ );
};
export default Register;