Merge branch 'Landing_pages' of https://git.marcoaiot.com/admin/marco.pms.web into Landing_pages

src/pages/authentication/AuthWrapper.jsx

@@ -4,10 +4,13 @@ import "./page-auth.css";
 export const AuthWrapper = ({ children }) => {
   return (
     <div className="container-xxl">
+      {/* <div className="authentication-wrapper authentication-basic container-p-y">
       {/* <div className="authentication-wrapper authentication-basic container-p-y">
         <div className="authentication-inner">
+          <div className="card"> */}
           <div className="card"> */}
             <div className="card-body">
+              <div className="app-brand justify-content-center" >
               <div className="app-brand justify-content-center" >
                 <Link
                   aria-label="Go to Home Page"
@@ -23,11 +26,14 @@ export const AuthWrapper = ({ children }) => {
                   </span>
                 </Link>
               {/* </div> */}
+              {/* </div> */}
               {children}
             </div>
           </div>
         </div>
       // </div>
     // </div>
+      // </div>
+    // </div>
   );
 };

src/pages/authentication/ForgotPasswordPage.jsx

@@ -1,5 +1,6 @@
 import { useState } from "react";
 import { Link } from "react-router-dom";
+import { Link } from "react-router-dom";
 import { AuthWrapper } from "./AuthWrapper"
 import "./page-auth.css";
 import AuthRepository from "../../repositories/AuthRepository";
@@ -7,16 +8,21 @@ import showToast from "../../services/toastService";
 import { useForm } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
+import { z } from "zod";
 
 
+const forgotPassSceham = z.object({
 const forgotPassSceham = z.object({
   email: z.string().email(),
 })
+})
 
 const ForgotPasswordPage = () => {
 
   const [loding, setLoading] = useState(false)
+  const [loding, setLoading] = useState(false)
 
+  const { register,
   const { register,
     handleSubmit,
     formState: { errors },
@@ -27,15 +33,28 @@ const ForgotPasswordPage = () => {
         email: ""
       }
     })
+    getValues } = useForm({
+      resolver: zodResolver(forgotPassSceham),
+      defaultValues: {
+        email: ""
+      }
+    })
 
+  const onSubmit = async (data) => {
+    try {
   const onSubmit = async (data) => {
     try {
       setLoading(true)
       const response = await AuthRepository.forgotPassword(data)
+      if (response.data && response.success)
+        showToast("verification email has been sent to your registered email address", "success")
+      const response = await AuthRepository.forgotPassword(data)
       if (response.data && response.success)
         showToast("verification email has been sent to your registered email address", "success")
       reset()
       setLoading(false)
+    } catch (err) {
+      setLoading(false)
     } catch (err) {
       reset()
       if (err.response.status === 404) {
@@ -44,6 +63,12 @@ const ForgotPasswordPage = () => {
         showToast("Something wrong", "error")
       }
 
+      if (err.response.status === 404) {
+        showToast("verification email has been sent to your registered email address", "success")
+      } else {
+        showToast("Something wrong", "error")
+      }
+
       setLoading(false)
     }
   }
@@ -97,6 +122,11 @@ const ForgotPasswordPage = () => {
 
       </div>
     </div>
+
+        {/* Footer Text */}
+
+      </div>
+    </div>
   );
 };
 

src/pages/authentication/LoginPage.jsx

@@ -1,11 +1,13 @@
 import { useEffect, useState } from "react";
 import { Link, useNavigate } from "react-router-dom";
+import { Link, useNavigate } from "react-router-dom";
 import AuthRepository from "../../repositories/AuthRepository";
 import showToast from "../../services/toastService";
 import { useForm } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 import { AuthWrapper } from "./AuthWrapper";
+import { AuthWrapper } from "./AuthWrapper";
 
 const LoginPage = () => {
   const navigate = useNavigate();
@@ -18,11 +20,17 @@ const LoginPage = () => {
     ? z.object({
         username: z.string().email({ message: "Valid email required" }),
       })
+        username: z.string().email({ message: "Valid email required" }),
+      })
     : z.object({
         username: z.string().email({ message: "Valid email required" }),
         password: z.string().min(1, { message: "Password required" }),
         rememberMe: z.boolean(),
       });
+        username: z.string().email({ message: "Valid email required" }),
+        password: z.string().min(1, { message: "Password required" }),
+        rememberMe: z.boolean(),
+      });
 
   const {
     register,
@@ -74,6 +82,7 @@ const LoginPage = () => {
     }
   }, [IsLoginWithOTP]);
 
+
   return (
     <div className="col-12 col-lg-5 col-xl-4 d-flex align-items-center p-4 p-sm-5 bg-gray-60">
       <div className="w-100" style={{ maxWidth: 420, margin: "0 auto" }}>
@@ -164,20 +173,52 @@ const LoginPage = () => {
               </div>
             </>
           )}
+              {/* Remember Me + Forgot Password */}
+              <div className="mb-3 d-flex justify-content-between align-items-center">
+                <div className="form-check">
+                  <input
+                    type="checkbox"
+                    id="remember-me"
+                    className="form-check-input"
+                    {...register("rememberMe")}
+                  />
+                  <label className="form-check-label" htmlFor="remember-me">
+                    Remember Me
+                  </label>
+                </div>
+                <Link
+                  to="/auth/forgot-password"
+                  className="text-decoration-none"
+                >
+                  Forgot Password?
+                </Link>
+              </div>
+            </>
+          )}
 
