worked on the about

worked on the aboutus component edit functionlity
worked on the module of the aboutus and services
2025-02-25 13:58:13 +05:30 · 2025-02-14 15:00:43 +05:30 · 2025-02-12 19:00:47 +05:30 · 2025-02-12 16:38:28 +05:30 · 2025-02-12 16:27:49 +05:30 · 2025-02-12 15:35:38 +05:30
21 changed files with 674 additions and 305 deletions
--- a/dev-dist/sw.js
+++ b/dev-dist/sw.js
@@ -82,11 +82,7 @@ define(['./workbox-54d0af47'], (function (workbox) { 'use strict';
    "revision": "3ca0b8505b4bec776b69afdba2768812"
  }, {
    "url": "index.html",
-<<<<<<< HEAD
-    "revision": "0.iv1sobg60j"
-=======
-    "revision": "0.3bv9k3911i8"
->>>>>>> 688f6740627f6cdb421849d1fb012420be1d9d10
+    "revision": "0.ch9snbb3598"
  }], {});
  workbox.cleanupOutdatedCaches();
  workbox.registerRoute(new workbox.NavigationRoute(workbox.createHandlerBoundToURL("index.html"), {
--- a/package-lock.json
+++ b/package-lock.json
@@ -22,6 +22,7 @@
        "react-dom": "^18.3.1",
        "react-hook-form": "^7.54.2",
        "react-icons": "^5.4.0",
+        "react-quill": "^2.0.0",
        "react-redux": "^9.2.0",
        "react-router-dom": "^7.1.1",
        "vite-plugin-pwa": "^0.21.1"
@@ -3284,6 +3285,15 @@
      "devOptional": true,
      "license": "MIT"
    },
+    "node_modules/@types/quill": {
+      "version": "1.3.10",
+      "resolved": "https://registry.npmjs.org/@types/quill/-/quill-1.3.10.tgz",
+      "integrity": "sha512-IhW3fPW+bkt9MLNlycw8u8fWb7oO7W5URC9MfZYHBlA24rex9rs23D5DETChu1zvgVdc5ka64ICjJOgQMr6Shw==",
+      "license": "MIT",
+      "dependencies": {
+        "parchment": "^1.1.2"
+      }
+    },
    "node_modules/@types/react": {
      "version": "18.3.18",
      "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.18.tgz",
@@ -5348,6 +5358,15 @@
        "node": ">= 0.2.0"
      }
    },
+    "node_modules/clone": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz",
+      "integrity": "sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
    "node_modules/color-convert": {
      "version": "2.0.1",
      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
@@ -5574,6 +5593,26 @@
        }
      }
    },
+    "node_modules/deep-equal": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-1.1.2.tgz",
+      "integrity": "sha512-5tdhKF6DbU7iIzrIOa1AOUt39ZRm13cmL1cGEh//aqR8x9+tNfbywRf0n5FD/18OKMdo7DNEtrX2t22ZAkI+eg==",
+      "license": "MIT",
+      "dependencies": {
+        "is-arguments": "^1.1.1",
+        "is-date-object": "^1.0.5",
+        "is-regex": "^1.1.4",
+        "object-is": "^1.1.5",
+        "object-keys": "^1.1.1",
+        "regexp.prototype.flags": "^1.5.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
    "node_modules/deep-is": {
      "version": "0.1.4",
      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz",
@@ -6085,12 +6124,30 @@
        "node": ">=0.10.0"
      }
    },
+    "node_modules/eventemitter3": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-2.0.3.tgz",
+      "integrity": "sha512-jLN68Dx5kyFHaePoXWPsCGW5qdyZQtLYHkxkg02/Mz6g0kYpDx4FyP6XfArhQdlOC4b8Mv+EMxPo/8La7Tzghg==",
+      "license": "MIT"
+    },
+    "node_modules/extend": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz",
+      "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==",
+      "license": "MIT"
+    },
    "node_modules/fast-deep-equal": {
      "version": "3.1.3",
      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
      "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
      "license": "MIT"
    },
+    "node_modules/fast-diff": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/fast-diff/-/fast-diff-1.1.2.tgz",
+      "integrity": "sha512-KaJUt+M9t1qaIteSvjc6P3RbMdXsNhK61GRftR6SNxqmhthcd9MGIi4T+o0jD8LUSpSnSKXE20nLtJ3fOHxQig==",
+      "license": "Apache-2.0"
+    },
    "node_modules/fast-glob": {
      "version": "3.3.2",
      "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz",
@@ -6890,6 +6947,22 @@
        "node": ">= 0.4"
      }
    },
+    "node_modules/is-arguments": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/is-arguments/-/is-arguments-1.2.0.tgz",
+      "integrity": "sha512-7bVbi0huj/wrIAOzb8U1aszg9kdi3KN/CyU19CTI7tAoZYEZoL9yCDXpbXN+uPsuWnP02cyug1gleqq+TU+YCA==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "has-tostringtag": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
    "node_modules/is-array-buffer": {
      "version": "3.0.5",
      "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.5.tgz",
@@ -7829,6 +7902,22 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
+    "node_modules/object-is": {
+      "version": "1.1.6",
+      "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.1.6.tgz",
+      "integrity": "sha512-F8cZ+KfGlSGi09lJT7/Nd6KJZ9ygtvYC0/UYYLI9nmQKLMnydpB9yvbv9K1uSkEu7FU9vYPmVwLg328tX+ot3Q==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
    "node_modules/object-keys": {
      "version": "1.1.1",
      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.1.1.tgz",
@@ -7948,6 +8037,12 @@
      "dev": true,
      "license": "MIT"
    },
+    "node_modules/parchment": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/parchment/-/parchment-1.1.4.tgz",
+      "integrity": "sha512-J5FBQt/pM2inLzg4hEWmzQx/8h8D0CiDxaG3vyp9rKrQRSDgBlhjdP5jQGgosEajXPSQouXGHOmVdgo7QmJuOg==",
+      "license": "BSD-3-Clause"
+    },
    "node_modules/parent-module": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
@@ -8206,6 +8301,34 @@
      ],
      "license": "MIT"
    },
+    "node_modules/quill": {
+      "version": "1.3.7",
+      "resolved": "https://registry.npmjs.org/quill/-/quill-1.3.7.tgz",
+      "integrity": "sha512-hG/DVzh/TiknWtE6QmWAF/pxoZKYxfe3J/d/+ShUWkDvvkZQVTPeVmUJVu1uE6DDooC4fWTiCLh84ul89oNz5g==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "clone": "^2.1.1",
+        "deep-equal": "^1.0.1",
+        "eventemitter3": "^2.0.3",
+        "extend": "^3.0.2",
+        "parchment": "^1.1.4",
+        "quill-delta": "^3.6.2"
+      }
+    },
+    "node_modules/quill-delta": {
+      "version": "3.6.3",
+      "resolved": "https://registry.npmjs.org/quill-delta/-/quill-delta-3.6.3.tgz",
+      "integrity": "sha512-wdIGBlcX13tCHOXGMVnnTVFtGRLoP0imqxM696fIPwIf5ODIYUHIvHbZcyvGlZFiFhK5XzDC2lpjbxRhnM05Tg==",
+      "license": "MIT",
+      "dependencies": {
+        "deep-equal": "^1.0.1",
+        "extend": "^3.0.2",
+        "fast-diff": "1.1.2"
+      },
+      "engines": {
+        "node": ">=0.10"
+      }
+    },
    "node_modules/randombytes": {
      "version": "2.1.0",
      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",
@@ -8281,6 +8404,21 @@
      "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
      "license": "MIT"
    },
