Worked on the termandcondition

dev-dist/sw.js

@@ -82,7 +82,7 @@ define(['./workbox-54d0af47'], (function (workbox) { 'use strict';
     "revision": "3ca0b8505b4bec776b69afdba2768812"
   }, {
     "url": "index.html",
-    "revision": "0.18bfta5vpmg"
+    "revision": "0.eppr8hujklg"
   }], {});
   workbox.cleanupOutdatedCaches();
   workbox.registerRoute(new workbox.NavigationRoute(workbox.createHandlerBoundToURL("index.html"), {

src/Pages/ManageCMS/PrivacyPolicy/PrivacyPolicy.tsx

@@ -10,12 +10,8 @@ import { useContext, useEffect } from "react";
 const PrivacyPolicy = () => {
   const { data, isLoading, isFetching } = useGetPrivacyPolicyQuery();
 
-<<<<<<< HEAD
- 
-=======
   const context = useContext(GlobalStateContext);
   if (!context) throw new Error('App must be used within a GlobalStateProvider');
->>>>>>> cd586ddf1bf133f5c551b8188262ad150a7b8a8e
   
   const { setIsBarLoading } = context;
   useEffect(() => {

src/Pages/ManageCMS/PrivacyPolicy/PrivacyPolicyAddModel.tsx

@@ -71,40 +71,10 @@ function PrivacyPolicyAddModel() {
           </Button>
         </DialogFooter>
 
-<<<<<<< HEAD
-                p={3} // Reduced padding
-                bgSize={'md'}
-            >
-                <DialogHeader bg="white"  >
-                    <DialogTitle alignSelf="center" color="black" fontSize="14px">Edit</DialogTitle>
-                </DialogHeader>
-
-                <DialogBody bg="white">
-                    <Stack py={3} >
-
-                        <Field.Root>
-                            <Field.Label color="black" pt={1} fontSize="12px">PrivacyPolicy</Field.Label>
-                            <Textarea placeholder=""  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 >
-
-    )
-=======
         <DialogCloseTrigger color="black" />
       </DialogContent>
     </DialogRoot>
   );
->>>>>>> cd586ddf1bf133f5c551b8188262ad150a7b8a8e
 }
 
 export default PrivacyPolicyAddModel;

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,66 +1,56 @@
-import { Box, HStack, Skeleton, Text } from "@chakra-ui/react";
+import { Badge, Box, HStack, Skeleton, Spinner, Text, VStack } from "@chakra-ui/react";
 import MainFrame from "../../../components/MainFrame"
 import TermsAndConditionsAddModel from "./TermsAndConditionsAddModel";
 import {useGetTermsAndConditionQuery} from "../../../Redux/Service/terms.and.condition.service"
+import { useContext, useEffect } from "react";
+import GlobalStateContext from "../../../Contexts/GlobalStateContext";
+
 
 const TermsAndConditions = () => {
   
   // Fetch data using RTK Query with type annotations
-    const { data, isLoading } = useGetTermsAndConditionQuery();
+    const { data, isLoading, isFetching } = useGetTermsAndConditionQuery();
 
-  
-    // Log the response for debugging
-    console.log("====================================");  
-    console.log(data);
-    console.log("====================================");
+    const context = useContext(GlobalStateContext);
+    if (!context) throw new Error('App must be used within a GlobalStateProvider');
     
-    // 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"}>
-           Terms And Conditions
-          </Text>
+    <MainFrame  transperant={true}>
+     
+     <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"}
 
-          <HStack >
-            
-            <TermsAndConditionsAddModel />
-          </HStack>
-        </HStack>
-        {/* 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>
+              py={0}
+              px={0}
+            >
+              <Text as={"span"} fontSize={"sm"} fontWeight={500} color={"#000"}>
+              Terms And Conditions<Badge variant={'surface'}  colorPalette="cyan" ms={2} size={'sm'} fontSize={'xs'} px={2}>🎓 {terms_cond_language?.language_name}</Badge>
+              </Text>
+
+              <TermsAndConditionsAddModel />
+            </HStack>
+            <Text
+              as="p"
+              fontSize="sm"
+              fontWeight={400}
+              color="#1D1D1D"
+            >
+              {content}
+            </Text>
+
+          </VStack>)}
+      </VStack>
     </MainFrame>
   )
 }

src/Types/termsAndConditionTypes.tsx

@@ -3,6 +3,11 @@ export interface TermsAndConditionsContent {
     language_master_xid: number;
     content: string;
     is_active: boolean;
+    terms_cond_language:{
+      id:number;
+      language_code:string;
+      language_name:string;
+    }
   }
   
   export interface TermsAndConditionsResponse {