package.json

@@ -1,29 +1,66 @@
 {
   "name": "my-app",
   "version": "0.1.0",
+  "type": "module",
   "private": true,
   "dependencies": {
     "@ant-design/icons": "^5.3.7",
+    "@types/draft-js": "^0.11.18",
+    "@types/katex": "^0.16.7",
+    "@types/mathjax": "^0.0.40",
+    "@types/node": "^20.14.0",
+    "@types/react-draft-wysiwyg": "^1.13.8",
+    "@types/react-helmet": "^6.1.11",
+    "algebra.js": "^0.2.6",
     "antd": "^5.17.4",
+    "apexcharts": "^3.49.1",
     "axios": "^1.7.2",
+    "better-react-mathjax": "^2.0.3",
     "bootstrap": "^5.3.3",
     "dayjs": "^1.11.11",
+    "draft-js": "^0.11.7",
+    "draft-js-latex-plugin": "^0.1.2",
+    "equation-resolver": "^1.0.0",
     "formik": "^2.4.6",
-    "html-to-image": "^1.11.11",
+    "html2canvas": "^1.4.1",
     "i18next": "^23.11.5",
+    "jspdf": "^2.5.1",
+    "katex": "^0.16.11",
+    "lodash.debounce": "^4.0.8",
+    "mammoth": "^1.8.0",
+    "mathjax": "^3.2.2",
+    "mathjax-react": "^2.0.1",
+    "mathjax3-react": "^1.2.0",
+    "mathquill": "0.10.1-a",
+    "nmath": "^1.0.0",
     "path-to-regexp": "^6.2.2",
-    "pdf-lib": "^1.17.1",
+    "quill-image-resize-module": "^3.0.0",
     "react": "^18.3.1",
+    "react-apexcharts": "^1.4.1",
+    "react-contenteditable": "^3.3.7",
     "react-dom": "^18.3.1",
+    "react-draft-wysiwyg": "^1.15.0",
+    "react-equation": "^1.0.0",
+    "react-google-docs-viewer": "^1.0.1",
+    "react-helmet": "^6.1.0",
     "react-i18next": "^13.5.0",
     "react-icons": "^4.12.0",
+    "react-katex": "^3.0.1",
+    "react-latex-next": "^3.0.0",
+    "react-math": "^0.0.1",
+    "react-math-keyboard": "^1.5.17",
+    "react-mathjax": "^1.0.1",
+    "react-mathjax2": "^0.0.2",
+    "react-mathquill": "^1.0.3",
     "react-query": "^3.39.3",
+    "react-quill": "^2.0.0",
     "react-router-dom": "^6.23.1",
+    "react-textarea-autosize": "^8.5.3",
     "react-toastify": "^9.1.3",
     "reactstrap": "^9.2.2",
     "sass": "^1.77.4",
-    "ts-node": "^10.9.2",
-    "vite-plugin-env-compatible": "^2.0.1",
+    "source-map-explorer": "^2.5.3",
+    "typescript": "^4.9.5",
     "yup": "^1.4.0",
     "zustand": "^4.5.2"
   },
@@ -54,25 +91,16 @@
     ]
   },
   "devDependencies": {
-    "@testing-library/jest-dom": "^5.17.0",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^13.5.0",
-    "@types/node": "^20.14.0",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
-    "@types/react-helmet": "^6.1.11",
-    "@vitejs/plugin-legacy": "^5.4.1",
     "@vitejs/plugin-react": "^4.3.0",
     "jest": "^29.7.0",
     "jsdom": "^24.1.0",
     "prettier": "^3.3.0",
     "rollup-plugin-visualizer": "^5.12.0",
     "ts-jest": "^29.1.4",
-    "ts-loader": "^9.5.1",
-    "typescript": "^4.9.5",
-    "vite": "^5.2.12",
-    "vite-plugin-compression": "^0.5.1",
-    "webpack": "^5.93.0",
-    "webpack-cli": "^5.1.4"
+    "vite": "^5.2.12"
   }
 }

src/Components/Layout/Navbar/MenuItem.tsx

@@ -25,10 +25,7 @@ export const MenuItem = ({ item, location, index }: any) => {
         <i>{item.icon}</i>
         <Link to={item.path || "/"}>{t(item.text)}</Link>
         {item?.children && (
-          <DropdownToggle
-            isOpen={isDropdownOpen}
-            onClick={() => handleDropdown(index)}
-          />
+          <DropdownToggle isOpen={isDropdownOpen} onClick={() => handleDropdown(index)} />
         )}
       </div>
 

src/Components/Layout/Navbar/NavBarRightSide.tsx

@@ -1,17 +1,17 @@
-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";
+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 [t] = useTranslation()
     const translateArray = translateOptions(search_array, t);
   
     const { handel_open_model } = useModalHandler();
@@ -32,11 +32,7 @@ const NavBarRightSide = () => {
       </div>
       <Tooltip
         placement="top"
-          title={
-            <div onClick={handleEdit}>
-              {t("header.change_your_current_password")}
-            </div>
-          }
+        title={<div onClick={handleEdit}>{t("header.change_your_current_password")}</div>}
         color="#E0E0E0"
       >
         <div className="gear">
@@ -52,7 +48,7 @@ const NavBarRightSide = () => {
       <Image src="/Layout/DefaultStudentImage.png" alt="Profile" />
     </div>
   </article>
-  );
-};
+  )
+}
 
