update

src/Components/Loaders/FullscreenLoaders.jsx

@@ -1,16 +1,16 @@
 import { Box, Spinner, Text } from "@chakra-ui/react";
 import React from "react";
-import './FullscreenLoaders.css'
+import "./FullscreenLoaders.css";
 
-const FullscreenLoaders = ({height}) => {
+const FullscreenLoaders = ({ height }) => {
   return (
     <Box
       display={"flex"}
       justifyContent={"center"}
-      flexDirection={'column'}
+      flexDirection={"column"}
       alignItems={"center"}
       w={"100%"}
-      h={height ? height: "100vh"}
+      h={height ? height : "100vh"}
       gap={4}
     >
       {/* <div className="dot-spinner">
@@ -23,8 +23,16 @@ const FullscreenLoaders = ({height}) => {
     <div className="dot-spinner__dot"></div>
     <div className="dot-spinner__dot"></div>
 </div> */}
-  {/* <Text color='#004717' fontSize={'md'} fontWeight={500}>Loading...</Text> */}
-  <Spinner />
+      {/* <Text color='#004717' fontSize={'md'} fontWeight={500}>Loading...</Text> */}
+      {/* <div className="spinner-grow" style={{backgroundColor:"#004118"}} role="status" /> */}
+
+      <Spinner
+        thickness="4px"
+        speed="0.65s"
+        emptyColor="#fff"
+        color="#004118"
+        size="lg"
+      />
     </Box>
   );
 };

src/Components/Loaders/Loader01.jsx

@@ -4,6 +4,16 @@ import { Spinner } from "@chakra-ui/react";
 
 const Loader01 = () => {
   return (
+    // <div className="dot-spinner">
+    //   <div className="dot-spinner__dot"></div>
+    //   <div className="dot-spinner__dot"></div>
+    //   <div className="dot-spinner__dot"></div>
+    //   <div className="dot-spinner__dot"></div>
+    //   <div className="dot-spinner__dot"></div>
+    //   <div className="dot-spinner__dot"></div>
+    //   <div className="dot-spinner__dot"></div>
+    //   <div className="dot-spinner__dot"></div>
+    // </div>
 
     // <div className="dot-spinner">
     //   <div className="dot-spinner__dot"></div>

src/Constants/Constants.js

@@ -1,6 +1,7 @@
 
 import dns from "node:dns"
 import * as XLSX from 'xlsx';
+import CryptoJS from "crypto-js";
 
 
 export const generateSerialNumber = (index, currentPage, pageSize) => {
@@ -218,4 +219,18 @@ export function formatDateToYYYYMMDD(dateString) {
 
   // Combine the formatted parts
   return `${year}-${month}-${day}`;
-}
+}
+
+
+// Encrypt a string
+export const encryptString = (text) => {
+  const ciphertext = CryptoJS.AES.encrypt(text, import.meta.env.VITE_ROLE_ENCRYPTION_KEY).toString();
+  return ciphertext;
+};
+
+// Decrypt a string
+export const decryptString = (ciphertext) => {
+  const bytes = CryptoJS.AES.decrypt(ciphertext, import.meta.env.VITE_ROLE_ENCRYPTION_KEY);
+  const originalText = bytes.toString(CryptoJS.enc.Utf8);
+  return originalText;
+};

src/Services/token.serivce.js

@@ -1,4 +1,5 @@
 import { createApi, fetchBaseQuery } from "@reduxjs/toolkit/query/react";
+import { encryptString } from '../Constants/Constants'
 
 // Define a base query function with RTK Query
 // export const baseQuery = fetchBaseQuery({
@@ -100,7 +101,7 @@ export const apiSlice = createApi({
           localStorage.setItem("refreshToken", data?.data?.refresh?.token);
           // localStorage.setItem('refreshTokenExp', data?.data?.refresh?.expires);
           localStorage.setItem("accessTokenExp", data?.data?.access?.expires);
-          localStorage.setItem("role", data?.data?.role);
+          localStorage.setItem("role", encryptString(data?.data?.role));
         } catch (error) {
           console.error("Login failed:", error);
         }