+    "node_modules/react-quill": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/react-quill/-/react-quill-2.0.0.tgz",
+      "integrity": "sha512-4qQtv1FtCfLgoD3PXAur5RyxuUbPXQGOHgTlFie3jtxp43mXDtzCKaOgQ3mLyZfi1PUlyjycfivKelFhy13QUg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/quill": "^1.3.10",
+        "lodash": "^4.17.4",
+        "quill": "^1.3.7"
+      },
+      "peerDependencies": {
+        "react": "^16 || ^17 || ^18",
+        "react-dom": "^16 || ^17 || ^18"
+      }
+    },
    "node_modules/react-redux": {
      "version": "9.2.0",
      "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-9.2.0.tgz",
--- a/package.json
+++ b/package.json
@@ -24,6 +24,7 @@
    "react-dom": "^18.3.1",
    "react-hook-form": "^7.54.2",
    "react-icons": "^5.4.0",
+    "react-quill": "^2.0.0",
    "react-redux": "^9.2.0",
    "react-router-dom": "^7.1.1",
    "vite-plugin-pwa": "^0.21.1"
--- a/src/Contexts/GlobalStateContext.tsx
+++ b/src/Contexts/GlobalStateContext.tsx
@@ -2,11 +2,12 @@
 import { createContext, Dispatch, SetStateAction } from 'react';

 // Define the shape of your context value
-type GlobalStateContextType = {
+export interface GlobalStateContextType {
  isAuthenticate: boolean;
  setIsAuthenticate: Dispatch<SetStateAction<boolean>>;
-};
-
+  isBarLoading: boolean;
+  setIsBarLoading: Dispatch<SetStateAction<boolean>>;
+}
 // Create the context with a default value of `undefined`
 const GlobalStateContext = createContext<GlobalStateContextType | undefined>(undefined);

--- a/src/Contexts/GlobalStateProvider.tsx
+++ b/src/Contexts/GlobalStateProvider.tsx
@@ -1,14 +1,21 @@
-import { ReactNode, useState } from 'react';
-import GlobalStateContext from './GlobalStateContext';
-
+import { ReactNode, useState } from "react";
+import GlobalStateContext from "./GlobalStateContext";



 const GlobalStateProvider = ({ children }: { children: ReactNode }) => {
  const [isAuthenticate, setIsAuthenticate] = useState<boolean>(true);
+  const [isBarLoading, setIsBarLoading] = useState<boolean>(false); // ✅ Fixed typo
+
+ 

  return (
-    <GlobalStateContext.Provider value={{ isAuthenticate, setIsAuthenticate }}>
+    <GlobalStateContext.Provider value={{
+      isAuthenticate,
+      setIsAuthenticate,
+      isBarLoading,
+      setIsBarLoading, // ✅ Fixed typo
+    }}>
      {children}
    </GlobalStateContext.Provider>
  );
--- a/src/Layouts/DefaultLayout.tsx
+++ b/src/Layouts/DefaultLayout.tsx
@@ -24,7 +24,7 @@ const DefaultLayout: FC<{ children: React.ReactNode }> = ({ children }) => {
  if (!context) {
    throw new Error('App must be used within a GlobalStateProvider');
  }
-  const { setIsAuthenticate } = context;
+  const { setIsAuthenticate, isBarLoading } = context;
  const [ logOutAdmin ] = useLogOutMutation()


@@ -48,7 +48,7 @@ const DefaultLayout: FC<{ children: React.ReactNode }> = ({ children }) => {

  return (
    <VStack gap={0} w="100%" h="100vh" bg="#F2F2F2">
-    <ProgressBar isLoading={false}  />
+    <ProgressBar isLoading={isBarLoading}  />
    <HStack overflow={'hidden'} position={'relative'} bg="#F2F2F2" backgroundPosition="center" backgroundRepeat="repeat" backgroundSize="cover" gap={0} w="100%" h="calc(100% - 4px)"  p={0}>
      
      <VStack pt={0} zIndex={1} gap={0} rounded={'lg'} h="100%" w="15%" overflow={'auto'} >
@@ -56,9 +56,9 @@ const DefaultLayout: FC<{ children: React.ReactNode }> = ({ children }) => {
          <Image w={55} src={logo} />
        </HStack>
        <VStack  w={'100%'} p={2} pt={0}>
-          {nav?.map(({ title, path, Icon, type, children }, index) => type === 'single' ?
+          {nav?.map(({ title, path, Icon, type, children, initPath }, index) => type === 'single' ?
            <NavLink  className="link" key={index} to={path} style={{ cursor: 'pointer', borderRadius: '8px', padding: '6px', width: '100%', display: 'flex', alignItems: 'center', gap: 6, border: '1px solid #ffffff', backgroundColor:'#fff', color:'#000', boxShadow:'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'}} ><Icon style={{ fontSize: '20px' }} /> <Text fontSize={'xs'} w={'100%'}>{title}</Text></NavLink> :
-            <AccordionRoot key={index} bg={'#fff'} rounded={'lg'} collapsible>
+            <AccordionRoot border={location?.pathname.startsWith(initPath ?? path) ? "1px solid #02A0A0" : '1px' } key={index} bg={'#fff'} rounded={'lg'} collapsible>
              <AccordionItem rounded={'lg'} bg={'#fff'} boxShadow={'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'} borderBottom={'none'} p={0} key={index} value={title}>
                <AccordionItemTrigger className="Oxygen" color={'#fff'}   onClick={() => navigate(path)} gap={0} style={{ cursor: 'pointer', borderRadius: '8px', padding: '5px', width: '100%', display: 'flex', alignItems: 'center', border: '1px solid #ffffff', backgroundColor:'#fff',color:'#000',  fontSize: '14px',  }}> <Text fontSize={'xs'} gap={1} display={'flex'} alignItems={'center'} ><Icon style={{ fontSize: '20px' }} />{title}</Text></AccordionItemTrigger>
                {children?.map(({ title, path, Icon }, index) => <AccordionItemContent className={`linkChild Oxygen ${location?.pathname === path && 'activeChild'}`} key={index} onClick={()=>navigate(path)} style={{ marginTop: 6, cursor: 'pointer', borderRadius: '8px', padding: '6px', width: '100%', display: 'flex', alignItems: 'center', gap: 6, border: '1px solid #ffffff', backgroundColor:'#fff',color:'#919198' }} ><Icon style={{ fontSize: '20px' }} /> <Text fontSize={'xs'} w={'100%'}>{title}</Text></AccordionItemContent>)}
--- a/src/Pages/ManageCMS/AboutUs/AboutUs.tsx
+++ b/src/Pages/ManageCMS/AboutUs/AboutUs.tsx
@@ -1,68 +1,132 @@
-import { Box, HStack, Skeleton, Text } from "@chakra-ui/react";
-import MainFrame from "../../../components/MainFrame"
-import AboutUsAddModel from "../../ManageCMS/AboutUs/AboutUsAddModel";
+// import { Badge, HStack, Text, VStack } from "@chakra-ui/react";
+// import MainFrame from "../../../components/MainFrame"
+// import { useGetAboutUsQuery } from "../../../Redux/Service/manage.aboutus.service";
+// import { Spinner } from "../../../components/Sipnner/Spinner";
+// import GlobalStateContext from "../../../Contexts/GlobalStateContext";
+// import { useContext, useEffect } from "react";
+// import AboutUsAddModel from "./AboutUsAddModel";
+
+
+
+// const AboutUs = () => {
+
+//   const { data, isLoading, isFetching } = useGetAboutUsQuery();
+
+//   // const content = data?.data
+//   console.log('====================================');
+//   console.log(data);
+//   console.log('====================================');
+
+//   const context = useContext(GlobalStateContext);
+//   if (!context) throw new Error('App must be used within a GlobalStateProvider');
+
+//   const { setIsBarLoading } = context;
+//   useEffect(() => {
+//     setIsBarLoading(isFetching)
+//   }, [data])
+
+//   return (
+//     <MainFrame transperant={true}>
+//       <VStack gap={4} pb={4} pt={0}>
+//         {isLoading || isFetching ?
+//           <Spinner /> : data?.data?.map(({ id, content, about_language }) => <VStack bg={'#fff'}
+//             boxShadow={'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'} rounded={'lg'} p={3} key={id}>
+//             <HStack
+//               w={"100%"}
+//               justifyContent={"space-between"}
+
+//               py={0}
+//               px={0}
+//             >
+//               <Text as={"span"} fontSize={"sm"} fontWeight={500} color={"#000"}>
+//                 About Us <Badge variant={'surface'} colorPalette="cyan" ms={2} size={'sm'} fontSize={'xs'} px={2}>🎓 {about_language?.language_name}</Badge>
+//               </Text>
+
+//               {/* <AboutUsAddModel /> */}
+//               <AboutUsAddModel/>
+//             </HStack>
+//             <Text
+//               as="p"
+//               fontSize="sm"
+//               fontWeight={400}
+//               color="#1D1D1D"
+//             >
+//               {content}
+//             </Text>
+
+//           </VStack>)}
+//       </VStack>
+//     </MainFrame>
+//   )
+// }
+// export default AboutUs
+
+import { Badge, HStack, Stack, Text, VStack } from "@chakra-ui/react";
+import MainFrame from "../../../components/MainFrame";
 import { useGetAboutUsQuery } from "../../../Redux/Service/manage.aboutus.service";
-
-
+import { Spinner } from "../../../components/Sipnner/Spinner";
+import GlobalStateContext from "../../../Contexts/GlobalStateContext";
+import { useContext, useEffect } from "react";
+import AboutUsAddModel from "./AboutUsAddModel";

 const AboutUs = () => {
+  const { data, isLoading, isFetching } = useGetAboutUsQuery();

-  const { data, isLoading } = useGetAboutUsQuery();
+  console.log("Fetched About Us Data:", data);

-  const content = data?.data?.[0]?.content
-  console.log('====================================');
-  // console.log(response);
-  console.log('====================================');
+  const context = useContext(GlobalStateContext);
+  if (!context) throw new Error("App must be used within a GlobalStateProvider");

+  const { setIsBarLoading } = context;
+  useEffect(() => {
+    setIsBarLoading(isFetching);
+  }, [isFetching, setIsBarLoading]);

  return (
+    <MainFrame transperant={true}>
+      <VStack gap={4} pb={4} pt={0}>
+        <Stack bg={"#fff"} w={"100%"} mt={2} p={4} borderRadius={4}><Text color={"black"} textAlign={"left"} fontWeight={"600"} >             About Us
+        </Text></Stack>

-    <MainFrame>
-      <Box pb={4}>
-        <HStack
-          w={"100%"}
-          justifyContent={"space-between"}
-          mb={4}
-          py={0}
-          px={3}
-        >
-          <Text as={"span"} fontSize={"sm"} fontWeight={500} color={"#000"}>
-            AboutUs
-          </Text>
-
-          <HStack>
-
-            <AboutUsAddModel />
-          </HStack>
-        </HStack>
-        {/* Show Skeleton until content is available */}
-        {isLoading || !content ? (
-          <Box px={3} w="85%">
-            <Skeleton height="20px" mb="10px" />
-            <Skeleton height="20px" mb="10px" />
-            <Skeleton height="20px" mb="10px" />
-            <Skeleton height="20px" mb="10px" width="75%" />
-            <Skeleton height="20px" mb="15px" width="90%" />
-            <Skeleton height="20px" mb="10px" />
-            <Skeleton height="20px" mb="10px" width="85%" />
-            <Skeleton height="20px" mb="10px" />
-            <Skeleton height="20px" width="70%" />
-          </Box>
+        {isLoading || isFetching ? (
+          <Spinner />
        ) : (
-          <Text
-            as="p"
-            fontSize="sm"
-            fontWeight={400}
-            color="#1D1D1D"
-            px={3}
-            w="85%"
-            mb="15px"
-          >
-            {content}
-          </Text>
+          data?.data?.map(({ id, content, about_language }) => (
+            <VStack
+              bg={"#fff"}
+              boxShadow={"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"}
+              rounded={"lg"}
+              p={3}
+              key={id}
+            >
+
+              <HStack w={"100%"} justifyContent={"space-between"} py={0} px={0}>
+                <Text as={"span"} fontSize={"sm"} fontWeight={500} color={"#000"}>
+                  <Badge
+                    variant={"surface"}
+                    colorPalette="cyan"
+                    ms={2}
+                    size={"sm"}
+                    fontSize={"xs"}
+                    px={2}
+                  >
+                    🎓 {about_language?.language_name}
+                  </Badge>
+                </Text>
+
+                {/* Pass Data to AboutUsAddModel */}
+                <AboutUsAddModel aboutUsData={{ id, content, about_language }} />
+              </HStack>
+              <Text as="p" fontSize="sm" fontWeight={400} color="#1D1D1D">
+                {/* {content} */}
+                <div dangerouslySetInnerHTML={{ __html: content }} />
+              </Text>
+            </VStack>
+          ))
        )}
-      </Box>
+      </VStack>
    </MainFrame>
-  )
-}
-export default AboutUs
+  );
+};
+
+export default AboutUs;
--- a/src/Pages/ManageCMS/AboutUs/AboutUsAddModel.tsx
+++ b/src/Pages/ManageCMS/AboutUs/AboutUsAddModel.tsx
@@ -1,119 +1,142 @@
-import React, { useState } from "react";
 import { FaRegEdit } from "react-icons/fa";
 import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
+    DialogBody,
+    DialogCloseTrigger,
+    DialogContent,
+    DialogFooter,
+    DialogHeader,
+    DialogRoot,
+    DialogTitle,
+    DialogTrigger,
 } from "../../../components/ui/dialog";
-import { Field, Stack, Text, Textarea } from "@chakra-ui/react";
+import { Field, Stack, Text } from "@chakra-ui/react";
 import { Button } from "../../../components/ui/button";
+import ReactQuill from "react-quill";
+import "react-quill/dist/quill.snow.css"; // Import the styles
+import { useState } from "react";
 import { useUpdateAboutUsMutation } from "../../../Redux/Service/manage.aboutus.service";
+import { useForm, Controller } from "react-hook-form"; // Import React Hook Form

-function AboutUsAddModel() {
-  const [content, setContent] = useState(""); // State for the textarea input
-  const [updateAboutUs, { isLoading }] = useUpdateAboutUsMutation(); // Mutation for updating About Us
-  //   const toast = useToast(); // Toast for feedback
+function AboutUsAddModel({ aboutUsData }: { aboutUsData: any }) {
+    const [isOpen, setIsOpen] = useState(false);

-  // Handle form submission
-  const handleSubmit = async (e: any) => {
-    e.preventDefault(); // Prevent default form submission
+    // RTK Query Mutation Hook
+    const [updateAboutUs, { isLoading }] = useUpdateAboutUsMutation();

-    try {
-      // Call the updateAboutUs mutation
-      const res = await updateAboutUs({ id: 2, updatedData: content }).unwrap();
-      console.log(res);
+    // React Hook Form
+    const {
+        control,
+        handleSubmit,
+        reset,
+        setValue,
+    } = useForm({
+        defaultValues: {
+            content: "",
+            languageCode: "",
+        },
+    });

-      // Show success toast
-      //   toast({
-      //     title: "Success",
-      //     description: "About Us content updated successfully",
-      //     status: "success",
-      //     duration: 5000,
-      //     isClosable: true,
-      //   });
+    // Function to handle edit click (pre-fill the editor)
+    const handleEditClick = (data: any) => {
+        setValue("content", data.content); // Pre-fill the content field
+        setValue("languageCode", data.about_language.language_code); // Pre-fill the language code
+        setIsOpen(true); // Open dialog
+    };

-      // Clear the input field after successful submission
-      setContent("");
-    } catch (error) {
-      // Show error toast
-      //   toast({
-      //     title: "Error",
-      //     description: "Failed to update About Us content",
-      //     status: "error",
-      //     duration: 5000,
-      //     isClosable: true,
-      //   });
-    }
-  };
+    // Function to handle update submission
+    const onSubmit = async (formData: any) => {
+        if (!formData.content.trim()) return; // Prevent empty updates

-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-        <Button bgColor="#EEEEEE" pl={3} pr={3} size="xs" color="#000">
-          <FaRegEdit color="#000" style={{ height: "14px", width: "14px" }} />
-          <Text color="#000" mt={1}>
-            Edit
-          </Text>
-        </Button>
-      </DialogTrigger>
+        try {
+            await updateAboutUs({
+                id: aboutUsData.id,
+                content: formData.content,
+                language_code: formData.languageCode,
+            }).unwrap();
+            setIsOpen(false); // Close dialog on success
+            reset(); // Reset the form
+        } catch (error) {
+            console.error("Update failed:", error);
+        }
+    };

-      <DialogContent
-        bg="#fff"
-        w={{ base: "90%", md: "400px" }}
-        height="auto"
-        p={3}
-      >
-        <DialogHeader bg="white">
-          <DialogTitle alignSelf="center" color="black" fontSize="14px">
-            Edit
-          </DialogTitle>
-        </DialogHeader>
+    return (
+        <DialogRoot placement="center" open={isOpen}>
+            <DialogTrigger asChild>
+                <Button
+                    bgColor="#EEEEEE"
+                    pl={3}
+                    pr={3}
+                    size="xs"
+                    color="#000"
+                    onClick={() => handleEditClick(aboutUsData)} // Set content before opening modal
+                >
+                    <FaRegEdit color="#000" style={{ height: "14px", width: "14px" }} />
+                    <Text color="#000" mt={1}>Edit</Text>
+                </Button>
+            </DialogTrigger>

-        <DialogBody bg="white">
-          <Stack py={3}>
-            <Field.Root>
-              <Field.Label color="black" pt={1} fontSize="12px">
-                AboutUs
-              </Field.Label>
-              <Textarea
-                placeholder="Enter About Us content"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                p={2}
-                fontSize="12px"
-                height="140px" // Increased height for better usability
-                pt={1.5}
-                value={content} // Bind the state to the textarea
-                onChange={(e) => setContent(e.target.value)} 
-                resize={'none'}
-                _focusVisible={{outline:'none'}}
-              />
-            </Field.Root>
-          </Stack>
-        </DialogBody>
+            <DialogContent bg="#fff" w={{ base: "90%", md: "1200px" }} height="auto" p={3}>
+                <DialogHeader bg="white">
+                    <DialogTitle alignSelf="center" color="black" fontSize="14px">
+                        Edit About Us
+                    </DialogTitle>
+                </DialogHeader>

-        <DialogFooter display="flex" justifyContent="center" pt="2">
-          <Button
-            w="100%"
-            bg="#02A0A0"
-            color="#fff"
-            onClick={handleSubmit} // Trigger handleSubmit on button click
-            // isLoading={isLoading} // Show loading state while the mutation is in progress
-          >
-            Save
-          </Button>
-        </DialogFooter>
+                <DialogBody bg="white">
+                    <Stack py={3} mb={8}>
+                        <Field.Root>
+                            <Field.Label color="black" pt={1} fontSize="12px">
+                                About Us Content
+                            </Field.Label>
+                            {/* Use Controller to integrate ReactQuill with React Hook Form */}
+                            <Controller
+                                name="content"
+                                control={control}
+                                render={({ field }) => (
+                                    <ReactQuill
+                                        value={field.value}
+                                        onChange={field.onChange}
+                                        placeholder="Enter About Us content"
+                                        modules={{
+                                            toolbar: [
+                                                [{ 'header': [1, 2, false] }],
+                                                ['bold', 'italic', 'underline', 'strike'],
+                                                ['link', 'image'],
+                                                [{ 'list': 'ordered' }, { 'list': 'bullet' }],
+                                                ['clean']
+                                            ],
+                                        }}
+                                        formats={[
+                                            'header',
+                                            'bold', 'italic', 'underline', 'strike',
+                                            'list', 'bullet',
+                                            'link', 'image'
+                                        ]}
+                                        style={{ color: "black", border: "none", fontSize: "12px", height: "170px", width: "100%" }}
+                                    />
+                                )}
+                            />
+                        </Field.Root>
+                    </Stack>
+                </DialogBody>

-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+                <DialogFooter display="flex" justifyContent="center" pt="2">
+                    <Button
+                        w="100%"
+                        bg="#02A0A0"
+                        color="#fff"
+                        // isLoading={isLoading}
+                        onClick={handleSubmit(onSubmit)} // Use handleSubmit to trigger form submission
+                    >
+                        Save
+                    </Button>
+                </DialogFooter>
+
+                <DialogCloseTrigger color="black" onClick={() => setIsOpen(false)} />
+            </DialogContent>
+        </DialogRoot>
+    );
 }

-export default AboutUsAddModel;
+export default AboutUsAddModel;
--- a/src/Pages/ManageCMS/FAQ/EditDetails.tsx
+++ b/src/Pages/ManageCMS/FAQ/EditDetails.tsx
@@ -1,3 +1,85 @@
+// import { Button } from "../../../components/ui/button";
+// import {
+//   DialogBody,
+//   DialogCloseTrigger,
+//   DialogContent,
+//   DialogFooter,
+//   DialogHeader,
+//   DialogRoot,
+//   DialogTitle,
+//   DialogTrigger,
+// } from "../../../components/ui/dialog";
+// import { Field, Input, Stack, Textarea } from "@chakra-ui/react";
+// import Edit from "../../../components/ActionIcons/Edit";
+// function EditDetails() {
+//   return (
+//     <DialogRoot placement="center">
+//       <DialogTrigger asChild>
+//         {/*  */}
+//         <Button bg={"#fff"} color={"black"}><Edit /></Button>
+
+//       </DialogTrigger>
+
+//       <DialogContent
+//         bg={"#fff"}
+//         // w={{ lg: "60%", md: "230px" }}
+//         w={{ base: "90%", md: "400px" }}
+//         height={"auto"}
+//         p={3} // Reduced padding
+//         bgSize={"md"}
+//       >
+//         <DialogHeader bg="white">
+//           <DialogTitle alignSelf="center" color="black" fontSize="14px">
+//             Edit Details
+//           </DialogTitle>
+//         </DialogHeader>
+
+//         <DialogBody bg="white">
+//           <Stack py={3}>
+//             <Field.Root>
+//               <Field.Label color="black" pt={1} fontSize="12px">
+//                 Questions
+//               </Field.Label>
+//               <Input
+//                 placeholder="Questions"
+//                 bgColor="#EEEEEE"
+//                 color="black"
+//                 border="none"
+//                 pl={1}
+//                 fontSize="12px"
+//                 height="30px"
+//               />
+
+//               <Field.Label color="black" pt={1} fontSize="12px">
+//                 Answer
+//               </Field.Label>
+//               <Textarea
+//                 placeholder="Answer"
+//                 bgColor="#EEEEEE"
+//                 color="black"
+//                 border="none"
+//                 pl={1}
+//                 fontSize="12px"
+//                 height="30px"
+//                 pt={1.5}
+//               />
+//             </Field.Root>
+//           </Stack>
+//         </DialogBody>
+//         <DialogFooter display="flex" justifyContent="center" pt={"2"}>
+//           <Button w="100%" bg="#02A0A0" color={"#fff"}>
+//             Save
+//           </Button>
+//         </DialogFooter>
+
+//         <DialogCloseTrigger color="black" />
+//       </DialogContent>
+//     </DialogRoot>
+//   );
+// }
+
+// export default EditDetails;
+
 import { Button } from "../../../components/ui/button";
 import {
  DialogBody,
@@ -11,24 +93,27 @@ import {
 } from "../../../components/ui/dialog";
 import { Field, Input, Stack, Textarea } from "@chakra-ui/react";
 import Edit from "../../../components/ActionIcons/Edit";
-function EditDetails() {
+
+function EditDetails(rowData: any) {
+
  return (
    <DialogRoot placement="center">
      <DialogTrigger asChild>
-        <Edit />
+
+
+
+        <Button bg="transparent" color={"black"} h={"18px"}>    <Edit /></Button>
      </DialogTrigger>

      <DialogContent
        bg={"#fff"}
-        // w={{ lg: "60%", md: "230px" }}
        w={{ base: "90%", md: "400px" }}
        height={"auto"}
-        p={3} // Reduced padding
-        bgSize={"md"}
+        p={3}
      >
        <DialogHeader bg="white">
          <DialogTitle alignSelf="center" color="black" fontSize="14px">
-            Edit Details
+            Edit Details (ID: {rowData?.id})
          </DialogTitle>
        </DialogHeader>

@@ -36,16 +121,17 @@ function EditDetails() {
          <Stack py={3}>
            <Field.Root>
              <Field.Label color="black" pt={1} fontSize="12px">
-                Questions
+                Question
              </Field.Label>
              <Input
-                placeholder="Questions"
+                placeholder="Question"
                bgColor="#EEEEEE"
                color="black"
                border="none"
                pl={1}
                fontSize="12px"
                height="30px"
+                defaultValue={rowData?.question} // Pre-fill question
              />

              <Field.Label color="black" pt={1} fontSize="12px">
@@ -60,10 +146,12 @@ function EditDetails() {
                fontSize="12px"
                height="30px"
                pt={1.5}
+                defaultValue={rowData?.answer} // Pre-fill answer
              />
            </Field.Root>
          </Stack>
        </DialogBody>
+
        <DialogFooter display="flex" justifyContent="center" pt={"2"}>
          <Button w="100%" bg="#02A0A0" color={"#fff"}>
            Save
--- a/src/Pages/ManageCMS/FAQ/FAQ.tsx
+++ b/src/Pages/ManageCMS/FAQ/FAQ.tsx
@@ -5,7 +5,6 @@ import { InputGroup } from "../../../components/ui/input-group";
 import { LuSearch } from "react-icons/lu";
 import DataTable from "../../../components/DataTable";
 import AlertDailog from "../../../components/AlertDailog";
-import { RiDeleteBin5Line } from "react-icons/ri";
 import { Switch } from "../../../components/ui/switch";
 import FaqAddModel from "./FaqAddModel";
 import Delete from "../../../components/ActionIcons/Delete";
@@ -28,11 +27,13 @@ const managepost: any[] = [
    "Action": (
      <HStack justifyContent="center">
        <Box>
-          <Switch colorPalette={'teal'} size={"xs"}/>
+          <Switch colorPalette={'teal'} size={"xs"} />
        </Box>
+        {/* <EditDetails /> */}
        <EditDetails />
+
        <AlertDailog
-          AltertTiggerIcon={() => <Delete />} 
+          AltertTiggerIcon={() => <Delete />}
          alertText="Delete Users"
          alertIcon={<Image src={"DeleteIcon"} h={"39px"} />}
          alertCaption="are you sure you want to delete ?"
@@ -58,11 +59,11 @@ const FAQ = () => {
          px={3}
        >
          <Text as={"span"} fontSize={"sm"} fontWeight={500} color={"#000"}>
-           FAQs
+            FAQs
          </Text>

          <HStack >
-            <InputGroup 
+            <InputGroup
              startElement={
                <LuSearch fontSize={"xs"} style={{ position: 'relative', left: '10px' }} />
              }
@@ -91,7 +92,7 @@ const FAQ = () => {
          tableHeadRow={tableHeadRow}
          data={managepost}
        />
-      </Box>       
+      </Box>
    </MainFrame>
  )
 }
--- a/src/Pages/ManageCMS/PrivacyPolicy/PrivacyPolicy.tsx
+++ b/src/Pages/ManageCMS/PrivacyPolicy/PrivacyPolicy.tsx
@@ -1,66 +1,53 @@
-import { Box, HStack, Text, Skeleton } from "@chakra-ui/react";
-import MainFrame from "../../../components/MainFrame";
-import PrivacyPolicyAddModel from "./PrivacyPolicyAddModel";
+import { Badge, HStack, Text, VStack } from "@chakra-ui/react";
 import { useGetPrivacyPolicyQuery } from "../../../Redux/Service/privacy.policy.service";
+import MainFrame from "../../../components/MainFrame";
+import { Spinner } from "../../../components/Sipnner/Spinner";
+import PrivacyPolicyAddModel from "./PrivacyPolicyAddModel";
+import GlobalStateContext from "../../../Contexts/GlobalStateContext";
+import { useContext, useEffect } from "react";


 const PrivacyPolicy = () => {
-  // Fetch data using RTK Query with type annotations
-  const { data, isLoading } = useGetPrivacyPolicyQuery();
+  const { data, isLoading, isFetching } = useGetPrivacyPolicyQuery();

-  console.log(isLoading);
-  
+  const context = useContext(GlobalStateContext);
+  if (!context) throw new Error('App must be used within a GlobalStateProvider');

-  // Log the response for debugging
-  console.log("====================================");  
-  console.log(data);
-  console.log("====================================");
-  
-  // Extract content array from the response
-  const content = data?.data?.[0]?.content;
+  const { setIsBarLoading } = context;
+  useEffect(() => {
+    setIsBarLoading(isFetching)
+  }, [data])

  return (
-    <MainFrame>
-      <Box>
-        <HStack
-          w={"100%"}
-          justifyContent={"space-between"}
-          mb={4}
-          py={0}
-          px={3}
-        >
-          <Text as={"span"} fontSize={"sm"} fontWeight={500} color={"#000"}>
-            Privacy Policy
-          </Text>
+    <MainFrame transperant={true}>
+      <VStack gap={4} pb={4} pt={0}>
+        {isLoading || isFetching ?
+          <Spinner /> : data?.data?.map(({ id, content, privacy_language }) => <VStack bg={'#fff'}
+            boxShadow={'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'} rounded={'lg'} p={3} key={id}>
+            <HStack
+              w={"100%"}
+              justifyContent={"space-between"}

-          <HStack>
-            <PrivacyPolicyAddModel />
-          </HStack>
-        </HStack>
+              py={0}
+              px={0}
+            >
+              <Text as={"span"} fontSize={"sm"} fontWeight={500} color={"#000"}>
+                Privacy Policy <Badge variant={'surface'} colorPalette="cyan" ms={2} size={'sm'} fontSize={'xs'} px={2}>🎓 {privacy_language?.language_name}</Badge>
+              </Text>

-        {/* Render multiple skeletons or content based on loading state */}
-        {isLoading || !content ? (
-          <Box px={3} pb={3} w="90%">
-            <Skeleton height="20px" mb="10px" width="90%" />
-            <Skeleton height="20px" mb="15px" width="90%" />
-            <Skeleton height="20px" mb="10px" width="90%" />
-            <Skeleton height="20px" mb="10px" width="80%" />
-            <Skeleton height="20px" width="60%" />
-          </Box>
-        ) : (
-          <Text
-            as="p"
-            fontSize="sm"
-            fontWeight={400}
-            color="#1D1D1D"
-            px={3}
-            w="85%"
-            mb="15px"
-          >
-            {content}
-          </Text>
-        )}
-      </Box>
+              <PrivacyPolicyAddModel />
+            </HStack>
+            <Text
+              as="p"
+              fontSize="sm"
+              fontWeight={400}
+              color="#1D1D1D"
+            >
+              {content}
+            </Text>
+
+          </VStack>)}
+      </VStack>
    </MainFrame>
  );
 };
--- a/src/Pages/ManageCMS/PrivacyPolicy/PrivacyPolicySkeleton.tsx
+++ b/src/Pages/ManageCMS/PrivacyPolicy/PrivacyPolicySkeleton.tsx
@@ -0,0 +1,15 @@
+import { Box, Skeleton } from '@chakra-ui/react'
+
+const PrivacyPolicySkeleton = () => {
+  return (
+    <Box px={3} pb={3} w="90%">
+      <Skeleton height="20px" mb="10px" width="90%" />
+      <Skeleton height="20px" mb="15px" width="90%" />
+      <Skeleton height="20px" mb="10px" width="90%" />
+      <Skeleton height="20px" mb="10px" width="80%" />
+      <Skeleton height="20px" width="60%" />
+    </Box>
+  )
+}
+
+export default PrivacyPolicySkeleton
--- a/src/Pages/Profile/Profile.tsx
+++ b/src/Pages/Profile/Profile.tsx
@@ -1,7 +1,6 @@
-import { Avatar, Box, Field, Input, SimpleGrid, Stack, Text } from "@chakra-ui/react"
-import MainFrame from "../../components/MainFrame"
+import { Avatar, Box, Field, Input, SimpleGrid, Stack, Text } from "@chakra-ui/react";
 import { FaCamera } from "react-icons/fa";
-import { Button } from "../../components/ui/button";
+import MainFrame from "../../components/MainFrame";
 import Changepassword from "./ChangePassword";

 const Profile = () => {
@@ -10,13 +9,11 @@ const Profile = () => {
      <Stack p={5}>
        <Box position="relative" width="fit-content"
          display="inline-block"
-
          cursor="pointer" onClick={() => alert("Avatar clicked!")}>
          <Avatar.Root size={"2xl"} style={{ display: "inline-block", width: "auto" }}>
            <Avatar.Fallback />
            <Avatar.Image src="https://bit.ly/sage-adebayo" />
          </Avatar.Root>
-
          <Box
            position="absolute"
            bottom="-2px"
@@ -27,7 +24,6 @@ const Profile = () => {
          </Box>
        </Box>
        <Text color={"black"} fontWeight={"bold"}>{`Jackson Da`.slice(0, 10) + '...'}</Text>
-        {/* <Text color={"black"} fontSize={"10px"}>Employee ID: <Text color={"black"} fontSize={"10px"}>#1245679</Text> </Text> */}
        <Text color="black" fontSize="12px">
          Employee ID: <span>#1245679</span>
        </Text>
@@ -35,14 +31,16 @@ const Profile = () => {
          <SimpleGrid columns={{ base: 1, md: 2 }} columnGap={9} rowGap={4}>
            <Field.Root>
              <Field.Label color="black" pt={1} fontSize="12px">First Name</Field.Label>
-              <Input placeholder="Enter the First Name" color="black" border="1px solid grey" pl={1} fontSize="12px" height="30px" /></Field.Root>
+              <Input placeholder="Enter the First Name" color="black" border="1px solid grey" pl={1} fontSize="12px" height="30px" />
+            </Field.Root>
            <Field.Root>
              <Field.Label color="black" pt={1} fontSize="12px">last Name</Field.Label>
-              <Input placeholder="Enter the last Name" color="black" border="1px solid grey" pl={1} fontSize="12px" height="30px" /></Field.Root>
+              <Input placeholder="Enter the last Name" color="black" border="1px solid grey" pl={1} fontSize="12px" height="30px" />
+            </Field.Root>
            <Field.Root>
              <Field.Label color="black" pt={1} fontSize="12px" >Phone Number</Field.Label>
-              <Input placeholder="Enter the Phone Number" color="black" border="1px solid grey" pl={1} fontSize="12px" height="30px" /></Field.Root>
-
+              <Input placeholder="Enter the Phone Number" color="black" border="1px solid grey" pl={1} fontSize="12px" height="30px" />
+            </Field.Root>
          </SimpleGrid>
          <Text color={"black"} fontWeight={"bold"} fontSize={"14px"} mt={5}>Update password</Text>
          {/* <Button bg="#02A0A0" color={"#fff"} p={4} fontSize={"12px"} mt={2}>
--- a/src/Redux/Service/manage.aboutus.service.ts
+++ b/src/Redux/Service/manage.aboutus.service.ts
@@ -1,6 +1,6 @@
 import { createApi } from "@reduxjs/toolkit/query/react";
 import { baseQueryWithReauth } from "./apiSlice";
-
+import { AboutUsResponse } from "../../Types/aboutUsType";
 export const aboutUs = createApi({
  reducerPath: "aboutUs",
  baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
@@ -30,16 +30,22 @@ export const aboutUs = createApi({
        body: data,
      }),
    }),
-
    // 🔹 PUT: Update an existing post
-    updateAboutUs: builder.mutation<UpdateAboutUsResponse, UpdateAboutUsRequest>({
-      query: ({ id, updatedData }) => ({
-        url: `/posts/${id}`,
-        method: "POST",
-        body: updatedData,
+    // updateAboutUs: builder.mutation<UpdateAboutUsResponse, UpdateAboutUsRequest>({
+    //   query: ({ id, updatedData }) => ({
+    //     url: `/posts/${id}`,
+    //     method: "POST",
+    //     body: updatedData,
+    //   }),
+    // }),
+       // 🔹 PUT: Update an About Us entry
+       updateAboutUs: builder.mutation({
+        query: (updatedData) => ({
+          url: "/about-us/update", // ✅ Updated URL
+          method: "POST",
+          body: updatedData,
+        }),
      }),
-    }),
-
    // 🔹 DELETE: Remove a post by ID
    deletePost: builder.mutation<{ success: boolean }, number>({
      query: (id) => ({
@@ -78,12 +84,12 @@ export type Post = {


 export type UpdateAboutUsRequest={
-  id: number; updatedData: string
+  id: number; updatedData: string,language_code:string
 }


 export type UpdateAboutUsResponse={
-  id: number; updatedData: string
+  id: number; updatedData: string,language_code:string
 }


@@ -94,10 +100,3 @@ export type AboutUs = {
  is_active: boolean;
 };

-// First define your interface
-interface AboutUsResponse {
-  data: {
-    content: string;
-    // other fields...
-  }[];
-}
--- a/src/Routes/Nav.ts
+++ b/src/Routes/Nav.ts
@@ -17,18 +17,18 @@ export const nav = [
        },
        {
          title: "Manage Users",
-          path: "/register-users",
+          initPath: "/manage-users",
          Icon: BiUserPin,
          type:'multiple',
          children: [
            {
              title: "Register Users",
-              path: "/register-users",
+              path: "/manage-users/register-users",
              Icon: GoDotFill,
            },
            {
              title: "Deactivated Accounts",
-              path: "/deactivated-accounts",
+              path: "/manage-users/deactivated-accounts",
              Icon: GoDotFill,
            },
          ],
@@ -65,33 +65,33 @@ export const nav = [
        },
        {
          title: "Manage CMS",
-          path: "/faq",
+          initPath: "/manage-cms",
          Icon: AiOutlineFileText,
          type:'multiple',
          children: [
            {
              title: "FAQs",
-              path: "/faq",
+              path: "/manage-cms/faq",
              Icon: GoDotFill,
            },
            {
              title: "About Us",
-              path: "/about-us",
+              path: "/manage-cms/about-us",
              Icon: GoDotFill,
            },
            {
              title: "Privacy Policy",
-              path: "/privacy-policy",
+              path: "/manage-cms/privacy-policy",
              Icon: GoDotFill,
            },
            {
              title: "Terms And Conditions",
-              path: "/terms-conditions",
+              path: "/manage-cms/terms-conditions",
              Icon: GoDotFill,
            },
            {
              title: "Privacy",
-              path: "/privacy",
+              path: "/manage-cms/privacy",
              Icon: GoDotFill,
            },
          ],
@@ -104,38 +104,38 @@ export const nav = [
        },
        {
          title: "Master Module",
-          path: "/agency-master",
+          initPath: "/master-module",
          Icon: BsBoxes,
          type:'multiple',
          children: [
            {
              title: "Agency Master",
-              path: "/agency-master",
+              path: "/master-module/agency-master",
              Icon: GoDotFill,
            },
            {
              title: "Template Master",
-              path: "/template-master",
+              path: "/master-module/template-master",
              Icon: GoDotFill,
            },
            {
              title: "Job Type",
-              path: "/job-type",
+              path: "/master-module/job-type",
              Icon: GoDotFill,
            },
            {
              title: "Workspace Mode",
-              path: "/workspace-mode",
+              path: "/master-module/workspace-mode",
              Icon: GoDotFill,
            },
            {
              title: "Country",
-              path: "/country",
+              path: "/master-module/country",
              Icon: GoDotFill,
            },
            {
              title: "Job Status",
-              path: "/job-status",
+              path: "/master-module/job-status",
              Icon: GoDotFill,
            },
          ],
--- a/src/Routes/Routes.ts
+++ b/src/Routes/Routes.ts
@@ -27,27 +27,40 @@ import { Spinner } from "../components/Sipnner/Spinner";
 export const RouteLink = [
    { path: "/", Component: Dashboard },
    { path: "/dashboard", Component: Dashboard },
-    { path: "/register-users", Component: RegisterUsers },
-    { path: "/deactivated-accounts", Component: DeactivatedAccounts },
+    { path: "/manage-users/register-users", Component: RegisterUsers },
+    { path: "/manage-users/deactivated-accounts", Component: DeactivatedAccounts },
    { path: "/manage-post", Component: ManagePost },
    { path: "/sub-admin", Component: SubAdmin},
    { path: "/manage-jobs", Component: ManageJobs},
    { path: "/manage-groups", Component: ManageGroups },
    { path: "/manage-contact", Component: ManageContact},
-    { path: "/faq", Component: FAQ},
-    { path: "/about-us", Component: AboutUs},
-    { path: "/privacy-policy", Component: PrivacyPolicy},
-    { path: "/terms-conditions", Component: TermsAndConditions},
-    { path: "/privacy", Component: Privacy},
+
+
+
+    { path: "/manage-cms/faq", Component: FAQ},
+    { path: "/manage-cms/about-us", Component: AboutUs},
+    { path: "/manage-cms/privacy-policy", Component: PrivacyPolicy},
+    { path: "/manage-cms/terms-conditions", Component: TermsAndConditions},
+    { path: "/manage-cms/privacy", Component: Spinner},
+
+
+
    { path: "/my-profile", Component: MyProfile},
    { path: "/manage-notification", Component: Notification},
+
+
+
+
+
    { path: "/profile", Component: Profile},
-    { path: "/agency-master", Component: AgencyMaster},
-    { path: "/template-master", Component: TemplateMaster},
-    { path: "/job-type", Component: JobType},
-    { path: "/workspace-mode", Component: WorkspaceMode},
-    { path: "/country", Component: Country},
-    { path: "/job-status", Component: JobStatus},
+
+
+    { path: "/master-module/agency-master", Component: AgencyMaster},
+    { path: "/master-module/template-master", Component: TemplateMaster},
+    { path: "/master-module/job-type", Component: JobType},
+    { path: "/master-module/workspace-mode", Component: WorkspaceMode},
+    { path: "/master-module/country", Component: Country},
+    { path: "/master-module/job-status", Component: JobStatus},
    // { path: "/job-status", Component: Spinner},

 ]
--- a/src/Types/aboutUsType.tsx
+++ b/src/Types/aboutUsType.tsx
@@ -0,0 +1,27 @@
+// First define your interface
+// export interface AboutUsResponse {
+//     data: {
+//         content: string;
+//         // other fields...
+//     }[];
+// }
+
+
+export interface AboutUsContent {
+    id: number;
+    language_master_xid: number;
+    content: string;
+    is_active: boolean;
+    about_language: {
+        id: number;
+        language_code: string;
+        language_name: string;
+    }
+}
+
+export interface AboutUsResponse {
+    status: "success" | "error"; // Assuming it can be "success" or "error"
+    status_code: number;
+    message: string;
+    data: AboutUsContent[];
+}
--- a/src/Types/privacyPolicyTypes.tsx
+++ b/src/Types/privacyPolicyTypes.tsx
@@ -3,6 +3,11 @@ export interface PrivacyPolicyContent {
  language_master_xid: number;
  content: string;
  is_active: boolean;
+  privacy_language:{
+    id:number;
+    language_code:string;
+    language_name:string;
+  }
 }

 export interface PrivacyPolicyResponse {
--- a/src/components/MainFrame.tsx
+++ b/src/components/MainFrame.tsx
@@ -9,19 +9,21 @@ const MotionVStack = motion(VStack)
 interface MainFrameProps {
  children: React.ReactNode
  title?: string
+  transperant?:boolean
 }

-const MainFrame: FC<MainFrameProps> = ({ children }) => {
+const MainFrame: FC<MainFrameProps> = ({ children, transperant }) => {
  return (
-    <MotionVStack  rounded="lg" overflowY={'auto'} overflowX={'hidden'} {...OPACITY_ON_LOAD} w="100%" minH="93%"  p={0} pe={2} ps={1.5}  pb={2}>
+    <MotionVStack overflow={'auto'}   {...OPACITY_ON_LOAD} w="100%" minH="93%"   pe={2} ps={1.5} pt={1}  pb={2}>
      <Box
        w="100%"
-        // h="100%"
-        bg="#ffffff"
+        // minH="100%"
+        bg={transperant?'transperant':"#ffffff"}
        // overflow={'scroll'}
        rounded="lg"
-        boxShadow={'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'}
-        pt={3}
+        boxShadow={transperant?'none':'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'}
+        pt={transperant?0:3}
+        
      >
        {children}
      </Box>
--- a/src/components/Sipnner/Spinner.tsx
+++ b/src/components/Sipnner/Spinner.tsx
@@ -1,6 +1,7 @@
 import { Center } from '@chakra-ui/react'
 import './Spinner.css'
-export const Spinner = () => <Center w={'100%'} h={'100%'}> <div className='loader'/></Center>
+import MainFrame from '../MainFrame'
+export const Spinner = () =><Center boxShadow={'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'} rounded={'lg'} w={'100%'} h={'89vh'} bg={'#fff'} > <div className='loader'/></Center>



--- a/src/index.css
+++ b/src/index.css
@@ -42,6 +42,7 @@ body {
  transition: all 0.5s;
  border-radius: 8px;
  /* background-color: #e2e8f01c; */
+  
 }

 .active:hover {
@@ -153,11 +154,13 @@ body {
  width: 6px;
  height: 8px;
  cursor: pointer;
+
 }

 /* Scrollbar track */
 ::-webkit-scrollbar-track {
  background: transparent; /* No visible track */
+  border-radius: 50%;
 }

 /* Scrollbar thumb (the draggable part) */
Author	SHA1	Message	Date
parth.ramani	9b97228ec8	worked on the about	2025-02-25 13:58:13 +05:30
parth.ramani	2cb6173b81	worked on the aboutus component edit functionlity	2025-02-14 15:00:43 +05:30
parth.ramani	097d8bad99	worked on the module of the aboutus and services	2025-02-12 19:00:47 +05:30
parth.ramani	e24d48b917	worked on aboutus	2025-02-12 16:38:28 +05:30
Siddhesh.More	cd586ddf1b	update	2025-02-12 16:27:49 +05:30
Siddhesh.More	001d346426	update	2025-02-12 15:35:38 +05:30
Siddhesh.More	2ad88f91d4	update	2025-02-12 13:51:41 +05:30
Siddhesh.More	b56710d363	Merge branch 'yasin' of http://git.wdipl.com/Siddhesh.More/SSA-Admin-Panel	2025-02-12 13:51:37 +05:30
Siddhesh.More	22d07519ff	update	2025-02-12 13:30:02 +05:30
parth.ramani	1b27fa32ce	worked on the aboutus	2025-02-12 13:19:36 +05:30
Siddhesh.More	9579771f98	update	2025-02-12 13:18:18 +05:30
parth.ramani	6f25a6a234	worked privacypolicy	2025-02-12 12:47:44 +05:30