mobile banner

src/Components/MobileView.jsx

@@ -0,0 +1,24 @@
+import { Box, Button, Image, Modal,  ModalContent, ModalFooter, ModalHeader, ModalOverlay } from '@chakra-ui/react'
+import React from 'react'
+import Mobile from "../assets/mobileWing.png"
+import mobileBanner from "../assets/welcome.avif"
+
+const MobileView = ({isOpen,onClose,finalRef}) => {
+  return (
+    <div>
+      <Modal  finalFocusRef={finalRef} isOpen={isOpen} onClose={onClose} >
+        <ModalOverlay />
+        <ModalContent h={"600px"} w={"300px"} backgroundColor={"transparent"} boxShadow={"none"} position={"relative"}>
+            <Image  h={"100%"} src={Mobile} position={"absolute"} top={"0"} left={"0"} />
+            <Box backgroundColor={"#fff"} h={"100%"} m={2} borderRadius={"30px"} pt={"30px"} px={4}>
+                 <Box>
+                    <Image borderRadius={"5px"} h={"130px"} w={"100%"} src={mobileBanner} />
+                 </Box>
+            </Box>
+        </ModalContent>
+      </Modal>
+    </div>
+  )
+}
+
+export default MobileView

src/Pages/Deposit/DepositRequest/DepositRequest.jsx

@@ -328,7 +328,7 @@ const DepositRequest = () => {
         isLoading={isLoading}
       />
       <DepositRequestApprove
-      data={data?.data?.rows}
+        data={data?.data?.rows}
         isOpen={isConfirmOpen}
         onClose={onConfirmClose}
         id={actionId}

src/Pages/Deposit/DepositViewHistory/RejectModal.jsx

@@ -46,7 +46,7 @@ const RejectModal = ({ isOpen, onClose, firstField }) => {
 
     setCreate((prevCreate) => [...prevCreate, newDocument]);
     onClose();
-  };
+  }; 
 
   const handleFileChange = (event) => {
     const selectedFile = event.target.files[0];

src/Pages/IO_Management/ViewIO/ViewIOTable.jsx

@@ -15,6 +15,7 @@ import {
   Tag,
   Text,
   Tooltip,
+  useDisclosure,
   useToast,
 } from "@chakra-ui/react";
 import React, { useContext, useEffect, useState } from "react";
@@ -38,6 +39,8 @@ import ToastBox from "../../../Components/ToastBox";
 import { useGetIOsQuery } from "../../../Services/io.service";
 import { TABLE_PAGINATION } from "../../../Constants/Paginations";
 import { formatCurrency } from "../../../Components/CurrencyInput";
+import { IoIosPhonePortrait } from "react-icons/io";
+import MobileView from "../../../Components/MobileView";
 // import { debounce } from "./AddIOCharges";
 
 const formatDate = (date) => new Date(date).toLocaleDateString(); // Simple date formatter
@@ -55,6 +58,13 @@ const ViewIOTable = () => {
   const [mouseEntered, setMouseEntered] = useState(false);
   const [mouseEnteredId, setMouseEnteredId] = useState("");
 
+  const {
+    isOpen: isOpen,
+    onOpen: onOpen,
+    onClose: onClose,
+  } = useDisclosure();
+
+
   // ===============================[ Paginations ]
   const [pageSize, setPageSize] = useState(TABLE_PAGINATION?.size);
   const [currentPage, setCurrentPage] = useState(TABLE_PAGINATION?.page);
@@ -75,6 +85,7 @@ const ViewIOTable = () => {
     "Goal Amount",
     "Holding Period",
     "IO Status",
+    "Priority",
     "Action",
   ];
 
@@ -176,7 +187,13 @@ const ViewIOTable = () => {
         </Badge>
       </Box>
     ),
-
+    "Priority": (
+      <Box w={"auto"} isTruncated={true}>
+        <Text onClick={onOpen} as={"span"} color={"teal.900"} cursor={"pointer"}>
+          <Badge textTransform={"lowercase"} fontWeight={"500"} display={"flex"} alignItems={"center"} justifyContent={"center"} p={"2px 2px"} borderRadius={"4px"} ><IoIosPhonePortrait fontSize={"14px"} /> View</Badge>
+        </Text>
+      </Box>
+    ),
     Action: (
       <Box display={"flex"} justifyContent={"center"} gap={2}>
         <Tooltip
@@ -339,6 +356,11 @@ const ViewIOTable = () => {
         setMouseEntered={setMouseEntered}
       />
 
+      <MobileView
+         isOpen={isOpen}
+         onClose={onClose}
+      />
+
       <CustomAlertDialog
         onClose={() => setDeleteAlert(false)}
         isOpen={deleteAlert}