This commit is contained in:
2024-10-23 18:00:34 +05:30
parent 9b35f2516b
commit 5f3be49ed0
7 changed files with 77 additions and 71 deletions

View File

@@ -1,3 +1,4 @@
// GlobalStateContext.js
import { createContext } from 'react';

View File

@@ -554,53 +554,13 @@ const GlobalStateProvider = ({ children }) => {
const [subnetId, setSubnetId] = useState([
{
id: 1,
subnetId: "A1B2C3D4E5F6G",
transactionCount: "10",
},
{
id: 2,
subnetId: "A1B2C3D4E5F6G",
transactionCount: "10",
},
{
id: 3,
subnetId: "A1B2C3D4E5F6G",
transactionCount: "10",
},
{
id: 4,
subnetId: "A1B2C3D4E5F6G",
transactionCount: "10",
},
{
id: 5,
subnetId: "A1B2C3D4E5F6G",
transactionCount: "10",
},
{
id: 6,
subnetId: "A1B2C3D4E5F6G",
transactionCount: "10",
},
{
id: 7,
subnetId: "A1B2C3D4E5F6G",
transactionCount: "10",
},
{
id: 8,
subnetId: "A1B2C3D4E5F6G",
transactionCount: "10",
},
{
id: 9,
subnetId: "A1B2C3D4E5F6G",
transactionCount: "10",
},
{
id: 10,
subnetId: "A1B2C3D4E5F6G",
transactionCount: "10",
subnetId: "96717e750ab7944355fa6c8d9289609477c03ef84e7237eca632af62af89d001",
transactionCount: [
"96717e750ab7944355fa6c8d9289609477c03ef84e7237eca632af62af89d001",
"96717e750ab7944355fa6c8d9289609477c03ef84e7237eca632af62af89d001",
"96717e750ab7944355fa6c8d9289609477c03ef84e7237eca632af62af89d001",
"96717e750ab7944355fa6c8d9289609477c03ef84e7237eca632af62af89d001"
],
},
]);

View File

@@ -76,9 +76,9 @@ const NormalTable = ({
};
return (
<TableContainer rounded={5} overflowX={"auto"} className="h-auto w-100 table-scroll" bg={colorMode === "light" ? "#F2EFFF" : "#312F35"}>
<TableContainer boxShadow={'md'} rounded={5} overflowX={"auto"} className="h-auto w-100 table-scroll" bg={colorMode === "light" ? "#F2EFFF" : "#312F35"}>
<Table size="sm" variant="striped" colorScheme={colorMode === "light" ? "whiteScheme" : "darkPurple"}>
<Thead bg="forestGreen.100">
<Thead >
<Tr bg={colorMode === "light"? "#230A79" : "#312F35"}>
{showRadioButton &&(
<Th
@@ -103,11 +103,12 @@ const NormalTable = ({
fontWeight={500}
textAlign={
tableHeadRow.length - 1 === index || centered
? "center"
? "left"
: "left"
}
key={index}
p={4}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
@@ -171,7 +172,7 @@ const NormalTable = ({
color={colorMode === "light"? "#000000" : "#FFFFFF"}
textAlign={
tableHeadRow?.length - 1 === i || centered
? "center"
? "left"
: "left"
}
key={i}

View File

@@ -98,7 +98,7 @@ const LineChart = () => {
setLabels(dataLableMonthly);
setDataset(dataSetMonthly);
}
}, [selectedValue, dailyData]);
}, [selectedValue, dailyData, dateData, monthlyData]);
const data = {
labels: labels,

View File

@@ -45,9 +45,10 @@ const NavBar = () => {
top={0}
left={0}
id="navbar"
color={colorMode === "light" ? "light" : "black.900"}
// color={colorMode === "light" ? "light" : "light"}
padding={"16px 0px"}
borderBottom={colorMode === "light" ? "1px solid #ccc" : "none"}
borderBottom={colorMode === "light" ? "1px solid #4023A6" : "none"}
bg={colorMode === "light"? "#4023A6":""}
>
<Container maxW="6xl">
<Box
@@ -58,7 +59,8 @@ const NavBar = () => {
>
<Link to="/">
<Image
src={colorMode === "light" ? logoLight : logo}
// src={colorMode === "light" ? logoLight : logo}
src={logo}
// width={"120px"}
width={{base:"95px",md : "120px"}}
/>
@@ -71,6 +73,7 @@ const NavBar = () => {
fontSize={{ base: "12px", md: "14px" }}
fontWeight="400"
borderBottom={isActive ? "1px solid #DE858E" : "0px solid #fff"}
color={'#fff'}
>
MAIN NET
</Text>
@@ -82,6 +85,7 @@ const NavBar = () => {
fontSize={{ base: "12px", md: "14px" }}
fontWeight="400"
borderBottom={isActive ? "1px solid #DE858E" : "0px solid #fff"}
color={'#fff'}
>
SUBNETS
</Text>

View File

@@ -20,36 +20,28 @@ import TransactionTable from "./TransactionTable";
import { useGetTransByIdQuery } from "../../Services/api.service";
// import rbtLogoOutline from "../../src/assets/images/rubix-filled.svg";
import rbtLogoOutline from "../../assets/images/rubix-filled.svg";
import { formatUTCToDDMMYYHHMMSS } from "../../Constants/Constants";
import NormalTable from "../../components/DataTable/NormalTable";
const TransactionDetails = () => {
const navigate = useNavigate();
const params = useParams();
const { colorMode } = useColorMode();
console.log(params?.id);
const {
data,
isLoading,
refetch,
errors,
} = useGetTransByIdQuery(params?.id);
console.log(data?.data);
// Scroll to top when component mounts or params change
useEffect(() => {
window.scrollTo({ top: 0, behavior: "smooth" }); // Scroll to top smoothly when params change
}, [params]);
const { transactions } = useContext(GlobalStateContext);
const filteredData = transactions?.find(
(item) => item?.description === params?.id
);
console.log(filteredData);
const toast = useToast();
function copyToClipboard(text) {
navigator.clipboard
.writeText(text)
@@ -67,6 +59,31 @@ const TransactionDetails = () => {
});
}
console.log(data?.data?.quorumList);
// ===============================[ Table Header ]
const tableHeadRow = [
// "Sr. no",
"Quorum List"];
// const extractedArray = reportsHistory.map((item)=>({ }))
const extractedArray = data?.data?.quorumList?.map((item, index) => ({
"Sr. no": (
<Text w={18} as={"span"} display={"flex"} gap={2} alignItems={"center"}>
{index + 1}
</Text>
),
"Quorum List": (
<Box
color={colorMode === "light" ? "#230A79" : "#B09AFF"}
onClick={() => navigate(`/subnet-id-overview/${row["Subnet Id"]}`)}
>
{item}
</Box>
),
}));
return (
<>
<Box
@@ -210,7 +227,7 @@ const TransactionDetails = () => {
boxShadow={colorMode === "light" && "md"}
bg={colorMode === "light" ? "#F3F3F3" : "#1D1D1D"}
p={4}
mb={5}
mb={extractedArray&&5}
rounded={6}
>
{data?.data?.netWorkType && <>
@@ -328,8 +345,9 @@ const TransactionDetails = () => {
boxShadow={colorMode === "light" && "md"}
bg={colorMode === "light" ? "#F3F3F3" : "#1D1D1D"}
p={4}
mb={0}
mb={5}
rounded={6}
>
<HStack fontSize={"sm"} gap={{base:"4rem",md:"8rem"}} mb={2}>
{data?.data?.amount && <Box>
@@ -346,10 +364,25 @@ const TransactionDetails = () => {
</Box>}
{data?.data?.timestamp && <Box>
<Text>Timestamp</Text>
<Text color={"#A1A1A1"}>{data?.data?.timestamp}</Text>
<Text color={"#A1A1A1"}>{formatUTCToDDMMYYHHMMSS(data?.data?.timestamp)}</Text>
</Box>}
</HStack>
</Box>
{extractedArray&&<NormalTable
tableHeadRow={tableHeadRow}
data={extractedArray}
isLoading={isLoading}
/>}
<TransactionTable />
</Container>
</Box>

View File

@@ -19,12 +19,15 @@ const TransactionTable = () => {
}, []);
// ===============================[ Table Header ]
const tableHeadRow = ["Sr. no", "Quorum DID", "Pledge Token(s)"];
const tableHeadRow = [
// "Sr. no",
"Quorum DID",
"Pledge Token(s)"];
// const extractedArray = reportsHistory.map((item)=>({ }))
const extractedArray = subnetId.map((item, index) => ({
"Sr. no": (
<Text as={"span"} display={"flex"} gap={2} alignItems={"center"}>
<Text w={57} as={"span"} display={"flex"} gap={2} alignItems={"center"}>
{index + 1}
</Text>
),
@@ -36,7 +39,11 @@ const TransactionTable = () => {
{item?.subnetId}
</Box>
),
"Pledge Token(s)": item?.transactionCount,
"Pledge Token(s)": item?.transactionCount?.map((trans, index) => (
<Box mb={1} key={index} color={colorMode === "light" ? "#230A79" : "#B09AFF"}>
{trans}
</Box>
)),
}));
return (
<Box pt={5}>