Merge branch 'main' of http://git.wdipl.com/Siddhesh.More/rubix-explore

src/Services/api.service.js

@@ -91,7 +91,7 @@ export const rubix = createApi({
 
 
     getSubnetAll: builder.query({
-      query: ({ pageNumber = 1, pageSize = 10 }) => `SubNet/GetAllSubnetworks?pageNumber=${pageNumber}&pageSize=${pageSize}`,
+      query: ({ pageNumber = 1, pageSize = 10, searchTerm }) => `SubNet/GetAllSubnetworks?pageNumber=${pageNumber}&pageSize=${pageSize}&searchFilter=${searchTerm || ""}`,
       providesTags: ["getTransAll"],
     }),
 

src/components/FullScreenLoaader/FullScreenLoaader.jsx

@@ -2,15 +2,15 @@ import { Box, Spinner, Text, useColorMode } from "@chakra-ui/react";
 import React from "react";
 import bannerImage from "../../assets/images/bannerImg.png";
 
-const FullScreenLoaader = () => {
+const FullScreenLoaader = ({half}) => {
   const { colorMode } = useColorMode();
   return (
     <Box
-      backgroundImage={colorMode !== "light" ? `url(${bannerImage})` : "none"}
+      backgroundImage={colorMode  !== "light" ? !half&& `url(${bannerImage})` : "none"}
       position={"relative"}
       backgroundSize="contain"
       backgroundRepeat="no-repeat"
-      h={"100vh"}
+      h={half ? "50vh":"100vh"}
       w={"100vw"}
       display={"flex"}
       justifyContent={"center"}

src/components/LatestTransactions/LatestTransactions.jsx

@@ -7,6 +7,7 @@ import {
   HStack,
   Icon,
   Image,
+  Spinner,
   Text,
   Tooltip,
   VStack,
@@ -27,6 +28,7 @@ import {
 } from "../../Services/api.service";
 import rbtLogoOutline from "../../assets/images/rubix-filled.svg";
 import { HiOutlineRefresh } from "react-icons/hi";
+import FullScreenLoaader from "../FullScreenLoaader/FullScreenLoaader";
 
 // Define the keyframes
 export const rotate = keyframes`
@@ -168,7 +170,7 @@ const LatestTransactions = () => {
     }
   };
   return (
-    <Container
+    isTransCountLoading? <HStack w={'100%'} justifyContent={'center'} > <Spinner color="purple.700" /></HStack>:<Container
       mt={location?.pathname === "/view-all-transaction" ? 24 : 0}
       mb={location?.pathname === "/view-all-transaction" ? 15 : 0}
       maxW="6xl"

src/components/NavBar/NavBar.jsx

@@ -48,7 +48,7 @@ const NavBar = () => {
         // color={colorMode === "light" ? "light" : "light"}
         padding={"16px 0px"}
         borderBottom={colorMode === "light" ? "1px solid #4023A6" : "none"}
-        bg={colorMode === "light"? "#4023A6":""}
+        bg={colorMode === "light"? "#230A79":""}
       >
         <Container maxW="6xl">
           <Box

src/pages/Home.jsx

@@ -228,7 +228,7 @@ const toast = useToast()
                   bg={colorMode === "light" ? "#DEDBEB" : "#393939"}
                   color={colorMode === "light" ? "#230A79" : "#fff"}
                   cursor={'pointer'}
-                  onClick={()=>navigate(`/transaction/${searchTerm}`)}
+                  // onClick={()=>navigate(`/transaction/${searchTerm}`)}
                   border={`1px solid ${
                     colorMode === "light" ? "#230A79" : "#565252"
                   }`}
@@ -295,7 +295,7 @@ boxShadow={
           </Box>
         </Container>
       </Box>
-      <Box pb={"3rem"} pt={colorMode!=="light" &&10} bg={colorMode === "light" ? "light.100" : "#101015"}>
+      <Box w={'100%'} pb={"3rem"} pt={colorMode!=="light" &&10} bg={colorMode === "light" ? "light.100" : "#101015"}>
         <Container
           maxW="6xl"
           color="white"

src/pages/SubnetId.jsx

@@ -24,6 +24,8 @@ import Pagination from "../components/Pagination";
 import { useGetSubnetAllQuery, useGetSubnetCountQuery } from "../Services/api.service";
 import { BiSearch, BiSearchAlt } from "react-icons/bi";
 import { MdArrowRight } from "react-icons/md";
+import Search from '../assets/images/search.png'
+import FullScreenLoaader from "../components/FullScreenLoaader/FullScreenLoaader";
 
 const SubnetId = () => {
   const { subnetId } = useContext(GlobalStateContext);
@@ -38,6 +40,8 @@ const SubnetId = () => {
   const [totalItems, setTotalItems] = useState(null); // Total items in the dataset
   const [lastRefreshedTime, setLastRefreshedTime] = useState(new Date()); // Store the last refresh time
   const [relativeRefreshTime, setRelativeRefreshTime] = useState("Just now"); 
+  const [ searchTerm, setSearchTerm] = useState()
+  const [debouncedSearchTerm, setDebouncedSearchTerm] = useState("");
 
 
 
@@ -46,6 +50,17 @@ const SubnetId = () => {
     isLoading: isSubnetTransLoading
   } = useGetSubnetCountQuery()
 
+    // Debounce the search term to avoid making a request on every keystroke
+    useEffect(() => {
+      const handler = setTimeout(() => {
+        setDebouncedSearchTerm(searchTerm);
+      }, 500); // Adjust delay as needed
+      return () => {
+        clearTimeout(handler);
+      };
+    }, [searchTerm]);
+  
+
 
   const {
     data,
@@ -53,6 +68,7 @@ const SubnetId = () => {
   } = useGetSubnetAllQuery({
     pageNumber: currentPage,
     pageSize: pageSize,
+    searchTerm: debouncedSearchTerm
   })
 
   console.log(data?.data?.items);
@@ -205,7 +221,14 @@ const SubnetId = () => {
       </VStack>
 
       
-      <Container maxW="6xl">
+      {isLoading?<FullScreenLoaader half={true}/>: extractedArray?.length === 0 ? <Box p={"4rem 0"} >
+       <Container maxW="6xl">
+          <HStack justifyContent={"center"} mt={10}>
+            <Image w={"40px"} src={Search}/>
+            <Text as={"span"} color={"#787878"}>No records found</Text>
+          </HStack>
+       </Container>
+    </Box>: <Container maxW="6xl">
         <NormalTable
             emptyMessage={`We don't have any Sponers `}
             tableHeadRow={tableHeadRow}
@@ -220,7 +243,7 @@ const SubnetId = () => {
         setCurrentPage={setCurrentPage}
         currentPage={currentPage}
       />
-      </Container>
+      </Container>}
     </Box>
   );
 };

src/pages/Transaction/TransactionDetails.jsx

@@ -638,7 +638,7 @@ const TransactionDetails = () => {
                     mb={2}
                     color={colorMode === "light" ? "#7B7B7B" : "#E8E8E8"}
                   >
-                    Token Link:
+                    Token List:
                   </Text>
                   {data?.data?.tokenList?.map(({value,tokenId })=>
                   <Text
@@ -652,7 +652,7 @@ const TransactionDetails = () => {
                     textOverflow={"ellipsis"}
                     isTruncated
 
-                    fontSize={'sm'}
+                    fontSize={'xs'}
                   >
                     {tokenId}
                   </Text>