From 46621f60c098909df7654d2b2ead68c2292ac1fd Mon Sep 17 00:00:00 2001 From: victorAnumudu Date: Mon, 30 Dec 2024 19:17:52 +0100 Subject: [PATCH] added select country in complete signup page --- src/component/auth/CSignup.jsx | 237 +++++++++++++++++++-------------- src/services/services.js | 8 ++ 2 files changed, 145 insertions(+), 100 deletions(-) diff --git a/src/component/auth/CSignup.jsx b/src/component/auth/CSignup.jsx index c38db83..c2b203d 100644 --- a/src/component/auth/CSignup.jsx +++ b/src/component/auth/CSignup.jsx @@ -2,35 +2,27 @@ 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 { Link, useNavigate, useParams } from 'react-router-dom' import siteLinks from '../../links/siteLinks' import { useMutation } from '@tanstack/react-query'; -import { signUpUser } from '../../services/services'; +import { verifyEmail } from '../../services/services'; + +import { IoMdArrowDropdown } from "react-icons/io"; 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") + country: Yup.string().required("Username is required"), + username: Yup.string().min(3, "Minimum 3 characters") .max(50, "Maximum 50 characters") - .required("Email is required"), + .required("Username 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: '', + username: '', password: '', + country: '', confirmpassword: '', - // lastname: '', - // isChecked: false, }; export default function CSignup() { @@ -39,19 +31,33 @@ export default function CSignup() { const navigate = useNavigate() - const mutation = useMutation({ +// API to verify email link + const verifyLink = useMutation({ mutationFn: (fields) => { - return signUpUser(fields) + return verifyEmail(fields) }, onSuccess: (res) => { console.log('res', res) + }, + onError: (err) => { + console.log('err', err) } }) - const CSignUp = (values) => { - // helpers.resetForm() - // console.log('values', values, helpers) - // mutation.mutate(values) + const cSignup = useMutation({ + mutationFn: (fields) => { + return null + }, + onSuccess: (res) => { + console.log('res', res) + }, + onError: (err) => { + console.log('err', err) + } + }) + + const completeSignup = (values) => { + // cSignup() console.log('values', values) } @@ -59,7 +65,8 @@ export default function CSignup() { if(!jwt){ return navigate(siteLinks.login, {replace: true}) } - }) + verifyLink.mutate({verify_link: jwt}) + }, []) return (
@@ -72,87 +79,117 @@ export default function CSignup() {

MERMS Panel

-

Welcome, Enter your password.

- Welcome, Enter your password.

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

{mutation.error.message}

-
- - } - -
- -
- - : -
-
-

Check your email to continue.

- Home +
+
+ {verifyLink.isPending ? +
+
+
+

loading...

- } +
+ : verifyLink.isSuccess ? +
+ + {(props) => { + return ( + +
+ <> +
+
+ + {/* */} +
+
+
+
+ +
+ + +
+ {/* */} +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+ + {/*
+
+ + +
+ {props.errors.isChecked} +
*/} -
- Need help with logging in or signing up? -
- -
- {/*

Already have an account ? Sign In

*/} -

Ready our Privacy Statement

-
+ {cSignup.error && + <> +
+

{cSignup.error.message}

+
+ + } + +
+ +
+ +
+ + ); + }} + +
+ : +
+
+
+

{verifyLink?.error?.message}

+
+
+
+ } + +
+ Need help with logging in or signing up?
- - ); - }} - + +
+

Read our Privacy Statement

+
+
+
+
diff --git a/src/services/services.js b/src/services/services.js index 700be83..d1c41ee 100644 --- a/src/services/services.js +++ b/src/services/services.js @@ -58,6 +58,14 @@ export const signUpUser = (reqData) => { return postAuxEnd('/panel/auth/register', postData, false) } +// FUNCTION TO VERIFY EMAIL +export const verifyEmail = (reqData) => { + let postData = { + ...reqData + } + return postAuxEnd('/panel/auth/register/verify', postData, false) +} + // FUNCTION TO RESET USER PASSWORD export const recoverPWD = (reqData) => {