shortened the url of the auth, fixed sidebar toggle issue and fixed browser tab

components/_App/Layout.js

@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import Head from "next/head";
 import { useRouter } from "next/router";
 import LeftSidebar from "@/components/_App/LeftSidebar";
@@ -12,20 +12,30 @@ const Layout = ({ children }) => {
   const router = useRouter();
   const [active, setActive] = useState(false);
 
+  const [isAuthenticationPage, setIsAuthenticationPage] = useState(false);
+
   const toggleActive = () => {
     setActive(!active);
   };
 
-  const isAuthenticationPage = [
-    "/authentication/sign-in",
-    "/authentication/sign-up",
-    "/authentication/forgot-password",
-    "/authentication/lock-screen",
-    "/authentication/confirm-mail",
-    "/authentication/logout",
-  ].includes(router.pathname);
+  useEffect(() => {
+    const authenticationPages = [
+      "/auth",
+      "/auth/sign-in",
+      "/auth/sign-up",
+      "/auth/forgot-password",
+      "/auth/lock-screen",
+      "/auth/confirm-mail",
+      "/auth/logout",
+    ];
 
-  const title = isAuthenticationPage ? "CMC - Authentication" : "CMC - Client";
+    setIsAuthenticationPage(authenticationPages.includes(router.pathname));
+  }, [router.pathname]);
+
+  // Debugging: Log the value of isAuthenticationPage
+  console.log("isAuthenticationPage:", isAuthenticationPage, router.pathname);
+
+  const title = isAuthenticationPage ? "CMC - auth" : "CMC - dashboard";
 
   return (
     <>
@@ -34,24 +44,22 @@ const Layout = ({ children }) => {
         <meta name="viewport" content="initial-scale=1.0, width=device-width" />
       </Head>
 
-      <AuthRoute>
-        <div className={`main-wrapper-content ${active ? "active" : ""}`}>
-          {!isAuthenticationPage && (
-            <>
-              <TopNavbar toggleActive={toggleActive} />
-              <LeftSidebar toggleActive={toggleActive} />
-            </>
-          )}
+      <div className={`main-wrapper-content ${active ? "active" : ""}`}>
+        {!isAuthenticationPage && (
+          <>
+            <TopNavbar toggleActive={toggleActive} />
+            <LeftSidebar toggleActive={toggleActive} />
+          </>
+        )}
 
-          <div className="main-content">{children}</div>
+        <div className="main-content">{children}</div>
 
-          {!isAuthenticationPage && <Footer />}
-        </div>
+        {!isAuthenticationPage && <Footer />}
+      </div>
 
-        <ScrollToTop />
+      <ScrollToTop />
 
-        {!isAuthenticationPage && <ControlPanelModal />}
-      </AuthRoute>
+      {!isAuthenticationPage && <ControlPanelModal />}
     </>
   );
 };