diff --git a/src/AppRouters.jsx b/src/AppRouters.jsx index 8b51e72..268a456 100644 --- a/src/AppRouters.jsx +++ b/src/AppRouters.jsx @@ -16,6 +16,7 @@ import CalendarPage from './views/CalendarPage' import SettingsPage from './views/SettingsPage' import ProductPage from './views/ProductPage' import SocketIOContextProvider from './component/context/SocketIOContext'; +import CSignupPage from './views/CSignupPage'; function AppRouters() { return ( @@ -27,7 +28,8 @@ function AppRouters() { } /> } /> } /> - } /> + } /> + } /> {/* protected routes */} diff --git a/src/component/auth/CSignup.jsx b/src/component/auth/CSignup.jsx new file mode 100644 index 0000000..c38db83 --- /dev/null +++ b/src/component/auth/CSignup.jsx @@ -0,0 +1,174 @@ +import React, { useEffect, useState } from 'react' +import { Form, Formik } from "formik"; +import * as Yup from "yup"; + +// import LoginImg from '../../assets/bg/login.svg' + +import { Link, useNavigate, useParams, useSearchParams } from 'react-router-dom' +import siteLinks from '../../links/siteLinks' +import { useMutation } from '@tanstack/react-query'; +import { signUpUser } from '../../services/services'; + +const validationSchema = Yup.object().shape({ + email: Yup.string() + .email("Wrong email format") + // .matches( + // /^[^0-9][a-zA-Z0-9._%+-]+@[a-zA-Z]+(\.[a-zA-Z]+)+$/, + // "Invalid email format" + // ) + .min(3, "Minimum 3 characters") + .max(50, "Maximum 50 characters") + .required("Email is required"), + password: Yup.string().required("Password is required"), + confirmpassword: Yup.string().required("Confirm Password is required").oneOf([Yup.ref('password')], 'Passwords must match') + // lastname: Yup.string().required("Lastname is required"), + // isChecked: Yup.bool().oneOf([true], "Please accept the terms & policy"), // use bool instead of boolean + }) + + const initialValues = { + email: '', + password: '', + confirmpassword: '', + // lastname: '', + // isChecked: false, + }; + +export default function CSignup() { + + const {jwt} = useParams() + + const navigate = useNavigate() + + const mutation = useMutation({ + mutationFn: (fields) => { + return signUpUser(fields) + }, + onSuccess: (res) => { + console.log('res', res) + } + }) + + const CSignUp = (values) => { + // helpers.resetForm() + // console.log('values', values, helpers) + // mutation.mutate(values) + console.log('values', values) + } + + useEffect(()=>{ + if(!jwt){ + return navigate(siteLinks.login, {replace: true}) + } + }) + + return ( +
+
+
+
+
+
+
+
+
+

MERMS Panel

+

Welcome, Enter your password.

+ + {(props) => { + return ( +
+
+ {!mutation.isSuccess ? + <> + {/*
+
+ + +
+
*/} +
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+ + {/*
+
+ + +
+ {props.errors.isChecked} +
*/} + + {mutation.error && + <> +
+

{mutation.error.message}

+
+ + } + +
+ +
+ + : +
+
+

Check your email to continue.

+ Home +
+
+ } + +
+ Need help with logging in or signing up? +
+ +
+ {/*

Already have an account ? Sign In

*/} +

Ready our Privacy Statement

+
+
+
+ ); + }} + +
+
+
+ {/*
+
+
+ +
+
+
*/} +
+
+
+
+ +
+
+ ) +} diff --git a/src/links/siteLinks.js b/src/links/siteLinks.js index 952d319..5bd0e20 100644 --- a/src/links/siteLinks.js +++ b/src/links/siteLinks.js @@ -11,7 +11,8 @@ const siteLinks = { settings: '/settings', login: '/auth/login', signup: '/auth/signup', - forgetpwd: '/auth/forgetpwd' + forgetpwd: '/auth/forgetpwd', + csignup: '/csignup/:jwt' } export default siteLinks \ No newline at end of file diff --git a/src/views/CSignupPage.jsx b/src/views/CSignupPage.jsx new file mode 100644 index 0000000..c4a96c2 --- /dev/null +++ b/src/views/CSignupPage.jsx @@ -0,0 +1,8 @@ +import React from 'react' +import CSignup from '../component/auth/CSignup' + +export default function CSignupPage() { + return ( + + ) +}