Merge branch 'R1' of http://git.wdipl.com/Siddhesh.More/SSA-Admin-Panel into R1

.env

@@ -1,5 +0,0 @@
-VITE_API_URL='https://ssa.betadelivery.com/apia/v1'
-# VITE_API_URL='http://192.16.50.44/seo-backend/apia/v1'
-VITE_USER_NAME="Admin"
-VITE_PASSWORD="71%@L%es^bUX94`J9XT*@bh,._WWM{$%^^&&"
-VITE_APP_NAME=MyViteApp

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.4goaulr6o2o"
   }], {});
   workbox.cleanupOutdatedCaches();
   workbox.registerRoute(new workbox.NavigationRoute(workbox.createHandlerBoundToURL("index.html"), {

package.json

@@ -13,25 +13,18 @@
     "@chakra-ui/react": "^3.2.3",
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.0",
-    "@reduxjs/toolkit": "^2.5.1",
-    "axios": "^1.7.9",
-    "chart.js": "^4.4.7",
     "framer-motion": "^11.18.0",
-    "js-cookie": "^3.0.5",
     "next-themes": "^0.4.4",
     "react": "^18.3.1",
-    "react-chartjs-2": "^5.3.0",
     "react-dom": "^18.3.1",
     "react-hook-form": "^7.54.2",
     "react-icons": "^5.4.0",
-    "react-redux": "^9.2.0",
     "react-router-dom": "^7.1.1",
     "vite-plugin-pwa": "^0.21.1"
   },
   "devDependencies": {
     "@chakra-ui/cli": "^3.2.3",
     "@eslint/js": "^9.17.0",
-    "@types/js-cookie": "^3.0.6",
     "@types/react": "^18.3.18",
     "@types/react-dom": "^18.3.5",
     "@vitejs/plugin-react": "^4.3.4",

src/App.tsx

@@ -1,50 +1,44 @@
-import { useContext, useEffect } from "react";
-import { BrowserRouter as Router, Routes, Route, Navigate } from "react-router-dom";
+import { useContext } from "react";
+import { Route, BrowserRouter as Router, Routes } from "react-router-dom";
 import GlobalStateContext from "./Contexts/GlobalStateContext";
 import DefaultLayout from "./Layouts/DefaultLayout";
 import Login from "./Pages/Login";
 import { RouteLink } from "./Routes/Routes";
+import LoginOtp from "./Pages/OnBoarding/LoginOtp";
+import CreatePass from "./Pages/OnBoarding/CreatePass";
 
-function App() {   
-  const context = useContext(GlobalStateContext); 
-  if (!context) throw new Error("App must be used within a GlobalStateProvider"); 
-  
-  const { isAuthenticate, setIsAuthenticate } = context; 
+function App() {
+  const context = useContext(GlobalStateContext);
+  if (!context)
+    throw new Error("App must be used within a GlobalStateProvider");
+  const { isAuthenticate } = context;
 
-  useEffect(() => {
-    const token = localStorage.getItem("token");
-    setIsAuthenticate(!!token); // Converts token to boolean
-  }, [setIsAuthenticate]);
-
-  console.log("Auth Status:", isAuthenticate);
-
-  return ( 
-    <Router> 
-      <Routes> 
-        {/* Redirect logged-in users away from login */}
-        <Route path="/login" element={isAuthenticate && localStorage.getItem("token") ? <Navigate to="/" /> : <Login />} /> 
-
-        {/* Protected Routes */}
-        <Route 
-          path="/*" 
-          element={isAuthenticate && localStorage.getItem("token")  ? (
-            <DefaultLayout>
-              <Routes>
-                {RouteLink.map(({ path, Component }, index) => (
-                  <Route key={index} path={path} element={<Component />} />
-                ))}
-              </Routes>
-            </DefaultLayout>
-          ) : (
-            <Navigate to="/login" />
-          )} 
-        /> 
-
-        {/* Catch-all route to prevent unauthorized access */}
-        <Route path="*" element={<Navigate to="/login" />} /> 
-      </Routes> 
-    </Router> 
-  ); 
-} 
+  return (
+    <Router>
+      <Routes>
+        <Route path="/login" element={<Login />} />
+        <Route path="/login/login-otp" element={<LoginOtp />} />
+        <Route path="/login/create-password" element={<CreatePass/>}/>
+        <Route
+          path="/*"
+          element={
+            isAuthenticate === true ? (
+              <DefaultLayout>
+                <Routes>
+                  {RouteLink.map(({ path, Component }, index) => (
+                    <Route key={index} path={path} element={<Component />} />
+                  ))}
+                </Routes>
+              </DefaultLayout>
+            ) : (
+              <Login />
+            )
+          }
+        />
+        <Route path="*" element={<Login />} />
+      </Routes>
+    </Router>
+  );
+}
 
 export default App;

src/Constants/Constants.tsx

@@ -0,0 +1,19 @@
+export const getTitle = (location: string): string => {
+    const titles: { [key: string]: string } = {
+      '/': 'Dashboard',
+      '/manage-user/register-user': 'Manage User',
+      '/manage-user/active-user': 'Manage User',
+      '/manage-post': 'Manage Post',
+      '/manage-sub-admin': 'Manage Sub Admin',
+      '/manage-jobs': 'Manage Jobs',
+      '/manage-contact-us': 'Manage Contact Us',
+      '/manage-cms/faq': 'Manage CMS',
+      '/manage-cms/about-us': 'Manage CMS',
+      '/manage-cms/privacy-policy': 'Manage CMS',
+      '/manage-cms/terms-and-condition': 'Manage CMS',
+      '/profile': 'My Profile',
+    };
+  
+    return titles[location] || 'Page Not Found';
+  };
+  

src/Contexts/GlobalStateContext.tsx

@@ -2,12 +2,11 @@
 import { createContext, Dispatch, SetStateAction } from 'react';
 
 // Define the shape of your context value
-export interface GlobalStateContextType {
+type 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);
 

src/Contexts/GlobalStateProvider.tsx

@@ -1,21 +1,14 @@
-import { ReactNode, useState } from "react";
-import GlobalStateContext from "./GlobalStateContext";
+import  { ReactNode, useState } from 'react';
+import GlobalStateContext from './GlobalStateContext';
 
 
 
-const GlobalStateProvider = ({ children }: { children: ReactNode }) => {
+
+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,
-      isBarLoading,
-      setIsBarLoading, // ✅ Fixed typo
-    }}>
+    <GlobalStateContext.Provider value={{ isAuthenticate, setIsAuthenticate }}>
       {children}
     </GlobalStateContext.Provider>
   );

src/Layouts/DefaultLayout.tsx

@@ -1,91 +1,206 @@
 import { HStack, Image, Text, VStack } from "@chakra-ui/react";
-import React, { FC, useContext } from "react";
+import React, { FC } from "react";
 import { RiNotificationLine } from "react-icons/ri";
 import { NavLink, useLocation, useNavigate } from "react-router-dom";
 import { nav } from "../Routes/Nav";
-import logo from '../assets/logo.svg';
-import { AccordionItem, AccordionItemContent, AccordionItemTrigger, AccordionRoot } from "../components/ui/accordion";
+import logo from "../assets/logo.svg";
+import {
+  AccordionItem,
+  AccordionItemContent,
+  AccordionItemTrigger,
+  AccordionRoot,
+} from "../components/ui/accordion";
 import { Avatar } from "../components/ui/avatar";
-import { LuLogOut } from "react-icons/lu";
-import { logout } from "../Redux/Service/authSlice";
-import { useDispatch } from "react-redux";
-import GlobalStateContext from "../Contexts/GlobalStateContext";
-import { useLogOutMutation } from "../Redux/Service/apiSlice";
-import ProgressBar from "../components/ProgressBar/ProgressBar";
+import { getTitle } from "../Constants/Constants";
 
 const DefaultLayout: FC<{ children: React.ReactNode }> = ({ children }) => {
-
-  const dispatch = useDispatch()
-  const navigate = useNavigate()
-  const location = useLocation()
-
-
-  const context = useContext(GlobalStateContext);
-  if (!context) {
-    throw new Error('App must be used within a GlobalStateProvider');
-  }
-  const { setIsAuthenticate, isBarLoading } = context;
-  const [ logOutAdmin ] = useLogOutMutation()
-
-
-  // Logout function
-  const handleLogout = async () => {
-    try {
-      // ✅ Call mutation and wait for the response
-      const res = await logOutAdmin().unwrap(); 
-      console.log("Logout Success:", res);
-  
-      // ✅ Clear local storage & update authentication state
-      dispatch(logout());
-      localStorage.removeItem("token"); 
-      setIsAuthenticate(false); 
-      // ✅ Redirect to login page
-      navigate("/login");
-    } catch (error) {
-      console.error("Logout Failed:", error);
-    }
-  };
+  const navigate = useNavigate();
+  const location = useLocation();
+  const headerTitle = getTitle(location?.pathname);
+  console.log(location);
 
   return (
-    <VStack gap={0} w="100%" h="100vh" bg="#F2F2F2">
-    <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'} >
-        <HStack w={'100%'} p={3} h={'7%'} justifyContent={'center'}>
+    <HStack
+      position={"relative"}
+      bg="#F2F2F2"
+      backgroundPosition="center"
+      backgroundRepeat="repeat"
+      backgroundSize="cover"
+      gap={0}
+      pt={2}
+      w="100%"
+      h="100vh"
+    >
+      <VStack zIndex={1} gap={0} rounded={"lg"} h="100%" w="15%">
+        <HStack w={"100%"} p={3} h={"6.5%"} justifyContent={"center"}>
           <Image w={55} src={logo} />
         </HStack>
-        <VStack  w={'100%'} p={2} pt={0}>
-          {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 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>)}
-              </AccordionItem>
-            </AccordionRoot>)}
-        </VStack>
-        <VStack w={'100%'} p={3} pt={0}>
-        <HStack onClick={handleLogout} className="link"  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'}} ><LuLogOut style={{ fontSize: '20px' }} /> <Text fontSize={'xs'} w={'100%'}>Logout</Text></HStack>
+        <VStack  w={"100%"} p={3}>
+          {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",
+                    backgroundColor: "#fff",
+                    width: 28,
+                    color: location?.pathname === path ? "#02A0A0" : "#000",
+                    padding: 2,
+                    borderRadius: "50%",
+                  }}
+                />{" "}
+                <Text fontSize={"xs"} w={"100%"}>
+                  {title}
+                </Text>
+              </NavLink>
+            ) : (
+              <AccordionRoot bg={"#fff"} rounded={"lg"} collapsible>
+                <AccordionItem
+                  boxShadow={"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"}
+                  rounded={"lg"}
+                  borderBottom={"none"}
+                  p={0}
+                  key={index}
+                  value={title}
+                >
+                  <AccordionItemTrigger
+                    className={`link  ${location?.pathname.startsWith(initPath ?? "") && "active"}`}
+                    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",
+                      fontWeight: "normal",
+                    }}
+                  >
+                    {" "}
+                    <Text
+                      fontSize={"xs"}
+                      gap={1}
+                      display={"flex"}
+                      alignItems={"center"}
+                    >
+                      <Icon
+                        style={{
+                          fontSize: "20px",
+                          backgroundColor: "#fff",
+                          width: 23,
+                          color: location?.pathname.startsWith(initPath ?? "")
+                            ? "#02A0A0"
+                            : "#000",
+                          padding: 2,
+                          borderRadius: "50%",
+                        }}
+                      />
+                      {title}
+                    </Text>
+                  </AccordionItemTrigger>
+                  {children?.map(({ title, path, Icon }, index) => (
+                    <AccordionItemContent
+                      className={`linkChild  ${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: "#000",
+                      }}
+                    >
+                      <Icon style={{ fontSize: "16px" }} />{" "}
+                      <Text fontSize={"xs"} w={"100%"}>
+                        {title}
+                      </Text>
+                    </AccordionItemContent>
+                  ))}
+                </AccordionItem>
+              </AccordionRoot>
+            )
+          )}
         </VStack>
       </VStack>
-      <VStack  gap={0} h="100%" w="85%" >
-     
-        <HStack h={'11%'} w={'100%'} justifyContent={'flex-end'} pe={3} gap={6}>
-        
-          <NavLink to={'/manage-notification'}><RiNotificationLine color="#013e3e" cursor={'pointer'} style={{ fontSize: '22px' }} /></NavLink>
-          <HStack cursor={'pointer'} onClick={() => navigate('/profile')} >
-            <Avatar size={'sm'} src="https://i.pinimg.com/736x/d6/cd/0f/d6cd0ffd4634b0763d3958a7325ce26e.jpg" />
-            <VStack color={'#013e3e'} gap={0} alignItems={'flex-start'}>
-              <Text fontSize={'sm'} fontWeight={'bold'}>Ritesh Pandey</Text>
-              <Text fontSize={'xs'} >ritesh.pandey@wdimails.com</Text>
-            </VStack>
+      <VStack overflowY="hidden" gap={0} h="100%" w="85%">
+        <HStack
+          h={"6.5%"}
+          w={"100%"}
+          justifyContent={"space-between"}
+          alignItems={"flex-end"}
+          pe={3}
+          gap={6}
+          p={4}
+        >
+          <Text
+            mb={1}
+            fontSize={"sm"}
+            ms={1}
+            fontWeight={600}
+            color={"#013e3e"}
+          >
+            {headerTitle}
+          </Text>
+          <HStack
+            // bg={"#fff"}
+            h={"100%"}
+            justifyContent={"center"}
+            p={2}
+            rounded={"md"}
+            // boxShadow={"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"}
+          >
+            <RiNotificationLine
+              color="#013e3e"
+              cursor={"pointer"}
+              style={{ fontSize: "22px" }}
+            />
+            <HStack cursor={"pointer"} onClick={() => navigate("/profile")}>
+              <Avatar
+                size={"sm"}
+                src="https://i.pinimg.com/736x/d6/cd/0f/d6cd0ffd4634b0763d3958a7325ce26e.jpg"
+              />
+              <VStack color={"#013e3e"} gap={0} alignItems={"flex-start"}>
+                <Text fontSize={"sm"} fontWeight={"bold"}>
+                  Ritesh Pandey
+                </Text>
+                <Text fontSize={"xs"}>ritesh.pandey@wdimails.com</Text>
+              </VStack>
+            </HStack>
           </HStack>
         </HStack>
         {children}
       </VStack>
     </HStack>
-    </VStack>
   );
 };
 

src/Pages/CMS/CMS.tsx

@@ -0,0 +1,6 @@
+const CMS = () => {
+  return (
+    <div>CMS</div>
+  )
+}
+export default CMS

src/Pages/Dashboard/Dashboard.tsx

@@ -1,190 +1,11 @@
-import {
-  Box,
-  createListCollection,
-  Heading,
-  HStack,
-  Status,
-  Tabs,
-  Text,
-} from "@chakra-ui/react";
-import BarChart from "../../components/Charts/BarChart";
-import CircularApp from "../../components/Charts/CircularProgress";
-import SemiDoughnutChart from "../../components/Charts/SemiDoughnutChart";
-import MainFrame from "../../components/MainFrame";
-import {
-  AccordionItem,
-  AccordionItemContent,
-  AccordionItemTrigger,
-  AccordionRoot,
-} from "../../components/ui/accordion";
-import { Button } from "../../components/ui/button";
-import {
-  SelectContent,
-  SelectItem,
-  SelectRoot,
-  SelectTrigger,
-  SelectValueText
-} from "../../components/ui/select";
-import AgencyName from "./AgencyName";
-import { Spinner } from "../../components/Sipnner/Spinner";
+import MainFrame from "../../components/MainFrame"
 
 const Dashboard = () => {
-  const frameworks = createListCollection({
-    items: [
-      { label: "Today", value: "Today" },
-      { label: "Week", value: "Week" },
-      { label: "Month", value: "Month" },
-      { label: "Year", value: "Year" },
-    ],
-  });
-
-  const accItems = [
-    {
-      value: "1",
-      title: "How to create new account?",
-      text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since. Lorem Ipsum has been the industry's standard dummy text ever since.",
-    },
-    {
-      value: "2",
-      title: "How to create new account?",
-      text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since. Lorem Ipsum has been the industry's standard dummy text ever since.",
-    },
-    {
-      value: "3",
-      title: "How to create new account?",
-      text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since. Lorem Ipsum has been the industry's standard dummy text ever since.",
-    },
-    {
-      value: "4",
-      title: "How to create new account?",
-      text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since. Lorem Ipsum has been the industry's standard dummy text ever since.",
-    },
-  ];
-
   return (
     <MainFrame>
-      <Box  display={"flex"} p={"20px"} pe={'20px'}  gap={5}>
-        <Box rounded={'lg'} w={"30%"} boxShadow={"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"}>
-          <Heading fontSize={"sm"} p={2}>
-            Total Users
-          </Heading>
-          <Tabs.Root
-            size={"sm"}
-            w={"80%"}
-            m={"auto"}
-            variant="enclosed"
-            fitted
-            defaultValue={"tab-1"}
-            mb={6}
-          >
-            <Tabs.List>
-              <Tabs.Trigger fontSize={"xs"} value="tab-1">
-                Past 24 hrs
-              </Tabs.Trigger>
-              <Tabs.Trigger fontSize={"xs"} value="tab-2">
-                Total Users
-              </Tabs.Trigger>
-              <Tabs.Trigger fontSize={"xs"} value="tab-3">
-                New Signups
-              </Tabs.Trigger>
-            </Tabs.List>
-          </Tabs.Root>
-          <Box>
-            <SemiDoughnutChart />
-          </Box>
-
-          <Box
-            w={"80%"}
-            m={"auto"}
-            display={"flex"}
-            justifyContent={"space-between"}
-            mt={8}
-          >
-            <Status.Root colorPalette="blue">
-              <Status.Indicator />
-              Recruiter <Text fontWeight={500}>2554</Text>
-            </Status.Root>
-            <Status.Root colorPalette="blue">
-              <Status.Indicator />
-              Customer <Text fontWeight={500}>1224</Text>
-            </Status.Root>
-          </Box>
-        </Box>
-        <Box
-          p={"20px"}
-          w={"49%"}
-          rounded={'lg'}
-          boxShadow={"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"}
-        >
-          <HStack alignItems={"center"} mb={4}>
-            <Text fontSize={"sm"}>Item approvals in</Text>
-            <SelectRoot collection={frameworks} size="xs" width="200px">
-              <SelectTrigger>
-                <SelectValueText p={2} placeholder="Select movie" />
-              </SelectTrigger>
-              <SelectContent p={2}>
-                {frameworks.items.map((movie) => (
-                  <SelectItem item={movie} key={movie.value}>
-                    {movie.label}
-                  </SelectItem>
-                ))}
-              </SelectContent>
-            </SelectRoot>
-          </HStack>
-          <BarChart />
-        </Box>
-        <Box
-          w={"20%"}
-          boxShadow={"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"}
-          p={'10px'}
-          rounded={'lg'}
-        >
-          <Text fontSize={"sm"} fontWeight={500} pt={3}>Number Of Groups created</Text>
-          <CircularApp />
-        </Box>
-      </Box>
-      <Box  p={"20px"} pt={0} display={"flex"} gap={5}>
-        <Box  w={"50%"} rounded={'lg'} bg={"#f2f2f2"} h={'100%'} p={"10px"} overflow={'auto'}>
-          <HStack justifyContent={"space-between"} mb={5}>
-            <Text fontSize={"xs"} fontWeight={500}>Faqs</Text>
-            <Button
-              bg={"#fff"}
-              color={"#222222CC"}
-              px={3}
-              fontSize={"12px"}
-              h={"28px"}
-            >
-              View ALL
-            </Button>
-          </HStack>
-          <AccordionRoot collapsible defaultValue={["b"]}>
-            {accItems.map((item, index) => (
-              <AccordionItem
-              boxShadow={'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'} 
-                key={index}
-                value={item.value}
-                bg={"#fff"}
-                mb={2}
-                p={"12px"}
-                rounded={5}
-                borderBottom={0}
-              >
-                <AccordionItemTrigger fontSize={"sm"} >
-                  {item.title}
-                </AccordionItemTrigger>
-                <AccordionItemContent fontSize={"xs"} color={'#222222CC'} pt={2}>
-                  {item.text}
-                </AccordionItemContent>
-              </AccordionItem>
-            ))}
-          </AccordionRoot>
-        </Box>
-        <Box w={"50%"} rounded={'lg'} bg={"#f2f2f2"} h={'100%'} overflow={'auto'}>
-          <AgencyName />
-        </Box>
-      </Box>
+      
     </MainFrame>
-  );
-};
+  )
+}
 
-export default Dashboard;
+export default Dashboard

src/Pages/ForgetPassword.tsx

@@ -1,65 +0,0 @@
-import { Field, Input, Stack, Text } from "@chakra-ui/react";
-import { Button } from "../components/ui/button";
-import {
-  DialogBody,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "../components/ui/dialog";
-function ForgetPassword() {
-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-        <Text w={"100%"} textAlign={"end"} mt={2} cursor={"pointer"}>
-          Forgot password?
-        </Text>
-      </DialogTrigger>
-
-      <DialogContent
-        bg={"#fff"}
-        w={{ base: "90%", md: "400px" }}
-        p={2}
-        bgSize={"md"}
-      >
-        <DialogHeader bg="white" pt={3} pb={2}>
-          <DialogTitle
-            alignSelf="center"
-            color="black"
-            fontSize="18px"
-            textAlign={"center"}
-          >
-            Forgot Password
-          </DialogTitle>
-        </DialogHeader>
-
-        <DialogBody bg="white" pt={5}>
-          <Stack p={2}>
-            <Field.Root>
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Please Enter Email Address
-              </Field.Label>
-              <Input
-                color="black"
-                p={2}
-                fontSize="sm"
-                type="text"
-                border="1px solid grey"
-                size={"sm"}
-              />
-            </Field.Root>
-          </Stack>
-        </DialogBody>
-        <DialogFooter display="flex" justifyContent="center" mt={2} p={2}>
-          <Button w="100%" bg="#02A0A0" color={"#fff"}>
-            Reset Password
-          </Button>
-        </DialogFooter>
-      </DialogContent>
-    </DialogRoot>
-  );
-}
-
-export default ForgetPassword;

src/Pages/Login.tsx

@@ -1,35 +1,18 @@
-import {
-  Box,
-  Center,
-  HStack,
-  Image,
-  Input,
-  Text,
-  Theme,
-  VStack,
-} from "@chakra-ui/react";
-import axios from "axios";
+import { Center, HStack, Image, Input, Text, VStack } from "@chakra-ui/react";
 import { useContext, useState } from "react";
 import { useForm } from "react-hook-form";
-import { useDispatch } from "react-redux";
 import GlobalStateContext from "../Contexts/GlobalStateContext";
-import { setToken } from "../Redux/Service/authSlice";
 import logo from "../assets/logo.svg";
 import { Button } from "../components/ui/button";
 import { Field } from "../components/ui/field";
-import { toaster, Toaster } from "../components/ui/toaster";
-import { PasswordInput } from "../components/ui/password-input";
-import { useNavigate } from "react-router-dom";
-import ForgetPassword from "./ForgetPassword";
+import { Toaster, toaster } from "../components/ui/toaster";
+import { LuUser } from "react-icons/lu";
 
 interface FormValues {
   mobileNumber: number;
-  password: string;
 }
 
 const Login = () => {
-  const navigate = useNavigate();
-  const dispatch = useDispatch();
   const [isLoading, setIsLoading] = useState<boolean>(false);
   const context = useContext(GlobalStateContext);
   if (!context) {
@@ -42,60 +25,24 @@ const Login = () => {
     formState: { errors },
   } = useForm<FormValues>();
 
-  const onSubmit = handleSubmit(async (data) => {
+  const onSubmit = handleSubmit((data) => {
     setIsLoading(true);
-    // Encode Basic Auth Credentials
-    const username = import.meta.env.VITE_USER_NAME || ""; // Replace with actual username
-    const password = import.meta.env.VITE_PASSWORD || ""; // Replace with actual password
-    const basicAuth = `${username} : ${password}`; // Encode to Base64
-
-    try {
-      const res = await axios.post(
-        `${import.meta.env.VITE_API_URL}/login`,
-        {
-          mobile_number: Number(data.mobileNumber),
-          password: data.password,
-        },
-        {
-          headers: {
-            Authorization: `Basic ${basicAuth}`,
-            "Content-Type": "application/json",
-          },
-        }
-      );
-      console.log("============",res);
-      
-
-      if (res.data) {
+    if (data?.mobileNumber === 1234567890) {
+      setTimeout(() => {
         setIsAuthenticate(true);
-        console.log("====================================");
-        console.log(res.data?.data);
-        console.log("====================================");
-        navigate("/dashboard");
-        dispatch(setToken(String(res.data?.data["access-token"])));
-      } else {
-        console.log("====================================");
-        console.log(res);
-        console.log("====================================");
-      }
-    } catch (error) {
-      console.log('error', error);
-      
-      if (error) {
-        toaster.create({
-          // title: error?.response?.data?.message,
-          title: "Something Went Wrong",
-          type: "info",
-        })
-        // console.log("Login failed", error?.response?.data?.message);
         setIsLoading(false);
-      }
+      }, 3000); // 3-second delay
+    } else {
+      toaster.create({
+        title: `Invalid Credentials`,
+        type: "error",
+      });
+      setIsLoading(false);
     }
   });
 
   return (
-
-    <VStack appearance={'light'} w={"100%"} h={"100vh"} bg={"#ffffff"}>
+    <VStack w={"100%"} h={"100vh"} bg={"#ffffff"}>
       <HStack
         boxShadow={"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"}
         w={"100%"}
@@ -117,14 +64,14 @@ const Login = () => {
           <Image w={250} src={logo} />
         </Center>
 
-        <Box
+        <Center
           as={"form"}
           onSubmit={onSubmit}
           p={{ base: 4, md: 16 }}
           w={{ base: "100%", md: "50%" }}
           h={"100%"}
         >
-          <VStack gap={2} w={"100%"}>
+          <VStack gap={2} w={"100%"} alignItems={"flex-start"}>
             <Text
               w={"100%"}
               textAlign={"center"}
@@ -135,39 +82,24 @@ const Login = () => {
               LOGIN
             </Text>
 
-            <Box mt={6} gap={4} w={"full"}>
+            <VStack mt={6} gap={4} w={"full"}>
               <Field
                 color={"#313039"}
                 label={"Enter Mobile Number"}
                 w={"100%"}
                 invalid={!!errors.mobileNumber}
                 errorText={errors.mobileNumber?.message}
-                mb={4}
               >
                 <Input
-                  type="number"
                   ps={3}
                   {...register("mobileNumber", {
                     required: "Mobile Number address is required",
                   })}
                   placeholder="Mobile Number Address"
                 />
-                {/* <Text as={'span'} w={'100%'} fontSize={'xs'} fontWeight={'normal'} color={'#686677'}>Forget password</Text>  */}
-              </Field>
-              <Field
-                color={"#313039"}
-                label={"Enter password."}
-                w={"100%"}
-                invalid={!!errors.password}
-                errorText={errors.password?.message}
-                mb={2}
-              >
-                <PasswordInput
-                  ps={3}
-                  {...register("password", { required: "Pasword is required" })}
-                  placeholder="Enter password"
-                />
-                {/* <Text as={'span'} w={'100%'} fontSize={'xs'} fontWeight={'normal'} color={'#686677'}>Forget password</Text>  */}
+
+
+                <Text cursor="pointer" as={'span'} w={'100%'} fontSize={'xs'} fontWeight={'normal'} color={'#686677'}>Forget password</Text>
               </Field>
               <Button
                 loading={isLoading}
@@ -179,13 +111,13 @@ const Login = () => {
                 color={"#ffffff"}
                 type="submit"
               >
-                Login
+                Send OTP
               </Button>
 
-              <ForgetPassword />
-            </Box>
+              <Text>Forgot password</Text>
+            </VStack>
           </VStack>
-        </Box>
+        </Center>
         <Toaster />
       </HStack>
     </VStack>

src/Pages/ManageCMS/AboutUs/AboutUs.tsx

@@ -1,68 +1,11 @@
-import { Box, HStack, Skeleton, Text } from "@chakra-ui/react";
-import MainFrame from "../../../components/MainFrame"
-import AboutUsAddModel from "../../ManageCMS/AboutUs/AboutUsAddModel";
-import { useGetAboutUsQuery } from "../../../Redux/Service/manage.aboutus.service";
-
-
+import MainFrame from '../../../components/MainFrame'
 
 const AboutUs = () => {
-
-  const { data, isLoading } = useGetAboutUsQuery();
-
-  const content = data?.data?.[0]?.content
-  console.log('====================================');
-  // console.log(response);
-  console.log('====================================');
-
-
   return (
-
     <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>
-        ) : (
-          <Text
-            as="p"
-            fontSize="sm"
-            fontWeight={400}
-            color="#1D1D1D"
-            px={3}
-            w="85%"
-            mb="15px"
-          >
-            {content}
-          </Text>
-        )}
-      </Box>
+        
     </MainFrame>
   )
 }
+
 export default AboutUs

src/Pages/ManageCMS/AboutUs/AboutUsAddModel.tsx

@@ -1,119 +1,53 @@
-import React, { useState } from "react";
-import { FaRegEdit } from "react-icons/fa";
-import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "../../../components/ui/dialog";
-import { Field, Stack, Text, Textarea } from "@chakra-ui/react";
-import { Button } from "../../../components/ui/button";
-import { useUpdateAboutUsMutation } from "../../../Redux/Service/manage.aboutus.service";
+import { FaRegEdit } from "react-icons/fa"
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
+import { Field, Stack, Text, Textarea } from "@chakra-ui/react"
+import { Button } from "../../../components/ui/button"
 
 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
+    return (
 
-  // Handle form submission
-  const handleSubmit = async (e: any) => {
-    e.preventDefault(); // Prevent default form submission
+        <DialogRoot placement="center">
+            <DialogTrigger asChild>
+                {/* <Button bg={"transparent"} size="sm">
+                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} />
+                </Button> */}
+                <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>
 
-    try {
-      // Call the updateAboutUs mutation
-      const res = await updateAboutUs({ id: 2, updatedData: content }).unwrap();
-      console.log(res);
+            </DialogTrigger>
 
-      // Show success toast
-      //   toast({
-      //     title: "Success",
-      //     description: "About Us content updated successfully",
-      //     status: "success",
-      //     duration: 5000,
-      //     isClosable: true,
-      //   });
+            <DialogContent
+                bg={"#fff"}
+                // w={{ lg: "60%", md: "230px" }}
+                w={{ base: '90%', md: '400px' }}
+                height={"auto"}
 
-      // 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,
-      //   });
-    }
-  };
+                p={3} // Reduced padding
+                bgSize={'md'}
+            >
+                <DialogHeader bg="white" >
+                    <DialogTitle alignSelf="center" color="black" fontSize="14px">Edit</DialogTitle>
+                </DialogHeader>
 
-  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>
+                <DialogBody bg="white">
+                    <Stack py={3} >
 
-      <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>
+                        <Field.Root>
+                            <Field.Label color="black" pt={1} fontSize="12px">AboutUs</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>
 
-        <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>
+                <DialogCloseTrigger color="black" />
+            </DialogContent>
+        </DialogRoot >
 
-        <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>
-
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+    )
 }
 
-export default AboutUsAddModel;
+export default AboutUsAddModel

src/Pages/ManageCMS/FAQ/EditDetails.tsx

@@ -1,79 +1,56 @@
-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";
+import { Button } from "../../../components/ui/button"
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
+import { Field, Grid, Input, Stack, Text, Textarea } from "@chakra-ui/react"
+import { FaRegEdit } from "react-icons/fa";
 function EditDetails() {
-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-        <Edit />
-      </DialogTrigger>
+    return (
 
-      <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>
+        <DialogRoot placement="center">
+            <DialogTrigger asChild>
+                <Button bg={"transparent"} size="sm">
+                    <FaRegEdit style={{ cursor: "pointer", }} color="#000" />
+                </Button>
+                {/* <Button><FaRegEdit /></Button> */}
 
-        <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"
-              />
+            </DialogTrigger>
 
-              <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>
+            <DialogContent
+                bg={"#fff"}
+                // w={{ lg: "60%", md: "230px" }}
+                w={{ base: '90%', md: '400px' }}
+                height={"auto"}
 
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+                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;
+export default EditDetails

src/Pages/ManageCMS/FAQ/FAQ.tsx

@@ -1,4 +1,4 @@
-import { Box, HStack, Image, Input, Text } from "@chakra-ui/react";
+import { Box, Button, HStack, Image, Input, Text } from "@chakra-ui/react";
 import MainFrame from "../../../components/MainFrame"
 import EditDetails from "./EditDetails";
 import { InputGroup } from "../../../components/ui/input-group";
@@ -8,7 +8,6 @@ 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";
 
 
 // table data
@@ -32,7 +31,7 @@ const managepost: any[] = [
         </Box>
         <EditDetails />
         <AlertDailog
-          AltertTiggerIcon={() => <Delete />} 
+          AltertTiggerIcon={RiDeleteBin5Line}
           alertText="Delete Users"
           alertIcon={<Image src={"DeleteIcon"} h={"39px"} />}
           alertCaption="are you sure you want to delete ?"
@@ -75,7 +74,7 @@ const FAQ = () => {
                 colorPalette={"blue"}
                 _focus={{ border: "1px solid #02A0A0" }}
                 rounded={"md"}
-                size={"xs"}
+                size={"2xs"}
                 fontSize={"2sm"}
                 placeholder="Search..."
                 bgColor={'#EEEEEE'}

src/Pages/ManageCMS/FAQ/FaqAddModel.tsx

@@ -1,84 +1,57 @@
-import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "../../../components/ui/dialog";
-import { Field, Input, Stack, Text, Textarea } from "@chakra-ui/react";
-import { IoMdAdd } from "react-icons/io";
-import { Button } from "../../../components/ui/button";
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
+import { Field, Input, Stack, Text, Textarea } from "@chakra-ui/react"
+import { IoMdAdd } from "react-icons/io"
+import { Button } from "../../../components/ui/button"
 
 function FaqAddModel() {
-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-        <Button px={5} size={"xs"} bg={"#02A0A0"}>
-          <IoMdAdd /> <Text>Add</Text>
-        </Button>
-      </DialogTrigger>
+    return (
 
-      <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">
-            Add
-          </DialogTitle>
-        </DialogHeader>
+        <DialogRoot placement="center">
+            <DialogTrigger asChild>
+                {/* <Button bg={"transparent"} size="sm">
+                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} />
+                </Button> */}
+                <Button px={5} size={"xs"} bg={"#02A0A0"}><IoMdAdd /> <Text>Add</Text></Button>
 
-        <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"
-                _focusVisible={{outline:'none'}}
-                size={'sm'}
-              />
+            </DialogTrigger>
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Answer
-              </Field.Label>
-              <Textarea
-                placeholder="Answer"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                p={2}
-                fontSize="12px"
-                height="120px"
-                resize={'none'}
-                _focusVisible={{outline:'none'}}
-              />
-            </Field.Root>
-          </Stack>
-        </DialogBody>
-        <DialogFooter display="flex" justifyContent="center" pt={"2"}>
-          <Button w="100%" bg="#02A0A0" color={"#fff"}>
-            Save
-          </Button>
-        </DialogFooter>
+            <DialogContent
+                bg={"#fff"}
+                // w={{ lg: "60%", md: "230px" }}
+                w={{ base: '90%', md: '400px' }}
+                height={"auto"}
 
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+                p={3} // Reduced padding
+                bgSize={'md'}
+            >
+                <DialogHeader bg="white" >
+                    <DialogTitle alignSelf="center" color="black" fontSize="14px">Add</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 FaqAddModel;
+export default FaqAddModel

src/Pages/ManageCMS/FAQ/FreqAskQuestion.tsx

@@ -0,0 +1,12 @@
+import { Text } from '@chakra-ui/react'
+import MainFrame from '../../../components/MainFrame'
+
+const FreqAskQuestion = () => {
+  return (
+    <MainFrame>
+        <Text>hello</Text>
+    </MainFrame>
+  )
+}
+
+export default FreqAskQuestion

src/Pages/ManageCMS/PrivacyPolicy/PrivacyPolicy.tsx

@@ -1,55 +1,11 @@
-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";
-
+import MainFrame from '../../../components/MainFrame'
 
 const PrivacyPolicy = () => {
-  const { data, isLoading, isFetching } = useGetPrivacyPolicyQuery();
-
-  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, 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"}
-
-              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>
-
-              <PrivacyPolicyAddModel />
-            </HStack>
-            <Text
-              as="p"
-              fontSize="sm"
-              fontWeight={400}
-              color="#1D1D1D"
-            >
-              {content}
-            </Text>
-
-          </VStack>)}
-      </VStack>
+    <MainFrame>
+        
     </MainFrame>
-  );
-};
+  )
+}
 
-export default PrivacyPolicy;
+export default PrivacyPolicy

src/Pages/ManageCMS/PrivacyPolicy/PrivacyPolicyAddModel.tsx

@@ -1,80 +1,53 @@
-import { FaRegEdit } from "react-icons/fa";
-import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "../../../components/ui/dialog";
-import { Field, Stack, Text, Textarea } from "@chakra-ui/react";
-import { Button } from "../../../components/ui/button";
+import { FaRegEdit } from "react-icons/fa"
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
+import { Field, Input, Stack, Text, Textarea } from "@chakra-ui/react"
+import { Button } from "../../../components/ui/button"
 
 function PrivacyPolicyAddModel() {
-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-        {/* <Button bg={"transparent"} size="sm">
+    return (
+
+        <DialogRoot placement="center">
+            <DialogTrigger asChild>
+                {/* <Button bg={"transparent"} size="sm">
                     <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} />
                 </Button> */}
-        <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>
+                <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>
 
-      <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
-          </DialogTitle>
-        </DialogHeader>
+            </DialogTrigger>
 
-        <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"
-                p={2}
-                fontSize="12px"
-                height={'140px'}
-                _focusVisible={{outline:'none'}}
-                resize={'none'}
-              />
-            </Field.Root>
-          </Stack>
-        </DialogBody>
-        <DialogFooter display="flex" justifyContent="center" pt={"2"}>
-          <Button w="100%" bg="#02A0A0" color={"#fff"}>
-            Save
-          </Button>
-        </DialogFooter>
+            <DialogContent
+                bg={"#fff"}
+                // w={{ lg: "60%", md: "230px" }}
+                w={{ base: '90%', md: '400px' }}
+                height={"auto"}
 
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+                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 >
+
+    )
 }
 
-export default PrivacyPolicyAddModel;
+export default PrivacyPolicyAddModel

src/Pages/ManageCMS/PrivacyPolicy/PrivacyPolicySkeleton.tsx

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

src/Pages/ManageCMS/TermsAndCondition/TermsAndCondition.tsx

@@ -0,0 +1,11 @@
+import MainFrame from '../../../components/MainFrame'
+
+const TermsAndCondition = () => {
+  return (
+    <MainFrame>
+        
+    </MainFrame>
+  )
+}
+
+export default TermsAndCondition

src/Pages/ManageCMS/TermsAndConditions/TermsAndConditions.tsx

@@ -20,7 +20,7 @@ const TermsAndConditions = () => {
            Terms And Conditions
           </Text>
 
-          <HStack >
+          <HStack mr={5}>
             
             <TermsAndConditionsAddModel />
           </HStack>

src/Pages/ManageCMS/TermsAndConditions/TermsAndConditionsAddModel.tsx

@@ -1,77 +1,53 @@
-import { FaRegEdit } from "react-icons/fa";
-import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "../../../components/ui/dialog";
-import { Field, Stack, Text, Textarea } from "@chakra-ui/react";
-import { Button } from "../../../components/ui/button";
+import { FaRegEdit } from "react-icons/fa"
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
+import { Field, Stack, Text, Textarea } from "@chakra-ui/react"
+import { Button } from "../../../components/ui/button"
 
 function TermsAndConditionsAddModel() {
-  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>
+    return (
 
-      <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
-          </DialogTitle>
-        </DialogHeader>
+        <DialogRoot placement="center">
+            <DialogTrigger asChild>
+                {/* <Button bg={"transparent"} size="sm">
+                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} />
+                </Button> */}
+                <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>
 
-        <DialogBody bg="white">
-          <Stack py={3}>
-            <Field.Root>
-              <Field.Label color="black" pt={1} fontSize="12px">
-                TermsAndConditions
-              </Field.Label>
-              <Textarea
-                placeholder=""
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                p={2}
-                fontSize="12px"
-                height={'140px'}
-                _focusVisible={{outline:'none'}}
-                resize={'none'}
-              />
-            </Field.Root>
-          </Stack>
-        </DialogBody>
-        <DialogFooter display="flex" justifyContent="center" pt={"2"}>
-          <Button w="100%" bg="#02A0A0" color={"#fff"}>
-            Save
-          </Button>
-        </DialogFooter>
+            </DialogTrigger>
 
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+            <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</DialogTitle>
+                </DialogHeader>
+
+                <DialogBody bg="white">
+                    <Stack py={3}>
+
+                        <Field.Root>
+                            <Field.Label color="black" pt={1} fontSize="12px">TermsAndConditions</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 >
+
+    )
 }
 
-export default TermsAndConditionsAddModel;
+export default TermsAndConditionsAddModel

src/Pages/ManageContact/ManageContact.tsx

@@ -1,4 +1,4 @@
-import { Box, HStack, Input, Text } from "@chakra-ui/react";
+import { Box, HStack, Image, Input, Text } from "@chakra-ui/react";
 import MainFrame from "../../components/MainFrame"
 import PendingRequests from "../../Pages/ManageContact/PendingRequests"
 import { InputGroup } from "../../components/ui/input-group";
@@ -25,6 +25,7 @@ const managepost: any[] = [
     "Action": (
       <HStack justifyContent="center">
         <PendingRequests />
+       
       </HStack>
     ),
   })),
@@ -46,8 +47,8 @@ const ManageContact = () => {
           Contact Requests
           </Text>
 
-          <HStack >
-            <InputGroup 
+          <HStack mr={5}>
+            <InputGroup marginRight={"1rem"}
               startElement={
                 <LuSearch fontSize={"xs"} style={{ position: 'relative', left: '10px' }} />
               }
@@ -60,8 +61,8 @@ const ManageContact = () => {
                 colorPalette={"blue"}
                 _focus={{ border: "1px solid #02A0A0" }}
                 rounded={"md"}
-                size={"xs"}
-                fontSize={"sm"}
+                size={"2xs"}
+                fontSize={"2sm"}
                 placeholder="Search..."
                 bgColor={'#EEEEEE'}
                 ps={8}

src/Pages/ManageContact/PendingRequests.tsx

@@ -1,105 +1,77 @@
-import { Button } from "../../components/ui/button";
-import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "../../components/ui/dialog";
-import { Badge, Field, HStack, Input, Stack, Textarea } from "@chakra-ui/react";
+import { Button } from "../../components/ui/button"
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
+import { Field, HStack, Input, Stack, Textarea, } from "@chakra-ui/react"
 function PendingRequests() {
-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-        <Badge fontSize={"xs"} px={2} bg={'#02a0a01f'}>
-          Answer request
-        </Badge>
-      </DialogTrigger>
+    return (
 
-      <DialogContent
-        bg={"#fff"}
-        w={{ base: "90%", md: "400px" }}
-        height={"auto"}
-        p={3} // Reduced padding
-        bgSize={"md"}
-      >
-        <DialogHeader bg="white">
-          <DialogTitle alignSelf="center" color="black" fontSize="14px">
-            Pending Requests
-          </DialogTitle>
-        </DialogHeader>
+        <DialogRoot placement="center">
+            <DialogTrigger asChild>
+                <Button bg={"transparent"} fontSize={"xs"} color="#000000CC" fontWeight="700" textDecoration="underline">
+                    {/* <MdOutlineRemoveRedEye style={{ cursor: "pointer", }} /> */}
+                    Answer request
+                </Button>
+                {/* <Button><FaRegEdit /></Button> */}
 
-        <DialogBody bg="white">
-          <Stack py={3}>
-            <Field.Root>
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Request Type
-              </Field.Label>
-              <Input
-                placeholder="Message"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
+            </DialogTrigger>
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Solution
-              </Field.Label>
-              <Textarea
-                placeholder=""
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="80px"
-                pt={1.5}
-              />
-            </Field.Root>
-          </Stack>
-        </DialogBody>
-        <DialogFooter
-          display={{ base: "block", md: "flex" }}
-          justifyContent="center"
-          gap={1}
-          pt={2}
-        >
-          <HStack mt={2} mb={3} width={"100%"} justifyContent={"space-between"}>
-            <Button
-              width={"48%"}
-              color="black"
-              _hover={{ bgColor: "white" }}
-              variant="outline"
-              borderRadius="sm"
-              border="1px solid #02A0A0"
-              size={"xs"}
+            <DialogContent
+                bg={"#fff"}
+                w={{ base: '90%', md: '400px' }}
+                height={"auto"}
+                p={3} // Reduced padding
+                bgSize={'md'}
             >
-              Unresolved
-            </Button>
-            <Button
-              width={"48%"}
-              borderRadius="sm"
-              // bgColor="#007F33"
-              bgColor={"#02A0A0"}
-              color="white"
-              // colorPalette="#007F33"
-              size={"xs"}
-            >
-              Resolved
-            </Button>
-          </HStack>
-        </DialogFooter>
+                <DialogHeader bg="white">
+                    <DialogTitle alignSelf="center" color="black" fontSize="14px">Pending Requests</DialogTitle>
+                </DialogHeader>
 
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+                <DialogBody bg="white">
+                    <Stack py={3}>
+                        <Field.Root>
+                            <Field.Label color="black" pt={1} fontSize="12px">Request Type</Field.Label>
+                            <Input placeholder="Message" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+
+                            <Field.Label color="black" pt={1} fontSize="12px">Solution</Field.Label>
+                            <Textarea placeholder="" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="80px" pt={1.5} />
+                        </Field.Root>
+
+                    </Stack>
+                </DialogBody>
+                <DialogFooter display={{ base: 'block', md: 'flex' }} justifyContent="center" gap={1} pt={2}>
+
+                    <HStack mt={2} width={"100%"}
+                        justifyContent={"space-between"}>
+                        <Button
+                            width={"48%"}
+                            color="black"
+                            _hover={{ bgColor: "white" }}
+                            variant="outline"
+                            borderRadius="sm"
+                            border="1px solid black"
+                            size={"xs"}
+                        >
+                            Unresolved
+                        </Button>
+                        <Button
+                            width={"48%"}
+                            borderRadius="sm"
+                            // bgColor="#007F33"
+                            bgColor={'#02A0A0'}
+                            color="white"
+                            // colorPalette="#007F33"
+                            size={"xs"}
+                        >
+                            Resolved{" "}
+                        </Button>
+                    </HStack>
+
+                </DialogFooter>
+
+                <DialogCloseTrigger color="black" />
+            </DialogContent>
+        </DialogRoot >
+
+    )
 }
 
-export default PendingRequests;
+export default PendingRequests

src/Pages/ManageContactUs/ManageContactUs.tsx

@@ -0,0 +1,11 @@
+import MainFrame from '../../components/MainFrame'
+
+const ManageContactUs = () => {
+  return (
+    <MainFrame>
+        
+    </MainFrame>
+  )
+}
+
+export default ManageContactUs

src/Pages/ManageGroups/EditDetailGroup.tsx

@@ -1,119 +1,85 @@
-import { Button } from "../../components/ui/button";
-import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "../../components/ui/dialog";
-import { Avatar, Box, Field, Heading, Input, Stack } from "@chakra-ui/react";
+import { Button } from "../../components/ui/button"
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
+import { Avatar, Box, Field, Heading, Input, Stack, Text } from "@chakra-ui/react"
 import { Switch } from "../../components/ui/switch";
+import { FaRegEdit } from "react-icons/fa";
 import { AvatarGroup } from "../../components/ui/avatar";
-import Edit from "../../components/ActionIcons/Edit";
 function EditDetailGroups() {
-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-        <Edit />
-      </DialogTrigger>
+    return (
 
-      <DialogContent
-        bg={"#fff"}
-        w={{ base: "90%", md: "400px" }}
-        height={"auto"}
-        p={3} // Reduced padding
-      >
-        <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">
-                Group Name
-              </Field.Label>
-              <Input
-                value="Priyanka"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-                readOnly
-              />
+        <DialogRoot placement="center" >
+            <DialogTrigger asChild>
+                <Button bg={"transparent"} size="sm">
+                    <FaRegEdit style={{ cursor: "pointer", }}  color="#000"/>
+                </Button>
+                {/* <Button><FaRegEdit /></Button> */}
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Description
-              </Field.Label>
-              <Input
-                value="Joshi"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-                readOnly
-              />
+            </DialogTrigger>
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Members
-              </Field.Label>
+            <DialogContent
+                bg={"#fff"}
+                w={{ base: '90%', md: '400px' }}
+                height={"auto"}
+                p={3} // Reduced padding
+            >
+                <DialogHeader bg="white">
+                    <DialogTitle alignSelf="center" color="black" fontSize="14px">Edit details</DialogTitle>
+                </DialogHeader>
 
-              <Box
-                bgColor="#EEEEEE"
-                border="none"
-                w="100%"
-                display="flex"
-                p={1}
-                rounded={4}
-              >
-                <AvatarGroup gap="0" spaceX="-3" size={"xs"}>
-                  <Avatar.Root border={"none"}>
-                    <Avatar.Fallback />
-                    <Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/9/131317.webp?s=d4b03c7291407bde303bc0758047f6bd" />
-                  </Avatar.Root>
+                <DialogBody bg="white">
+                    <Stack py={3} >
 
-                  <Avatar.Root border={"none"}>
-                    <Avatar.Fallback />
-                    <Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/7/284129.webp?s=a8998bf668767de58b33740886ca571c" />
-                  </Avatar.Root>
+                        <Field.Root>
+                            <Field.Label color="black" pt={1} fontSize="12px">Group Name</Field.Label>
+                            <Input value="Priyanka" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" readOnly />
 
-                  <Avatar.Root border={"none"}>
-                    <Avatar.Fallback />
-                    <Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/9/105421.webp?s=269ff1b2bb9abe3ac1bc443d3a76e863" />
-                  </Avatar.Root>
-                  <Avatar.Root
-                    variant="solid"
-                    border={"none"}
-                    backgroundColor={"transparent"}
-                  >
-                    <Avatar.Fallback ml={5}>+3</Avatar.Fallback>
-                  </Avatar.Root>
-                </AvatarGroup>
-              </Box>
-            </Field.Root>
-            <Heading color="black" pt={1} fontSize="12px">
-              public/Private
-            </Heading>
-            <Switch />
-          </Stack>
-        </DialogBody>
-        <DialogFooter display="flex" justifyContent="center" pt={"2"}>
-          <Button size={"xs"} w="100%" bg="#02A0A0" color={"#fff"}>
-            Save
-          </Button>
-        </DialogFooter>{" "}
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+                            <Field.Label color="black" pt={1} fontSize="12px">Description</Field.Label>
+                            <Input value="Joshi" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" readOnly />
+
+                            <Field.Label color="black" pt={1} fontSize="12px">Members</Field.Label>
+
+                            <Box
+                                bgColor="#EEEEEE"
+                                border="none"
+                                w="100%"
+                                display="flex"
+                                p={1}
+                                rounded={4}
+                            >
+                                <AvatarGroup gap="0" spaceX="-3" size={"xs"} >
+                                    <Avatar.Root border={'none'}>
+                                        <Avatar.Fallback />
+                                        <Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/9/131317.webp?s=d4b03c7291407bde303bc0758047f6bd" />
+                                    </Avatar.Root>
+
+                                    <Avatar.Root border={'none'}>
+                                        <Avatar.Fallback />
+                                        <Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/7/284129.webp?s=a8998bf668767de58b33740886ca571c" />
+                                    </Avatar.Root>
+
+                                    <Avatar.Root border={'none'}>
+                                        <Avatar.Fallback />
+                                        <Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/9/105421.webp?s=269ff1b2bb9abe3ac1bc443d3a76e863" />
+                                    </Avatar.Root>
+                                    <Avatar.Root variant="solid" border={'none'} backgroundColor={'transparent'} >
+                                        <Avatar.Fallback ml={5}>+3</Avatar.Fallback>
+                                    </Avatar.Root>
+                                </AvatarGroup>
+                            </Box>
+                        </Field.Root>
+                        <Heading color="black" pt={1} fontSize="12px">public/Private</Heading>
+                        <Switch />
+                    </Stack>
+                </DialogBody>
+                <DialogFooter display="flex" justifyContent="center" pt={"2"}>
+                    <Button size={'xs'} w="100%" bg="#02A0A0" color={"#fff"}>
+                        Save
+                    </Button>
+                </DialogFooter>   <DialogCloseTrigger color="black" />
+            </DialogContent>
+        </DialogRoot >
+
+    )
 }
 
-export default EditDetailGroups;
+export default EditDetailGroups

src/Pages/ManageGroups/ManageGroups.tsx

@@ -1,16 +1,16 @@
-import { Box, HStack, Image, Input, Text } from "@chakra-ui/react";
-import MainFrame from "../../components/MainFrame";
-import { InputGroup } from "../../components/ui/input-group";
-import { LuSearch } from "react-icons/lu";
-import DataTable from "../../components/DataTable";
-import AlertDailog from "../../components/AlertDailog";
+import { Box, HStack, Image, Input, Text } from "@chakra-ui/react"
+import MainFrame from "../../components/MainFrame"
+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 ViewManageGroup from "./ViewManageGroup";
-import EditDetailGroups from "./EditDetailGroup";
-import AddGroup from "./AddGroup";
-import Delete from "../../components/ActionIcons/Delete";
+import ViewManageGroup from "./ViewManageGroup"
+import EditDetailGroups from "./EditDetailGroup"
+import AddGroup from "./AddGroup"
 // import ViewSubAdmin from "./ViewSubAdmin"
 
+
 // table data
 
 const tableHeadRow = [
@@ -26,15 +26,21 @@ const managepost: any[] = [
   ...Array.from({ length: 12 }, (_, i) => ({
     "Sr. No": i + 1,
     "Group Name": "ABC",
-    Description: "Lorem ipsum",
-    Date: "12/01/1987",
+    "Description": "Lorem ipsum",
+    "Date": "12/01/1987",
     "Group type": "Private",
-    Action: (
+    "Action": (
       <HStack justifyContent="center">
+
+        {/* <MdOutlineRemoveRedEye
+            style={{ cursor: "pointer", fontSize: "16px" }}
+          /> */}
         <ViewManageGroup />
         <EditDetailGroups />
+
+        {/* <RiDeleteBin5Line style={{ cursor: "pointer" }} /> */}
         <AlertDailog
-          AltertTiggerIcon={() => <Delete />} 
+          AltertTiggerIcon={RiDeleteBin5Line}
           alertText="Delete Users"
           alertIcon={<Image src={"DeleteIcon"} h={"39px"} />}
           alertCaption="are you sure you want to delete ?"
@@ -48,7 +54,8 @@ const managepost: any[] = [
 ];
 const ManageGroups = () => {
   return (
-    <MainFrame>
+
+    <MainFrame >
       <Box>
         <HStack
           w={"100%"}
@@ -61,13 +68,10 @@ const ManageGroups = () => {
             Manage Groups
           </Text>
 
-          <HStack>
+          <HStack >
             <InputGroup
               startElement={
-                <LuSearch
-                  fontSize={"xs"}
-                  style={{ position: "relative", left: "10px" }}
-                />
+                <LuSearch fontSize={"xs"} style={{ position: 'relative', left: '10px' }} />
               }
               color={"#000"}
             >
@@ -78,12 +82,12 @@ const ManageGroups = () => {
                 colorPalette={"blue"}
                 _focus={{ border: "1px solid #02A0A0" }}
                 rounded={"md"}
-                size={"xs"}
-                fontSize={"sm"}
+                size={"2xs"}
+                fontSize={"2sm"}
                 placeholder="Search..."
-                bgColor={"#EEEEEE"}
+                bgColor={'#EEEEEE'}
                 ps={8}
-                border={"none"}
+                border={'none'}
               />
             </InputGroup>
             {/* <Button bgColor={'#EEEEEE'} pl={3} pr={3}><IoMdAdd /> <Text>Add</Text></Button> */}
@@ -95,8 +99,7 @@ const ManageGroups = () => {
           tableHeadRow={tableHeadRow}
           data={managepost}
         />
-      </Box>{" "}
-    </MainFrame>
-  );
-};
-export default ManageGroups;
+      </Box>    </MainFrame>
+  )
+}
+export default ManageGroups

src/Pages/ManageGroups/ViewManageGroup.tsx

@@ -1,116 +1,86 @@
-import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "../../components/ui/dialog";
-import { Avatar, Box, Field, Heading, Input, Stack } from "@chakra-ui/react";
+import { Button } from "../../components/ui/button"
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
+import { Avatar, Box, Field, Grid, Heading, Input, Stack, Text } from "@chakra-ui/react"
+import { Checkbox } from "../../components/ui/checkbox"
+import { MdOutlineRemoveRedEye } from "react-icons/md";
 import { Switch } from "../../components/ui/switch";
 import { AvatarGroup } from "../../components/ui/avatar";
-import View from "../../components/ActionIcons/View";
 function ViewManageGroup() {
-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-        <View />
-      </DialogTrigger>
+    return (
 
-      <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">
-            View details
-          </DialogTitle>
-        </DialogHeader>
+        <DialogRoot placement="center" >
+            <DialogTrigger asChild>
+                <Button bg={"transparent"} size="sm">
+                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", }}  color="#000"/>
+                </Button>
+                {/* <Button><FaRegEdit /></Button> */}
 
-        <DialogBody bg="white">
-          <Stack py={3}>
-            <Field.Root>
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Group Name
-              </Field.Label>
-              <Input
-                value="Priyanka"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-                readOnly
-              />
+            </DialogTrigger>
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Description
-              </Field.Label>
-              <Input
-                value="Joshi"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-                readOnly
-              />
+            <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">View details</DialogTitle>
+                </DialogHeader>
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Members
-              </Field.Label>
+                <DialogBody bg="white">
+                    <Stack py={3} >
 
-              <Box
-                bgColor="#EEEEEE"
-                border="none"
-                w="100%"
-                display="flex"
-                p={1}
-                rounded={4}
-              >
-                <AvatarGroup gap="0" spaceX="-3" size={"xs"}>
-                  <Avatar.Root border={"none"}>
-                    <Avatar.Fallback />
-                    <Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/9/131317.webp?s=d4b03c7291407bde303bc0758047f6bd" />
-                  </Avatar.Root>
+                        <Field.Root>
+                            <Field.Label color="black" pt={1} fontSize="12px">Group Name</Field.Label>
+                            <Input value="Priyanka" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" readOnly />
 
-                  <Avatar.Root border={"none"}>
-                    <Avatar.Fallback />
-                    <Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/7/284129.webp?s=a8998bf668767de58b33740886ca571c" />
-                  </Avatar.Root>
+                            <Field.Label color="black" pt={1} fontSize="12px">Description</Field.Label>
+                            <Input value="Joshi" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" readOnly />
 
-                  <Avatar.Root border={"none"}>
-                    <Avatar.Fallback />
-                    <Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/9/105421.webp?s=269ff1b2bb9abe3ac1bc443d3a76e863" />
-                  </Avatar.Root>
-                  <Avatar.Root
-                    variant="solid"
-                    border={"none"}
-                    backgroundColor={"transparent"}
-                  >
-                    <Avatar.Fallback ml={5}>+3</Avatar.Fallback>
-                  </Avatar.Root>
-                </AvatarGroup>
-              </Box>
-            </Field.Root>
-            <Heading color="black" pt={1} fontSize="12px">
-              public/Private
-            </Heading>
-            <Switch />
-          </Stack>
-        </DialogBody>
+                            <Field.Label color="black" pt={1} fontSize="12px">Members</Field.Label>
 
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+                            <Box
+                                bgColor="#EEEEEE"
+                                border="none"
+                                w="100%"
+                                display="flex"
+                                p={1}
+                                rounded={4}
+                            >
+                                <AvatarGroup gap="0" spaceX="-3" size={"xs"} >
+                                    <Avatar.Root border={'none'}>
+                                        <Avatar.Fallback />
+                                        <Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/9/131317.webp?s=d4b03c7291407bde303bc0758047f6bd" />
+                                    </Avatar.Root>
+
+                                    <Avatar.Root border={'none'}>
+                                        <Avatar.Fallback />
+                                        <Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/7/284129.webp?s=a8998bf668767de58b33740886ca571c" />
+                                    </Avatar.Root>
+
+                                    <Avatar.Root border={'none'}>
+                                        <Avatar.Fallback />
+                                        <Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/9/105421.webp?s=269ff1b2bb9abe3ac1bc443d3a76e863" />
+                                    </Avatar.Root>
+                                    <Avatar.Root variant="solid" border={'none'} backgroundColor={'transparent'} >
+                                        <Avatar.Fallback ml={5}>+3</Avatar.Fallback>
+                                    </Avatar.Root>
+                                </AvatarGroup>
+                            </Box>
+
+                        </Field.Root>
+                        <Heading color="black" pt={1} fontSize="12px">public/Private</Heading>
+                        <Switch />
+                    </Stack>
+                </DialogBody>
+
+                <DialogCloseTrigger color="black" />
+            </DialogContent>
+        </DialogRoot >
+
+    )
 }
 
-export default ViewManageGroup;
+export default ViewManageGroup

src/Pages/ManageJobs/ManageJobs.tsx

@@ -1,101 +1,11 @@
-import { Box, HStack, Image, Input, Text } from "@chakra-ui/react";
-import { LuSearch } from "react-icons/lu";
-import { RiDeleteBin5Line } from "react-icons/ri";
-import AlertDailog from "../../components/AlertDailog";
-import DataTable from "../../components/DataTable";
-import MainFrame from "../../components/MainFrame";
-import { InputGroup } from "../../components/ui/input-group";
-import ManageJobsAdd from "./ManageJobsAdd";
-import ViewManageJob from "./ViewManageJob";
-import Delete from "../../components/ActionIcons/Delete";
-
-// table data
-
-const tableHeadRow = [
-  "Sr. No",
-  "Job Title",
-  "Workspace mode",
-  "Category",
-  "Sub-category",
-  "Salary",
-  "Action",
-];
-
-const managepost: any[] = [
-  ...Array.from({ length: 12 }, (_, i) => ({
-    "Sr. No": i + 1,
-    "Job Title": "Freelance content writer",
-    "Workspace mode": "Onsite",
-    Category: "IT",
-    "Sub-category": "Flutter dev",
-    Salary: "3.5 LPA",
-    Action: (
-      <HStack justifyContent="center">
-        <ViewManageJob />
-        <ManageJobsAdd />
-        <AlertDailog
-          AltertTiggerIcon={() => <Delete />}
-          alertText="Delete Users"
-          alertIcon={<Image src={"DeleteIcon"} h={"39px"} />}
-          alertCaption="are you sure you want to delete ?"
-          onConfirm={() => {
-            console.log("User deleted:", i + 1);
-          }}
-        />
-      </HStack>
-    ),
-  })),
-];
+import MainFrame from "../../components/MainFrame"
 
 const ManageJobs = () => {
   return (
     <MainFrame>
-      <Box>
-        <HStack
-          w={"100%"}
-          justifyContent={"space-between"}
-          mb={4}
-          py={0}
-          px={3}
-        >
-          <Text as={"span"} fontSize={"sm"} fontWeight={500} color={"#000"}>
-            View job Posting
-          </Text>
-
-          <HStack>
-            <InputGroup
-              startElement={
-                <LuSearch
-                  fontSize={"xs"}
-                  style={{ position: "relative", left: "10px" }}
-                />
-              }
-              color={"#000"}
-            >
-              <Input
-                p={3}
-                w={300}
-                bg={"#fff"}
-                colorPalette={"blue"}
-                _focus={{ border: "1px solid #02A0A0" }}
-                rounded={"md"}
-                size={"xs"}
-                fontSize={"sm"}
-                placeholder="Search..."
-                bgColor={"#EEEEEE"}
-                ps={8}
-              />
-            </InputGroup>
-            {/* <Button bgColor={'#EEEEEE'} pl={3} pr={3}><IoMdAdd /> <Text>Add</Text></Button> */}
-          </HStack>
-        </HStack>
-        <DataTable
-          sortableColumns={["Name", "Registration Date "]}
-          tableHeadRow={tableHeadRow}
-          data={managepost}
-        />
-      </Box>
+        
     </MainFrame>
-  );
-};
-export default ManageJobs;
+  )
+}
+
+export default ManageJobs

src/Pages/ManageJobs/ManageJobsAdd.tsx

@@ -1,261 +1,118 @@
-import {
-  Field,
-  Icon,
-  Input,
-  SelectValueText,
-  Stack,
-  createListCollection,
-} from "@chakra-ui/react";
-import { Button } from "../../components/ui/button";
-import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "../../components/ui/dialog";
+import { Button } from "../../components/ui/button"
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
+import { createListCollection, Field, Input, SelectValueText, Stack } from "@chakra-ui/react"
 
-import { TbEdit } from "react-icons/tb";
-import {
-  SelectContent,
-  SelectItem,
-  SelectLabel,
-  SelectRoot,
-  SelectTrigger,
-} from "../../components/ui/select";
-import Edit from "../../components/ActionIcons/Edit";
+import { FaRegEdit } from "react-icons/fa"
+import { SelectContent, SelectItem, SelectLabel, SelectRoot, SelectTrigger } from "../../components/ui/select"
 
 const frameworks = createListCollection({
-  items: [
-    { label: "React.js", value: "react" },
-    { label: "Vue.js", value: "vue" },
-    { label: "Angular", value: "angular" },
-    { label: "Svelte", value: "svelte" },
-  ],
-});
+    items: [
+        { label: "React.js", value: "react" },
+        { label: "Vue.js", value: "vue" },
+        { label: "Angular", value: "angular" },
+        { label: "Svelte", value: "svelte" },
+    ],
+})
 function ManageJobsAdd() {
-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-        <Edit />
-      </DialogTrigger>
+    return (
 
-      <DialogContent
-        bg={"#fff"}
-        // w={{ lg: "60%", md: "230px" }}
-        w={{ base: "90%", md: "400px" }}
-        height={"80vh"}
-        overflow={"scroll"}
-        overflowX="hidden"
-        p={3} // Reduced padding
-        bgSize={"md"}
-      >
-        <DialogHeader bg="white">
-          <DialogTitle alignSelf="center" color="black" fontSize="14px">
-            Add Details
-          </DialogTitle>
-        </DialogHeader>
 
-        <DialogBody bg="white">
-          <Stack py={3}>
-            <Field.Root>
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Job title
-              </Field.Label>
-              <Input
-                placeholder="Enter the Job Title"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            <Field.Root>
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Workspace mode
-              </Field.Label>
-              <Input
-                placeholder="Enter the Workspace Mode"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            <Field.Root>
-              <Field.Label pt={1} color="black" fontSize="12px">
-                Category
-              </Field.Label>
-              <Input
-                placeholder="Enter the Category"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            <Field.Root>
-              <Field.Label pt={1} color="black" fontSize="12px">
-                Sub-Category
-              </Field.Label>
-              <Input
-                placeholder="Enter the Sub-Category"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            <Field.Root>
-              <Field.Label pt={1} color="black" fontSize="12px">
-                Salary
-              </Field.Label>
-              <Input
-                placeholder="Enter the Salary"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            <Field.Root>
-              <Field.Label pt={1} color="black" fontSize="12px">
-                Experience
-              </Field.Label>
-              <Input
-                placeholder="Enter the Experience"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            <Field.Root>
-              <Field.Label pt={1} color="black" fontSize="12px">
-                Job Location
-              </Field.Label>
-              <Input
-                placeholder="Enter the Job Location"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            {/* <Field.Label pt={1} color="black" fontSize="12px">Country Selection</Field.Label>
+        <DialogRoot placement="center">
+            <DialogTrigger asChild>
+                <Button bg={"transparent"} size="sm">
+                    <FaRegEdit style={{ cursor: "pointer", fontSize: "14px" }} color="#000" />
+                </Button>
+            </DialogTrigger>
+
+            <DialogContent
+                bg={"#fff"}
+                // w={{ lg: "60%", md: "230px" }}
+                w={{ base: '90%', md: '400px' }}
+                height={'80vh'}
+                overflow={'scroll'}
+                overflowX="hidden" 
+                p={3} // Reduced padding
+                bgSize={'md'}
+            >
+                <DialogHeader bg="white">
+                    <DialogTitle alignSelf="center" color="black" fontSize="14px">Add Details</DialogTitle>
+                </DialogHeader>
+
+                <DialogBody bg="white">
+                    <Stack py={3}>
+                        <Field.Root>
+                            <Field.Label color="black" pt={1} fontSize="12px">Job title</Field.Label>
+                            <Input placeholder="Enter the Job Title" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root>
+                        <Field.Root>
+
+                            <Field.Label color="black" pt={1} fontSize="12px">Workspace mode</Field.Label>
+                            <Input placeholder="Enter the Workspace Mode" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root>
+                        <Field.Root>
+                            <Field.Label pt={1} color="black" fontSize="12px">Category</Field.Label>
+                            <Input placeholder="Enter the Category" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root>
+                        <Field.Root>
+                            <Field.Label pt={1} color="black" fontSize="12px">Sub-Category</Field.Label>
+                            <Input placeholder="Enter the Sub-Category" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root>
+                        <Field.Root>
+                            <Field.Label pt={1} color="black" fontSize="12px">Salary</Field.Label>
+                            <Input placeholder="Enter the Salary" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root>
+                        <Field.Root>
+                            <Field.Label pt={1} color="black" fontSize="12px">Experience</Field.Label>
+                            <Input placeholder="Enter the Experience" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root>
+                        <Field.Root>
+                            <Field.Label pt={1} color="black" fontSize="12px">Job Location</Field.Label>
+                            <Input placeholder="Enter the Job Location" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root>
+                        {/* <Field.Label pt={1} color="black" fontSize="12px">Country Selection</Field.Label>
                             <Input placeholder="Enter the Country Selection"   /> */}
-            <SelectRoot collection={frameworks} size="sm" w={"100%"}>
-              <SelectLabel pt={1} color="black" fontSize="12px">
-                Country Selection
-              </SelectLabel>
-              <SelectTrigger
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-                borderRadius={"5px"}
-              >
-                <SelectValueText
-                  placeholder="Enter the Country Selection"
-                  pb={"6px"}
-                  fontSize={"12px"}
-                />
-              </SelectTrigger>
-              <SelectContent position={"relative"} zIndex={"9999"} bg={"#fff"}>
-                {frameworks.items.map((movie) => (
-                  <SelectItem
-                    item={movie}
-                    key={movie.value}
-                    color={"black"}
-                    pl={2}
-                    p={1}
-                    _hover={{ bg: "#F0F0F0" }} // Light grey background on hover
-                    fontSize="12px"
-                  >
-                    {movie.label}
-                  </SelectItem>
-                ))}
-              </SelectContent>
-            </SelectRoot>
-            <Field.Root>
-              <Field.Label pt={1} color="black" fontSize="12px">
-                Job type
-              </Field.Label>
-              <Input
-                placeholder="Enter the Job Type"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            <Field.Root>
-              <Field.Label pt={1} color="black" fontSize="12px">
-                Skills required
-              </Field.Label>
-              <Input
-                placeholder="Enter the Skills Required"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            <Field.Root>
-              <Field.Label pt={1} color="black" fontSize="12px">
-                Job Description*
-              </Field.Label>
-              <Input
-                placeholder="Enter the Job Description"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-          </Stack>
-        </DialogBody>
-        <DialogFooter display="flex" justifyContent="center" pt={"2"}>
-          <Button
-            w="100%"
-            bg="#02A0A0"
-            color={"#fff"}
-            fontSize="12px"
-            height="30px"
-          >
-            Save
-          </Button>
-        </DialogFooter>
+                        <SelectRoot collection={frameworks} size="sm" w={'100%'}>
+                            <SelectLabel pt={1} color="black" fontSize="12px">Country Selection</SelectLabel>
+                            <SelectTrigger bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px"
+                                borderRadius={"5px"}>
+                                <SelectValueText placeholder="Enter the Country Selection" pb={"6px"} fontSize={"12px"} />
+                            </SelectTrigger>
+                            <SelectContent position={'relative'} zIndex={'9999'} bg={"#fff"}>
+                                {frameworks.items.map((movie) => (
+                                    <SelectItem item={movie} key={movie.value} color={"black"} pl={2} p={1} _hover={{ bg: "#F0F0F0" }} // Light grey background on hover
+                                        fontSize="12px" >
+                                        {movie.label}
+                                    </SelectItem>
+                                ))}
+                            </SelectContent>
+                        </SelectRoot>
+                        <Field.Root>
 
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+                            <Field.Label pt={1} color="black" fontSize="12px">Job type</Field.Label>
+                            <Input placeholder="Enter the Job Type" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root>
+                        <Field.Root>
+                            <Field.Label pt={1} color="black" fontSize="12px">Skills required</Field.Label>
+                            <Input placeholder="Enter the Skills Required" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root>
+                        <Field.Root>
+                            <Field.Label pt={1} color="black" fontSize="12px">Job Description*</Field.Label>
+                            <Input placeholder="Enter the Job Description" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root>
+                    </Stack>
+                </DialogBody>
+                <DialogFooter display="flex" justifyContent="center" pt={"2"}>
+                    <Button w="100%" bg="#02A0A0" color={"#fff"} fontSize="12px" height="30px">
+                        Save
+                    </Button>
+                </DialogFooter>
+
+                <DialogCloseTrigger color="black" />
+            </DialogContent>
+        </DialogRoot>
+
+
+    )
 }
 
-export default ManageJobsAdd;
+export default ManageJobsAdd

src/Pages/ManageJobs/ViewManageJob.tsx

@@ -1,276 +1,113 @@
-import {
-  Field,
-  Icon,
-  Input,
-  SelectValueText,
-  Stack,
-  createListCollection,
-} from "@chakra-ui/react";
-import { Button } from "../../components/ui/button";
-import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "../../components/ui/dialog";
+import { Button } from "../../components/ui/button"
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
+import { createListCollection, Field, Input, SelectValueText, Stack, } from "@chakra-ui/react"
 
-import { MdOutlineRemoveRedEye } from "react-icons/md";
-import {
-  SelectContent,
-  SelectItem,
-  SelectLabel,
-  SelectRoot,
-  SelectTrigger,
-} from "../../components/ui/select";
-import View from "../../components/ActionIcons/View";
+import { FaRegEdit } from "react-icons/fa"
+import { SelectContent, SelectItem, SelectLabel, SelectRoot, SelectTrigger } from "../../components/ui/select"
+import { MdOutlineRemoveRedEye } from "react-icons/md"
 
 const frameworks = createListCollection({
-  items: [
-    { label: "React.js", value: "react" },
-    { label: "Vue.js", value: "vue" },
-    { label: "Angular", value: "angular" },
-    { label: "Svelte", value: "svelte" },
-  ],
-});
+    items: [
+        { label: "React.js", value: "react" },
+        { label: "Vue.js", value: "vue" },
+        { label: "Angular", value: "angular" },
+        { label: "Svelte", value: "svelte" },
+    ],
+})
 function ViewManageJob() {
-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-        <View />
-      </DialogTrigger>
+    return (
 
-      <DialogContent
-        bg={"#fff"}
-        // w={{ lg: "60%", md: "230px" }}
-        w={{ base: "90%", md: "400px" }}
-        height={"80vh"}
-        overflow={"scroll"}
-        overflowX="hidden"
-        p={3} // Reduced padding
-        bgSize={"md"}
-      >
-        <DialogHeader bg="white">
-          <DialogTitle alignSelf="center" color="black" fontSize="14px">
-            Add Details
-          </DialogTitle>
-        </DialogHeader>
 
-        <DialogBody bg="white">
-          <Stack py={3}>
-            <Field.Root>
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Job title
-              </Field.Label>
-              <Input
-                placeholder="Enter the Job Title"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            <Field.Root>
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Workspace mode
-              </Field.Label>
-              <Input
-                placeholder="Enter the Workspace Mode"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            <Field.Root>
-              <Field.Label pt={1} color="black" fontSize="12px">
-                Category
-              </Field.Label>
-              <Input
-                placeholder="Enter the Category"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            <Field.Root>
-              <Field.Label pt={1} color="black" fontSize="12px">
-                Sub-Category
-              </Field.Label>
-              <Input
-                placeholder="Enter the Sub-Category"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            <Field.Root>
-              <Field.Label pt={1} color="black" fontSize="12px">
-                Salary
-              </Field.Label>
-              <Input
-                placeholder="Enter the Salary"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            <Field.Root>
-              <Field.Label pt={1} color="black" fontSize="12px">
-                Experience
-              </Field.Label>
-              <Input
-                placeholder="Enter the Experience"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            <Field.Root>
-              <Field.Label pt={1} color="black" fontSize="12px">
-                Job Location
-              </Field.Label>
-              <Input
-                placeholder="Enter the Job Location"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            {/* <Field.Label pt={1} color="black" fontSize="12px">Country Selection</Field.Label>
+        <DialogRoot placement="center">
+            <DialogTrigger asChild>
+                <Button bg={"transparent"} size="sm">
+                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "14px" }}  color="#000"/>
+                </Button>
+            </DialogTrigger>
+
+            <DialogContent
+                bg={"#fff"}
+                // w={{ lg: "60%", md: "230px" }}
+                w={{ base: '90%', md: '400px' }}
+                height={'80vh'}
+                overflow={'scroll'}
+                overflowX="hidden" 
+                p={3} // Reduced padding
+                bgSize={'md'}
+            >
+                <DialogHeader bg="white" >
+                    <DialogTitle alignSelf="center" color="black" fontSize="14px">Add Details</DialogTitle>
+                </DialogHeader>
+
+                <DialogBody bg="white">
+                    <Stack py={3}>
+                        <Field.Root>
+                            <Field.Label color="black" pt={1} fontSize="12px">Job title</Field.Label>
+                            <Input placeholder="Enter the Job Title" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root><Field.Root>
+                            <Field.Label color="black" pt={1} fontSize="12px">Workspace mode</Field.Label>
+                            <Input placeholder="Enter the Workspace Mode" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root><Field.Root>
+                            <Field.Label pt={1} color="black" fontSize="12px">Category</Field.Label>
+                            <Input placeholder="Enter the Category" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root><Field.Root>
+                            <Field.Label pt={1} color="black" fontSize="12px">Sub-Category</Field.Label>
+                            <Input placeholder="Enter the Sub-Category" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root><Field.Root>
+                            <Field.Label pt={1} color="black" fontSize="12px">Salary</Field.Label>
+                            <Input placeholder="Enter the Salary" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root><Field.Root>
+                            <Field.Label pt={1} color="black" fontSize="12px">Experience</Field.Label>
+                            <Input placeholder="Enter the Experience" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root><Field.Root>
+                            <Field.Label pt={1} color="black" fontSize="12px">Job Location</Field.Label>
+                            <Input placeholder="Enter the Job Location" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root>
+                        {/* <Field.Label pt={1} color="black" fontSize="12px">Country Selection</Field.Label>
                             <Input placeholder="Enter the Country Selection"   /> */}
-            <SelectRoot collection={frameworks} size="sm" w={"100%"}>
-              <SelectLabel pt={1} color="black" fontSize="12px">
-                Country Selection
-              </SelectLabel>
-              <SelectTrigger
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-                borderRadius={"5px"}
-              >
-                <SelectValueText
-                  placeholder="Enter the Country Selection"
-                  pb={"6px"}
-                  fontSize={"12px"}
-                />
-              </SelectTrigger>
-              <SelectContent position={"relative"} zIndex={"9999"} bg={"#fff"}>
-                {frameworks.items.map((movie) => (
-                  <SelectItem
-                    item={movie}
-                    key={movie.value}
-                    color={"black"}
-                    pl={2}
-                    p={1}
-                    _hover={{ bg: "#F0F0F0" }} // Light grey background on hover
-                    fontSize="12px"
-                  >
-                    {movie.label}
-                  </SelectItem>
-                ))}
-              </SelectContent>
-            </SelectRoot>
+                        <SelectRoot collection={frameworks} size="sm" w={'100%'}>
+                            <SelectLabel pt={1} color="black" fontSize="12px">Country Selection</SelectLabel>
+                            <SelectTrigger bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px"
+                                borderRadius={"5px"}>
+                                <SelectValueText placeholder="Enter the Country Selection" pb={"6px"} fontSize={"12px"} />
+                            </SelectTrigger>
+                            <SelectContent position={'relative'} zIndex={'9999'} bg={"#fff"}>
+                                {frameworks.items.map((movie) => (
+                                    <SelectItem item={movie} key={movie.value} color={"black"} pl={2} p={1} _hover={{ bg: "#F0F0F0" }} // Light grey background on hover
+                                        fontSize="12px" >
+                                        {movie.label}
+                                    </SelectItem>
+                                ))}
+                            </SelectContent>
+                        </SelectRoot>
 
-            <Field.Root>
-              <Field.Label pt={1} color="black" fontSize="12px">
-                Job type
-              </Field.Label>
-              <Input
-                placeholder="Enter the Job Type"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            <Field.Root>
-              <Field.Label pt={1} color="black" fontSize="12px">
-                Skills required
-              </Field.Label>
-              <Input
-                placeholder="Enter the Skills Required"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            <Field.Root>
-              <Field.Label pt={1} color="black" fontSize="12px">
-                Job Description*
-              </Field.Label>
-              <Input
-                placeholder="Enter the Job Description"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-            <Field.Root>
-              <Field.Label pt={1} color="black" fontSize="12px">
-                Upload Image
-              </Field.Label>
-              <Input
-                placeholder="Upload Image"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-          </Stack>
-        </DialogBody>
-        <DialogFooter display="flex" justifyContent="center" pt={"2"}>
-          <Button
-            w="100%"
-            bg="#02A0A0"
-            color={"#fff"}
-            fontSize="12px"
-            height="30px"
-          >
-            Save
-          </Button>
-        </DialogFooter>
+                        <Field.Root>
+                            <Field.Label pt={1} color="black" fontSize="12px">Job type</Field.Label>
+                            <Input placeholder="Enter the Job Type" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root><Field.Root>
+                            <Field.Label pt={1} color="black" fontSize="12px">Skills required</Field.Label>
+                            <Input placeholder="Enter the Skills Required" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root><Field.Root>
+                            <Field.Label pt={1} color="black" fontSize="12px">Job Description*</Field.Label>
+                            <Input placeholder="Enter the Job Description" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root><Field.Root>
+                            <Field.Label pt={1} color="black" fontSize="12px">Upload Image</Field.Label>
+                            <Input placeholder="Upload Image" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </Field.Root>
+                    </Stack>
+                </DialogBody>
+                <DialogFooter display="flex" justifyContent="center" pt={"2"}>
+                    <Button w="100%" bg="#02A0A0" color={"#fff"} fontSize="12px" height="30px">
+                        Save
+                    </Button>
+                </DialogFooter>
 
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+                <DialogCloseTrigger color="black" />
+            </DialogContent>
+        </DialogRoot>
+
+
+    )
 }
 
-export default ViewManageJob;
+export default ViewManageJob

src/Pages/ManagePost/ManagePost.tsx

@@ -1,113 +1,11 @@
-import { Box, HStack, Image, Input, Text } from "@chakra-ui/react";
-import MainFrame from "../../components/MainFrame";
-import { InputGroup } from "../../components/ui/input-group";
-import { LuSearch } from "react-icons/lu";
-import DataTable from "../../components/DataTable";
-import AlertDailog from "../../components/AlertDailog";
-import { Switch } from "../../components/ui/switch";
-import img from "../../assets/waterfall.jpg";
-import { RiDeleteBin5Line } from "react-icons/ri";
-import ViewDailog from "./ViewDailog";
-import Delete from "../../components/ActionIcons/Delete";
-// import ViewDailog from './ViewDailog'
+import MainFrame from "../../components/MainFrame"
 
-// table data
-
-const tableHeadRow = [
-  "Sr. No",
-  "Images",
-  "Description",
-  "Publish Data",
-  "Activate/Deactivate",
-  "Action",
-];
-
-const managepost: any[] = [
-  ...Array.from({ length: 12 }, (_, i) => ({
-    "Sr. No": i + 1,
-    Images: (
-      // <Image w={50} src={img} />
-      <Image rounded={"lg"} w={100} h={50} src={img} />
-    ),
-    Description: (
-      <Text>
-        {`Lorem ipsum dolor, sit amet consectetur adipisicing elit.}`.slice(
-          0,
-          30
-        ) + "..."}
-      </Text>
-    ),
-    "Publish Data": "12/01/2025",
-    "Activate/Deactivate": (
-      <Box w={"100%"}>
-        <Switch size={"sm"} colorPalette={"teal"} />
-      </Box>
-    ),
-    Action: (
-      <HStack justifyContent="center">
-        <ViewDailog />
-        <AlertDailog
-          AltertTiggerIcon={() => <Delete />} 
-          alertText="Delete Users"
-          alertIcon={<Image src={"DeleteIcon"} h={"39px"} />}
-          alertCaption="are you sure you want to delete ?"
-          onConfirm={() => {
-            console.log("User deleted:", i + 1);
-          }}
-        />
-      </HStack>
-    ),
-  })),
-];
 const ManagePost = () => {
   return (
     <MainFrame>
-      <Box>
-        <HStack
-          w={"100%"}
-          justifyContent={"space-between"}
-          mb={4}
-          py={0}
-          px={3}
-        >
-          <Text as={"span"} fontSize={"sm"} fontWeight={500} color={"#000"}>
-            {/* Manage Post */}
-          </Text>
-
-          <HStack>
-            <InputGroup
-              startElement={
-                <LuSearch
-                  fontSize={"xs"}
-                  style={{ position: "relative", left: "10px" }}
-                />
-              }
-              color={"#000"}
-            >
-              <Input
-                p={3}
-                w={300}
-                bg={"#fff"}
-                colorPalette={"blue"}
-                _focus={{ border: "1px solid #02A0A0" }}
-                rounded={"md"}
-                size={"xs"}
-                fontSize={"sm"}
-                placeholder="Search..."
-                bgColor={"#EEEEEE"}
-                ps={8}
-              />
-            </InputGroup>
-          </HStack>
-        </HStack>
-        <DataTable
-          sortableColumns={["Name", "Registration Date "]}
-          tableHeadRow={tableHeadRow}
-          data={managepost}
-        />
-      </Box>
+      
     </MainFrame>
-  );
-};
+  )
+}
 
-export default ManagePost;
+export default ManagePost

src/Pages/ManagePost/ViewDailog.tsx

@@ -1,15 +1,16 @@
-import { Field, Icon, Image, Input, Stack } from "@chakra-ui/react"
-import { TbEdit } from "react-icons/tb"
-import img from "../../assets/waterfall.jpg"
+import { MdOutlineRemoveRedEye } from "react-icons/md"
+import { Button } from "../../components/ui/button"
 import { DialogBody, DialogCloseTrigger, DialogContent, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
-import Edit from "../../components/ActionIcons/Edit"
-
+import { Field, Image, Input, Stack } from "@chakra-ui/react"
+import img from "../../assets/waterfall.jpg"
 function ViewDailog() {
     return (
 
         <DialogRoot placement="center">
             <DialogTrigger asChild>
-                <Edit />
+                <Button bg={"transparent"} size="sm">
+                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} color="#000" />
+                </Button>
             </DialogTrigger>
 
             <DialogContent

src/Pages/ManageSubAdmin/ManageSubAdmin.tsx

@@ -0,0 +1,11 @@
+import MainFrame from '../../components/MainFrame'
+
+const ManageSubAdmin = () => {
+  return (
+    <MainFrame>
+        
+    </MainFrame>
+  )
+}
+
+export default ManageSubAdmin

src/Pages/ManageUser/DeactivatedAccounts/DeactivatedAccounts.tsx

@@ -0,0 +1,11 @@
+import MainFrame from '../../../components/MainFrame'
+
+const DeactivatedAccounts = () => {
+  return (
+    <MainFrame>
+        
+    </MainFrame>
+  )
+}
+
+export default DeactivatedAccounts

src/Pages/ManageUser/RegisterUsers/RegisterUsers.tsx

@@ -0,0 +1,233 @@
+import { Box, HStack, Input, Stack, Table, Text } from "@chakra-ui/react";
+import MainFrame from "../../../components/MainFrame";
+import { InputGroup } from "../../../components/ui/input-group";
+import { LuSearch } from "react-icons/lu";
+import DataTable from "../../../components/DataTable";
+
+// Table setup
+const tableHeadRow = [
+  "Sr. No",
+  "First Name",
+  "Mobile number",
+  "Gender",
+  "DOB",
+  "Type of User",
+  "Language",
+  "Status",
+  "Action",
+];
+
+const usersData: any[] = [
+  {
+    "Sr. No": 1,
+    "First Name": "Ritesh",
+    "Mobile number": "9876543210",
+    Gender: "Male",
+    DOB: "15-01-1990",
+    "Type of User": "Admin",
+    Language: "English",
+    Status: "Active",
+    Action: "Edit/Delete",
+  },
+  {
+    "Sr. No": 2,
+    "First Name": "Anjali",
+    "Mobile number": "9123456789",
+    Gender: "Female",
+    DOB: "21-06-1995",
+    "Type of User": "Customer",
+    Language: "Hindi",
+    Status: "Inactive",
+    Action: "Edit/Delete",
+  },
+  {
+    "Sr. No": 3,
+    "First Name": "Rajesh",
+    "Mobile number": "9871234560",
+    Gender: "Male",
+    DOB: "12-12-1985",
+    "Type of User": "Vendor",
+    Language: "English",
+    Status: "Active",
+    Action: "Edit/Delete",
+  },
+  {
+    "Sr. No": 4,
+    "First Name": "Priya",
+    "Mobile number": "9988776655",
+    Gender: "Female",
+    DOB: "05-05-1998",
+    "Type of User": "Customer",
+    Language: "Tamil",
+    Status: "Active",
+    Action: "Edit/Delete",
+  },
+  {
+    "Sr. No": 5,
+    "First Name": "Amit",
+    "Mobile number": "8899665544",
+    Gender: "Male",
+    DOB: "03-03-1992",
+    "Type of User": "Admin",
+    Language: "Gujarati",
+    Status: "Inactive",
+    Action: "Edit/Delete",
+  },
+  {
+    "Sr. No": 6,
+    "First Name": "Amit",
+    "Mobile number": "8899665544",
+    Gender: "Male",
+    DOB: "03-03-1992",
+    "Type of User": "Admin",
+    Language: "Gujarati",
+    Status: "Inactive",
+    Action: "Edit/Delete",
+  },
+  {
+    "Sr. No": 7,
+    "First Name": "Amit",
+    "Mobile number": "8899665544",
+    Gender: "Male",
+    DOB: "03-03-1992",
+    "Type of User": "Admin",
+    Language: "Gujarati",
+    Status: "Inactive",
+    Action: "Edit/Delete",
+  },
+  {
+    "Sr. No": 5,
+    "First Name": "Amit",
+    "Mobile number": "8899665544",
+    Gender: "Male",
+    DOB: "03-03-1992",
+    "Type of User": "Admin",
+    Language: "Gujarati",
+    Status: "Inactive",
+    Action: "Edit/Delete",
+  },
+  {
+    "Sr. No": 6,
+    "First Name": "Amit",
+    "Mobile number": "8899665544",
+    Gender: "Male",
+    DOB: "03-03-1992",
+    "Type of User": "Admin",
+    Language: "Gujarati",
+    Status: "Inactive",
+    Action: "Edit/Delete",
+  },
+  {
+    "Sr. No": 7,
+    "First Name": "Amit",
+    "Mobile number": "8899665544",
+    Gender: "Male",
+    DOB: "03-03-1992",
+    "Type of User": "Admin",
+    Language: "Gujarati",
+    Status: "Inactive",
+    Action: "Edit/Delete",
+  },
+  {
+    "Sr. No": 8,
+    "First Name": "Amit",
+    "Mobile number": "8899665544",
+    Gender: "Male",
+    DOB: "03-03-1992",
+    "Type of User": "Admin",
+    Language: "Gujarati",
+    Status: "Inactive",
+    Action: "Edit/Delete",
+  },
+  {
+    "Sr. No": 9,
+    "First Name": "Amit",
+    "Mobile number": "8899665544",
+    Gender: "Male",
+    DOB: "03-03-1992",
+    "Type of User": "Admin",
+    Language: "Gujarati",
+    Status: "Inactive",
+    Action: "Edit/Delete",
+  },
+  {
+    "Sr. No": 10,
+    "First Name": "Amit",
+    "Mobile number": "8899665544",
+    Gender: "Male",
+    DOB: "03-03-1992",
+    "Type of User": "Admin",
+    Language: "Gujarati",
+    Status: "Inactive",
+    Action: "Edit/Delete",
+  },
+  {
+    "Sr. No": 11,
+    "First Name": "Amit",
+    "Mobile number": "8899665544",
+    Gender: "Male",
+    DOB: "03-03-1992",
+    "Type of User": "Admin",
+    Language: "Gujarati",
+    Status: "Inactive",
+    Action: "Edit/Delete",
+  },
+  {
+    "Sr. No": 12,
+    "First Name": "Amit",
+    "Mobile number": "8899665544",
+    Gender: "Male",
+    DOB: "03-03-1992",
+    "Type of User": "Admin",
+    Language: "Gujarati",
+    Status: "Inactive",
+    Action: "Edit/Delete",
+  },
+  {
+    "Sr. No": 13,
+    "First Name": "Amit",
+    "Mobile number": "8899665544",
+    Gender: "Male",
+    DOB: "03-03-1992",
+    "Type of User": "Admin",
+    Language: "Gujarati",
+    Status: "Inactive",
+    Action: "Edit/Delete",
+  },
+];
+
+const RegisterUsers = () => {
+  return (
+    <MainFrame>
+      <HStack   w={"100%"} justifyContent={"space-between"} p={3}>
+        <Text as={"span"} fontSize={"sm"} fontWeight={"bolder"} color={"#000"}>
+          Register User
+        </Text>
+
+        <Box w={"30%"}>
+          <InputGroup
+            bgSize={"xs"}
+            flex="1"
+            startElement={<LuSearch />}
+            w={"100%"}
+            color={"#000"}
+          >
+            <Input
+              w={"100%"}
+              bg={"#EEEEEE"}
+              _focus={{ border: "1px #02A0A0 solid" }}
+              border={"1px #EEEEEE solid"}
+              rounded={"full"}
+              size={"sm"}
+              placeholder="Search..."
+            />
+          </InputGroup>
+        </Box>
+      </HStack>
+
+      <DataTable tableHeadRow={tableHeadRow} data={usersData} />
+    </MainFrame>
+  );
+};
+
+export default RegisterUsers;

src/Pages/ManageUsers/DeactivatedAccounts/DeactivatedAccounts.tsx

@@ -21,7 +21,7 @@ const manageUser: any[] = [
     "Company name": "9876543210",
     "Activate/Deactivate": (
       <Box display={'flex'} justifyContent={'center'}>
-        <Switch size={'sm'} colorPalette={'teal'} />
+        <Switch colorPalette={'teal'} />
       </Box>
     ),
   })),
@@ -57,7 +57,7 @@ const DeactivatedAccounts = () => {
                 _focus={{ border: "1px solid #02A0A0" }}
                 rounded={"md"}
                 size={"2xs"}
-                fontSize={"sm"}
+                fontSize={"2sm"}
                 placeholder="Search..."
                 bgColor={'#EEEEEE'}
                 ps={8}

src/Pages/ManageUsers/RegisterUsers/EditRegisterUsers.tsx

@@ -1,5 +1,5 @@
 import { MdOutlineRemoveRedEye } from "react-icons/md";
-import { Field, Icon, Input, Stack } from "@chakra-ui/react";
+import { Field, Input, Stack } from "@chakra-ui/react";
 import {
   DialogActionTrigger,
   DialogBody,
@@ -13,14 +13,12 @@ import {
 } from "../../../components/ui/dialog";
 import { BiEdit } from "react-icons/bi";
 import { Button } from "../../../components/ui/button";
-import { TbEdit } from "react-icons/tb";
-import Edit from "../../../components/ActionIcons/Edit";
 
 function EditRegisterUsers() {
   return (
     <DialogRoot placement="center">
       <DialogTrigger asChild>
-            <Edit/>
+        <BiEdit style={{ cursor: "pointer", fontSize: "16px" }} />
       </DialogTrigger>
 
       <DialogContent

src/Pages/ManageUsers/RegisterUsers/RegisterUsers.tsx

@@ -1,15 +1,18 @@
 import { Box, HStack, Image, Input, Text } from "@chakra-ui/react";
 import MainFrame from "../../../components/MainFrame";
 import AlertDailog from "../../../components/AlertDailog";
+import { NavLink } from "react-router-dom";
 import { RiDeleteBin5Line } from "react-icons/ri";
 import DataTable from "../../../components/DataTable";
 import { Switch } from "../../../components/ui/switch";
 import { InputGroup } from "../../../components/ui/input-group";
 import { LuSearch } from "react-icons/lu";
+import { BiEdit } from "react-icons/bi";
 import ViewRegisterUsers from "./ViewRegisterUsers";
 import EditRegisterUsers from "./EditRegisterUsers";
+import { Button } from "../../../components/ui/button";
+import { IoMdAdd } from "react-icons/io";
 import AddRegisterUsers from "./AddRegisterUsers";
-import Delete from "../../../components/ActionIcons/Delete";
 
 const tableHeadRow = [
   "Sr. No",
@@ -34,16 +37,16 @@ const registerUser: any[] = [
     "Language": "Mumbai",
     "Activate/Deactivate": (
       <Box>
-        <Switch size={'sm'} colorPalette={'teal'} />
+        <Switch colorPalette={'teal'} />
       </Box>
     ),
     "Action": (
-      <HStack justifyContent="center">
+      <HStack justifyContent="center">  
         <ViewRegisterUsers />
         <EditRegisterUsers />
         {/* <RiDeleteBin5Line style={{ cursor: "pointer" }} /> */}
         <AlertDailog
-          AltertTiggerIcon={() => <Delete />} // Pass as function
+          AltertTiggerIcon={RiDeleteBin5Line}
           alertText="Delete Users"
           alertIcon={<Image src={"DeleteIcon"} h={"39px"} />}
           alertCaption="Are You Sure You Want To Delete This User ?"
@@ -71,7 +74,7 @@ const RegisterUsers = () => {
             Register Users
           </Text>
 
-          <HStack> 
+          <HStack>
             <InputGroup
               startElement={
                 <LuSearch fontSize={"xs"} style={{ position: 'relative', left: '10px' }} />
@@ -85,8 +88,8 @@ const RegisterUsers = () => {
                 colorPalette={"blue"}
                 _focus={{ border: "1px solid #02A0A0" }}
                 rounded={"md"}
-                size={"xs"}
-                fontSize={"sm"}
+                size={"2xs"}
+                fontSize={"2sm"}
                 placeholder="Search..."
                 bgColor={'#EEEEEE'}
                 ps={8}

src/Pages/ManageUsers/RegisterUsers/ViewRegisterUsers.tsx

@@ -1,5 +1,5 @@
+import { MdOutlineRemoveRedEye } from "react-icons/md";
 import { Field, Input, Stack } from "@chakra-ui/react";
-import View from "../../../components/ActionIcons/View";
 import {
   DialogBody,
   DialogCloseTrigger,
@@ -14,17 +14,20 @@ function ViewRegisterUsers() {
   return (
     <DialogRoot placement="center">
       <DialogTrigger asChild>
-        <View />
+        <MdOutlineRemoveRedEye
+          color="#000"
+          style={{ cursor: "pointer", fontSize: "16px" }}
+        />
       </DialogTrigger>
 
       <DialogContent
-        bg={"#fff"}
-        w={{ base: "90%", md: "400px" }}
-        height={"80vh"}
-        overflow={"scroll"}
-        overflowX="hidden"
-        p={3} // Reduced padding
-        bgSize={"md"}
+         bg={"#fff"}
+         w={{ base: '90%', md: '400px' }}
+         height={'80vh'}
+         overflow={'scroll'}
+         overflowX="hidden" 
+         p={3} // Reduced padding
+         bgSize={'md'}
       >
         <DialogHeader bg="white">
           <DialogTitle alignSelf="center" color="black" fontSize="14px">
@@ -39,72 +42,42 @@ function ViewRegisterUsers() {
                 First Name
               </Field.Label>
               <Input
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
+                bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px"
               />
 
               <Field.Label color="black" pt={1} fontSize="12px">
                 Last Name
               </Field.Label>
               <Input
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
+                bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px"
               />
 
               <Field.Label color="black" pt={1} fontSize="12px">
                 Gender
               </Field.Label>
               <Input
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
+                bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px"
               />
 
               <Field.Label color="black" pt={1} fontSize="12px">
                 DOB
               </Field.Label>
               <Input
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
+                bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px"
               />
 
               <Field.Label color="black" pt={1} fontSize="12px">
                 OTP Verified
               </Field.Label>
               <Input
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
+                bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px"
               />
 
               <Field.Label color="black" pt={1} fontSize="12px">
                 Language
               </Field.Label>
               <Input
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
+                bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px"
               />
             </Field.Root>
           </Stack>

src/Pages/MasterModule/AgencyMaster/AgencyMaster.tsx

@@ -1,4 +1,4 @@
-import { Box, HStack, Input, Text } from "@chakra-ui/react";
+import { Box, HStack, Image, Input, Text } from "@chakra-ui/react";
 import MainFrame from "../../../components/MainFrame"
 import { InputGroup } from "../../../components/ui/input-group";
 import { LuSearch } from "react-icons/lu";
@@ -62,8 +62,8 @@ const AgencyMaster = () => {
           Agency Master
           </Text>
 
-          <HStack >
-            <InputGroup 
+          <HStack mr={5}>
+            <InputGroup marginRight={"1rem"}
               startElement={
                 <LuSearch fontSize={"xs"} style={{ position: 'relative', left: '10px' }} />
               }
@@ -76,8 +76,8 @@ const AgencyMaster = () => {
                 colorPalette={"blue"}
                 _focus={{ border: "1px solid #02A0A0" }}
                 rounded={"md"}
-                size={"xs"}
-                fontSize={"sm"}
+                size={"2xs"}
+                fontSize={"2sm"}
                 placeholder="Search..."
                 bgColor={'#EEEEEE'}
                 ps={8}

src/Pages/MasterModule/AgencyMaster/EditAgencyMaster.tsx

@@ -1,152 +1,75 @@
-import { Button } from "../../../components/ui/button";
-import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "../../../components/ui/dialog";
-import { Field, Icon, Input, Stack } from "@chakra-ui/react";
-import Edit from "../../../components/ActionIcons/Edit";
+import { FaRegEdit } from "react-icons/fa"
+import { Button } from "../../../components/ui/button"
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
+import { Field, Input, Stack, } from "@chakra-ui/react"
+
 
 function EditAgencyMaster() {
-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-        <Edit />
-      </DialogTrigger>
+    return (
 
-      <DialogContent
-        bg={"#fff"}
-        // w={{ lg: "60%", md: "230px" }}
-        w={{ base: "90%", md: "400px" }}
-        height={"80vh"}
-        overflow={"scroll"}
-        overflowX="hidden"
-        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">
-                Agency name
-              </Field.Label>
-              <Input
-                value="Lorem Ipsum"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
+        <DialogRoot placement="center">
+            <DialogTrigger asChild>
+                <Button bg={"transparent"} size="sm">
+                    <FaRegEdit style={{ cursor: "pointer", fontSize: "14px" }}  color="#000"/>
+                </Button>
+            </DialogTrigger>
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                RC No.
-              </Field.Label>
-              <Input
-                value="Lorem Ipsum"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
+            <DialogContent
+                bg={"#fff"}
+                // w={{ lg: "60%", md: "230px" }}
+                w={{ base: '90%', md: '400px' }}
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                State
-              </Field.Label>
-              <Input
-                value="Lorem Ipsum"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
+                height={'80vh'}
+                overflow={'scroll'}
+                overflowX="hidden" 
+                p={3} // Reduced padding
+                bgSize={'md'}
+            >
+                <DialogHeader bg="white">
+                    <DialogTitle alignSelf="center" color="black" fontSize="14px">Edit</DialogTitle>
+                </DialogHeader>
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Registered Office Address
-              </Field.Label>
-              <Input
-                value="Active"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
+                <DialogBody bg="white">
+                    <Stack py={3}>
+                    <Field.Root>
+                            <Field.Label color="black" pt={1} fontSize="12px">Agency name</Field.Label>
+                            <Input value="Lorem Ipsum" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Website/Domain
-              </Field.Label>
-              <Input
-                value="Lorem Ipsum"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
+                            <Field.Label color="black" pt={1} fontSize="12px">RC No.</Field.Label>
+                            <Input value="Lorem Ipsum" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                GST no.
-              </Field.Label>
-              <Input
-                value="Lorem Ipsum"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
+                            <Field.Label color="black" pt={1} fontSize="12px">State</Field.Label>
+                            <Input value="Lorem Ipsum" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Action
-              </Field.Label>
-              <Input
-                value="Lorem Ipsum"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-          </Stack>
-        </DialogBody>
-        <DialogFooter display="flex" justifyContent="center" pt={"2"}>
-          <Button
-            w="100%"
-            bg="#02A0A0"
-            color={"#fff"}
-            fontSize="12px"
-            height="30px"
-          >
-            Save
-          </Button>
-        </DialogFooter>
+                            <Field.Label color="black" pt={1} fontSize="12px">Registered Office Address</Field.Label>
+                            <Input value="Active" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                            
+                            <Field.Label color="black" pt={1} fontSize="12px">Website/Domain</Field.Label>
+                            <Input value="Lorem Ipsum" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
 
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+                            <Field.Label color="black" pt={1} fontSize="12px">GST no.</Field.Label>
+                            <Input value="Lorem Ipsum" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                            
+                            <Field.Label color="black" pt={1} fontSize="12px">Action</Field.Label>
+                            <Input value="Lorem Ipsum" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+
+
+                        </Field.Root>
+                    </Stack>
+                </DialogBody>
+                <DialogFooter display="flex" justifyContent="center" pt={"2"}>
+                    <Button w="100%" bg="#02A0A0" color={"#fff"} fontSize="12px" height="30px">
+                        Save
+                    </Button>
+                </DialogFooter>
+
+                <DialogCloseTrigger color="black" />
+            </DialogContent>
+        </DialogRoot>
+
+
+    )
 }
 
-export default EditAgencyMaster;
+export default EditAgencyMaster

src/Pages/MasterModule/AgencyMaster/ViewAgencyAddModel.tsx

@@ -1,5 +1,5 @@
 import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
-import { Field, Input, Stack, Text } from "@chakra-ui/react"
+import { Field, Input, Stack, Text, Textarea } from "@chakra-ui/react"
 import { IoMdAdd } from "react-icons/io"
 import { Button } from "../../../components/ui/button"
 

src/Pages/MasterModule/AgencyMaster/ViewAgencyMaster.tsx

@@ -1,153 +1,75 @@
-import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "../../../components/ui/dialog";
-import { Field, Icon, Input, Stack } from "@chakra-ui/react";
-import { MdOutlineRemoveRedEye } from "react-icons/md";
-import { Button } from "../../../components/ui/button";
-import View from "../../../components/ActionIcons/View";
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
+import { Field, Input, Stack, } from "@chakra-ui/react"
+import { MdOutlineRemoveRedEye } from "react-icons/md"
+import { Button } from "../../../components/ui/button"
+
 
 function ViewAgencyMaster() {
-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-        <View />
-      </DialogTrigger>
+    return (
 
-      <DialogContent
-        bg={"#fff"}
-        // w={{ lg: "60%", md: "230px" }}
-        w={{ base: "90%", md: "400px" }}
-        height={"80vh"}
-        overflow={"scroll"}
-        overflowX="hidden"
-        p={3} // Reduced padding
-        bgSize={"md"}
-      >
-        <DialogHeader bg="white">
-          <DialogTitle alignSelf="center" color="black" fontSize="14px">
-            Add
-          </DialogTitle>
-        </DialogHeader>
 
-        <DialogBody bg="white">
-          <Stack py={3}>
-            <Field.Root>
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Agency name
-              </Field.Label>
-              <Input
-                value="Lorem Ipsum"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
+        <DialogRoot placement="center">
+            <DialogTrigger asChild>
+                <Button bg={"transparent"} size="sm">
+                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "14px" }}  color="#000"/>
+                </Button>
+            </DialogTrigger>
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                RC No.
-              </Field.Label>
-              <Input
-                value="Lorem Ipsum"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
+            <DialogContent
+                bg={"#fff"}
+                // w={{ lg: "60%", md: "230px" }}
+                w={{ base: '90%', md: '400px' }}
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                State
-              </Field.Label>
-              <Input
-                value="Lorem Ipsum"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
+                height={'80vh'}
+                overflow={'scroll'}
+                overflowX="hidden" 
+                p={3} // Reduced padding
+                bgSize={'md'}
+            >
+                <DialogHeader bg="white">
+                    <DialogTitle alignSelf="center" color="black" fontSize="14px">Add</DialogTitle>
+                </DialogHeader>
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Registered Office Address
-              </Field.Label>
-              <Input
-                value="Active"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
+                <DialogBody bg="white">
+                    <Stack py={3}>
+                    <Field.Root>
+                            <Field.Label color="black" pt={1} fontSize="12px">Agency name</Field.Label>
+                            <Input value="Lorem Ipsum" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Website/Domain
-              </Field.Label>
-              <Input
-                value="Lorem Ipsum"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
+                            <Field.Label color="black" pt={1} fontSize="12px">RC No.</Field.Label>
+                            <Input value="Lorem Ipsum" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                GST no.
-              </Field.Label>
-              <Input
-                value="Lorem Ipsum"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
+                            <Field.Label color="black" pt={1} fontSize="12px">State</Field.Label>
+                            <Input value="Lorem Ipsum" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Action
-              </Field.Label>
-              <Input
-                value="Lorem Ipsum"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-          </Stack>
-        </DialogBody>
-        <DialogFooter display="flex" justifyContent="center" pt={"2"}>
-          <Button
-            w="100%"
-            bg="#02A0A0"
-            color={"#fff"}
-            fontSize="12px"
-            height="30px"
-          >
-            Save
-          </Button>
-        </DialogFooter>
+                            <Field.Label color="black" pt={1} fontSize="12px">Registered Office Address</Field.Label>
+                            <Input value="Active" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                            
+                            <Field.Label color="black" pt={1} fontSize="12px">Website/Domain</Field.Label>
+                            <Input value="Lorem Ipsum" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
 
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+                            <Field.Label color="black" pt={1} fontSize="12px">GST no.</Field.Label>
+                            <Input value="Lorem Ipsum" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                            
+                            <Field.Label color="black" pt={1} fontSize="12px">Action</Field.Label>
+                            <Input value="Lorem Ipsum" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+
+
+                        </Field.Root>
+                    </Stack>
+                </DialogBody>
+                <DialogFooter display="flex" justifyContent="center" pt={"2"}>
+                    <Button w="100%" bg="#02A0A0" color={"#fff"} fontSize="12px" height="30px">
+                        Save
+                    </Button>
+                </DialogFooter>
+
+                <DialogCloseTrigger color="black" />
+            </DialogContent>
+        </DialogRoot>
+
+
+    )
 }
 
-export default ViewAgencyMaster;
+export default ViewAgencyMaster

src/Pages/MasterModule/Country/Country.tsx

@@ -1,4 +1,4 @@
-import { Box, HStack, Input, Text } from "@chakra-ui/react";
+import { Box, HStack, Image, Input, Text } from "@chakra-ui/react";
 import MainFrame from "../../../components/MainFrame"
 import { InputGroup } from "../../../components/ui/input-group";
 import { LuSearch } from "react-icons/lu";
@@ -49,8 +49,8 @@ const Country = () => {
           Country
           </Text>
 
-          <HStack >
-            <InputGroup 
+          <HStack mr={5}>
+            <InputGroup marginRight={"1rem"}
               startElement={
                 <LuSearch fontSize={"xs"} style={{ position: 'relative', left: '10px' }} />
               }
@@ -63,8 +63,8 @@ const Country = () => {
                 colorPalette={"blue"}
                 _focus={{ border: "1px solid #02A0A0" }}
                 rounded={"md"}
-                size={"xs"}
-                fontSize={"sm"}
+                size={"2xs"}
+                fontSize={"2sm"}
                 placeholder="Search..."
                 bgColor={'#EEEEEE'}
                 ps={8}

src/Pages/MasterModule/Country/EditCountryModel.tsx

@@ -1,67 +1,61 @@
-import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "../../../components/ui/dialog";
-import { Field, Input, Stack } from "@chakra-ui/react";
-import { Button } from "../../../components/ui/button";
-import Edit from "../../../components/ActionIcons/Edit";
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
+import { Box, Field, IconButton, Input, Stack, Text, Textarea } from "@chakra-ui/react"
+import { Button } from "../../../components/ui/button"
+import { FaRegEdit } from "react-icons/fa";
+
 
 function EditCountryModel() {
-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-        <Edit />
-      </DialogTrigger>
 
-      <DialogContent
-        bg={"#fff"}
-        // w={{ lg: "60%", md: "230px" }}
-        w={{ base: "90%", md: "400px" }}
-        height={"auto"}
-        overflowX="hidden"
-        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">
-                Country
-              </Field.Label>
-              <Input
-                value="Lorem Ipsum"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-          </Stack>
-        </DialogBody>
-        <DialogFooter display="flex" justifyContent="center" pt={"2"}>
-          <Button w="100%" bg="#02A0A0" color={"#fff"}>
-            Save
-          </Button>
-        </DialogFooter>
+   
+    return (
 
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+        <DialogRoot placement="center">
+            <DialogTrigger asChild>
+                {/* <Button bg={"transparent"} size="sm">
+                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} />
+                </Button> */}
+                <Button bg={"transparent"} size="sm">
+                 <FaRegEdit style={{ cursor: "pointer", fontSize: "14px" }}  color="#000"/>
+                </Button>
+
+            </DialogTrigger>
+
+            <DialogContent
+                 bg={"#fff"}
+                 // w={{ lg: "60%", md: "230px" }}
+                 w={{ base: '90%', md: '400px' }}
+                height={'auto'}
+                 
+                 overflowX="hidden" 
+                 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">Country</Field.Label>
+                            <Input value="Lorem Ipsum" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </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 EditCountryModel;
+export default EditCountryModel

src/Pages/MasterModule/JobStatus/EditJobStatusModel.tsx

@@ -2,7 +2,6 @@ import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHead
 import { Box, Field, IconButton, Input, Stack, Text, Textarea } from "@chakra-ui/react"
 import { Button } from "../../../components/ui/button"
 import { FaRegEdit } from "react-icons/fa";
-import Edit from "../../../components/ActionIcons/Edit";
 
 
 function EditJobStatusModel() {
@@ -13,7 +12,13 @@ function EditJobStatusModel() {
 
         <DialogRoot placement="center">
             <DialogTrigger asChild>
-               <Edit />
+                {/* <Button bg={"transparent"} size="sm">
+                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} />
+                </Button> */}
+                <Button bg={"transparent"} size="sm">
+                 <FaRegEdit style={{ cursor: "pointer", fontSize: "14px" }}  color="#000"/>
+                </Button>
+
             </DialogTrigger>
 
             <DialogContent

src/Pages/MasterModule/JobStatus/JobStatus.tsx

@@ -49,8 +49,8 @@ const JobStatus = () => {
           Job Status
           </Text>
 
-          <HStack >
-            <InputGroup 
+          <HStack mr={5}>
+            <InputGroup marginRight={"1rem"}
               startElement={
                 <LuSearch fontSize={"xs"} style={{ position: 'relative', left: '10px' }} />
               }
@@ -63,8 +63,8 @@ const JobStatus = () => {
                 colorPalette={"blue"}
                 _focus={{ border: "1px solid #02A0A0" }}
                 rounded={"md"}
-                size={"xs"}
-                fontSize={"sm"}
+                size={"2xs"}
+                fontSize={"2sm"}
                 placeholder="Search..."
                 bgColor={'#EEEEEE'}
                 ps={8}

src/Pages/MasterModule/JobType/EditJobModel.tsx

@@ -1,67 +1,62 @@
-import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "../../../components/ui/dialog";
-import { Field, Input, Stack } from "@chakra-ui/react";
-import { Button } from "../../../components/ui/button";
-import Edit from "../../../components/ActionIcons/Edit";
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
+import { Box, Field, IconButton, Input, Stack, Text, Textarea } from "@chakra-ui/react"
+import { Button } from "../../../components/ui/button"
+import { FiUpload } from "react-icons/fi";
+import { FaRegEdit } from "react-icons/fa";
+
 
 function EditJobeModel() {
-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-        <Edit />
-      </DialogTrigger>
 
-      <DialogContent
-        bg={"#fff"}
-        // w={{ lg: "60%", md: "230px" }}
-        w={{ base: "90%", md: "400px" }}
-        height={"auto"}
-        overflowX="hidden"
-        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">
-                Job Type
-              </Field.Label>
-              <Input
-                value="Lorem Ipsum"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-          </Stack>
-        </DialogBody>
-        <DialogFooter display="flex" justifyContent="center" pt={"2"}>
-          <Button w="100%" bg="#02A0A0" color={"#fff"}>
-            Save
-          </Button>
-        </DialogFooter>
+   
+    return (
 
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+        <DialogRoot placement="center">
+            <DialogTrigger asChild>
+                {/* <Button bg={"transparent"} size="sm">
+                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} />
+                </Button> */}
+                <Button bg={"transparent"} size="sm">
+                 <FaRegEdit style={{ cursor: "pointer", fontSize: "14px" }}  color="#000"/>
+                </Button>
+
+            </DialogTrigger>
+
+            <DialogContent
+                 bg={"#fff"}
+                 // w={{ lg: "60%", md: "230px" }}
+                 w={{ base: '90%', md: '400px' }}
+                height={'auto'}
+                 
+                 overflowX="hidden" 
+                 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">Job Type</Field.Label>
+                            <Input value="Lorem Ipsum" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </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 EditJobeModel;
+export default EditJobeModel

src/Pages/MasterModule/JobType/JobType.tsx

@@ -49,8 +49,8 @@ const JobType = () => {
           Job Type
           </Text>
 
-          <HStack >
-            <InputGroup 
+          <HStack mr={5}>
+            <InputGroup marginRight={"1rem"}
               startElement={
                 <LuSearch fontSize={"xs"} style={{ position: 'relative', left: '10px' }} />
               }
@@ -63,8 +63,8 @@ const JobType = () => {
                 colorPalette={"blue"}
                 _focus={{ border: "1px solid #02A0A0" }}
                 rounded={"md"}
-                size={"xs"}
-                fontSize={"sm"}
+                size={"2xs"}
+                fontSize={"2sm"}
                 placeholder="Search..."
                 bgColor={'#EEEEEE'}
                 ps={8}

src/Pages/MasterModule/TemplateMaster/EditTemplateModel.tsx

@@ -1,143 +1,100 @@
-import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "../../../components/ui/dialog";
-import {
-  Box,
-  Field,
-  IconButton,
-  Input,
-  Stack,
-  Text,
-  Textarea,
-} from "@chakra-ui/react";
-import { Button } from "../../../components/ui/button";
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
+import { Box, Field, IconButton, Input, Stack, Text, Textarea } from "@chakra-ui/react"
+import { Button } from "../../../components/ui/button"
 import { FiUpload } from "react-icons/fi";
 import { useState } from "react";
 import { FaRegEdit } from "react-icons/fa";
-import Edit from "../../../components/ActionIcons/Edit";
+
 
 function EditTemplateModel() {
-  const [images, setImages] = useState<string[]>([]);
 
-  const handleImageChange = (event: React.ChangeEvent<HTMLInputElement>) => {
-    if (event.target.files) {
-      const selectedFiles = Array.from(event.target.files);
+    const [images, setImages] = useState<string[]>([]);
 
-      const newImages = selectedFiles.map((file) => {
-        return URL.createObjectURL(file); // Convert to preview URL
-      });
+    const handleImageChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+      if (event.target.files) {
+        const selectedFiles = Array.from(event.target.files);
+  
+        const newImages = selectedFiles.map((file) => {
+          return URL.createObjectURL(file); // Convert to preview URL
+        });
+  
+        setImages((prevImages) => [...prevImages, ...newImages]); // Append new images
+      }
+    };
 
-      setImages((prevImages) => [...prevImages, ...newImages]); // Append new images
-    }
-  };
+   
+    return (
 
-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-        <Edit />
-      </DialogTrigger>
+        <DialogRoot placement="center">
+            <DialogTrigger asChild>
+                {/* <Button bg={"transparent"} size="sm">
+                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} />
+                </Button> */}
+                <Button bg={"transparent"} size="sm">
+                 <FaRegEdit style={{ cursor: "pointer", fontSize: "14px" }}  color="#000"/>
+                </Button>
 
-      <DialogContent
-        bg={"#fff"}
-        // w={{ lg: "60%", md: "230px" }}
-        w={{ base: "90%", md: "400px" }}
-        height={"auto"}
-        overflowX="hidden"
-        p={3} // Reduced padding
-        bgSize={"md"}
-      >
-        <DialogHeader bg="white">
-          <DialogTitle alignSelf="center" color="black" fontSize="14px">
-            Add
-          </DialogTitle>
-        </DialogHeader>
+            </DialogTrigger>
 
-        <DialogBody bg="white">
-          <Stack py={3}>
-            <Field.Root>
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Template Name
-              </Field.Label>
-              <Input
-                placeholder=""
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
+            <DialogContent
+                 bg={"#fff"}
+                 // w={{ lg: "60%", md: "230px" }}
+                 w={{ base: '90%', md: '400px' }}
+                height={'auto'}
+                 
+                 overflowX="hidden" 
+                 p={3} // Reduced padding
+                 bgSize={'md'}
+            >
+                <DialogHeader bg="white" >
+                    <DialogTitle alignSelf="center" color="black" fontSize="14px">Add</DialogTitle>
+                </DialogHeader>
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Images
-              </Field.Label>
-              <Box
-                display="flex"
-                alignItems="center"
-                justifyContent="space-between"
-                px={3}
-                bgColor="#EEEEEE"
-                border="none"
-                width="100%"
-                height="50px"
-                cursor="pointer"
-                position="relative"
-              >
-                <Input
-                  type="file"
-                  accept="image/*"
-                  opacity={0}
-                  position="absolute"
-                  bgColor="#EEEEEE"
-                  border="none"
-                  pl={1}
-                  width="100%"
-                  height="100%"
-                  cursor="pointer"
-                  onChange={handleImageChange}
-                />
-                <Box display="flex" gap={2} overflow="hidden">
-                  {images.length > 0 ? (
-                    images.map((img, index) => (
-                      <img
-                        key={index}
-                        src={img}
-                        alt={`Uploaded ${index}`}
-                        style={{
-                          maxHeight: "40px",
-                          maxWidth: "70px",
-                          objectFit: "contain",
-                        }}
-                      />
-                    ))
-                  ) : (
-                    <Box width="70px" height="40px" /> // Placeholder to maintain layout
-                  )}
-                </Box>
-                <FiUpload color="#000" />
-              </Box>
+                <DialogBody bg="white">
+                    <Stack py={3}>
 
-              {/* <Input placeholder="" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" /> */}
-            </Field.Root>
-          </Stack>
-        </DialogBody>
-        <DialogFooter display="flex" justifyContent="center" pt={"2"}>
-          <Button w="100%" bg="#02A0A0" color={"#fff"}>
-            Save
-          </Button>
-        </DialogFooter>
+                        <Field.Root>
+                            <Field.Label color="black" pt={1} fontSize="12px">Template Name</Field.Label>
+                            <Input placeholder="" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
 
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+                            
+                            <Field.Label color="black" pt={1} fontSize="12px">Images</Field.Label>
+                            <Box display="flex" alignItems="center" justifyContent="space-between" px={3} bgColor="#EEEEEE" border="none" width="100%"  height="50px" cursor="pointer"  position="relative">
+                            <Input type="file" accept="image/*" opacity={0} position="absolute" bgColor="#EEEEEE" border="none" pl={1} width="100%" height="100%"  cursor="pointer" onChange={handleImageChange}/>
+                            <Box display="flex" gap={2} overflow="hidden">
+                                {images.length > 0 ? (
+                                images.map((img, index) => (
+                                    <img
+                                    key={index}
+                                    src={img}
+                                    alt={`Uploaded ${index}`}
+                                    style={{ maxHeight: "40px", maxWidth: "70px", objectFit: "contain" }}
+                                    />
+                                ))
+                                ) : (
+                                <Box width="70px" height="40px" /> // Placeholder to maintain layout
+                                )}
+                            </Box>
+                              <FiUpload color="#000" />
+                            </Box>
+                           
+                            {/* <Input placeholder="" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" /> */}
+
+                        </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 EditTemplateModel;
+export default EditTemplateModel

src/Pages/MasterModule/TemplateMaster/TemplateMaster.tsx

@@ -28,8 +28,8 @@ const managepost: any[] = [
     "Images": (
       // <Image w={50} src={img} />
       <HStack >
-      <Image rounded={'lg'} w={100} h={50} src={img} />
-      <Image rounded={'lg'} w={100} h={50} src={Templateimg} />
+      <Image w={100} h={50} src={img} />
+      <Image w={100} h={50} src={Templateimg} />
       </HStack>
 
 
@@ -62,8 +62,8 @@ const TemplateMaster = () => {
           Template Master
           </Text>
 
-          <HStack >
-            <InputGroup 
+          <HStack mr={5}>
+            <InputGroup marginRight={"1rem"}
               startElement={
                 <LuSearch fontSize={"xs"} style={{ position: 'relative', left: '10px' }} />
               }
@@ -76,8 +76,8 @@ const TemplateMaster = () => {
                 colorPalette={"blue"}
                 _focus={{ border: "1px solid #02A0A0" }}
                 rounded={"md"}
-                size={"xs"}
-                fontSize={"sm"}
+                size={"2xs"}
+                fontSize={"2sm"}
                 placeholder="Search..."
                 bgColor={'#EEEEEE'}
                 ps={8}

src/Pages/MasterModule/WorkspaceMode/EditWorkModel.tsx

@@ -1,76 +1,61 @@
-import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "../../../components/ui/dialog";
-import {
-  Box,
-  Field,
-  IconButton,
-  Input,
-  Stack,
-  Text,
-  Textarea,
-} from "@chakra-ui/react";
-import { Button } from "../../../components/ui/button";
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
+import { Box, Field, IconButton, Input, Stack, Text, Textarea } from "@chakra-ui/react"
+import { Button } from "../../../components/ui/button"
 import { FaRegEdit } from "react-icons/fa";
-import Edit from "../../../components/ActionIcons/Edit";
+
 
 function EditWorkModel() {
-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-        <Edit />
-      </DialogTrigger>
 
-      <DialogContent
-        bg={"#fff"}
-        // w={{ lg: "60%", md: "230px" }}
-        w={{ base: "90%", md: "400px" }}
-        height={"auto"}
-        overflowX="hidden"
-        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">
-                Workspace Mode
-              </Field.Label>
-              <Input
-                value="Lorem Ipsum"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-            </Field.Root>
-          </Stack>
-        </DialogBody>
-        <DialogFooter display="flex" justifyContent="center" pt={"2"}>
-          <Button w="100%" bg="#02A0A0" color={"#fff"}>
-            Save
-          </Button>
-        </DialogFooter>
+   
+    return (
 
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+        <DialogRoot placement="center">
+            <DialogTrigger asChild>
+                {/* <Button bg={"transparent"} size="sm">
+                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} />
+                </Button> */}
+                <Button bg={"transparent"} size="sm">
+                 <FaRegEdit style={{ cursor: "pointer", fontSize: "14px" }}  color="#000"/>
+                </Button>
+
+            </DialogTrigger>
+
+            <DialogContent
+                 bg={"#fff"}
+                 // w={{ lg: "60%", md: "230px" }}
+                 w={{ base: '90%', md: '400px' }}
+                height={'auto'}
+                 
+                 overflowX="hidden" 
+                 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">Workspace Mode</Field.Label>
+                            <Input value="Lorem Ipsum" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                        </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 EditWorkModel;
+export default EditWorkModel

src/Pages/MasterModule/WorkspaceMode/WorkspaceMode.tsx

@@ -49,8 +49,8 @@ const WorkspaceMode = () => {
           Workspace Mode
           </Text>
 
-          <HStack >
-            <InputGroup 
+          <HStack mr={5}>
+            <InputGroup marginRight={"1rem"}
               startElement={
                 <LuSearch fontSize={"xs"} style={{ position: 'relative', left: '10px' }} />
               }
@@ -63,8 +63,8 @@ const WorkspaceMode = () => {
                 colorPalette={"blue"}
                 _focus={{ border: "1px solid #02A0A0" }}
                 rounded={"md"}
-                size={"xs"}
-                fontSize={"sm"}
+                size={"2xs"}
+                fontSize={"2sm"}
                 placeholder="Search..."
                 bgColor={'#EEEEEE'}
                 ps={8}

src/Pages/OnBoarding/CreatePass.tsx

@@ -0,0 +1,149 @@
+import { Center, HStack, Image, Input, Text, VStack } from "@chakra-ui/react";
+import { useContext, useState } from "react";
+import { useForm } from "react-hook-form";
+import GlobalStateContext from "../../Contexts/GlobalStateContext";
+import logo from "../../assets/logo.svg";
+import { Button } from "../../components/ui/button";
+import { Field } from "../../components/ui/field";
+import { Toaster, toaster } from "../../components/ui/toaster";
+
+interface FormValues {
+  password: string;
+  confirmPassword: string;
+}
+
+const CreatePass = () => {
+  const [isLoading, setIsLoading] = useState<boolean>(false);
+  const context = useContext(GlobalStateContext);
+  if (!context) {
+    throw new Error("App must be used within a GlobalStateProvider");
+  }
+  const { setIsAuthenticate } = context;
+  const {
+    register,
+    handleSubmit,
+    formState: { errors },
+  } = useForm<FormValues>();
+
+  const onSubmit = handleSubmit((data) => {
+    setIsLoading(true);
+    if (data?.password === "password123") { 
+      setTimeout(() => {
+        setIsAuthenticate(true);
+        setIsLoading(false);
+      }, 3000); 
+    } else {
+      toaster.create({
+        title: `Invalid Credentials`,
+        type: "error",
+      });
+      setIsLoading(false);
+    }
+  });
+
+  return (
+    <VStack w={"100%"} h={"100vh"} bg={"#ffffff"}>
+      <HStack
+        boxShadow={"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"}
+        w={"100%"}
+        ps={8}
+        h={"7%"}
+        justifyContent={"flex-start"}
+      >
+        <Image w={50} src={logo} />
+      </HStack>
+
+      <HStack w={"100%"} h={"93%"} p={8} gap={8}>
+        <Center
+          display={{ base: "none", md: "flex" }}
+          bg={"#02A0A033"}
+          w={"50%"}
+          h={"100%"}
+          rounded={"3xl"}
+        >
+          <Image w={250} src={logo} />
+        </Center>
+
+        <Center
+          as={"form"}
+          onSubmit={onSubmit}
+          p={{ base: 4, md: 16 }}
+          w={{ base: "100%", md: "50%" }}
+          h={"100%"}
+        >
+          <VStack gap={2} w={"100%"} alignItems={"flex-start"}>
+            <Text
+              w={"100%"}
+              textAlign={"center"}
+              fontSize={"24px"}
+              fontWeight={"normal"}
+              color={"#313039"}
+              textTransform={"uppercase"}
+            >
+              create a password
+            </Text>
+
+            <VStack mt={6} gap={4} w={"full"}>
+              <Field
+                color={"#313039"}
+                label={"Enter password"}
+                w={"100%"}
+                invalid={!!errors.password}
+                errorText={errors.password?.message}
+              >
+                <Input
+                  ps={3}
+                  type="password"
+                  {...register("password", {
+                    required: "Password is required",
+                    minLength: {
+                      value: 6,
+                      message: "Password must be at least 6 characters long",
+                    },
+                  })}
+                  placeholder="Enter your password"
+                />
+              </Field>
+              <Field
+                color={"#313039"}
+                label={"Confirm password"}
+                w={"100%"}
+                invalid={!!errors.confirmPassword}
+                errorText={errors.confirmPassword?.message}
+              >
+                <Input
+                  ps={3}
+                  type="password"
+                  {...register("confirmPassword", {
+                    required: "Please confirm your password",
+                    validate: (value) => 
+                      value === getValues("password") || "Passwords do not match",
+                  })}
+                  placeholder="Confirm your password"
+                />
+              </Field>
+              <Button
+                loading={isLoading}
+                mt={4}
+                size={"sm"}
+                bg={"#02A0A0"}
+                rounded={"md"}
+                w={"100%"}
+                color={"#ffffff"}
+                type="submit"
+                textTransform="capitalize"
+              >
+                Confirm Password
+              </Button>
+
+              <Text>Forgot password</Text>
+            </VStack>
+          </VStack>
+        </Center>
+        <Toaster />
+      </HStack>
+    </VStack>
+  );
+};
+
+export default CreatePass;

src/Pages/OnBoarding/LoginOtp.tsx

@@ -0,0 +1,142 @@
+import { Center, HStack, Image, Input, Text, VStack } from "@chakra-ui/react";
+import { useContext, useState } from "react";
+import { useForm } from "react-hook-form";
+import GlobalStateContext from "../../Contexts/GlobalStateContext";
+import logo from "../../assets/logo.svg";
+import uiEdit from "../../assets/icons/edit.png";
+import { Button } from "../../components/ui/button";
+import { Field } from "../../components/ui/field";
+import { Toaster, toaster } from "../../components/ui/toaster";
+import { PinInput } from "../../components/ui/pin-input";
+
+interface FormValues {
+  mobileNumber: number;
+}
+
+const LoginOtp = () => {
+  const [isLoading, setIsLoading] = useState<boolean>(false);
+  const context = useContext(GlobalStateContext);
+  if (!context) {
+    throw new Error("App must be used within a GlobalStateProvider");
+  }
+  const { setIsAuthenticate } = context;
+  const {
+    register,
+    handleSubmit,
+    formState: { errors },
+  } = useForm<FormValues>();
+
+  const onSubmit = handleSubmit((data) => {
+    setIsLoading(true);
+    if (data?.mobileNumber === 1234567890) {
+      setTimeout(() => {
+        setIsAuthenticate(true);
+        setIsLoading(false);
+      }, 3000); // 3-second delay
+    } else {
+      toaster.create({
+        title: `Invalid Credentials`,
+        type: "error",
+      });
+      setIsLoading(false);
+    }
+  });
+
+  return (
+    <VStack w={"100%"} h={"100vh"} bg={"#ffffff"}>
+      <HStack
+        boxShadow={"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"}
+        w={"100%"}
+        ps={8}
+        h={"7%"}
+        justifyContent={"flex-start"}
+      >
+        <Image w={50} src={logo} />
+      </HStack>
+
+      <HStack w={"100%"} h={"93%"} p={8} gap={8}>
+        <Center
+          display={{ base: "none", md: "flex" }}
+          bg={"#02A0A033"}
+          w={"50%"}
+          h={"100%"}
+          rounded={"3xl"}
+        >
+          <Image w={250} src={logo} />
+        </Center>
+
+        <Center
+          as={"form"}
+          onSubmit={onSubmit}
+          p={{ base: 4, md: 16 }}
+          w={{ base: "100%", md: "50%" }}
+          h={"100%"}
+        >
+          <VStack gap={2} w={"100%"} alignItems={"center"}>
+            <Text
+              w={"100%"}
+              textAlign={"center"}
+              fontSize={"24px"}
+              fontWeight={"normal"}
+              color={"#313039"}
+            >
+              Enter otp
+            </Text>
+            <Text
+              w={"100%"}
+              textAlign={"center"}
+              fontSize={"sm"}
+              fontWeight={"normal"}
+              color={"#49475A"}
+            >
+              OTP has been send to your E-mail Address
+            </Text>
+            <HStack>
+              <Image src={uiEdit} h="24px" w="24px" />
+              <Text
+                w={"100%"}
+                textAlign={"center"}
+                fontSize={"sm"}
+                fontWeight={"normal"}
+                color={"#49475A"}
+              >
+                9619565889
+              </Text>
+            </HStack>
+
+            <VStack mt={6} gap={4} w={"full"}>
+              <PinInput />
+              <Text
+                w={"100%"}
+                textAlign={"center"}
+                fontSize={"sm"}
+                fontWeight={"600"}
+                color={"#4746F4"}
+                textDecoration="underline"
+              >
+                Resend OTP
+              </Text>
+              <Button
+                loading={isLoading}
+                mt={4}
+                size={"sm"}
+                bg={"#02A0A0"}
+                rounded={"md"}
+                w={"100%"}
+                color={"#ffffff"}
+                type="submit"
+              >
+                Send OTP
+              </Button>
+
+              <Text>Forgot password</Text>
+            </VStack>
+          </VStack>
+        </Center>
+        <Toaster />
+      </HStack>
+    </VStack>
+  );
+};
+
+export default LoginOtp;

src/Pages/Profile/ChangePassword.tsx

@@ -1,22 +1,28 @@
 
-import { Field, Input, Stack } from "@chakra-ui/react";
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
+import { Field, Grid, Heading, Input, Stack, Text } from "@chakra-ui/react"
+import { FaRegEdit } from "react-icons/fa";
 import { Button } from "../../components/ui/button";
-import { DialogBody, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog";
 import EnterPassword from "./EnterPassword";
 function Changepassword() {
     return (
 
         <DialogRoot placement="center">
             <DialogTrigger asChild>
-                <Button bg="#02A0A0" size={'2xs'} color={"#fff"} px={2}  >
+                <Button bg="#02A0A0" color={"#fff"} p={4} fontSize={"12px"} mt={2}>
                     Change Password
                 </Button>
+
             </DialogTrigger>
 
             <DialogContent
                 bg={"#fff"}
+                // w={{ lg: "60%", md: "230px" }}
                 w={{ base: '90%', md: '400px' }}
-                p={2} 
+
+                // height={'80vh'}
+                // overflow={'scroll'}
+                p={2} // Reduced padding
                 bgSize={'md'}
             >
                 <DialogHeader bg="white" pt={3} pb={2} >
@@ -27,17 +33,22 @@ function Changepassword() {
                     <Stack p={2} >
                         <Field.Root>
                             <Field.Label color="black" pt={1} fontSize="12px">New password</Field.Label>
-                            <Input color="black" pl={1} fontSize="12px"  type="password" border="1px solid grey" /></Field.Root>
+                            <Input color="black" pl={1} fontSize="12px" height="30px" type="password" border="1px solid grey" /></Field.Root>
                         <Field.Root>
                             <Field.Label color="black" pt={1} fontSize="12px">Confirm password</Field.Label>
-                            <Input color="black" pl={1} fontSize="12px"  type="password" border="1px solid grey" /></Field.Root>
+                            <Input color="black" pl={1} fontSize="12px" height="30px" type="password" border="1px solid grey" /></Field.Root>
 
                     </Stack>
                 </DialogBody>
                 <DialogFooter display="flex" justifyContent="center" mt={2} p={2}
                 >
+                    {/* <Button w="100%" bg="#02A0A0" color={"#fff"}>
+                        Save
+                    </Button> */}
                     <EnterPassword />
                 </DialogFooter>
+
+                {/* <DialogCloseTrigger color="black" /> */}
             </DialogContent>
         </DialogRoot >
 

src/Pages/Profile/Profile.tsx

@@ -1,69 +1,10 @@
-import { Avatar, Box, HStack, Text, VStack } from "@chakra-ui/react";
-import { FaCamera } from "react-icons/fa";
-import EditableInput from "../../components/EditableInput";
-import MainFrame from "../../components/MainFrame";
-import { Field } from "../../components/ui/field";
-import Changepassword from "./ChangePassword";
+import MainFrame from "../../components/MainFrame"
 
 const Profile = () => {
   return (
     <MainFrame >
-      <HStack  alignItems={'flex-start'} justifyContent={'center'} pt={0} h={'89vh'} w={'100%'} >
 
-        <VStack   w={'50%'} p={3} rounded={'lg'} mb={3}>
-
-<HStack shadow={'md'} rounded={'lg'} justifyContent={'space-between'} alignItems={'flex-end'}  w={'100%'} px={3}  py={3} >
-        <VStack  w={'100%'} alignItems={'flex-start'} gap={0}>
-        <Box mb={2} position="relative" width="fit-content"
-          cursor="pointer" onClick={() => alert("Avatar clicked!")}>
-          <Avatar.Root size={"2xl"} style={{ display: "inline-block", width: "auto" }}>
-            <Avatar.Fallback />
-            <Avatar.Image src="https://i.pinimg.com/736x/d6/cd/0f/d6cd0ffd4634b0763d3958a7325ce26e.jpg" />
-          </Avatar.Root>
-          <Box
-            position="absolute"
-            bottom="-2px"
-            left={"39px"}
-            p="2px"
-          >
-            <FaCamera  color="#ccc" size={16} />
-          </Box>
-        </Box>
-        <Text color={"black"} as={'span'} fontSize={'sm'} fontWeight={"bold"}>Ritesh Pandey</Text>
-        <Text color="black" as={'span'} fontSize={'xs'}>
-          Employee ID: <span>#1245679</span>
-        </Text>
-        </VStack>
-
-        
-        <Changepassword />
-        </HStack>
-
-        
-        <VStack  w={"100%"} >
-        <Field mt={4} label="First Name" fontSize="xs" required>
-              <EditableInput defaultValue="Ritesh" placeholder="Enter first name" />
-            </Field>
-
-            <Field mt={4} label="Last Name" fontSize="xs" required>
-              <EditableInput defaultValue="Pandey" placeholder="Enter last name" />
-            </Field>
-
-            <Field mt={4} label="Mobile Number" fontSize="xs" required>
-              <EditableInput defaultValue={"98234567892"} placeholder="Mobile Number" type='number' />
-            </Field>
-
-
-
-
-
-
-        </VStack>
-        </VStack>
-
-      </HStack>
-
-    </MainFrame >
+    </MainFrame>
   )
 }
 

src/Pages/SubAdmin/AddModel.tsx

@@ -12,7 +12,7 @@ function AddModel() {
                 {/* <Button bg={"transparent"} size="sm">
                     <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} />
                 </Button> */}
-                <Button rounded={'md'} px={4} py={2} size={"xs"} bg={"#02A0A0"}><IoMdAdd /> Add</Button>
+                <Button px={4} size={"xs"} bg={"#02A0A0"}><IoMdAdd /> <Text>Add</Text></Button>
 
             </DialogTrigger>
 
@@ -65,7 +65,7 @@ function AddModel() {
                     </Stack>
                 </DialogBody>
                 <DialogFooter display="flex" justifyContent="center" pt={"2"}>
-                    <Button size={'xs'} w="100%" bg="#02A0A0" color={"#fff"}>
+                    <Button w="100%" bg="#02A0A0" color={"#fff"}>
                         Save
                     </Button>
                 </DialogFooter>

src/Pages/SubAdmin/SubAdmin.tsx

@@ -8,7 +8,6 @@ import { RiDeleteBin5Line } from "react-icons/ri";
 import AddModel from "./AddModel"
 import EditSubAdmin from "../../components/EditSubAdmin"
 import ViewSubAdmin from "./ViewSubAdmin"
-import Delete from "../../components/ActionIcons/Delete"
 
 
 // table data
@@ -34,11 +33,16 @@ const managepost: any[] = [
     "Action": (
       <HStack justifyContent="center">
 
+        {/* <MdOutlineRemoveRedEye
+            style={{ cursor: "pointer", fontSize: "16px" }}
+          /> */}
+        {/* <ViewDailog /> */}
         <ViewSubAdmin />
         <EditSubAdmin />
 
+        {/* <RiDeleteBin5Line style={{ cursor: "pointer" }} /> */}
         <AlertDailog
-          AltertTiggerIcon={() => <Delete />} 
+          AltertTiggerIcon={RiDeleteBin5Line}
           alertText="Delete Users"
           alertIcon={<Image src={"DeleteIcon"} h={"39px"} />}
           alertCaption="are you sure you want to delete ?"
@@ -77,11 +81,11 @@ const SubAdmin = () => {
                 p={3}
                 w={300}
                 bg={"#fff"}
-                colorPalette={"cyan"}
+                colorPalette={"blue"}
                 _focus={{ border: "1px solid #02A0A0" }}
                 rounded={"md"}
-                size={"xs"}
-                fontSize={"sm"}
+                size={"2xs"}
+                fontSize={"2sm"}
                 placeholder="Search..."
                 bgColor={'#EEEEEE'}
                 ps={8}

src/Pages/SubAdmin/ViewSubAdmin.tsx

@@ -1,183 +1,82 @@
-import { Button } from "../../components/ui/button";
-import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "../../components/ui/dialog";
-import {
-  Field,
-  Grid,
-  Heading,
-  Icon,
-  Input,
-  Stack,
-  Text,
-} from "@chakra-ui/react";
-import { Checkbox } from "../../components/ui/checkbox";
+import { Button } from "../../components/ui/button"
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
+import { Field, Grid, Heading, Input, Stack, Text } from "@chakra-ui/react"
+import { Checkbox } from "../../components/ui/checkbox"
 import { MdOutlineRemoveRedEye } from "react-icons/md";
-import { FaRegEdit } from "react-icons/fa";
-import View from "../../components/ActionIcons/View";
 function ViewSubAdmin() {
-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-        <View />
-      </DialogTrigger>
+    return (
 
-      <DialogContent
-        bg={"#fff"}
-        // w={{ lg: "60%", md: "230px" }}
-        w={{ base: "90%", md: "400px" }}
-        height={"80vh"}
-        overflow={"scroll"}
-        overflowX="hidden"
-        p={3} // Reduced padding
-        bgSize={"md"}
-      >
-        <DialogHeader bg="white">
-          <DialogTitle alignSelf="center" color="black" fontSize="14px">
-            View Sub Admin Account
-          </DialogTitle>
-        </DialogHeader>
+        <DialogRoot placement="center" >
+            <DialogTrigger asChild>
+                <Button bg={"transparent"} size="sm">
+                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", }} color="#000"/>
+                </Button>
+                {/* <Button><FaRegEdit /></Button> */}
 
-        <DialogBody bg="white">
-          <Stack py={3}>
-            <Field.Root>
-              <Field.Label color="black" pt={1} fontSize="12px">
-                First Name
-              </Field.Label>
-              <Input
-                value="Priyanka"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-                readOnly
-              />
+            </DialogTrigger>
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Last Name
-              </Field.Label>
-              <Input
-                value="Joshi"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-                readOnly
-              />
+            <DialogContent
+                bg={"#fff"}
+                // w={{ lg: "60%", md: "230px" }}
+                w={{ base: '90%', md: '400px' }}
+                height={'80vh'}
+                overflow={'scroll'}
+                overflowX="hidden" 
+                p={3} // Reduced padding
+                bgSize={'md'}
+            >
+                <DialogHeader bg="white">
+                    <DialogTitle alignSelf="center" color="black" fontSize="14px">View Sub Admin Account</DialogTitle>
+                </DialogHeader>
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                ID
-              </Field.Label>
-              <Input
-                value="ID"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-                readOnly
-              />
+                <DialogBody bg="white">
+                    <Stack py={3} >
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                DOB
-              </Field.Label>
-              <Input
-                value="11/02/1989"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-                readOnly
-              />
+                        <Field.Root>
+                            <Field.Label color="black" pt={1} fontSize="12px">First Name</Field.Label>
+                            <Input value="Priyanka" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" readOnly />
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Gender
-              </Field.Label>
-              <Input
-                value="Male"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-                readOnly
-              />
-              <Heading mt={5} color={"#000"} fontSize={"sm"}>
-                Permissions
-              </Heading>
-            </Field.Root>
-            <Grid templateColumns="repeat(2, 1fr)" gap={4}>
-              <Checkbox size={"sm"} color={"black"}>
-                <Text fontSize={12}>Dashboard</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                {" "}
-                <Text fontSize={12}>Manage contact us</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                {" "}
-                <Text fontSize={12}>manage User</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                {" "}
-                <Text fontSize={12}>Manage CMS</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                {" "}
-                <Text fontSize={12}>Manage Post</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                {" "}
-                <Text fontSize={12}>Manage Reports</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                {" "}
-                <Text fontSize={12}>manage Sub-Admin</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                {" "}
-                <Text fontSize={12}>My profile</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                <Text fontSize={12}>Manage Jobs</Text>{" "}
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                <Text fontSize={12}> manage feedbacks</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                <Text fontSize={12}>Manage community</Text>{" "}
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                <Text fontSize={12}> Notification</Text>
-              </Checkbox>
-            </Grid>
-          </Stack>
-        </DialogBody>
-        <DialogFooter display="flex" justifyContent="center" pt={"2"}>
-          {/* <Button w="100%" bg="#02A0A0" color={"#fff"}>
+                            <Field.Label color="black" pt={1} fontSize="12px">Last Name</Field.Label>
+                            <Input value="Joshi" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" readOnly />
+
+                            <Field.Label color="black" pt={1} fontSize="12px">ID</Field.Label>
+                            <Input value="ID" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" readOnly />
+
+                            <Field.Label color="black" pt={1} fontSize="12px">DOB</Field.Label>
+                            <Input value="11/02/1989" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" readOnly />
+
+                            <Field.Label color="black" pt={1} fontSize="12px">Gender</Field.Label>
+                            <Input value="Male" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" readOnly
+                            />
+                            <Heading mt={5} color={'#000'} fontSize={'sm'}>Permissions</Heading>
+                        </Field.Root>
+                        <Grid templateColumns="repeat(2, 1fr)" gap={4}>
+                            <Checkbox size={'sm'} color={"black"} ><Text fontSize={12}>Dashboard</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"}> <Text fontSize={12}>Manage contact us</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"}> <Text fontSize={12}>manage User</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"}> <Text fontSize={12}>Manage CMS</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"}> <Text fontSize={12}>Manage Post</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"}> <Text fontSize={12}>Manage Reports</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"}> <Text fontSize={12}>manage Sub-Admin</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"}> <Text fontSize={12}>My profile</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"}><Text fontSize={12}>Manage Jobs</Text> </Checkbox>
+                            <Checkbox size={'sm'} color={"black"}><Text fontSize={12}> manage feedbacks</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"}><Text fontSize={12}>Manage community</Text> </Checkbox>
+                            <Checkbox size={'sm'} color={"black"}><Text fontSize={12}> Notification</Text></Checkbox>
+                        </Grid>
+                    </Stack>
+                </DialogBody>
+                <DialogFooter display="flex" justifyContent="center" pt={"2"} >
+                    <Button w="100%" bg="#02A0A0" color={"#fff"}>
                         Save
-                    </Button> */}
-        </DialogFooter>
+                    </Button>
+                </DialogFooter>
 
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+                <DialogCloseTrigger color="black" />
+            </DialogContent>
+        </DialogRoot >
+
+    )
 }
 
-export default ViewSubAdmin;
+export default ViewSubAdmin

src/Redux/Service/apiSlice.tsx

@@ -1,75 +0,0 @@
-import { createApi, fetchBaseQuery } from "@reduxjs/toolkit/query/react";
-import { BaseQueryFn, FetchArgs, FetchBaseQueryError } from "@reduxjs/toolkit/query";
-import { logout } from "./authSlice"; // Import logout action from authSlice
-import { RootState } from "../Store";
-
-const baseQuery = fetchBaseQuery({
-  baseUrl: `${import.meta.env.VITE_API_URL}`,
-  prepareHeaders: (headers, { getState }) => {
-
-    const token = (getState() as RootState).auth.token; // Get token from Redux store
-    // Encode Basic Auth Credentials
-    const username = import.meta.env.VITE_USER_NAME||''; // Replace with actual username
-    const password = import.meta.env.VITE_PASSWORD||''; // Replace with actual password
-    const basicAuth = `${username} : ${password}`; // Encode to Base64
-
-    if (token) {
-      headers.set("Authorization", `Basic ${basicAuth}`);
-      headers.set("access-token", `${token}`);
-    
-    }
-    headers.set("Content-Type", "application/json");
-    return headers;
-  },
-});
-
-
-// ✅ Handle 401 Errors (Auto Logout)
-export const baseQueryWithReauth: BaseQueryFn<
-  string | FetchArgs,
-  unknown,
-  FetchBaseQueryError
-> = async (args, api, extraOptions) => {
-  const result = await baseQuery(args, api, extraOptions);
-
-  if (result.error && result.error.status === 401) {
-    api.dispatch(logout()); // Logout user on 401 error
-  }
-
-  return result;
-};
-
-
-
-
-export const dashboard = createApi({
-  reducerPath: "api",
-  baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
-  endpoints: (builder) => ({
-
-
-
-    getPosts: builder.query<Post[], void>({ query: () => "/posts" }),
-
-    
-    // 🔹 POST: Create a new post
-    logOut: builder.mutation<void, void>({
-      query: () => ({
-        url: "/logout",
-        method: "POST",
-      }),
-    }),
-
-
-
-
-  }),
-});
-
-export const { useGetPostsQuery, useLogOutMutation } = dashboard;
-
-export type Post = {
-  id: number;
-  title: string;
-  body: string;
-};

src/Redux/Service/authSlice.tsx

@@ -1,27 +0,0 @@
-import { createSlice, PayloadAction } from "@reduxjs/toolkit";
-
-type AuthState = {
-  token: string | null;
-};
-
-const initialState: AuthState = {
-  token: localStorage.getItem("token"), // Load token from localStorage
-}; 
-
-const authSlice = createSlice({
-  name: "auth",
-  initialState,
-  reducers: {
-    setToken: (state, action: PayloadAction<string>) => {
-      state.token = action.payload;
-      localStorage.setItem("token", action.payload); // ✅ Store token in localStorage
-    },
-    logout: (state) => {
-      state.token = null;
-      localStorage.removeItem("token"); // ✅ Remove token from localStorage on logout
-    },
-  },
-});
-
-export const { setToken, logout } = authSlice.actions;
-export default authSlice.reducer;

src/Redux/Service/deactivated.account.service.ts

@@ -1,26 +0,0 @@
-import { createApi } from "@reduxjs/toolkit/query";
-import { baseQueryWithReauth } from "./apiSlice";
-
-export const deactivatedAccounts = createApi({
-    reducerPath: "deactivatedAccounts",
-    baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
-    endpoints: (builder) => ({
-  
-  
-  
-      getPosts: builder.query<Post[], void>({ query: () => "/posts" }),
-  
-  
-  
-  
-  
-    }),
-  });
-  
-  export const {  } = deactivatedAccounts;
-  
-  export type Post = {
-    id: number;
-    title: string;
-    body: string;
-  };

src/Redux/Service/faqs.service.ts

@@ -1,26 +0,0 @@
-import { createApi } from "@reduxjs/toolkit/query";
-import { baseQueryWithReauth } from "./apiSlice";
-
-export const faqs = createApi({
-    reducerPath: "faqs",
-    baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
-    endpoints: (builder) => ({
-  
-  
-  
-      getPosts: builder.query<Post[], void>({ query: () => "/posts" }),
-  
-  
-  
-  
-  
-    }),
-  });
-  
-  export const {  } = faqs;
-  
-  export type Post = {
-    id: number;
-    title: string;
-    body: string;
-  };

src/Redux/Service/forget.password.service.ts

@@ -1,36 +0,0 @@
-import { createApi } from "@reduxjs/toolkit/query/react";
-import { baseQueryWithReauth } from "./apiSlice";
-
-export const forgetPassword = createApi({
-  reducerPath: "aboutUs",
-  baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
-  endpoints: (builder) => ({
-
-
-
-    // 🔹 GET: Fetch all posts
-    getAboutUs: builder.query<AboutUs[], void>({
-      query: () => "/send-otp",
-    }),
-
-  }),
-});
-
-export const { 
-  useGetAboutUsQuery,  
-} = forgetPassword;
-
-// Define Post type
-export type Post = {
-  id: number;
-  title: string;
-  body: string;
-};
-
-
-export type AboutUs = {
-  id: number;
-  language_master_xid: number;
-  content: string;
-  is_active: boolean;
-};

src/Redux/Service/manage.aboutus.service.ts

@@ -1,103 +0,0 @@
-import { createApi } from "@reduxjs/toolkit/query/react";
-import { baseQueryWithReauth } from "./apiSlice";
-
-export const aboutUs = createApi({
-  reducerPath: "aboutUs",
-  baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
-  endpoints: (builder) => ({
-
-
-
-    // 🔹 GET: Fetch all posts
-    getAboutUs: builder.query<AboutUsResponse, void>({
-      query: () => "/about-us",
-    }),
-
-
-
-
-
-    // 🔹 GET: Fetch a single post by ID
-    getPostById: builder.query<Post, number>({
-      query: (id) => `/posts/${id}`,
-    }),
-
-    // 🔹 POST: Create a new post
-    createPost: builder.mutation<Post, Partial<Post>>({
-      query: (data) => ({
-        url: "/posts",
-        method: "POST",
-        body: data,
-      }),
-    }),
-
-    // 🔹 PUT: Update an existing post
-    updateAboutUs: builder.mutation<UpdateAboutUsResponse, UpdateAboutUsRequest>({
-      query: ({ id, updatedData }) => ({
-        url: `/posts/${id}`,
-        method: "POST",
-        body: updatedData,
-      }),
-    }),
-
-    // 🔹 DELETE: Remove a post by ID
-    deletePost: builder.mutation<{ success: boolean }, number>({
-      query: (id) => ({
-        url: `/posts/${id}`,
-        method: "DELETE",
-      }),
-    }),
-  }),
-});
-
-export const { 
-  useGetAboutUsQuery, 
-  useUpdateAboutUsMutation,
-
-
-
-
-
-
-
-
-
-
-  
-  useGetPostByIdQuery, 
-  useCreatePostMutation,  
-  useDeletePostMutation 
-} = aboutUs;
-
-// Define Post type
-export type Post = {
-  id: number;
-  title: string;
-  body: string;
-};
-
-
-export type UpdateAboutUsRequest={
-  id: number; updatedData: string
-}
-
-
-export type UpdateAboutUsResponse={
-  id: number; updatedData: string
-}
-
-
-export type AboutUs = {
-  id: number;
-  language_master_xid: number;
-  content: string;
-  is_active: boolean;
-};
-
-// First define your interface
-interface AboutUsResponse {
-  data: {
-    content: string;
-    // other fields...
-  }[];
-}

src/Redux/Service/manage.contactus.service.ts

@@ -1,26 +0,0 @@
-import { createApi } from "@reduxjs/toolkit/query";
-import { baseQueryWithReauth } from "./apiSlice";
-
-export const manageContactUs = createApi({
-    reducerPath: "manageContactUs",
-    baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
-    endpoints: (builder) => ({
-  
-  
-  
-      getPosts: builder.query<Post[], void>({ query: () => "/posts" }),
-  
-  
-  
-  
-  
-    }),
-  });
-  
-  export const {  } = manageContactUs;
-  
-  export type Post = {
-    id: number;
-    title: string;
-    body: string;
-  };

src/Redux/Service/manage.groups.service.ts

@@ -1,26 +0,0 @@
-import { createApi } from "@reduxjs/toolkit/query";
-import { baseQueryWithReauth } from "./apiSlice";
-
-export const manageGroups = createApi({
-    reducerPath: "manageGroups",
-    baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
-    endpoints: (builder) => ({
-  
-  
-  
-      getPosts: builder.query<Post[], void>({ query: () => "/posts" }),
-  
-  
-  
-  
-  
-    }),
-  });
-  
-  export const {  } = manageGroups;
-  
-  export type Post = {
-    id: number;
-    title: string;
-    body: string;
-  };

src/Redux/Service/manage.jobs.service.ts

@@ -1,26 +0,0 @@
-import { createApi } from "@reduxjs/toolkit/query";
-import { baseQueryWithReauth } from "./apiSlice";
-
-export const manageJobs = createApi({
-    reducerPath: "manageJobs",
-    baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
-    endpoints: (builder) => ({
-  
-  
-  
-      getPosts: builder.query<Post[], void>({ query: () => "/posts" }),
-  
-  
-  
-  
-  
-    }),
-  });
-  
-  export const {  } = manageJobs;
-  
-  export type Post = {
-    id: number;
-    title: string;
-    body: string;
-  };

src/Redux/Service/manage.posts.service.ts

@@ -1,26 +0,0 @@
-import { createApi } from "@reduxjs/toolkit/query";
-import { baseQueryWithReauth } from "./apiSlice";
-
-export const managePosts = createApi({
-    reducerPath: "managePosts",
-    baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
-    endpoints: (builder) => ({
-  
-  
-  
-      getPosts: builder.query<Post[], void>({ query: () => "/posts" }),
-  
-  
-  
-  
-  
-    }),
-  });
-  
-  export const {  } = managePosts;
-  
-  export type Post = {
-    id: number;
-    title: string;
-    body: string;
-  };

src/Redux/Service/manage.subadmin.service.ts

@@ -1,26 +0,0 @@
-import { createApi } from "@reduxjs/toolkit/query";
-import { baseQueryWithReauth } from "./apiSlice";
-
-export const manageSubAdmin = createApi({
-    reducerPath: "manageSubAdmin",
-    baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
-    endpoints: (builder) => ({
-  
-  
-  
-      getPosts: builder.query<Post[], void>({ query: () => "/posts" }),
-  
-  
-  
-  
-  
-    }),
-  });
-  
-  export const {  } = manageSubAdmin;
-  
-  export type Post = {
-    id: number;
-    title: string;
-    body: string;
-  };

src/Redux/Service/master.module.service.ts

@@ -1,26 +0,0 @@
-import { createApi } from "@reduxjs/toolkit/query";
-import { baseQueryWithReauth } from "./apiSlice";
-
-export const masterModule = createApi({
-    reducerPath: "masterModule",
-    baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
-    endpoints: (builder) => ({
-  
-  
-  
-      getPosts: builder.query<Post[], void>({ query: () => "/posts" }),
-  
-  
-  
-  
-  
-    }),
-  });
-  
-  export const {  } = masterModule;
-  
-  export type Post = {
-    id: number;
-    title: string;
-    body: string;
-  };

src/Redux/Service/myprofie.service.ts

@@ -1,26 +0,0 @@
-import { createApi } from "@reduxjs/toolkit/query";
-import { baseQueryWithReauth } from "./apiSlice";
-
-export const myProfile = createApi({
-    reducerPath: "myProfile",
-    baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
-    endpoints: (builder) => ({
-  
-  
-  
-      getPosts: builder.query<Post[], void>({ query: () => "/posts" }),
-  
-  
-  
-  
-  
-    }),
-  });
-  
-  export const {  } = myProfile;
-  
-  export type Post = {
-    id: number;
-    title: string;
-    body: string;
-  };

src/Redux/Service/privacy.policy.service.ts

@@ -1,16 +0,0 @@
-import { createApi } from "@reduxjs/toolkit/query/react";
-import { baseQueryWithReauth } from "./apiSlice"; // Ensure this is correctly configured
-import { PrivacyPolicyResponse } from "../../Types/privacyPolicyTypes";
-
-export const privacyPolicy = createApi({
-  reducerPath: "privacyPolicy",
-  baseQuery: baseQueryWithReauth, // Ensure this returns a valid `BaseQueryFn`
-  endpoints: (builder) => ({
-    getPrivacyPolicy: builder.query<PrivacyPolicyResponse, void>({ // Fix types here
-      query: () => "/privacy-policy",
-    }),
-  }),
-});
-
-// Export hook
-export const { useGetPrivacyPolicyQuery } = privacyPolicy;

src/Redux/Service/privacy.service.ts

@@ -1,26 +0,0 @@
-import { createApi } from "@reduxjs/toolkit/query";
-import { baseQueryWithReauth } from "./apiSlice";
-
-export const privacy = createApi({
-    reducerPath: "privacy",
-    baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
-    endpoints: (builder) => ({
-  
-  
-  
-      getPosts: builder.query<Post[], void>({ query: () => "/posts" }),
-  
-  
-  
-  
-  
-    }),
-  });
-  
-  export const {  } = privacy;
-  
-  export type Post = {
-    id: number;
-    title: string;
-    body: string;
-  };

src/Redux/Service/register.user.service.ts

@@ -1,26 +0,0 @@
-import { createApi } from "@reduxjs/toolkit/query";
-import { baseQueryWithReauth } from "./apiSlice";
-
-export const registerUser = createApi({
-    reducerPath: "registerUser",
-    baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
-    endpoints: (builder) => ({
-  
-  
-  
-      getPosts: builder.query<Post[], void>({ query: () => "/posts" }),
-  
-  
-  
-  
-  
-    }),
-  });
-  
-  export const {  } = registerUser;
-  
-  export type Post = {
-    id: number;
-    title: string;
-    body: string;
-  };

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

@@ -1,26 +0,0 @@
-import { createApi } from "@reduxjs/toolkit/query";
-import { baseQueryWithReauth } from "./apiSlice";
-
-export const termsAndCondition = createApi({
-    reducerPath: "api",
-    baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
-    endpoints: (builder) => ({
-  
-  
-  
-      getPosts: builder.query<Post[], void>({ query: () => "/posts" }),
-  
-  
-  
-  
-  
-    }),
-  });
-  
-  export const {  } = termsAndCondition;
-  
-  export type Post = {
-    id: number;
-    title: string;
-    body: string;
-  };

src/Redux/Store.tsx

@@ -1,55 +0,0 @@
-import { configureStore } from "@reduxjs/toolkit";
-import { dashboard } from "./Service/apiSlice";
-import authReducer from "./Service/authSlice";
-import { registerUser } from "./Service/register.user.service";
-import { deactivatedAccounts } from "./Service/deactivated.account.service";
-import { faqs } from "./Service/faqs.service";
-import { managePosts } from "./Service/manage.posts.service";
-import { manageSubAdmin } from "./Service/manage.subadmin.service";
-import { manageJobs } from "./Service/manage.jobs.service";
-import { manageGroups } from "./Service/manage.groups.service";
-import { manageContactUs } from "./Service/manage.contactus.service";
-import { aboutUs } from "./Service/manage.aboutus.service";
-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";
-
-export const store = configureStore({
-  reducer: {
-    [dashboard.reducerPath]: dashboard.reducer,
-    [registerUser.reducerPath]: registerUser.reducer,
-    [deactivatedAccounts.reducerPath]: deactivatedAccounts.reducer,
-    [faqs.reducerPath]: faqs.reducer,
-    [managePosts.reducerPath]: managePosts.reducer,
-    [manageSubAdmin.reducerPath]: manageSubAdmin.reducer,
-    [manageJobs.reducerPath]: manageJobs.reducer,
-    [manageGroups.reducerPath]: manageGroups.reducer,
-    [manageContactUs.reducerPath]: manageContactUs.reducer,
-    [aboutUs.reducerPath]: aboutUs.reducer,
-    [privacyPolicy.reducerPath]: privacyPolicy.reducer,
-    [privacy.reducerPath]: privacy.reducer,
-    [myProfile.reducerPath]: myProfile.reducer,
-    [masterModule.reducerPath]: masterModule.reducer,
-    auth: authReducer,
-  },
-  middleware: (getDefaultMiddleware) =>
-    getDefaultMiddleware().concat(
-      dashboard.middleware, 
-      deactivatedAccounts.middleware,
-      managePosts.middleware,
-      faqs.middleware,
-      manageSubAdmin.middleware,
-      manageJobs.middleware,
-      manageGroups.middleware,
-      manageContactUs.middleware,
-      aboutUs.middleware,
-      privacyPolicy.middleware,
-      privacy.middleware,
-      myProfile.middleware,
-      masterModule.middleware,
-      ),
-});
-
-export type RootState = ReturnType<typeof store.getState>;
-export type AppDispatch = typeof store.dispatch;

src/Routes/Nav.ts

@@ -1,34 +1,35 @@
-import { LuBriefcaseBusiness} from "react-icons/lu";
-import { MdHeadsetMic, MdOutlineDashboard} from "react-icons/md";
+import { CgWorkAlt } from "react-icons/cg";
 import { GoDotFill } from "react-icons/go";
-import { HiOutlinePencilSquare } from "react-icons/hi2";
-import { BiUser, BiUserPin } from "react-icons/bi";
-import { PiUsersThree } from "react-icons/pi";
-import { BsBoxes, BsPersonBadge } from "react-icons/bs";
-import { AiOutlineFileText } from "react-icons/ai";
+import { PiHeadphonesBold } from "react-icons/pi";
+import { RiUserSettingsLine } from "react-icons/ri";
+import { TbEdit, TbLayoutDashboard } from "react-icons/tb";
+import { TiDocumentText, TiUserAddOutline, TiUserOutline } from "react-icons/ti";
+
+
 
 export const nav = [
     
         {
           title: "Dashboard",
           path: "/",
-          Icon: MdOutlineDashboard,
+          Icon: TbLayoutDashboard,
           type:'single'
         },
         {
           title: "Manage Users",
-          initPath: "/manage-users",
-          Icon: BiUserPin,
+          path: "/manage-user/register-user",
+          initPath:'/manage-user',
+          Icon: TiUserOutline,
           type:'multiple',
           children: [
             {
               title: "Register Users",
-              path: "/manage-users/register-users",
+              path: "/manage-user/register-user",
               Icon: GoDotFill,
             },
             {
               title: "Deactivated Accounts",
-              path: "/manage-users/deactivated-accounts",
+              path: "/manage-user/deactivate-accounts",
               Icon: GoDotFill,
             },
           ],
@@ -36,41 +37,37 @@ export const nav = [
         {
           title: "Manage Post",
           path: "/manage-post",
-          Icon: HiOutlinePencilSquare,
+          Icon: TbEdit,
           type:'single'
         },
         {
           title: "Manage Sub-Admin",
-          path: "/sub-admin",
-          Icon: BiUser,
+          path: "/manage-sub-admin",
+          Icon: TiUserAddOutline,
           type:'single'
         },
         {
           title: "Manage Jobs",
           path: "/manage-jobs",
-          Icon: LuBriefcaseBusiness,
-          type:'single'
-        },
-        {
-          title: "Manage Groups",
-          path: "/manage-groups",
-          Icon: PiUsersThree,
+          Icon: CgWorkAlt,
           type:'single'
         },
         {
           title: "Manage Contact Us",
-          path: "/manage-contact",
-          Icon: MdHeadsetMic  ,
+          path: "/manage-contact-us",
+          Icon: PiHeadphonesBold,
           type:'single'
         },
+        
         {
           title: "Manage CMS",
-          initPath: "/manage-cms",
-          Icon: AiOutlineFileText,
+          initPath:'/manage-cms',
+          path: "/manage-cms/faq",
+          Icon: TiDocumentText,
           type:'multiple',
           children: [
             {
-              title: "FAQs",
+              title: "FAQ",
               path: "/manage-cms/faq",
               Icon: GoDotFill,
             },
@@ -86,12 +83,7 @@ export const nav = [
             },
             {
               title: "Terms And Conditions",
-              path: "/manage-cms/terms-conditions",
-              Icon: GoDotFill,
-            },
-            {
-              title: "Privacy",
-              path: "/manage-cms/privacy",
+              path: "/manage-cms/terms-and-condition",
               Icon: GoDotFill,
             },
           ],
@@ -99,45 +91,8 @@ export const nav = [
         {
           title: "My Profile",
           path: "/profile",
-          Icon: BsPersonBadge,
+          Icon: RiUserSettingsLine,
           type:'single'
         },
-        {
-          title: "Master Module",
-          initPath: "/master-module",
-          Icon: BsBoxes,
-          type:'multiple',
-          children: [
-            {
-              title: "Agency Master",
-              path: "/master-module/agency-master",
-              Icon: GoDotFill,
-            },
-            {
-              title: "Template Master",
-              path: "/master-module/template-master",
-              Icon: GoDotFill,
-            },
-            {
-              title: "Job Type",
-              path: "/master-module/job-type",
-              Icon: GoDotFill,
-            },
-            {
-              title: "Workspace Mode",
-              path: "/master-module/workspace-mode",
-              Icon: GoDotFill,
-            },
-            {
-              title: "Country",
-              path: "/master-module/country",
-              Icon: GoDotFill,
-            },
-            {
-              title: "Job Status",
-              path: "/master-module/job-status",
-              Icon: GoDotFill,
-            },
-          ],
-        },
+        
   ];

src/Routes/Routes.ts

@@ -1,66 +1,55 @@
 
-
 import Dashboard from "../Pages/Dashboard/Dashboard";
-import ManageGroups from "../Pages/ManageGroups/ManageGroups";
+import AboutUs from "../Pages/ManageCMS/AboutUs/AboutUs";
+import FreqAskQuestion from "../Pages/ManageCMS/FAQ/FreqAskQuestion";
+import PrivacyPolicy from "../Pages/ManageCMS/PrivacyPolicy/PrivacyPolicy";
+import ManageContactUs from "../Pages/ManageContactUs/ManageContactUs";
 import ManageJobs from "../Pages/ManageJobs/ManageJobs";
 import ManagePost from "../Pages/ManagePost/ManagePost";
+import ManageSubAdmin from "../Pages/ManageSubAdmin/ManageSubAdmin";
+import DeactivatedAccounts from "../Pages/ManageUser/DeactivatedAccounts/DeactivatedAccounts";
+import RegisterUsers from "../Pages/ManageUser/RegisterUsers/RegisterUsers";
 import Profile from "../Pages/Profile/Profile";
-import SubAdmin from "../Pages/SubAdmin/SubAdmin";
-import ManageContact from "../Pages/ManageContact/ManageContact";
-import FAQ from "../Pages/ManageCMS/FAQ/FAQ";
-import AboutUs from "../Pages/ManageCMS/AboutUs/AboutUs";
-import PrivacyPolicy from "../Pages/ManageCMS/PrivacyPolicy/PrivacyPolicy";
-import TermsAndConditions from "../Pages/ManageCMS/TermsAndConditions/TermsAndConditions";
-import Privacy from "../Pages/ManageCMS/Privacy/Privacy";
-import MyProfile from "../Pages/MyProfile/MyProfile";
-import Notification from "../Pages/Notification/Notification";
-import AgencyMaster from "../Pages/MasterModule/AgencyMaster/AgencyMaster";
-import TemplateMaster from "../Pages/MasterModule/TemplateMaster/TemplateMaster";
-import JobType from "../Pages/MasterModule/JobType/JobType";
-import WorkspaceMode from "../Pages/MasterModule/WorkspaceMode/WorkspaceMode";
-import Country from "../Pages/MasterModule/Country/Country";
-import JobStatus from "../Pages/MasterModule/JobStatus/JobStatus";
-import RegisterUsers from "../Pages/ManageUsers/RegisterUsers/RegisterUsers";
-import DeactivatedAccounts from "../Pages/ManageUsers/DeactivatedAccounts/DeactivatedAccounts";
-import { Spinner } from "../components/Sipnner/Spinner";
-
 export const RouteLink = [
     { path: "/", Component: Dashboard },
-    { path: "/dashboard", Component: Dashboard },
-    { path: "/manage-users/register-users", Component: RegisterUsers },
-    { path: "/manage-users/deactivated-accounts", Component: DeactivatedAccounts },
+    { path: "/manage-user/register-user", Component: RegisterUsers },
+    { path: "/manage-user/deactivate-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: "/manage-sub-admin", Component: ManageSubAdmin },
+    { path: "/manage-jobs", Component: ManageJobs },
+    { path: "/manage-contact-us", Component: ManageContactUs },
+    { path: "/manage-cms/faq", Component: FreqAskQuestion },
+
+
+
+    { path: "/manage-cms/about-us", Component: AboutUs },
+
+
+
+    { path: "/manage-cms/privacy-policy", Component: PrivacyPolicy },
+
+
+    { path: "/manage-cms/terms-and-condition", Component: PrivacyPolicy },
+
+
+
+
+    
+
+
+
+
+
 
 
 
-    { 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: "/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},
-
 ]

src/Types/privacyPolicyTypes.tsx

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

src/components/ActionIcons/Delete.tsx

@@ -1,34 +0,0 @@
-import { Icon, Image } from "@chakra-ui/react";
-import { Tooltip } from "../ui/tooltip";
-import { RiDeleteBin5Line } from "react-icons/ri";
-
-const Delete = () => {
-  return (
-    <Tooltip
-      content="Delete"
-      openDelay={100}
-      contentProps={{
-        css: {
-          "--tooltip-bg": "#fed7d7",
-          color: "#822727",
-          padding: "1px 8px",
-        },
-      }}
-    >
-      <Icon
-        cursor={"pointer"}
-        p={1}
-        _hover={{ bg: "#00000015" }}
-        rounded={"xs"}
-        boxSize={5}
-        h={"24px"}
-        w={"24px"}
-        // color={iconColor && iconColor}
-      >
-        <RiDeleteBin5Line />
-      </Icon>
-    </Tooltip>
-  );
-};
-
-export default Delete;

src/components/ActionIcons/Edit.tsx

@@ -1,33 +0,0 @@
-import { Icon } from "@chakra-ui/react";
-import { TbEdit } from "react-icons/tb";
-import { Tooltip } from "../ui/tooltip";
-
-const Edit = () => {
-  return (
-    <Tooltip
-      content="Edit"
-      openDelay={100}
-      contentProps={{
-        css: {
-          "--tooltip-bg": "#c6f6d5",
-          color: "#22543d",
-          padding: "1px 8px",
-        },
-      }}
-    >
-      <Icon
-        cursor={"pointer"}
-        p={1}
-        _hover={{ bg: "#00000015" }}
-        rounded={"xs"}
-        boxSize={5}
-        h={"24px"}
-        w={"24px"}
-      >
-        <TbEdit />
-      </Icon>
-    </Tooltip>
-  );
-};
-
-export default Edit;

src/components/ActionIcons/View.tsx

@@ -1,34 +0,0 @@
-import { Icon } from "@chakra-ui/react";
-import { Tooltip } from "../ui/tooltip";
-import { MdOutlineRemoveRedEye } from "react-icons/md";
-
-const View = () => {
-  return (
-    <Tooltip
-      content="View"
-      openDelay={100}
-      contentProps={{
-        css: {
-          "--tooltip-bg": "#ccecec",
-          color: "#055757",
-          padding: "1px 8px",
-        },
-      }}
-    >
-      <Icon
-        cursor={"pointer"}
-        p={1}
-        _hover={{ bg: "#00000015" }}
-        rounded={"xs"}
-        boxSize={5}
-        h={"24px"}
-        w={"24px"}
-        // color={iconColor && iconColor}
-      >
-        <MdOutlineRemoveRedEye />
-      </Icon>
-    </Tooltip>
-  );
-};
-
-export default View;

src/components/AlertDailog.tsx

@@ -25,6 +25,7 @@ const AlertDailog: React.FC<DeleteConfirmationDialogProps> = ({
   onConfirm,
   alertText,
   alertCaption,
+  alertIcon,
   AltertTiggerIcon,
   button,
   iconColor,

src/components/DataTable.tsx

@@ -1,130 +1,35 @@
-import { useState } from "react";
-import { HStack, Stack, Table } from "@chakra-ui/react";
-import { PaginationItems, PaginationNextTrigger, PaginationPrevTrigger, PaginationRoot } from "./ui/pagination";
-// import {
-//   PaginationItems,
-//   PaginationNextTrigger,
-//   PaginationPrevTrigger,
-//   PaginationRoot,
-// } from "./ui/pagination";
+import { Stack, Table } from "@chakra-ui/react"
+
 
 interface TableProps {
   tableHeadRow: string[];
   data: Record<string, any>[];
-  sortableColumns?: string[]; // Specify which columns are sortable
 }
 
-const DataTable: React.FC<TableProps> = ({
-  tableHeadRow,
-  data,
-  sortableColumns = [],
-}) => {
-  const [sortedData, setSortedData] = useState(data);
-  const [sortConfig, setSortConfig] = useState<{
-    key: string;
-    direction: "asc" | "desc";
-  } | null>(null);
 
-  const handleSort = (column: string) => {
-    if (!sortableColumns.includes(column)) return;
-
-    let direction: "asc" | "desc" = "asc";
-    if (
-      sortConfig &&
-      sortConfig.key === column &&
-      sortConfig.direction === "asc"
-    ) {
-      direction = "desc";
-    }
-
-    const sortedArray = [...sortedData].sort((a, b) => {
-      if (a[column] < b[column]) return direction === "asc" ? -1 : 1;
-      if (a[column] > b[column]) return direction === "asc" ? 1 : -1;
-      return 0;
-    });
-
-    setSortedData(sortedArray);
-    setSortConfig({ key: column, direction });
-  };
 
+const DataTable: React.FC<TableProps> = ({ tableHeadRow, data }) => {
   return (
-    <Stack mt={0} color={"#000000CC"}>
-      <Table.ScrollArea mb={3}>
-        <Table.Root size="sm" variant={"line"} stickyHeader>
-          <Table.Header>
-            <Table.Row bg={"#02A0A0"}>
-              {tableHeadRow.map((item, index) => (
-                <Table.ColumnHeader
-                  color="white"
-                  fontSize={"xs"}
-                  fontWeight={600}
-                  px={4}
-                  p={3}
-                  textAlign={
-                    index === tableHeadRow.length - 1 ? "center" : "left"
-                  }
-                  key={index}
-                  border={"none"}
-                  onClick={() => handleSort(item)}
-                  cursor={
-                    sortableColumns.includes(item) ? "pointer" : "default"
-                  }
-                  _hover={
-                    sortableColumns.includes(item)
-                      ? { textDecoration: "underline" }
-                      : {}
-                  }
-                >
-                  {item}
-                  {sortableColumns.includes(item) &&
-                    sortConfig?.key === item && (
-                      <span style={{ marginLeft: "4px" }}>
-                        {sortConfig.direction === "asc" ? "\u25B2" : "\u25BC"}
-                      </span>
-                    )}
-                </Table.ColumnHeader>
-              ))}
-            </Table.Row>
-          </Table.Header>
-          <Table.Body>
-            {sortedData.map((item: any, index) => (
-              <Table.Row
-                key={index}
-                bg={index % 2 === 0 ? "#fff" : "#007F3310"}
-              >
-                {tableHeadRow.map((heading, colIndex) => (
-                  <Table.Cell
-                    // className="oxygen"
-                    px={4}
-                    p={2}
-                    key={`${index}-${colIndex}`}
-                    fontSize={"xs"}
-                    fontWeight={500}
-                    border={"none"}
-                  >
-                    {item[heading]}
-                  </Table.Cell>
-                ))}
+     <Stack mt={4} color={'#000000CC'} gap="10">
+          <Table.Root  key={'line'} size="sm" variant={'line'}>
+            <Table.Header >
+              <Table.Row bg={'#02A0A0'} >
+                {tableHeadRow.map((item, index)=><Table.ColumnHeader fontSize={'xs'} fontWeight={700} key={index} border={'none'}>{item}</Table.ColumnHeader>)}
+                
               </Table.Row>
-            ))}
-          </Table.Body>
-        </Table.Root>
-      </Table.ScrollArea>
-      <PaginationRoot
-        size={"xs"}
-        count={20}
-        pageSize={2}
-        defaultPage={1}
-        mb={4}
-      >
-        <HStack justifyContent="flex-end">
-          <PaginationPrevTrigger />
-          <PaginationItems />
-          <PaginationNextTrigger />
-        </HStack>
-      </PaginationRoot>
-    </Stack>
-  );
-};
+            </Table.Header>
+            <Table.Body>
+              {data.map((item:any, index) => (
+                <Table.Row 
+                      bg={index % 2 === 0 ? "#fff" : "#02A0A020"}  >
+                  {tableHeadRow.map((heading)=><Table.Cell key={index} fontSize={'xs'} fontWeight={500}  border={'none'}>{item[heading]}</Table.Cell>  )}
+                  
+                </Table.Row>))}
+            
+            </Table.Body>
+          </Table.Root>
+        </Stack>
+  )
+}
 
-export default DataTable;
+export default DataTable

src/components/EditSubAdmin.tsx

@@ -1,161 +1,79 @@
-import { Field, Grid, Heading, Icon, Input, Stack, Text } from "@chakra-ui/react";
-import { TbEdit } from "react-icons/tb";
-import { Button } from "./ui/button";
-import { Checkbox } from "./ui/checkbox";
-import {
-  DialogBody,
-  DialogCloseTrigger,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogRoot,
-  DialogTitle,
-  DialogTrigger,
-} from "./ui/dialog";
-import Edit from "./ActionIcons/Edit";
+import { Button } from "./ui/button"
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "./ui/dialog"
+import { Field, Grid, Heading, Input, Stack, Text } from "@chakra-ui/react"
+import { Checkbox } from "./ui/checkbox"
+import { FaRegEdit } from "react-icons/fa";
 function EditSubAdmin() {
-  return (
-    <DialogRoot placement="center">
-      <DialogTrigger asChild>
-          {/* <FaRegEdit style={{ cursor: "pointer" }} color="#000" /> */}
+    return (
 
-          <Edit />
-        {/* <Button><FaRegEdit /></Button> */}
-      </DialogTrigger>
+        <DialogRoot placement="center">
+            <DialogTrigger asChild>
+                <Button bg={"transparent"} size="sm">
+                    <FaRegEdit style={{ cursor: "pointer", }} color="#000" />
+                </Button>
+                {/* <Button><FaRegEdit /></Button> */}
 
-      <DialogContent
-        bg={"#fff"}
-        w={{ base: "90%", md: "400px" }}
-        height={"80vh"}
-        overflow={"scroll"}
-        overflowX="hidden"
-        p={3} // Reduced padding
-        bgSize={"md"}
-      >
-        <DialogHeader bg="white">
-          <DialogTitle alignSelf="center" color="black" fontSize="14px">
-            Edit Sub Admin Account
-          </DialogTitle>
-        </DialogHeader>
+            </DialogTrigger>
 
-        <DialogBody bg="white">
-          <Stack py={3}>
-            <Field.Root>
-              <Field.Label color="black" pt={1} fontSize="12px">
-                First Name
-              </Field.Label>
-              <Input
-                placeholder="Enter the First Name"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-              <Field.Label color="black" pt={1} fontSize="12px">
-                First Name
-              </Field.Label>
-              <Input
-                placeholder="Enter the First Name"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Last Name
-              </Field.Label>
-              <Input
-                placeholder="Enter the Last Name"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
+            <DialogContent
+                bg={"#fff"}
+                w={{ base: '90%', md: '400px' }}
+                height={'80vh'}
+                overflow={'scroll'}
+                overflowX="hidden" 
+                p={3} // Reduced padding
+                bgSize={'md'}
+            >
+                <DialogHeader bg="white">
+                    <DialogTitle alignSelf="center" color="black" fontSize="14px">Edit Sub Admin Account</DialogTitle>
+                </DialogHeader>
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                DOB
-              </Field.Label>
-              <Input
-                placeholder="Enter the DOB"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
+                <DialogBody bg="white">
+                    <Stack py={3} >
 
-              <Field.Label color="black" pt={1} fontSize="12px">
-                Gender
-              </Field.Label>
-              <Input
-                placeholder="Enter the Gender"
-                bgColor="#EEEEEE"
-                color="black"
-                border="none"
-                pl={1}
-                fontSize="12px"
-                height="30px"
-              />
-              <Heading mt={5} color={"#000"} fontSize={"sm"}>
-                Permissions
-              </Heading>
-            </Field.Root>
-            <Grid templateColumns="repeat(2, 1fr)" gap={4}>
-              <Checkbox size={"sm"} color={"black"}>
-                <Text fontSize={12}>Dashboard</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                <Text fontSize={12}>Manage contact us</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                <Text fontSize={12}>manage User</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                <Text fontSize={12}>Manage CMS</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                <Text fontSize={12}>Manage Post</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                <Text fontSize={12}>Manage Reports</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                <Text fontSize={12}>manage Sub-Admin</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                <Text fontSize={12}>My profile</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                <Text fontSize={12}>Manage Jobs</Text>{" "}
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                <Text fontSize={12}> manage feedbacks</Text>
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                <Text fontSize={12}>Manage community</Text>{" "}
-              </Checkbox>
-              <Checkbox size={"sm"} color={"black"}>
-                <Text fontSize={12}> Notification</Text>
-              </Checkbox>
-            </Grid>
-          </Stack>
-        </DialogBody>
-        <DialogFooter display="flex" justifyContent="center" pt={"2"}>
-          <Button size={"xs"} w="100%" bg="#02A0A0" color={"#fff"}>
-            Save
-          </Button>
-        </DialogFooter>
-        <DialogCloseTrigger color="black" />
-      </DialogContent>
-    </DialogRoot>
-  );
+                        <Field.Root>
+                            <Field.Label color="black" pt={1} fontSize="12px">First Name</Field.Label>
+                            <Input placeholder="Enter the First Name" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                            <Field.Label color="black" pt={1} fontSize="12px">First Name</Field.Label>
+                            <Input placeholder="Enter the First Name" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                            <Field.Label color="black" pt={1} fontSize="12px">Last Name</Field.Label>
+                            <Input placeholder="Enter the Last Name" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+
+                            <Field.Label color="black" pt={1} fontSize="12px">DOB</Field.Label>
+                            <Input placeholder="Enter the DOB" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+
+                            <Field.Label color="black" pt={1} fontSize="12px">Gender</Field.Label>
+                            <Input placeholder="Enter the Gender" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
+                            <Heading mt={5} color={'#000'} fontSize={'sm'}>Permissions</Heading>
+
+                        </Field.Root>
+                        <Grid templateColumns="repeat(2, 1fr)" gap={4}>
+                            <Checkbox size={'sm'} color={"black"} ><Text fontSize={12}>Dashboard</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"} ><Text fontSize={12}>Manage contact us</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"} ><Text fontSize={12}>manage User</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"} ><Text fontSize={12}>Manage CMS</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"} ><Text fontSize={12}>Manage Post</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"} ><Text fontSize={12}>Manage Reports</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"} ><Text fontSize={12}>manage Sub-Admin</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"} ><Text fontSize={12}>My profile</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"} ><Text fontSize={12}>Manage Jobs</Text> </Checkbox>
+                            <Checkbox size={'sm'} color={"black"} ><Text fontSize={12}> manage feedbacks</Text></Checkbox>
+                            <Checkbox size={'sm'} color={"black"} ><Text fontSize={12}>Manage community</Text> </Checkbox>
+                            <Checkbox size={'sm'} color={"black"} ><Text fontSize={12}> Notification</Text></Checkbox>
+                        </Grid>
+                    </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 EditSubAdmin;
+export default EditSubAdmin

src/components/EditableInput.tsx

@@ -1,53 +0,0 @@
-import { Editable } from "@chakra-ui/react";
-import { FC } from "react";
-
-interface InputProps {
-  value?: string;
-  onChange?: (value: string) => void;
-  defaultValue?: string;
-  placeholder?: string;
-  props?: any;
-  type?:string
-}
-const EditableInput: FC<InputProps> = ({
-  value,
-  onChange,
-  defaultValue,
-  placeholder,
-  type,
-  ...props
-}) => {
-  return (
-    <Editable.Root
-      {...props}
-      value={value}
-      onChange={() => onChange && onChange}
-      w={"100%"}
-      size={"sm"}
-      textAlign="start"
-      defaultValue={defaultValue || ""}
-    >
-      <Editable.Preview
-        bg={"#00000006"}
-        fontSize={"xs"}
-        w={"100%"}
-        bgSize={"sm"}
-        ps={3}
-        // _hover={{ backgroundColor: "#00000010" }}
-      />
-      <Editable.Input
-        fontSize={"xs"}
-        placeholder={placeholder}
-        w={"100%"}
-        border={"#ccc 1px solid"}
-        type={type}
-        _focus={{ bg: "#02A0A015" }}
-        outline={"#007F33"}
-        bgSize={"xs"}
-        ps={3}
-      />
-    </Editable.Root>
-  );
-};
-
-export default EditableInput;

src/components/MainFrame.tsx

@@ -9,22 +9,17 @@ const MotionVStack = motion(VStack)
 interface MainFrameProps {
   children: React.ReactNode
   title?: string
-  transperant?:boolean
-  props?:any
 }
 
-const MainFrame: FC<MainFrameProps> = ({ children, transperant, props }) => {
+const MainFrame: FC<MainFrameProps> = ({ children }) => {
   return (
-    <MotionVStack {...props} overflow={'auto'}   {...OPACITY_ON_LOAD} w="100%" minH="93%"   pe={2} ps={1.5} pt={1}  pb={2}>
+    <MotionVStack overflowY="scroll" {...OPACITY_ON_LOAD} w="100%" h="94.5%"  p={3} pe={0} ps={0} pt={3}   >
       <Box
         w="100%"
-        // h="100%"
-        bg={transperant?'transperant':"#ffffff"}
-        // overflow={'scroll'}
-        rounded="lg"
-        boxShadow={transperant?'none':'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'}
-        pt={transperant?0:3}
-        
+        h="100%"
+        bg="#ffffff"
+        rounded="md"
+        boxShadow={'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'}
       >
         {children}
       </Box>

src/components/ProgressBar/ProgessBar.css

@@ -1,20 +0,0 @@
-/* HTML: <div class="progressbar"></div> */
-.progressbar {
-    height: 4px;
-    width: 100%;
-    --c: no-repeat linear-gradient(#02A0A0 0 0);
-    background: var(--c), var(--c), #B8F8F8;
-    background-size: 60% 100%;
-    animation: l16 3s infinite;
-}
-
-@keyframes l16 {
-    0%   {background-position: -150% 0, -150% 0}
-    66%  {background-position: 250% 0, -150% 0}
-    100% {background-position: 250% 0, 250% 0}
-}
-
-.progressbarInactive{
-    height: 4px;
-    width: 100%;
-}

src/components/ProgressBar/ProgressBar.tsx

@@ -1,12 +0,0 @@
-import React from "react";
-import './ProgessBar.css';
-
-interface ProgressBarProps {
-  isLoading: boolean;
-}
-
-const ProgressBar: React.FC<ProgressBarProps> = ({ isLoading }) => {
-  return <span className={isLoading ? "progressbar" : "progressbarInactive"} />;
-};
-
-export default ProgressBar;

src/components/Sipnner/Spinner.css

@@ -1,28 +0,0 @@
-/* HTML: <div class="loader"></div> */
-.loader {
-    width: 25px;
-    aspect-ratio: 1;
-    display: grid;
-    border-radius: 50%;
-    background:
-    linear-gradient(0deg, rgba(2, 160, 160, 0.5) 30%, transparent 0 70%, rgba(2, 160, 160, 1) 0) 50% / 8% 100%,
-    linear-gradient(90deg, rgba(2, 160, 160, 0.25) 30%, transparent 0 70%, rgba(2, 160, 160, 0.75) 0) 50% / 100% 8%;
-    background-repeat: no-repeat;
-    animation: l23 1s infinite steps(12);
-  }
-  .loader::before,
-  .loader::after {
-     content: "";
-     grid-area: 1/1;
-     border-radius: 50%;
-     background: inherit;
-     opacity: 0.915;
-     transform: rotate(30deg);
-  }
-  .loader::after {
-     opacity: 0.83;
-     transform: rotate(60deg);
-  }
-  @keyframes l23 {
-    100% {transform: rotate(1turn)}
-  }

src/components/Sipnner/Spinner.tsx

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

src/components/ui/field.tsx

@@ -15,7 +15,7 @@ export const Field = React.forwardRef<HTMLDivElement, FieldProps>(
     return (
       <ChakraField.Root ref={ref} {...rest}>
         {label && (
-          <ChakraField.Label fontSize={'xs'}>
+          <ChakraField.Label>
             {label}
             <ChakraField.RequiredIndicator fallback={optionalText} />
           </ChakraField.Label>

src/components/ui/password-input.tsx

@@ -86,7 +86,7 @@ const VisibilityTrigger = React.forwardRef<HTMLButtonElement, ButtonProps>(
       <IconButton
         tabIndex={-1}
         ref={ref}
-        me="2"
+        me="-2"
         aspectRatio="square"
         size="sm"
         variant="ghost"