diff --git a/src/Routers.jsx b/src/Routers.jsx index 4d71669..eecec75 100755 --- a/src/Routers.jsx +++ b/src/Routers.jsx @@ -22,6 +22,7 @@ import UpdatePasswordPages from "./views/UpdatePasswordPages"; import UploadProductPage from "./views/UploadProductPage"; import UserProfilePage from "./views/UserProfilePage"; import VerifyYouPages from "./views/VerifyYouPages"; +import VerifySignupPage from "./views/VerifySignupPage"; import RemindersPage from './views/RemindersPage'; import RemindersAddPage from './views/RemindersAddPage'; @@ -49,6 +50,7 @@ export default function Routers() { element={} /> } /> + } /> {/* private route */} }> diff --git a/src/components/AuthPages/SignUp/CompleteSignUp/index.jsx b/src/components/AuthPages/SignUp/CompleteSignUp/index.jsx new file mode 100644 index 0000000..5e452bb --- /dev/null +++ b/src/components/AuthPages/SignUp/CompleteSignUp/index.jsx @@ -0,0 +1,48 @@ +import React from "react"; + +export default function ThankYou({ className }) { + return ( +
+
+
+

+ SignUp Completed +

+
+
+ + + + +
+
+

+ Thank you ! +

+

+ Your account is verified +

+
+ + Login to continue + +
+
+ ); +} diff --git a/src/components/AuthPages/SignUp/VerifySignup/Otp.jsx b/src/components/AuthPages/SignUp/VerifySignup/Otp.jsx new file mode 100644 index 0000000..ea07d94 --- /dev/null +++ b/src/components/AuthPages/SignUp/VerifySignup/Otp.jsx @@ -0,0 +1,73 @@ +import React, { useEffect } from "react"; + +export default function Otp() { + useEffect(() => { + const otp = document.querySelector("#otp-inputs"); + // eslint-disable-next-line no-restricted-syntax + for (const pin of otp.children) { + // eslint-disable-next-line no-loop-func + pin.onkeyup = () => { + if (pin.nextSibling) { + pin.nextSibling.children.otp.focus(); + } + }; + } + }); + return ( + <> +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ + ); +} diff --git a/src/components/AuthPages/SignUp/VerifySignup/index.jsx b/src/components/AuthPages/SignUp/VerifySignup/index.jsx new file mode 100644 index 0000000..d103b3c --- /dev/null +++ b/src/components/AuthPages/SignUp/VerifySignup/index.jsx @@ -0,0 +1,46 @@ +import React from "react"; +import titleShape from "../../../../assets/images/shape/text-shape-three.svg"; +import AuthLayout from "../../AuthLayout"; +import Otp from "./Otp"; + +export default function VerifyYou() { + return ( + <> + +
+
+
+

+ SignUp Verification +

+
+ shape +
+
+
+ + +
+

+ Dont’t have an aceount ? + + Please resend + +

+
+
+
+
+ + + ); +} diff --git a/src/components/AuthPages/SignUp/index.jsx b/src/components/AuthPages/SignUp/index.jsx index 72d2426..55769f6 100755 --- a/src/components/AuthPages/SignUp/index.jsx +++ b/src/components/AuthPages/SignUp/index.jsx @@ -4,8 +4,10 @@ import googleLogo from "../../../assets/images/google-logo.svg"; import logo from "../../../assets/images/light-logo.png"; //logo-1.svg"; import titleShape from "../../../assets/images/shape/title-shape-two.svg"; import InputCom from "../../Helpers/Inputs/InputCom"; +import { Link, useNavigate } from 'react-router-dom'; export default function SignUp() { + const navigate = useNavigate(); const [checked, setValue] = useState(false); const rememberMe = () => { setValue(!checked); @@ -127,14 +129,15 @@ export default function SignUp() {
- - Sign Up - - navigate("/verify-signup")} + > + Sign Up + + {/* navigate("/verify-you")} className="w-full border border-light-purple dark:border-[#5356fb29] rounded-[50px] h-[58px] flex justify-center bg-[#FAFAFA] dark:bg-[#11131F] items-center" > Sign Up with Google - + */}

diff --git a/src/views/VerifySignupPage.jsx b/src/views/VerifySignupPage.jsx new file mode 100644 index 0000000..96767a1 --- /dev/null +++ b/src/views/VerifySignupPage.jsx @@ -0,0 +1,7 @@ +import React from "react"; +import VerifyYou from "../components/AuthPages/VerifyYou"; +import VerifySignup from "../components/AuthPages/SignUp/VerifySignup"; + +export default function VerifySignupPage() { + return ; +} \ No newline at end of file