updated

dev-dist/sw.js

@@ -82,11 +82,7 @@ define(['./workbox-54d0af47'], (function (workbox) { 'use strict';
     "revision": "3ca0b8505b4bec776b69afdba2768812"
   }, {
     "url": "index.html",
-<<<<<<< HEAD
+    "revision": "0.ahcfbbr0fl8"
-    "revision": "0.iv1sobg60j"
-=======
-    "revision": "0.3bv9k3911i8"
->>>>>>> 688f6740627f6cdb421849d1fb012420be1d9d10
   }], {});
   workbox.cleanupOutdatedCaches();
   workbox.registerRoute(new workbox.NavigationRoute(workbox.createHandlerBoundToURL("index.html"), {

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",

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"

src/Pages/Login.tsx

@@ -5,7 +5,6 @@ import {
   Image,
   Input,
   Text,
-  Theme,
   VStack,
 } from "@chakra-ui/react";
 import axios from "axios";

src/Pages/ManageCMS/TermsAndConditions/TermAndConditionSkeleton.tsx

@@ -0,0 +1,16 @@
+import { Box, Skeleton } from '@chakra-ui/react'
+import React from 'react'
+
+const TermAndConditionSkeleton = () => {
+  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 TermAndConditionSkeleton

src/Pages/ManageCMS/TermsAndConditions/TermsAndConditions.tsx

@@ -1,37 +1,57 @@
-import { Box, HStack, Text } from "@chakra-ui/react";
+import { Badge, HStack, Text, VStack } from "@chakra-ui/react";
 import MainFrame from "../../../components/MainFrame"
-import { p } from "framer-motion/client";
 import TermsAndConditionsAddModel from "./TermsAndConditionsAddModel";
+import {useGetTermsAndConditionQuery} from "../../../Redux/Service/terms.and.condition.service"
+import { useContext, useEffect } from "react";
+import GlobalStateContext from "../../../Contexts/GlobalStateContext";
+import { Spinner } from "../../../components/Sipnner/Spinner";
 
 
 const TermsAndConditions = () => {
+  
+  // Fetch data using RTK Query with type annotations
+    const { data, isLoading, isFetching } = useGetTermsAndConditionQuery();
+
+    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>
+    <MainFrame  transperant={true}>
-      <Box>
-        <HStack
-          w={"100%"}
-          justifyContent={"space-between"}
-          mb={4}
-          py={0}
-          px={3}
-        >
-          <Text as={"span"} fontSize={"sm"} fontWeight={500} color={"#000"}>
-           Terms And Conditions
-          </Text>
      
-          <HStack >
+     <VStack gap={4} pb={4} pt={0}>
+        {isLoading || isFetching ?
+          <Spinner /> : data?.data?.map(({ id, content, terms_cond_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"}
 
-            <TermsAndConditionsAddModel />
+              py={0}
-          </HStack>
+              px={0}
-        </HStack>
+            >
-        <Text as={p} fontSize={"sm"} fontWeight={400} color={"#1D1D1D"} px={3} w={"85%"} mb={"15px"} >
+              <Text as={"span"} fontSize={"sm"} fontWeight={500} color={"#000"}>
-          Lorem ipsum dolor sit amet, consectetur adipisicing elit. Numquam soluta doloremque quibusdam facilis quas, unde hic eaque doloribus sed perferendis atque, eos dolores eius consectetur iure sint adipisci itaque tempora fugit quidem culpa provident possimus. Ullam, vitae in voluptatum dignissimos, quos blanditiis sequi aut repellat error eaque veritatis unde quam temporibus adipisci consectetur neque vero exercitationem dolor cum numquam maiores alias, totam minima quas. Possimus, ratione harum. Alias laboriosam nesciunt esse fugit deserunt pariatur corporis tempora quia veniam laborum aliquid enim voluptatibus asperiores minima tempore repudiandae vero quo porro, doloribus explicabo sit beatae et hic natus. Non earum nisi reiciendis? 
+              Terms And Conditions<Badge variant={'surface'}  colorPalette="cyan" ms={2} size={'sm'} fontSize={'xs'} px={2}>🎓 {terms_cond_language?.language_name}</Badge>
-        </Text>
+              </Text>
-        <Text as={p}  fontSize={"sm"} fontWeight={400} color={"#1D1D1D"} px={3} w={"85%"} >
+
-          Lorem ipsum dolor sit amet, consectetur adipisicing elit. Numquam soluta doloremque quibusdam facilis quas, unde hic eaque doloribus sed perferendis atque, eos dolores eius consectetur iure sint adipisci itaque tempora fugit quidem culpa provident possimus. Ullam, vitae in voluptatum dignissimos, quos blanditiis sequi aut repellat error eaque veritatis unde quam temporibus adipisci consectetur neque vero exercitationem dolor cum numquam maiores alias, totam minima quas. Possimus, ratione harum. Alias laboriosam nesciunt esse fugit deserunt pariatur corporis tempora quia veniam laborum aliquid enim voluptatibus asperiores minima tempore repudiandae vero quo porro, doloribus explicabo sit beatae et hic natus. Non earum nisi reiciendis? 
+              <TermsAndConditionsAddModel />
-        </Text>
+            </HStack>
-     </Box>
+            <Text
+              as="p"
+              fontSize="sm"
+              fontWeight={400}
+              color="#1D1D1D"
+            >
+              {content}
+            </Text>
+
+          </VStack>)}
+      </VStack>
     </MainFrame>
   )
 }

src/Pages/ManageCMS/TermsAndConditions/TermsAndConditionsAddModel.tsx

@@ -1,3 +1,4 @@
+import React, { useState } from "react";
 import { FaRegEdit } from "react-icons/fa";
 import {
   DialogBody,
@@ -9,10 +10,38 @@ import {
   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
 
 function TermsAndConditionsAddModel() {
+  const [value, setValue] = useState(""); // State to manage the rich text content
+
+  // Configuration for the Quill editor toolbar
+  const modules = {
+    toolbar: [
+      [{ header: [1, 2, 3, 4, 5, 6, false] }],
+      ["bold", "italic", "underline", "strike"],
+      [{ list: "ordered" }, { list: "bullet" }],
+      ["link", "image"],
+      ["clean"],
+    ],
+  };
+
+  // Formats allowed in the Quill editor
+  const formats = [
+    "header",
+    "bold",
+    "italic",
+    "underline",
+    "strike",
+    "list",
+    "bullet",
+    "link",
+    "image",
+  ];
+
   return (
     <DialogRoot placement="center">
       <DialogTrigger asChild>
@@ -30,10 +59,9 @@ function TermsAndConditionsAddModel() {
 
       <DialogContent
         bg={"#fff"}
-        // w={{ lg: "60%", md: "230px" }}
+        w={{ base: "90%", md: "800px" }}
-        w={{ base: "90%", md: "400px" }}
         height={"auto"}
-        p={3} // Reduced padding
+        p={3}
         bgSize={"md"}
       >
         <DialogHeader bg="white">
@@ -48,16 +76,21 @@ function TermsAndConditionsAddModel() {
               <Field.Label color="black" pt={1} fontSize="12px">
                 TermsAndConditions
               </Field.Label>
-              <Textarea
+              {/* Replace Textarea with ReactQuill */}
-                placeholder=""
+              <ReactQuill
-                bgColor="#EEEEEE"
+                theme="snow" // Theme style
-                color="black"
+                value={value}
-                border="none"
+                onChange={setValue}
-                p={2}
+                modules={modules}
-                fontSize="12px"
+                formats={formats}
-                height={'140px'}
+                style={{
-                _focusVisible={{outline:'none'}}
+                  width:"100%",
-                resize={'none'}
+                  color: "black",
+                  border: "none",
+                  fontSize: "12px",
+                  height: "140px",
+                  
+                }}
               />
             </Field.Root>
           </Stack>

src/Redux/Service/terms.and.condition.service.ts

@@ -1,26 +1,16 @@
-import { createApi } from "@reduxjs/toolkit/query";
+import { createApi } from "@reduxjs/toolkit/query/react";
 import { baseQueryWithReauth } from "./apiSlice";
+import { TermsAndConditionsResponse } from "../../Types/termsAndConditionTypes";
 
-export const termsAndCondition = createApi({
+export const TermsAndCondition = createApi({
-    reducerPath: "api",
+    reducerPath: "TermsAndCondition",
     baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
     endpoints: (builder) => ({
-  
+      getTermsAndCondition: builder.query<TermsAndConditionsResponse, void>({
-  
+        query: () => "/term-and-condition",
-  
+      }),
-      getPosts: builder.query<Post[], void>({ query: () => "/posts" }),
-  
-  
-  
-  
-  
     }),
-  });
+});
 
-  export const {  } = termsAndCondition;
+// Correctly export the hook
-  
+export const { useGetTermsAndConditionQuery } = TermsAndCondition;
-  export type Post = {
-    id: number;
-    title: string;
-    body: string;
-  };

src/Redux/Store.tsx

@@ -14,6 +14,7 @@ import { privacyPolicy } from "./Service/privacy.policy.service";
 import { privacy } from "./Service/privacy.service";
 import { myProfile } from "./Service/myprofie.service";
 import { masterModule } from "./Service/master.module.service";
+import { TermsAndCondition } from "./Service/terms.and.condition.service";
 
 export const store = configureStore({
   reducer: {
@@ -21,6 +22,7 @@ export const store = configureStore({
     [registerUser.reducerPath]: registerUser.reducer,
     [deactivatedAccounts.reducerPath]: deactivatedAccounts.reducer,
     [faqs.reducerPath]: faqs.reducer,
+    [TermsAndCondition.reducerPath]: TermsAndCondition.reducer,
     [managePosts.reducerPath]: managePosts.reducer,
     [manageSubAdmin.reducerPath]: manageSubAdmin.reducer,
     [manageJobs.reducerPath]: manageJobs.reducer,
@@ -40,6 +42,7 @@ export const store = configureStore({
       managePosts.middleware,
       faqs.middleware,
       manageSubAdmin.middleware,
+      TermsAndCondition.middleware,
       manageJobs.middleware,
       manageGroups.middleware,
       manageContactUs.middleware,

src/Types/termsAndConditionTypes.tsx

@@ -0,0 +1,18 @@
+export interface TermsAndConditionsContent {
+    id: number;
+    language_master_xid: number;
+    content: string;
+    is_active: boolean;
+    terms_cond_language:{
+      id:number;
+      language_code:string;
+      language_name:string;
+    }
+  }
+  
+  export interface TermsAndConditionsResponse {
+    status: "success" | "error"; // Assuming it can be "success" or "error"
+    status_code: number;
+    message: string;
+    data: TermsAndConditionsContent[];
+  }

src/components/Sipnner/Spinner.tsx

@@ -1,6 +1,6 @@
 import { Center } from '@chakra-ui/react'
 import './Spinner.css'
-import MainFrame from '../MainFrame'
+// 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>