+          {/* Submit */}
           {/* Submit */}
           <button
             type="submit"
             className="btn btn-primary w-100"
             disabled={loading}
+            className="btn btn-primary w-100"
+            disabled={loading}
           >
             {loading
               ? "Please Wait..."
               : IsLoginWithOTP
               ? "Send OTP"
               : "Sign In"}
+            {loading
+              ? "Please Wait..."
+              : IsLoginWithOTP
+              ? "Send OTP"
+              : "Sign In"}
           </button>
 
+          {/* Login With OTP Button */}
+
           {/* Login With OTP Button */}
           {!IsLoginWithOTP && (
             <>
@@ -192,9 +233,40 @@ const LoginPage = () => {
                 Login With OTP
               </button>
             </>
+            <>
+              <div className="divider my-4">
+                <div className="divider-text">or</div>
+              </div>
+              <button
+                type="button"
+                className="btn btn-outline-secondary w-100"
+                onClick={() => setLoginWithOtp(true)}
+              >
+                Login With OTP
+              </button>
+            </>
           )}
         </form>
+        </form>
 
+        {/* Footer Text */}
+        {!IsLoginWithOTP ? (
+          <p className="text-center mt-3">
+            <span>New on our platform? </span>
+            <Link to="/auth/reqest/demo" className="btn btn-link p-0">
+              Request a Demo
+            </Link>
+          </p>
+        ) : (
+          <div className="text-center mt-3">
+            <button
+              className="btn btn-link p-0"
+              onClick={() => setLoginWithOtp(false)}
+            >
+              <i className="bx bx-chevron-left scaleX-n1-rtl bx-sm"></i>
+              Back to login
+            </button>
+          </div>
         {/* Footer Text */}
         {!IsLoginWithOTP ? (
           <p className="text-center mt-3">
@@ -216,6 +288,8 @@ const LoginPage = () => {
         )}
       </div>
     </div>
+      </div>
+    </div>
   );
 };
 

src/pages/authentication/RegisterPage.jsx

@@ -58,6 +58,7 @@ const RegisterPage = () => {
     fetchIndustries();
   }, []);
 
+  useEffect(() => { }, [industries]);
   useEffect(() => { }, [industries]);
 
   const fetchIndustries = async () => {
@@ -81,6 +82,7 @@ const RegisterPage = () => {
           <form
             id="formAuthentication"
             className="mb-2"
+            className="mb-2"
             onSubmit={handleSubmit(onSubmit)}
           >
           <div className="row">
@@ -178,6 +180,7 @@ const RegisterPage = () => {
               <label className="form-label" htmlFor="contactnumber">
                 About Organization
               </label>
+              <div className="input-group">
               <div className="input-group">
                 <textarea
                   id="about"
@@ -197,6 +200,7 @@ const RegisterPage = () => {
                 </div>
               )}
             </div>
+            <div className="mb-2 form-password-toggle text-start">
             <div className="mb-2 form-password-toggle text-start">
               <label className="form-label" htmlFor="oragnizationSize">
                 Organization Size
@@ -224,6 +228,7 @@ const RegisterPage = () => {
                 </div>
               )}
             </div>
+            <div className="mb-2 form-password-toggle text-start">
             <div className="mb-2 form-password-toggle text-start">
               <label className="form-label" htmlFor="industryId">
                 Industry
@@ -255,6 +260,7 @@ const RegisterPage = () => {
                 </div>
               )}
             </div>
+            <div className="mb-2 text-start">
             <div className="mb-2 text-start">
               <div className="form-check">
                 <input
@@ -265,16 +271,21 @@ const RegisterPage = () => {
                   {...register("terms")}
                 />
                 <label className="form-check-label" htmlFor="terms-conditions">
+                  I agree to{" "}
                   I agree to{" "}
                   <Link
                     to="/legal-info"
                     aria-label="privacy policy and terms"
                     className="text-decoration-underline"
+                    aria-label="privacy policy and terms"
+                    className="text-decoration-underline"
                   >
                     privacy policy & terms
+                    privacy policy & terms
                   </Link>
                 </label>
 
+
               </div>
               {errors.terms && (
                 <div
@@ -286,6 +297,7 @@ const RegisterPage = () => {
               )}
             </div>
             <button
+              aria-label="Click me "
               aria-label="Click me "
               className="btn btn-primary d-grid w-100"
             >
@@ -294,18 +306,23 @@ const RegisterPage = () => {
           </form>
 
           <p className="text-center">
+            <span>Already have an account? </span>
             <span>Already have an account? </span>
             <Link
               aria-label="Go to Login Page"
               to="/auth/login"
               className="text-decoration-underline ms-1"
+              className="text-decoration-underline ms-1"
             >
+              <i className="bx bx-chevron-left scaleX-n1-rtl bx-sm me-1"></i>
               <i className="bx bx-chevron-left scaleX-n1-rtl bx-sm me-1"></i>
               Back to login
             </Link>
           </p>
         </div>
       </div>
+        </div>
+      </div>
     </>
   );
 };

src/router/AppRoutes.jsx

@@ -46,6 +46,7 @@ import MainResetPasswordPage from "../pages/authentication/MainResetPasswordPage
 
 const router = createBrowserRouter(
   [
+    { path: "/", element: <LandingPage /> },
     { path: "/", element: <LandingPage /> },
     {
       element: <AuthLayout />,