-export default NavBarRightSide;
+export default NavBarRightSide

src/Components/Layout/Navbar/SubMenu.tsx

@@ -10,12 +10,7 @@ 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}
-        />
+        <MenuItem key={index} item={childItem} location={location} index={index} />
       ))}
     </div>
   );

src/Components/Routes/RenderRouteElement.tsx

@@ -10,6 +10,10 @@ export const RenderRouteElement = (route: any) => (
         </Layout>
       }
     >
-    {route.header ? <Layout>{route.element}</Layout> : route.element || <></>}
+      {route.header ? (
+        <Layout>{route.element}</Layout>
+      ) : (
+        route.element || <></>
+      )}
     </Suspense>
   );

src/Components/Routes/RenderRoutesRecursively.tsx

@@ -16,4 +16,5 @@ export const renderRoutesRecursively = (routes: TMenuItem[]) =>
             {route.children && renderRoutesRecursively(route.children)}
           </React.Fragment>
         );
+
     });

src/Layout/Ui/Layout.tsx

@@ -10,7 +10,9 @@ const Layout = ({
   children: React.ReactNode;
   className?: string;
 }) => {
+
   return (
+
       <ProtectedRouteProvider className="Layout">
         <main className={`${className} Layout_Body`}>
           <NavBar />
@@ -18,6 +20,7 @@ const Layout = ({
         </main>
         <SideBar />
       </ProtectedRouteProvider>
+   
   );
 };
 

src/Layout/Ui/NavBar.tsx

@@ -17,6 +17,7 @@ const NavBar = () => {
   const navigate = useNavigate();
   const PrevPath = getPrevPathRoute(location.pathname);
 
+
   const handelNavigate = () => {
     if (PrevPath === 0) {
       return;
@@ -24,6 +25,7 @@ const NavBar = () => {
     navigate(deletePathSegments(location.pathname, PrevPath));
   };
 
+
   return (
     <div className="NavBar">
       <span className="navbar_link" onClick={handelNavigate}>

src/Layout/Ui/SideBar.tsx

@@ -10,6 +10,8 @@ import { getLocalStorage } from "../../utils/LocalStorage";
 import { BRANCH_OBJECT_KEY } from "../../config/AppKey";
 import { MenuItem } from "../../Components/Layout/SideBar/MenuItem";
 
+
+
 const SideBar = () => {
   const location = useLocation();
 

src/ProviderContainer.tsx

@@ -11,9 +11,14 @@ function ProviderContainer({ children }: ChildrenType) {
       <I18nProvider>
           <QueryProvider>
         <ToastProvider>
-            <AntdProvider>{children}</AntdProvider>
+          <AntdProvider>
+
+            {children}
+          </AntdProvider>
+  
         </ToastProvider>
       </QueryProvider>
+ 
         </I18nProvider>
     </BrowserRouter>
   );

src/Styles/Pages/Division.scss

@@ -70,6 +70,7 @@
       color: black;
     }
   }
+
 }
 .ModelBodyForm {
   padding: 2vw;

src/api/helper/useAxios.ts

@@ -1,3 +1,4 @@
+
 import useAuthState from "../../zustand/AuthState";
 import { BaseURL, HEADER_KEY } from "../config";
 import AxiosBuilder from "./AxiosBuilder";

src/enums/LocalStorageEnum.ts

@@ -1,6 +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",
+    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/lib/AntdProvider.tsx

@@ -1,4 +1,4 @@
-import { ConfigProvider } from "antd";
+import { ConfigProvider } from 'antd';
 
 function AntdProvider({ children }: { children: React.ReactNode }) {
   const primaryColor = "#3182ce";

src/lib/I18nProvider.tsx

@@ -1,6 +1,6 @@
-import React, { ReactNode } from "react";
-import { I18nextProvider } from "react-i18next";
-import i18n from "./i18nConfig"; // Import the configured i18n instance
+import React, { ReactNode } from 'react';
+import { I18nextProvider } from 'react-i18next';
+import i18n from './i18nConfig'; // Import the configured i18n instance
 
 interface I18nProviderProps {
   children: ReactNode;

src/lib/ProtectedRouteProvider.tsx

@@ -6,10 +6,7 @@ interface ProtectedRouteProviderProps extends React.HTMLProps<HTMLDivElement> {
   children: React.ReactNode;
 }
 
-function ProtectedRouteProvider({
-  children,
-  ...props
-}: ProtectedRouteProviderProps) {
+function ProtectedRouteProvider({ children, ...props }: ProtectedRouteProviderProps) {
   const navigate = useNavigate();
   const { isAuthenticated } = useAuthState();
 
@@ -19,7 +16,11 @@ function ProtectedRouteProvider({
     }
   }, [isAuthenticated, navigate]);
 
-  return <div {...props}>{children}</div>;
+  return (
+    <div {...props}>
+      {children}
+    </div>
+  );
 }
 
 export default ProtectedRouteProvider;

src/lib/i18nConfig.tsx

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