fix word

src/App.tsx

@@ -1,64 +1,15 @@
-import React, { Suspense, lazy, useEffect } from "react";
-import { Route, Routes, useNavigate } from "react-router-dom";
-import Layout from "./Layout/Ui/Layout";
+import { Suspense, lazy } from "react";
+import { Route, Routes } from "react-router-dom";
 import { CrudRoute, menuItems } from "./Routes";
 import { Spin } from "antd";
 import { hasAbility } from "./utils/hasAbility";
-import { useChangeLanguage } from "./Hooks/useChangeLanguage";
-import useAuthState from "./zustand/AuthState";
-import { TMenuItem } from "./types/App";
-import { useTranslation } from "react-i18next";
-import SpinContainer from "./Components/Layout/SpinContainer";
+import { renderRoutesRecursively } from "./Components/Routes/RenderRoutesRecursively";
+import { RenderRouteElement } from "./Components/Routes/RenderRouteElement";
 
 const Page404 = lazy(() => import("./Layout/Ui/NotFoundPage"));
 const Auth = lazy(() => import("./Pages/Auth/Page"));
 
 const App = () => {
-  const { changeLanguage } = useChangeLanguage();
-  const navigate = useNavigate();
-  const { isAuthenticated } = useAuthState();
-  const [t] = useTranslation();
-
-  useEffect(() => {
-    if (!isAuthenticated) {
-      navigate("/auth");
-    }
-  }, [isAuthenticated, navigate]);
-
-  const renderRouteElement = (route: any) => (
-    <Suspense
-      fallback={
-        <Layout>
-          {" "}
-          <SpinContainer />{" "}
-        </Layout>
-      }
-    >
-      {route.header ? (
-        <Layout>{route.element}</Layout>
-      ) : (
-        route.element || <h1>please Create the Page</h1>
-      )}
-    </Suspense>
-  );
-
-  const renderRoutesRecursively = (routes: TMenuItem[]) =>
-    routes.map((route: TMenuItem) => {
-      const useAbility = hasAbility(route.abilities, route.abilities_value);
-      const tableHeader = t(`${route?.header}`);
-      // useSetPageTitle(tableHeader,route?.path);
-
-      if (useAbility) {
-        return (
-          <React.Fragment key={route.path}>
-            <Route path={route.path} element={renderRouteElement(route)} />
-            {route.children && renderRoutesRecursively(route.children)}
-          </React.Fragment>
-        );
-      }
-      return null;
-    });
-
   return (
     <Routes>
       <Route
@@ -66,8 +17,7 @@ const App = () => {
         path={"/auth"}
         element={
           <Suspense fallback={<Spin />}>            
-            {" "}
-            <Auth />{" "}
+            <Auth />
           </Suspense>
         }
       />
@@ -76,8 +26,7 @@ const App = () => {
         path={"/*"}
         element={
           <Suspense fallback={<Spin />}>   
-            {" "}
-            <Page404 />{" "}
+            <Page404 />
           </Suspense>
         }
       />
@@ -86,9 +35,6 @@ const App = () => {
 
       {CrudRoute.map((route) => {
         const useAbility = hasAbility(route.abilities, route.abilities_value);
-        const tableHeader = t(`${route?.header}`);
-        // useSetPageTitle(tableHeader,route?.path);
-
         if (!useAbility) {
           return false;
         }
@@ -96,7 +42,7 @@ const App = () => {
           <Route
             key={route.path ?? ""}
             path={route.path ?? ""}
-            element={renderRouteElement(route)}
+            element={RenderRouteElement(route)}
           />
         );
       })}

src/Components/Layout/Navbar/DropdownToggle.tsx

@@ -0,0 +1,16 @@
+import { MdExpandLess, MdExpandMore } from "react-icons/md";
+
+interface DropdownToggleProps {
+  isOpen: boolean;
+  onClick: () => void;
+}
+
+const DropdownToggle: React.FC<DropdownToggleProps> = ({ isOpen, onClick }) => {
+  return (
+    <div className="DropDownIcon" onClick={onClick}>
+      {isOpen ? <MdExpandLess /> : <MdExpandMore />}
+    </div>
+  );
+};
+
+export default DropdownToggle;

src/Components/Layout/Navbar/MenuItem.tsx

@@ -0,0 +1,37 @@
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Link, useNavigate } from "react-router-dom";
+import DropdownToggle from "./DropdownToggle"; // Adjust the import path as necessary
+import SubMenu from "./SubMenu"; // Adjust the import path as necessary
+
+export const MenuItem = ({ item, location, index }: any) => {
+  const isActive = location.pathname.split("/")[1] === item.path?.slice(1);
+  const [openDropdown, setOpenDropdown] = useState<number | null>(null);
+  const [t] = useTranslation();
+  const navigate = useNavigate();
+
+  const handleDropdown = (index: number) => {
+    setOpenDropdown((prev) => (prev === index ? null : index));
+  };
+
+  const isDropdownOpen = openDropdown === index;
+
+  return (
+    <>
+      <div
+        className={`link ${isActive ? "active" : ""} ${item?.children && "DropDownLink"}`}
+        onClick={() => navigate(item.path || "/")}
+      >
+        <i>{item.icon}</i>
+        <Link to={item.path || "/"}>{t(item.text)}</Link>
+        {item?.children && (
+          <DropdownToggle isOpen={isDropdownOpen} onClick={() => handleDropdown(index)} />
+        )}
+      </div>
+
+      {item?.children && isDropdownOpen && (
+        <SubMenu items={item.children} location={location} />
+      )}
+    </>
+  );
+};

src/Components/Layout/Navbar/NavBarRightSide.tsx

@@ -0,0 +1,54 @@
+import React from 'react'
+import { getLocalStorage } from '../../../utils/LocalStorage';
+import { USER_KEY } from '../../../config/AppKey';
+import { translateOptions } from '../../../utils/translatedOptions';
+import { search_array } from '../../../Routes';
+import { useTranslation } from 'react-i18next';
+import SearchFieldWithSelect from '../../DataTable/SearchFieldWithSelect';
+import { Tooltip } from 'antd';
+import useModalHandler from '../../../utils/useModalHandler';
+import { ModalEnum } from '../../../enums/Model';
+import Image from '../../Ui/Image';
+const NavBarRightSide = () => {
+    const userData = getLocalStorage(USER_KEY);
+    const [t] = useTranslation()
+    const translateArray = translateOptions(search_array, t);
+  
+    const { handel_open_model } = useModalHandler();
+    const handleEdit = () => {
+        handel_open_model(ModalEnum.CHANGE_PASSWORD);
+      };
+  return (
+    <article>
+    <div className="header_search">
+      <SearchFieldWithSelect
+        options={translateArray}
+        placeholder={t("practical.search_here")}
+      />
+    </div>
+    <span className="header_icons">
+      <div>
+        <Image src="/Icon/bell.png" alt="Notifications" />
+      </div>
+      <Tooltip
+        placement="top"
+        title={<div onClick={handleEdit}>{t("header.change_your_current_password")}</div>}
+        color="#E0E0E0"
+      >
+        <div className="gear">
+          <Image src="/Icon/gear.png" alt="Settings" />
+        </div>
+      </Tooltip>
+    </span>
+    <div className="header_profile">
+      <span>
+        <h6>{userData?.username}</h6>
+        <p>{userData?.type}</p>
+      </span>
+      <Image src="/Layout/DefaultStudentImage.png" alt="Profile" />
+    </div>
+  </article>
+  )
+}
+
+export default NavBarRightSide

src/Components/Layout/Navbar/SubMenu.tsx

@@ -0,0 +1,19 @@
+import React from "react";
+import { MenuItem } from "./MenuItem"; // Adjust the import path as necessary
+
+interface SubMenuProps {
+  items: any[];
+  location: any;
+}
+
+const SubMenu: React.FC<SubMenuProps> = ({ items, location }) => {
+  return (
+    <div className="sub-menu">
+      {items.map((childItem, index) => (
+        <MenuItem key={index} item={childItem} location={location} index={index} />
+      ))}
+    </div>
+  );
+};
+
+export default SubMenu;

src/Components/Layout/SideBar/MenuItem.tsx

@@ -0,0 +1,63 @@
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { MdExpandLess, MdExpandMore } from "react-icons/md";
+import { Link, useNavigate } from "react-router-dom";
+
+export const MenuItem = ({ item, location, index }: any) => {
+    const isActive = location.pathname.split("/")[1] === item.path?.slice(1);
+    // console.log(location.pathname.split("/")[1]);
+  
+    const [openDropdown, setOpenDropdown] = useState<number | null>(null);
+  
+    const handleDropdown = (index: number) => {
+      setOpenDropdown((prev) => (prev === index ? null : index));
+    };
+  
+    const isDropdownOpen = openDropdown === index;
+    const [t] = useTranslation();
+    const navigate = useNavigate();
+  
+    return (
+      <>
+        <div
+          className={`link ${isActive ? "active" : ""} ${item?.children && "DropDownLink"} `}
+          onClick={() => navigate(item.path || "/")}
+        >
+          <i>{item.icon}</i>
+          <Link to={item.path || "/"}>{t(item.text)}</Link>
+          {item?.children && (
+            <>
+              {isDropdownOpen ? (
+                <div
+                  className="DropDownIcon"
+                  onClick={() => handleDropdown(index)}
+                >
+                  <MdExpandLess />
+                </div>
+              ) : (
+                <div
+                  className="DropDownIcon"
+                  onClick={() => handleDropdown(index)}
+                >
+                  <MdExpandMore />
+                </div>
+              )}
+            </>
+          )}
+        </div>
+  
+        {item?.children && isDropdownOpen && (
+          <div className="sub-menu">
+            {item.children.map((childItem: any, index: any) => (
+              <MenuItem
+                key={index}
+                item={childItem}
+                location={location}
+                index={index}
+              />
+            ))}
+          </div>
+        )}
+      </>
+    );
+  };

src/Components/Layout/Tabs/TabsBar.tsx

@@ -15,7 +15,7 @@ const TabsBar = ({ steps }: any) => {
           !step.hidden && (
             <div
               onClick={() => handleTabClick(index)}
-              className={`ModelBodyTab ${ActiveTab === index ? "activeModeltab" : ""}`}
+              className={`ModelBodyTab ${ActiveTab === index ? "activeModelTab" : ""}`}
               key={index}
             >
               <div>{index + 1}</div>

src/Components/Routes/RenderRouteElement.tsx

@@ -0,0 +1,19 @@
+import { Suspense } from "react";
+import SpinContainer from "../Layout/SpinContainer";
+import Layout from "../../Layout/Ui/Layout";
+
+export const RenderRouteElement = (route: any) => (
+    <Suspense
+      fallback={
+        <Layout>
+          <SpinContainer />
+        </Layout>
+      }
+    >
+      {route.header ? (
+        <Layout>{route.element}</Layout>
+      ) : (
+        route.element || <></>
+      )}
+    </Suspense>
+  );

src/Components/Routes/RenderRoutesRecursively.tsx

@@ -0,0 +1,20 @@
+import React from "react";
+import { TMenuItem } from "../../types/App";
+import { hasAbility } from "../../utils/hasAbility";
+import { Route } from "react-router-dom";
+import { RenderRouteElement } from "./RenderRouteElement";
+
+export const renderRoutesRecursively = (routes: TMenuItem[]) =>
+    routes.map((route: TMenuItem) => {
+      const useAbility = hasAbility(route.abilities, route.abilities_value);
+      if (!useAbility) {
+        return false;
+      }
+        return (
+          <React.Fragment key={route.path}>
+            <Route path={route.path} element={RenderRouteElement(route)} />
+            {route.children && renderRoutesRecursively(route.children)}
+          </React.Fragment>
+        );
+
+    });

src/Components/Utils/Translate.tsx

@@ -1,54 +0,0 @@
-import React, { memo } from "react";
-import type { MenuProps } from "antd";
-import { Button, Dropdown, Space } from "antd";
-import { useChangeLanguage } from "../../Hooks/useChangeLanguage";
-import { useTranslation } from "react-i18next";
-const Translate: React.FC = () => {
-  const { currentLanguage, changeLanguage } = useChangeLanguage();
-  const { t } = useTranslation();
-
-  const EnLanguage = memo(() => (
-    <div className="MenuChange" onClick={EnLanguageClickHandler}>
-      <img alt="" src="../Layout/En.svg" width={20} height={20} />
-      {t("En")}
-    </div>
-  ));
-
-  const ArLanguage = memo(() => (
-    <div className="MenuChange" onClick={ArLanguageClickHandler}>
-      <img alt="" src="../Layout/Ar.svg" width={20} height={20} />
-      {t("Ar")}
-    </div>
-  ));
-
-  const EnLanguageClickHandler = React.useCallback(() => {
-    changeLanguage("en");
-  }, [changeLanguage]);
-
-  const ArLanguageClickHandler = React.useCallback(() => {
-    changeLanguage("ar");
-  }, [changeLanguage]);
-
-  const items: MenuProps["items"] = [
-    {
-      key: "1",
-      label: <EnLanguage />,
-    },
-    {
-      key: "2",
-      label: <ArLanguage />,
-    },
-  ];
-
-  return (
-    <Space direction="vertical">
-      <Dropdown menu={{ items }} placement="top">
-        <Button disabled>
-          {currentLanguage === "en" ? <EnLanguage /> : <ArLanguage />}
-        </Button>
-      </Dropdown>
-    </Space>
-  );
-};
-
-export default Translate;

src/Hooks/useChangeLanguage.tsx

@@ -1,47 +0,0 @@
-import { useCallback, useLayoutEffect, useState } from "react";
-import translationEN from "../translate/en.json";
-import translationAR from "../translate/ar.json";
-import { initReactI18next } from "react-i18next";
-import i18n from "i18next"; // Make sure this import is correct
-import { LANGUAGE_KEY } from "../config/AppKey";
-
-i18n.use(initReactI18next).init({
-  resources: {
-    en: {
-      translation: translationEN,
-    },
-    ar: {
-      translation: translationAR,
-    },
-  },
-  lng: localStorage.getItem(LANGUAGE_KEY) || "ar",
-  interpolation: {
-    escapeValue: false,
-  },
-});
-
-export const useChangeLanguage = () => {
-  const [currentLanguage, setCurrentLanguage] = useState(
-    localStorage.getItem(LANGUAGE_KEY) || "ar",
-  );
-
-  useLayoutEffect(() => {
-    if (currentLanguage === "ar") {
-      i18n.changeLanguage("ar");
-      document.body.setAttribute("dir", "rtl");
-      document.body.classList.remove("en");
-    } else if (currentLanguage === "en") {
-      i18n.changeLanguage("en");
-      document.body.setAttribute("dir", "ltr");
-      document.body.classList.add("en");
-    }
-
-    localStorage.setItem(LANGUAGE_KEY, currentLanguage);
-  }, [currentLanguage]);
-
-  const changeLanguage = useCallback((newLanguage: any) => {
-    setCurrentLanguage(newLanguage);
-  }, []);
-
-  return { currentLanguage, changeLanguage };
-};

src/Hooks/useSetPageTitle.ts

@@ -1,12 +1,12 @@
 import { useEffect } from "react";
-import { usePage_titleState } from "../zustand/PageTitleState";
+import { usePageTitleState } from "../zustand/PageTitleState";
 
 const useSetPageTitle = (title: any) => {
-  const setPage_title = usePage_titleState((state) => state.setPage_title);
+  const setPageTitle = usePageTitleState((state) => state.setPageTitle);
 
   useEffect(() => {
-    setPage_title(title);
-  }, [title, setPage_title]);
+    setPageTitle(title);
+  }, [title, setPageTitle]);
 };
 
 export default useSetPageTitle;

src/Layout/Ui/Layout.tsx

@@ -1,10 +1,7 @@
-import React, { useEffect } from "react";
-import { useGetTitleFromRoute } from "../../Hooks/useGetTitleFromRoute";
-import { Helmet } from "react-helmet";
-import { useLocation } from "react-router-dom";
+import React from "react";
 import NavBar from "./NavBar";
 import SideBar from "./SideBar";
-import { USER_KEY } from "../../config/AppKey";
+import ProtectedRouteProvider from "../../lib/ProtectedRouteProvider";
 
 const Layout = ({
   children,
@@ -13,21 +10,17 @@ const Layout = ({
   children: React.ReactNode;
   className?: string;
 }) => {
-  const location = useLocation();
 
   return (
-    <>
-      <Helmet>
-        <title>{useGetTitleFromRoute(location.pathname)}</title>
-      </Helmet>
-      <div className="Layout">
+
+      <ProtectedRouteProvider className="Layout">
         <main className={`${className} Layout_Body`}>
           <NavBar />
           <div className="Layout_Children">{children}</div>
         </main>
         <SideBar />
-      </div>
-    </>
+      </ProtectedRouteProvider>
+   
   );
 };
 

src/Layout/Ui/NavBar.tsx

@@ -1,86 +1,40 @@
-import React from "react";
-import Image from "../../Components/Ui/Image";
-import SearchField from "../../Components/DataTable/SearchFieldWithSelect";
-import { usePage_titleState } from "../../zustand/PageTitleState";
+import React, { lazy, Suspense } from "react";
+
+import { usePageTitleState } from "../../zustand/PageTitleState";
 import { MdOutlineArrowForwardIos } from "react-icons/md";
-import { useLocation, useNavigate, useParams } from "react-router-dom";
-import { search_array } from "../../Routes";
-import { BRANCH_OBJECT_KEY, USER_KEY } from "../../config/AppKey";
-import { useTranslation } from "react-i18next";
-import { translateOptions } from "../../utils/translatedOptions";
-import { ParamsEnum } from "../../enums/params";
-import { Tooltip } from "antd";
-import useModalHandler from "../../utils/useModalHandler";
-import { ModalEnum } from "../../enums/Model";
-import ChangePasswordModel from "./model/AddModel";
-import { getLocalStorage } from "../../utils/LocalStorage";
+import { useLocation, useNavigate } from "react-router-dom";
 import { getPrevPathRoute } from "../../utils/getPrevPathRoute";
 import { deletePathSegments } from "../../utils/deletePathSegments";
+import SpinContainer from "../../Components/Layout/SpinContainer";
+import NavBarRightSide from "../../Components/Layout/Navbar/NavBarRightSide";
+
+// Lazy load the ChangePasswordModel
+const ChangePasswordModel = lazy(() => import("./model/AddModel"));
+
 const NavBar = () => {
-  const { Page_title } = usePage_titleState((state) => state);
-  const userData = getLocalStorage(USER_KEY);
-
-  const [t] = useTranslation();
+  const { PageTitle } = usePageTitleState((state) => state);
   const location = useLocation();
-
-  const translateArray = translateOptions(search_array, t);
   const navigate = useNavigate();
   const PrevPath = getPrevPathRoute(location.pathname);
 
+
   const handelNavigate = () => {
     if (PrevPath === 0) {
-      return 0;
+      return;
     }
     navigate(deletePathSegments(location.pathname, PrevPath));
   };
 
-  const { handel_open_model } = useModalHandler();
-  const handleEdit = (record: any) => {
-    handel_open_model(ModalEnum?.CHANGE_PASSWORD);
-  };
 
   return (
     <div className="NavBar">
       <span className="navbar_link" onClick={handelNavigate}>
-        <MdOutlineArrowForwardIos /> {Page_title}
+        <MdOutlineArrowForwardIos /> {PageTitle}
       </span>
-      <article>
-        <div className="header_search">
-          {/* <NavBarSelect /> */}
-
-          <SearchField
-            options={translateArray}
-            placeholder={t("practical.search_here")}
-          />
-        </div>
-        <span className="header_icons">
-          <div>
-            <Image src="/Icon/bell.png" />
-          </div>
-          <Tooltip
-            placement="top"
-            title={
-              <div onClick={handleEdit}>
-                {" "}
-                {t("header.change_your_current_password")}{" "}
-              </div>
-            }
-            color="#E0E0E0"
-          >
-            <div className="gear">
-              <Image src="/Icon/gear.png" />
-            </div>
-          </Tooltip>
-        </span>
-        <div className="header_profile">
-          <span>
-            <h6>{userData?.username}</h6>
-            <p>{userData?.type}</p>
-          </span>
-          <Image src="/Layout/DefultStudentImage.png" />
-        </div>
-      </article>
+      <NavBarRightSide/>
+      <Suspense fallback={<SpinContainer/>}>
         <ChangePasswordModel />
+      </Suspense>
     </div>
   );
 };

src/Layout/Ui/NotFoundPage.tsx

@@ -4,7 +4,7 @@ import { useNavigate } from "react-router-dom";
 function NotFoundPage() {
   const navigate = useNavigate();
   return (
-    <div className="not_foound_page">
+    <div className="not_found_page">
       <div className="container-not-found">
         <p>
           404 <h6>|</h6>This page could not be found

src/Layout/Ui/SideBar.tsx

@@ -1,72 +1,16 @@
-import React, { useState } from "react";
+import React from "react";
 import { Divider } from "antd";
-import { Link, useLocation, useNavigate } from "react-router-dom";
+import { useLocation, useNavigate } from "react-router-dom";
 import { menuItems } from "../../Routes";
-import { MdLogout, MdExpandMore, MdExpandLess } from "react-icons/md";
+import { MdLogout } from "react-icons/md";
 import useAuthState from "../../zustand/AuthState";
 import { hasAbility } from "../../utils/hasAbility";
 import { useTranslation } from "react-i18next";
 import { getLocalStorage } from "../../utils/LocalStorage";
 import { BRANCH_OBJECT_KEY } from "../../config/AppKey";
+import { MenuItem } from "../../Components/Layout/SideBar/MenuItem";
 
-const MenuItem = ({ item, location, index }: any) => {
-  const isActive = location.pathname.split("/")[1] === item.path?.slice(1);
-  // console.log(location.pathname.split("/")[1]);
 
-  const [openDropdown, setOpenDropdown] = useState<number | null>(null);
-
-  const handleDropdown = (index: number) => {
-    setOpenDropdown((prev) => (prev === index ? null : index));
-  };
-
-  const isDropdownOpen = openDropdown === index;
-  const [t] = useTranslation();
-  const navigate = useNavigate();
-
-  return (
-    <>
-      <div
-        className={`link ${isActive ? "active" : ""} ${item?.children && "DropDownLink"} `}
-        onClick={() => navigate(item.path || "/")}
-      >
-        <i>{item.icon}</i>
-        <Link to={item.path || "/"}>{t(item.text)}</Link>
-        {item?.children && (
-          <>
-            {isDropdownOpen ? (
-              <div
-                className="DropDownIcon"
-                onClick={() => handleDropdown(index)}
-              >
-                <MdExpandLess />
-              </div>
-            ) : (
-              <div
-                className="DropDownIcon"
-                onClick={() => handleDropdown(index)}
-              >
-                <MdExpandMore />
-              </div>
-            )}
-          </>
-        )}
-      </div>
-
-      {item?.children && isDropdownOpen && (
-        <div className="sub-menu">
-          {item.children.map((childItem: any, index: any) => (
-            <MenuItem
-              key={index}
-              item={childItem}
-              location={location}
-              index={index}
-            />
-          ))}
-        </div>
-      )}
-    </>
-  );
-};
 
 const SideBar = () => {
   const location = useLocation();

src/Layout/Ui/model/AddModel.tsx

@@ -5,7 +5,6 @@ import FormikForm from "../../../Layout/Dashboard/FormikFormModel";
 import ModelBody from "./Add";
 import { getInitialValues, getValidationSchema } from "./formUtil";
 import { ModalEnum } from "../../../enums/Model";
-import { useParams } from "react-router-dom";
 import { useObjectToEdit } from "../../../zustand/ObjectToEditState";
 import { useTranslation } from "react-i18next";
 import { useUpdateAdmin } from "../../../api/users";

src/Pages/lesson/Page.tsx

@@ -26,7 +26,7 @@ const TableHeader = () => {
       "/" +
       `${SubjectName}` +
       "/" +
-      t(`page_title.unit`) +
+      t(`PageTitle.unit`) +
       "/" +
       `${unitName}`,
   );

src/Pages/question/AddPage.tsx

@@ -59,15 +59,15 @@ const AddPage: React.FC = () => {
       "/" +
       `${SubjectName}` +
       "/" +
-      t(`page_title.unit`) +
+      t(`PageTitle.unit`) +
       "/" +
       `${unitName}` +
       "/" +
-      t(`page_title.lesson`) +
+      t(`PageTitle.lesson`) +
       "/" +
       `${lessonName}` +
       "/" +
-      t(`page_title.questions`),
+      t(`PageTitle.questions`),
   );
 
   const handleSubmit = (

src/Pages/question/EditPage.tsx

@@ -70,15 +70,15 @@ const EditPage: React.FC = () => {
       "/" +
       `${SubjectName}` +
       "/" +
-      t(`page_title.unit`) +
+      t(`PageTitle.unit`) +
       "/" +
       `${unitName}` +
       "/" +
-      t(`page_title.lesson`) +
+      t(`PageTitle.lesson`) +
       "/" +
       `${lessonName}` +
       "/" +
-      t(`page_title.questions`),
+      t(`PageTitle.questions`),
   );
 
   const handleSubmit = (values: any) => {

src/Pages/question/Page.tsx

@@ -24,15 +24,15 @@ const TableHeader = () => {
       "/" +
       `${SubjectName}` +
       "/" +
-      t(`page_title.unit`) +
+      t(`PageTitle.unit`) +
       "/" +
       `${unitName}` +
       "/" +
-      t(`page_title.lesson`) +
+      t(`PageTitle.lesson`) +
       "/" +
       `${lessonName}` +
       "/" +
-      t(`page_title.questions`),
+      t(`PageTitle.questions`),
   );
 
   return (

src/Pages/subject/show/FillterNavWithRadio.tsx

@@ -1,12 +1,12 @@
 import React, { useState } from "react";
 import { FaArrowRight, FaPlus } from "react-icons/fa";
 import { useButtonState } from "../../../zustand/ButtonState";
-import { usePage_titleState } from "../../../zustand/PageTitleState";
+import { usePageTitleState } from "../../../zustand/PageTitleState";
 
 const FillterNavWithRadio = () => {
   const [activeButton, setActiveButton] = useState(0);
   const { setActiveTab } = useButtonState((state) => state);
-  const { title } = usePage_titleState();
+  const { title } = usePageTitleState();
 
   // Function to handle button click
   const handleButtonClick = (index: number) => {

src/ProviderContainer.tsx

@@ -1,36 +1,25 @@
 import QueryProvider from "./lib/ReactQueryProvider";
 import { BrowserRouter } from "react-router-dom";
-import { Tchildren } from "./types/App";
+import { ChildrenType } from "./types/App";
 import ToastProvider from "./lib/ToastProvider";
-import { ConfigProvider } from "antd";
-
-function ProviderContainer({ children }: Tchildren) {
-  const primaryColor = "#3182ce";
-  const bgColor = "rgb(255, 255, 255)";
+import AntdProvider from "./lib/AntdProvider";
+import I18nProvider from "./lib/I18nProvider";
 
+function ProviderContainer({ children }: ChildrenType) {
   return (
     <BrowserRouter basename="/">
-      {/* <ReduxT> */}
+      <I18nProvider>
           <QueryProvider>
         <ToastProvider>
-          <ConfigProvider
-            theme={{
-              token: {
-                colorPrimary: primaryColor,
-              },
-              components: {
-                Table: {
-                  headerBg: bgColor,
-                  headerColor: primaryColor,
-                },
-              },
-            }}
-          >
+          <AntdProvider>
+
             {children}
-          </ConfigProvider>
+          </AntdProvider>
+  
         </ToastProvider>
       </QueryProvider>
-      {/* </ReduxT> */}
+ 
+        </I18nProvider>
     </BrowserRouter>
   );
 }

src/Routes.tsx

@@ -1,9 +1,6 @@
 import { TCrudRoute, TMenuItem } from "./types/App";
-import { FaHome, FaMoneyBill, FaUser } from "react-icons/fa";
-import { ImBooks } from "react-icons/im";
-import React, { lazy } from "react";
-
-// import Home from "./Pages/Home/Page";
+import { FaHome, FaMoneyBill } from "react-icons/fa";
+import React from "react";
 const Dummy = React.lazy(() => import("./Pages/Home/Dummy"));
 
 const Subject = React.lazy(() => import("./Pages/subject/Table/Page"));
@@ -16,10 +13,6 @@ const Question = React.lazy(() => import("./Pages/question/Page"));
 const AddQuestionPage = React.lazy(() => import("./Pages/question/AddPage"));
 const EditQuestionPage = React.lazy(() => import("./Pages/question/EditPage"));
 
-// const QuestionChildren = React.lazy(() => import('./Pages/question/children/Page'))
-// const AddQuestionChildren = React.lazy(() => import('./Pages/question/children/Model/AddModel'))
-// const EditQuestionChildren = React.lazy(() => import('./Pages/question/children/Model/EditModel'))
-
 import { hasAbility } from "./utils/hasAbility";
 import { ABILITIES_ENUM, ABILITIES_VALUES_ENUM } from "./enums/abilities";
 import { ParamsEnum } from "./enums/params";

src/Styles/App/App.scss

@@ -36,7 +36,7 @@ svg {
   cursor: pointer;
 }
 
-.not_foound_page {
+.not_found_page {
   background: black;
   height: 100vh;
   display: flex;

src/Styles/Layout/header_cards_section.scss

@@ -88,7 +88,7 @@
   display: none !important;
 }
 
-.Show_More_Button {
+.ShowMoreButton {
   position: absolute;
   bottom: 1vw;
   right: 0.5vw;

src/Styles/Pages/Columns.scss

@@ -9,14 +9,14 @@
 .absence_icon {
   background-color: red;
 }
-.lateArrival_icon {
+.late_arrival_icon {
   background-color: orange;
 }
 .presence_icon {
   background-color: #31ce83 !important;
 }
 
-.earlyDeparture_Details {
+.earlyDepartureDetails {
   // color: gray;
   svg {
     color: #a098ae;
@@ -33,7 +33,7 @@
   justify-content: center;
   align-items: center;
 }
-.custom_add_button_column_Mark {
+.custom_add_button_column_mark {
   display: flex;
   justify-content: center;
   align-items: center;
@@ -46,7 +46,7 @@
 //     font-size: 7px;
 // }
 
-.column_studentBlock {
+.column_student_block {
   width: 20px;
   height: 20px;
   border-radius: 4px;
@@ -72,16 +72,16 @@
   border: 2px solid var(--absence);
 }
 
-.earlyDeparture_student {
+.earlyDepartureStudent {
   background-color: var(--earlyDeparture);
 }
-.not_earlyDeparture_student {
+.not_earlyDepartureStudent {
   border: 2px solid var(--earlyDeparture);
 }
 
-.lateArrival_student {
+.lateArrivalStudent {
   background-color: var(--lateArrival);
 }
-.not_lateArrival_student {
+.notLateArrivalStudent {
   border: 2px solid var(--lateArrival);
 }

src/Styles/Pages/Division.scss

@@ -2,7 +2,7 @@
   display: none !important;
 }
 
-.Show_More_Button {
+.ShowMoreButton {
   position: absolute;
   bottom: 1vw;
   right: 0.5vw;
@@ -64,24 +64,13 @@
     }
   }
 
-  .activeModeltab {
+  .activeModelTab {
     > div {
       background: #bfe2fd;
       color: black;
     }
   }
 
-  &::after {
-    z-index: 1;
-    position: absolute;
-    bottom: 0;
-    right: -2.4vw;
-    content: "";
-    background: url("../../../public/Icon/cercile.svg");
-    width: 15vw;
-    height: 15vw;
-    background-repeat: no-repeat;
-  }
 }
 .ModelBodyForm {
   padding: 2vw;

src/Styles/Pages/index.scss

@@ -6,7 +6,7 @@
 @import "./Course.scss";
 @import "./EduClass.scss";
 @import "./programme.scss";
-@import "./Coulmns.scss";
+@import "./Columns.scss";
 @import "./subject.scss";
 @import "./Marks.scss";
 @import "./exercise.scss";

src/api/helper/useAddMutation.ts

@@ -10,8 +10,6 @@ function useAddMutation(
   toast: boolean = true,
 ): UseMutationResult<AxiosResponse, unknown, any, unknown> {
   const axios = useAxios();
-  console.log(toast, key);
-
   return useMutation<AxiosResponse, unknown, any, unknown>(
     async (dataToSend) => {
       const filterDataToSend = filterData(dataToSend);

src/api/helper/useAxios.ts

@@ -1,8 +1,4 @@
-import {
-  BRANCH_OBJECT_KEY,
-  CYCLE_OBJECT_KEY,
-  TERM_OBJECT_KEY,
-} from "../../config/AppKey";
+
 import useAuthState from "../../zustand/AuthState";
 import { BaseURL, HEADER_KEY } from "../config";
 import AxiosBuilder from "./AxiosBuilder";
@@ -12,7 +8,6 @@ import { useQueryClient } from "react-query";
 import { useValidationState } from "../../Components/ValidationField/utils/ValidationState";
 import { useNavigate } from "react-router-dom";
 import { AxiosQueryEnum, AxiosStatusEnum } from "../../enums/Axios";
-import { getLocalStorage } from "../../utils/LocalStorage";
 
 function useAxios() {
   const { isAuthenticated, token } = useAuthState();
@@ -43,7 +38,6 @@ function useAxios() {
 
       const key = response.config.headers[HEADER_KEY];
       const isToasted = response.config.headers["X-Custom-Message"];
-      console.log(isToasted);
 
       const ResponseMessage =
         responseMsg || t("validation.the_possess_done_successful");

src/enums/LocalStorageEnum.ts

@@ -0,0 +1,7 @@
+export enum LocalStorageEnum {
+    PROJECT_NAME = 'SCHOOL_DASHBOARD_EXERCISE',
+    LANGUAGE_KEY = LocalStorageEnum.PROJECT_NAME + '_LANGUAGE',
+    TOKEN_KEY = LocalStorageEnum.PROJECT_NAME + '_TOKEN_KEY',
+    USER_KEY = LocalStorageEnum.PROJECT_NAME + '_USER_KEY',
+  }
+  

src/index.tsx

@@ -1,10 +1,8 @@
 import App from "./App";
 import "bootstrap/dist/css/bootstrap.min.css";
 import "./Styles/App/index.scss";
-
 import { createRoot } from "react-dom/client";
 import ProviderContainer from "./ProviderContainer";
-import i18n from "i18next";
 
 const root = createRoot(document.getElementById("root") as HTMLElement);
 root.render(

src/lib/AntdProvider.tsx

@@ -0,0 +1,26 @@
+import { ConfigProvider } from 'antd';
+
+function AntdProvider({ children }: { children: React.ReactNode }) {
+  const primaryColor = "#3182ce";
+  const bgColor = "rgb(255, 255, 255)";
+    
+  return (
+    <ConfigProvider
+    theme={{
+      token: {
+        colorPrimary: primaryColor,
+      },
+      components: {
+        Table: {
+          headerBg: bgColor,
+          headerColor: primaryColor,
+        },
+      },
+    }}
+  >
+      {children}
+    </ConfigProvider>
+  );
+}
+
+export default AntdProvider;

src/lib/I18nProvider.tsx

@@ -0,0 +1,13 @@
+import React, { ReactNode } from 'react';
+import { I18nextProvider } from 'react-i18next';
+import i18n from './i18nConfig'; // Import the configured i18n instance
+
+interface I18nProviderProps {
+  children: ReactNode;
+}
+
+const I18nProvider: React.FC<I18nProviderProps> = ({ children }) => {
+  return <I18nextProvider i18n={i18n}>{children}</I18nextProvider>;
+};
+
+export default I18nProvider;

src/lib/ProtectedRouteProvider.tsx

@@ -0,0 +1,26 @@
+import { useNavigate } from "react-router-dom";
+import useAuthState from "../zustand/AuthState";
+import { useEffect } from "react";
+
+interface ProtectedRouteProviderProps extends React.HTMLProps<HTMLDivElement> {
+  children: React.ReactNode;
+}
+
+function ProtectedRouteProvider({ children, ...props }: ProtectedRouteProviderProps) {
+  const navigate = useNavigate();
+  const { isAuthenticated } = useAuthState();
+
+  useEffect(() => {
+    if (!isAuthenticated) {
+      navigate("/auth");
+    }
+  }, [isAuthenticated, navigate]);
+
+  return (
+    <div {...props}>
+      {children}
+    </div>
+  );
+}
+
+export default ProtectedRouteProvider;

src/lib/i18nConfig.tsx

@@ -0,0 +1,19 @@
+import i18n from 'i18next';
+import { initReactI18next } from 'react-i18next';
+import translationAR from '../translate/ar.json';
+
+const resources = {
+  ar: {
+    translation: translationAR,
+  },
+};
+
+i18n.use(initReactI18next).init({
+  resources,
+  lng: 'ar', // Set the default language
+  interpolation: {
+    escapeValue: false,
+  },
+});
+
+export default i18n;

src/translate/ar.json

@@ -656,7 +656,7 @@
     "some_thing_went_wrong": "حدث خطأ ما",
     "the_possess_done_successful": "تمت العملية بنجاح"
   },
-  "page_title": {
+  "PageTitle": {
     "main_page": "الصفحة الرئيسية",
     "course": "الصفوف",
     "education_class": "الشعب",

src/translate/en.json

@@ -1,612 +0,0 @@
-{
-  "main_page": "Main Page",
-  "dashboard": "dashboard",
-
-  "validation": {
-    "required": "required",
-    "value_must_be_less_than_900000": "value_must_be_less_than_900000",
-    "type_required": "type_required",
-    "pleas_fill_all_label": "pleas Fill All Label",
-    "please_select_students": "please_select_students",
-    "please_fill_in_all_the_fields": "please_fill_in_all_the_fields",
-    "Invalid_email": "Invalid_email",
-    "Email_is_required": "Email_is_required",
-    "Password_is_required": "Password_is_required",
-    "Password_must_be_at_least_8_characters_long": "Password_must_be_at_least_8_characters_long",
-    "Nationality_is_required": "Nationality_is_required",
-    "Address_is_required": "Address_is_required",
-    "Place_of_birth_is_required": "Place_of_birth_is_required",
-    "Date_of_birth_is_required": "Date_of_birth_is_required",
-    "Mother's_name_is_required": "Mother's_name_is_required",
-    "Father's_name_is_required": "Father's_name_is_required",
-    "Last_name_is_required": "Last_name_is_required",
-    "First_name_is_required": "First_name_is_required",
-    "Religion_is_required": "Religion_is_required",
-    "Gender_is_required": "Gender_is_required",
-    "Attachment1_is_required": "Attachment1_is_required",
-    "Father's_job_is_required": "Father's_job_is_required",
-    "Mother's_phone_number_is_required": "Mother's_phone_number_is_required",
-    "Father's_phone_number_is_required": "Father's_phone_number_is_required",
-    "Mother's_job_is_required": "Mother's_job_is_required",
-    "justification_is_required": "justification_is_required",
-    "duration_is_required": "duration_is_required",
-    "pleas_do_any_changes": "pleas_do_any_changes",
-    "edit_session_content": "edit_session_content",
-    "Title_is_required": "Title_is_required",
-    "Exam_type_is_required": "Exam_type_is_required",
-    "Subject_is_required": "Subject_is_required",
-    "Maximum_grade_is_required": "Maximum_grade_is_required",
-    "Must_be_a_number": "Must_be_a_number",
-    "Value_must_not_exceed_10000": "Value_must_not_exceed_10000",
-    "Passing_grade_is_required": "Passing_grade_is_required",
-    "Date_is_required": "Date_is_required",
-    "Duration_is_required": "Duration_is_required",
-    "the_possess_done_successful": "the_possess_done_successful",
-    "some_thing_went_wrong": "some_thing_went_wrong",
-    "Due_date_must_be_before_assigning_date": "Due date must be before assigning date"
-  },
-  "header": {
-    "register_students": "register_students",
-    "import_students": "import_students",
-    "move_student": "move_student",
-    "Student_added_successfully": "Student_added_successfully",
-    "the_student_has_been_added_Do_you_want_to_add_another_student": "the_student_has_been_added_Do_you_want_to_add_another_student",
-    "Add_a_new_student": "Add_a_new_student",
-    "Please enter all required data": "Please enter all required data",
-    "Back to Previous Step": "Back to Previous Step",
-    "Adding...": "Adding...",
-    "Next Step": "Next Step",
-    "Add Student": "Add Student",
-    "Attendance and absence of students": "Attendance and absence of students",
-    "see_more_details": "see_more_details",
-    "earlyDepartures": "earlyDepartures",
-    "Follow_the_curriculum": "Follow_the_curriculum",
-    "add_session_content": "add_session_content",
-    "add_session": "add_session",
-    "edit_session": "edit_session",
-    "classroom_behavior_of_students": "classroom_behavior_of_students",
-    "note_details": "note_details",
-    "student_homework": "student_homework",
-    "home_work_title": "home_work_title",
-    "subject": "subject",
-    "max_grade": "max_grade",
-    "student_count": "student_count",
-    "student_exam": "student_exam",
-    "student_name": "student_name",
-    "student_card": "student_card",
-    "Student_classroom_behavior": "Student_classroom_behavior",
-    "The_student_financial_situation": "The_student_financial_situation",
-    "Modify_student_information": "Modify_student_information",
-    "student_details": "student_details",
-    "student_status": "student_status",
-
-    "parent_details": "parent_details",
-    "contact_details": "contact_details",
-    "additional_details": "additional_details",
-    "note_type": "note_type",
-    "student_payment": "student_payment",
-    "add_new_unit": "add_new_unit",
-    "add_new_lessons": "add_new_lessons",
-    "Student_Information": "Student_Information",
-    "Parent_Information": "Parent_Information",
-    "Contact_Information": "Contact_Information",
-    "Attachment_Images": "Attachment_Images",
-    "Weekly_Class_Schedule": "Weekly_Class_Schedule",
-    "Print_Schedule": "Print_Schedule",
-    "Welcome": "Welcome",
-    "Enter your email and password to log in": "Enter your email and password to log in",
-    "change_your_current_password": "change your current password",
-    "view_cycle_for_this_branch": "view cycle for this branch",
-    "view_term_for_this_cycle": "view term for this branch"
-  },
-  "columns": {
-    "id": "id",
-    "name": "name",
-    "address": "address",
-    "contact_information": "contact_information",
-    "data": "data",
-    "details": "details",
-    "receipt_number": "receipt_number",
-    "payment_type": "payment_type",
-    "value": "value",
-    "subject_name": "subject_name",
-    "image": "image",
-    "card": "card",
-    "birthday": "birthday",
-    "last_name": "last_name",
-    "father_name": "father_name",
-    "sex": "sex",
-    "presence": "presence",
-    "teacher_name": "teacher_name",
-    "lesson_name": "lesson_name",
-    "session_start": "session_start",
-    "type": "type",
-    "title": "title",
-    "content": "content",
-    "assigning_date": "assigning_date",
-    "due_date": "due_date",
-    "mark": "mark",
-    "student_name": "student_name",
-    "absence": "absence",
-    "earlyDeparture": "earlyDeparture",
-    "lateArrival": "lateArrival",
-    "date": "date",
-    "starting_date": "starting_date",
-    "ending_date": "ending_date",
-    "term_type": "term_type",
-    "status": "status"
-  },
-  "practical": {
-    "to_confirm_deletion_please_re_enter": "To confirm deletion, please re-enter",
-
-    "back": "back",
-    "add": "add",
-    "edit": "edit",
-    "move": "move",
-    "skip": "skip",
-    "show": "show",
-    "save": "save",
-    "enter": "enter",
-    "delete": "delete",
-    "cancel": "cancel",
-    "search_here": "search_here",
-    "details": "details",
-    "export_students": "export_students",
-    "send_notification_to_course": "send_notification_to_course",
-    "Send_Direct_Notification": "Send_Direct_Notification",
-    "cancel_registration": "cancel_registration",
-    "send_notification_to_education_class": "send_notification_to_education_class",
-    "send_notification_to_student": "send_notification_to_student",
-    "status": "status",
-    "Step": "Step",
-    "login": "login",
-    "submite": "submite",
-    "index": "index",
-    "store": "store",
-    "update": "update",
-    "me": "me",
-    "importStudentData": "importStudentData",
-    "moveStudents": "moveStudents",
-    "importStudents": "importStudents",
-    "overview": "overview",
-    "presence": "presence"
-  },
-  "Table": {
-    "header": "",
-    "info": ""
-  },
-  "models": {
-    "teacher": "teacher",
-    "student": "student",
-    "students": "students",
-    "subject": "subject",
-    "education_class": "education_class",
-    "eduClass": "education_class",
-
-    "session_content": "session_content",
-    "course": "course",
-    "payment": "payment",
-    "note": "note",
-    "homework": "homework",
-    "mark": "mark",
-    "exam": "exam",
-    "absence": "absence",
-    "late_arrival": "late_arrival",
-    "presence": "presence",
-    "earlyDeparture": "earlyDeparture",
-    "branch": "branch",
-    "cycle": "cycle",
-    "term": "term",
-    "role": "role",
-
-    "Pass": "Pass",
-    "user": "User",
-    "branchAdmin": "Branch Admin",
-    "grade": "Grade",
-    "homeworkAttachment": "Homework Attachment",
-    "lateArrival": "Late Arrival",
-    "noteAttachment": "Note Attachment",
-    "session": "Session",
-    "sessionContent": "Session Content",
-
-    "subjectAttachment": "Subject Attachment",
-    "unit": "Unit",
-    "lesson": "Lesson",
-    "exercise": "Exercise",
-    "exerciseAnswer": "Exercise Answer",
-    "tag": "Tag",
-
-    "Exam": "Exam",
-    "ExamType": "Exam Type",
-
-    "studentParent": "Student Parent",
-    "registrationRecord": "Registration Record",
-    "paymentOverview": "Payment Overview",
-    "subjectAttachmentType": "Subject Attachment Type",
-    "param": "Param",
-    "subjectProgress": "Subject Progress",
-    "main_page": "Main Page"
-  },
-  "education_class_actions": {
-    "Student_Records": "Student_Records",
-    "Attendance": "Attendance",
-    "Permissions": "Permissions",
-    "Grades": "Grades",
-    "Notes": "Notes",
-    "Financial_Status": "Financial_Status",
-    "Assignments": "Assignments",
-    "Class_Schedule": "Class_Schedule",
-    "Curriculum_Follow_up": "Curriculum_Follow_up"
-  },
-
-  "input": {
-    "name": "name",
-    "address": "address",
-    "number": "number",
-    "price": "price",
-    "drag_and_drop_or_click_here_to_select_the_file": "Drag and drop or click here to select the file",
-    "Click_to_upload_the_image": "Click to upload the image",
-    "payment_type": "payment_type",
-    "details": "details",
-    "student_name": "student_name",
-    "receipt_number": "receipt_number",
-    "date": "date",
-    "value": "value",
-    "teacher_name": "teacher_name",
-    "sex": "sex",
-    "content": "content",
-    "type": "type",
-    "attachments": "attachments",
-    "send_notification_to_course": "send_notification_to_course",
-    "export_students": "export_students",
-    "password": "password",
-    "nationality": "nationality",
-    "religion": "religion",
-    "birthday": "birthday",
-    "birth_place": "birth_place",
-    "father_name": "father_name",
-    "father_job": "father_job",
-    "mother_name": "mother_name",
-    "mother_phone_number": "mother_phone_number",
-    "father_phone_number": "father_phone_number",
-    "mother_job": "mother_job",
-    "phone_number": "phone_number",
-    "additional_phone_number": "additional_phone_number",
-    "note": "note",
-    "school_document": "school_document",
-    "first_name": "first_name",
-    "last_name": "last_name",
-    "email": "email",
-    "student_status": "student_status",
-    "duration": "duration",
-    "justification": "justification",
-    "attachment": "attachment",
-    "session_name": "session_name",
-    "lesson_name": "lesson_name",
-    "title": "title",
-    "due_date": "due_date",
-    "assigning_date": "assigning_date",
-    "subject_name": "subject_name",
-    "exam_type": "exam_type",
-    "grade_to_pass": "grade_to_pass",
-    "max_grade": "max_grade",
-    "status": "status",
-    "departure_time": "departure_time",
-    "mark": "mark",
-    "image": "image",
-    "term": "term",
-    "session_start": "session_start",
-    "session_end": "session_end",
-    "academic_year": "academic_year",
-    "select_date": "select_date",
-    "School_Year": "School Year",
-    "Enter_branch_first": "Enter branch first",
-    "School_Term": "School Term",
-    "Enter_school_year_first": "Enter school year first",
-    "Username": "Username",
-    "Password": "Password",
-    "new_password": "new_password",
-    "old_password": "old_password",
-    "username": "username",
-    "starting_date": "starting_date",
-    "ending_date": "ending_date",
-    "term_type": "term_type",
-    "description": "description",
-    "abilities": "abilities"
-  },
-
-  "select": {
-    "Payments": {
-      "paid": "paid",
-      "to_be_paid": "to_be_paid",
-      "all_payment": "all_payment",
-      "dues": "dues"
-    },
-    "Marks": {
-      "Not_Taken": "Not_Taken",
-      "Taken": "Taken"
-    },
-    "Sex": {
-      "male": "male",
-      "female": "female",
-      "bi": "mix"
-    },
-    "Religion": {
-      "muslim": "muslim",
-      "christianity": "christianity",
-      "other": "other"
-    },
-    "nationalities": {
-      "Afghan": "Afghan",
-      "Albanian": "Albanian",
-      "Algerian": "Algerian",
-      "American": "American",
-      "Andorran": "Andorran",
-      "Angolan": "Angolan",
-      "Antiguans": "Antiguans",
-      "Argentinean": "Argentinean",
-      "Armenian": "Armenian",
-      "Australian": "Australian",
-      "Austrian": "Austrian",
-      "Azerbaijani": "Azerbaijani",
-      "Bahamian": "Bahamian",
-      "Bahraini": "Bahraini",
-      "Bangladeshi": "Bangladeshi",
-      "Barbadian": "Barbadian",
-      "Barbudans": "Barbudans",
-      "Batswana": "Batswana",
-      "Belarusian": "Belarusian",
-      "Belgian": "Belgian",
-      "Belizean": "Belizean",
-      "Beninese": "Beninese",
-      "Bhutanese": "Bhutanese",
-      "Bolivian": "Bolivian",
-      "Bosnian": "Bosnian",
-      "Brazilian": "Brazilian",
-      "British": "British",
-      "Bruneian": "Bruneian",
-      "Bulgarian": "Bulgarian",
-      "Burkinabe": "Burkinabe",
-      "Burmese": "Burmese",
-      "Burundian": "Burundian",
-      "Cambodian": "Cambodian",
-      "Cameroonian": "Cameroonian",
-      "Canadian": "Canadian",
-      "Cape Verdean": "Cape Verdean",
-      "Central African": "Central African",
-      "Chadian": "Chadian",
-      "Chilean": "Chilean",
-      "Chinese": "Chinese",
-      "Colombian": "Colombian",
-      "Comoran": "Comoran",
-      "Congolese": "Congolese",
-      "Costa Rican": "Costa Rican",
-      "Croatian": "Croatian",
-      "Cuban": "Cuban",
-      "Cypriot": "Cypriot",
-      "Czech": "Czech",
-      "Danish": "Danish",
-      "Djibouti": "Djibouti",
-      "Dominican": "Dominican",
-      "Dutch": "Dutch",
-      "East Timorese": "East Timorese",
-      "Ecuadorean": "Ecuadorean",
-      "Egyptian": "Egyptian",
-      "Emirian": "Emirian",
-      "Equatorial Guinean": "Equatorial Guinean",
-      "Eritrean": "Eritrean",
-      "Estonian": "Estonian",
-      "Ethiopian": "Ethiopian",
-      "Fijian": "Fijian",
-      "Filipino": "Filipino",
-      "Finnish": "Finnish",
-      "French": "French",
-      "Gabonese": "Gabonese",
-      "Gambian": "Gambian",
-      "Georgian": "Georgian",
-      "German": "German",
-      "Ghanaian": "Ghanaian",
-      "Greek": "Greek",
-      "Grenadian": "Grenadian",
-      "Guatemalan": "Guatemalan",
-      "Guinea-Bissauan": "Guinea-Bissauan",
-      "Guinean": "Guinean",
-      "Guyanese": "Guyanese",
-      "Haitian": "Haitian",
-      "Herzegovinian": "Herzegovinian",
-      "Honduran": "Honduran",
-      "Hungarian": "Hungarian",
-      "I-Kiribati": "I-Kiribati",
-      "Icelander": "Icelander",
-      "Indian": "Indian",
-      "Indonesian": "Indonesian",
-      "Iranian": "Iranian",
-      "Iraqi": "Iraqi",
-      "Irish": "Irish",
-      "palestine": "palestine",
-      "Italian": "Italian",
-      "Ivorian": "Ivorian",
-      "Jamaican": "Jamaican",
-      "Japanese": "Japanese",
-      "Jordanian": "Jordanian",
-      "Kazakhstani": "Kazakhstani",
-      "Kenyan": "Kenyan",
-      "Kittian and Nevisian": "Kittian and Nevisian",
-      "Kuwaiti": "Kuwaiti",
-      "Kyrgyz": "Kyrgyz",
-      "Laotian": "Laotian",
-      "Latvian": "Latvian",
-      "Lebanese": "Lebanese",
-      "Liberian": "Liberian",
-      "Libyan": "Libyan",
-      "Liechtensteiner": "Liechtensteiner",
-      "Lithuanian": "Lithuanian",
-      "Luxembourger": "Luxembourger",
-      "Macedonian": "Macedonian",
-      "Malagasy": "Malagasy",
-      "Malawian": "Malawian",
-      "Malaysian": "Malaysian",
-      "Maldivan": "Maldivan",
-      "Malian": "Malian",
-      "Maltese": "Maltese",
-      "Marshallese": "Marshallese",
-      "Mauritanian": "Mauritanian",
-      "Mauritian": "Mauritian",
-      "Mexican": "Mexican",
-      "Micronesian": "Micronesian",
-      "Moldovan": "Moldovan",
-      "Monacan": "Monacan",
-      "Mongolian": "Mongolian",
-      "Moroccan": "Moroccan",
-      "Mosotho": "Mosotho",
-      "Motswana": "Motswana",
-      "Mozambican": "Mozambican",
-      "Namibian": "Namibian",
-      "Nauruan": "Nauruan",
-      "Nepali": "Nepali",
-      "New Zealander": "New Zealander",
-      "Nicaraguan": "Nicaraguan",
-      "Nigerian": "Nigerian",
-      "Nigerien": "Nigerien",
-      "North Korean": "North Korean",
-      "Northern Irish": "Northern Irish",
-      "Norwegian": "Norwegian",
-      "Omani": "Omani",
-      "Pakistani": "Pakistani",
-      "Palauan": "Palauan",
-      "Panamanian": "Panamanian",
-      "Papua New Guinean": "Papua New Guinean",
-      "Paraguayan": "Paraguayan",
-      "Peruvian": "Peruvian",
-      "Polish": "Polish",
-      "Portuguese": "Portuguese",
-      "Qatari": "Qatari",
-      "Romanian": "Romanian",
-      "Russian": "Russian",
-      "Rwandan": "Rwandan",
-      "Saint Lucian": "Saint Lucian",
-      "Salvadoran": "Salvadoran",
-      "Samoan": "Samoan",
-      "San Marinese": "San Marinese",
-      "Sao Tomean": "Sao Tomean",
-      "Saudi": "Saudi",
-      "Scottish": "Scottish",
-      "Senegalese": "Senegalese",
-      "Serbian": "Serbian",
-      "Seychellois": "Seychellois",
-      "Sierra Leonean": "Sierra Leonean",
-      "Singaporean": "Singaporean",
-      "Slovakian": "Slovakian",
-      "Slovenian": "Slovenian",
-      "Solomon Islander": "Solomon Islander",
-      "Somali": "Somali",
-      "South African": "South African",
-      "South Korean": "South Korean",
-      "Spanish": "Spanish",
-      "Sri Lankan": "Sri Lankan",
-      "Sudanese": "Sudanese",
-      "Surinamer": "Surinamer",
-      "Swazi": "Swazi",
-      "Swedish": "Swedish",
-      "Swiss": "Swiss",
-      "Syrian": "Syrian",
-      "Taiwanese": "Taiwanese",
-      "Tajik": "Tajik",
-      "Tanzanian": "Tanzanian",
-      "Thai": "Thai",
-      "Togolese": "Togolese",
-      "Tongan": "Tongan",
-      "Trinidadian/Tobagonian": "Trinidadian/Tobagonian",
-      "Tunisian": "Tunisian",
-      "Turkish": "Turkish",
-      "Tuvaluan": "Tuvaluan",
-      "Ugandan": "Ugandan",
-      "Ukrainian": "Ukrainian",
-      "Uruguayan": "Uruguayan",
-      "Uzbekistani": "Uzbekistani",
-      "Venezuelan": "Venezuelan",
-      "Vietnamese": "Vietnamese",
-      "Welsh": "Welsh",
-      "Yemenite": "Yemenite",
-      "Zambian": "Zambian",
-      "Zimbabwean": "Zimbabwean"
-    },
-    "Student_Type": {
-      "all_students": "all_students",
-      "absence": "absence",
-      "late_arrival": "late_arrival",
-      "presence": "presence",
-      "justified": "justified",
-      "not_justified": "not_justified",
-      "earlyDeparture": "earlyDeparture"
-    },
-    "Note": {
-      "normal_note": "normal_note",
-      "alert_note": "alert_note",
-      "financial_note": "financial_note",
-      "positive_note": "positive_note",
-      "warning_note": "warning_note",
-      "academic_note": "academic_note",
-      "studying_note": "studying_note",
-      "organization_note": "organization_note",
-      "all_note": "all_note"
-    },
-    "Exam": {
-      "Taken": "Taken",
-      "Not_Taken": "Not_Taken",
-      "all_student": "all_student"
-    },
-    "Term_type": {
-      "first": "first",
-      "second": "second"
-    }
-  },
-  "array": {
-    "Period": {
-      "Today": "Today",
-      "First": "First",
-      "Second": "Second",
-      "Third": "Third",
-      "Fourth": "Fourth",
-      "Fifth": "Fifth",
-      "Sixth": "Sixth",
-      "Seventh": "Seventh"
-    },
-    "Days": {
-      "Sunday": "Sunday",
-      "Monday": "Monday",
-      "Tuesday": "Tuesday",
-      "Wednesday": "Wednesday",
-      "Thursday": "Thursday",
-      "Friday": "Friday",
-      "Saturday": "Saturday"
-    },
-    "UserInfo": {
-      "course": "course",
-      "education_class": "education_class",
-      "nationality": "nationality",
-      "birthday": "birthday",
-      "warning": "warning",
-      "appreciation": "appreciation",
-      "alert": "alert"
-    }
-  },
-  "sidebar": {
-    "dashboard": "dashboard",
-    "course": "course",
-    "teacher": "teacher",
-    "payment": "payment",
-    "student_details": "student_details",
-    "create_student": "create_student",
-    "course_details": "course_details",
-    "education_class_details": "education_class_details",
-    "subject_details": "subject_details",
-    "logout": "logout",
-    "branch": "branch",
-    "role": "role"
-  },
-  "message": {
-    "some_thing_went_wrong": "some_thing_went_wrong",
-    "the_possess_done_successful": "the_possess_done_successful"
-  }
-}

src/types/App.ts

@@ -2,7 +2,7 @@ import { ReactElement, LazyExoticComponent, ReactNode } from "react";
 import { Mark_State, Payment_type, term_type } from "./Item";
 import { ABILITIES_ENUM, ABILITIES_VALUES_ENUM } from "../enums/abilities";
 
-export type Tchildren = {
+export type ChildrenType = {
   children: ReactNode;
 };
 

src/utils/LocalStorage.ts

@@ -3,7 +3,7 @@ export const getLocalStorage = (key: string) => {
     const data = localStorage?.getItem(key);
     return data ? JSON.parse(data) : null;
   } catch (error) {
-    console.error("Error parsing JSON from localStorage", error);
+    // console.error("Error parsing JSON from localStorage", error);
     return null;
   }
 };

src/zustand/AuthState.ts

@@ -1,5 +1,6 @@
 import { create } from "zustand";
 import { ABILITIES_KEY, TOKEN_KEY, USER_KEY } from "../config/AppKey";
+import { useNavigate } from "react-router-dom";
 
 interface AuthStore {
   token: string | null | undefined;

src/zustand/PageTitleState.ts

@@ -1,15 +1,15 @@
 import { create } from "zustand";
 
-interface Page_titleState {
-  Page_title: string;
-  setPage_title: (value: string) => void;
+interface PageTitleState {
+  PageTitle: string;
+  setPageTitle: (value: string) => void;
   title: string | null;
   set_title: (value: string) => void;
 }
 
-export const usePage_titleState = create<Page_titleState>((set) => ({
-  Page_title: "",
-  setPage_title: (value: string) => set(() => ({ Page_title: value })),
+export const usePageTitleState = create<PageTitleState>((set) => ({
+  PageTitle: "",
+  setPageTitle: (value: string) => set(() => ({ PageTitle: value })),
   title: null,
   set_title: (value: string) => set(() => ({ title: value })),
 }));