From cf827a9cc910add02d8c3d87a912869b000ed2b2 Mon Sep 17 00:00:00 2001 From: YasinShaikh123 <123150391+YasinShaikh123@users.noreply.github.com> Date: Mon, 14 Oct 2024 20:14:50 +0530 Subject: [PATCH] UPDATED --- src/Contexts/GlobalStateProvider.jsx | 69 +++------ src/pages/DidInfo.jsx | 5 +- src/pages/MainNet.jsx | 207 ++++++++++--------------- src/pages/SmartContract.jsx | 17 ++- src/pages/Subnet.jsx | 217 +++++++++++---------------- src/pages/Transaction.jsx | 2 +- 6 files changed, 207 insertions(+), 310 deletions(-) diff --git a/src/Contexts/GlobalStateProvider.jsx b/src/Contexts/GlobalStateProvider.jsx index ff82013..cad4e6e 100644 --- a/src/Contexts/GlobalStateProvider.jsx +++ b/src/Contexts/GlobalStateProvider.jsx @@ -62,7 +62,7 @@ const GlobalStateProvider = ({ children }) => { { id: 1, description: - 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzABCDEFGHIJKLMNOPQRS5674577TUV WXYZ !"§ $%&', + 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzbc5def6ghi7jkl8mnojhdj9pqrs2tuv5wxys2tuv5wxy', sender: 'abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ', receiver: 'abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ', @@ -75,7 +75,7 @@ const GlobalStateProvider = ({ children }) => { { id: 2, description: - 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzbc5def6ghi7jkl8mno9pqrs2tuv5wxys2tuv5wxy', + 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzbc5de7euuf6ghi7jkl8mno9pqrs2tuv5wxys2tuv5wxy', sender: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", receiver: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", contract:"A1B2C3D4E5F6G", @@ -87,7 +87,7 @@ const GlobalStateProvider = ({ children }) => { { id: 3, description: - 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzbc5def6ghi7jkl8mno9pqrs2tuv5wxys2tuv5wxy', + 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzbjfu8c5def6ghi7jkl8mno9pqrs2tuv5wxys2tuv5wxy', sender: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", receiver: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", contract:"A1B2C3D4E5F6G", @@ -99,7 +99,7 @@ const GlobalStateProvider = ({ children }) => { { id: 4, description: - 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzbc5def6ghi7jkl8mno9pqrs2tuv5wxys2tuv5wxy', + 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzbjfhfi9c5def6ghi7jkl8mno9pqrs2tuv5wxys2tuv5wxy', sender: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", receiver: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", contract:"A1B2C3D4E5F6G", @@ -109,9 +109,22 @@ const GlobalStateProvider = ({ children }) => { subnetID: "S1N2P3E4T5I6D", }, { - id: 5, + id: 1, description: - 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzbc5def6ghi7jkl8mno9pqrs2tuv5wxys2tuv5wxy', + 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzbc5def6ghi7jkl8mnojhdj9pqrs2tuv5wxys2tuv5wxy', + sender: 'abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ', + receiver: + 'abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ', + contract:"A1B2C3D4E5F6G", + date:"18 hours ago, 29/07/2024", + amount:"$ 10000.12345", + transactionType: "ABCDESDJFDBJ", + subnetID: "A1B2C3D4E5F6G", + }, + { + id: 2, + description: + 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzbc5de7euuf6ghi7jkl8mno9pqrs2tuv5wxys2tuv5wxy', sender: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", receiver: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", contract:"A1B2C3D4E5F6G", @@ -121,9 +134,9 @@ const GlobalStateProvider = ({ children }) => { subnetID: "S1N2P3E4T5I6D", }, { - id: 6, + id: 3, description: - 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzbc5def6ghi7jkl8mno9pqrs2tuv5wxys2tuv5wxy', + 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzbjfu8c5def6ghi7jkl8mno9pqrs2tuv5wxys2tuv5wxy', sender: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", receiver: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", contract:"A1B2C3D4E5F6G", @@ -133,45 +146,9 @@ const GlobalStateProvider = ({ children }) => { subnetID: "S1N2P3E4T5I6D", }, { - id: 7, + id: 4, description: - 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzbc5def6ghi7jkl8mno9pqrs2tuv5wxys2tuv5wxy', - sender: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", - receiver: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", - contract:"A1B2C3D4E5F6G", - date:"18 hours ago, 29/07/2024", - amount:"$ 10000.12345", - transactionType: "TXType2Example", - subnetID: "S1N2P3E4T5I6D", - }, - { - id: 8, - description: - 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzbc5def6ghi7jkl8mno9pqrs2tuv5wxys2tuv5wxy', - sender: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", - receiver: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", - contract:"A1B2C3D4E5F6G", - date:"18 hours ago, 29/07/2024", - amount:"$ 10000.12345", - transactionType: "TXType2Example", - subnetID: "S1N2P3E4T5I6D", - }, - { - id: 9, - description: - 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzbc5def6ghi7jkl8mno9pqrs2tuv5wxys2tuv5wxy', - sender: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", - receiver: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", - contract:"A1B2C3D4E5F6G", - date:"18 hours ago, 29/07/2024", - amount:"$ 10000.12345", - transactionType: "TXType2Example", - subnetID: "S1N2P3E4T5I6D", - }, - { - id: 10, - description: - 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzbc5def6ghi7jkl8mno9pqrs2tuv5wxys2tuv5wxy', + 'abc5def6ghi7jkl8mno9pqrs2tuv5wxyzbjfhfi9c5def6ghi7jkl8mno9pqrs2tuv5wxys2tuv5wxy', sender: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", receiver: "abcdefghiklmnopqrstuvwxyzABCDEGHIJKLMNOPQRSTUVWXYZ", contract:"A1B2C3D4E5F6G", diff --git a/src/pages/DidInfo.jsx b/src/pages/DidInfo.jsx index 721aee4..fa92dc1 100644 --- a/src/pages/DidInfo.jsx +++ b/src/pages/DidInfo.jsx @@ -10,7 +10,7 @@ import { } from "@chakra-ui/react"; import React, { useEffect } from "react"; import { MdContentCopy} from "react-icons/md"; - import { Link, useParams } from "react-router-dom"; + import { Link, useNavigate, useParams } from "react-router-dom"; import RelatedTransactions from "../components/RelatedTransactions/RelatedTransactions"; import bannerImage from "../assets/images/bannerImg.png"; import ToastBox from "../components/ToastBox"; @@ -18,9 +18,10 @@ import ToastBox from "../components/ToastBox"; const DidInfo = () => { useEffect(() => { window.scrollTo({ top: 0, behavior: "smooth" }); // Scroll to top smoothly when params change - }, [params]); + }, []); const { colorMode } = useColorMode(); const params = useParams() + const navigate = useNavigate() const toast = useToast() diff --git a/src/pages/MainNet.jsx b/src/pages/MainNet.jsx index a42b2e8..404dea6 100644 --- a/src/pages/MainNet.jsx +++ b/src/pages/MainNet.jsx @@ -1,16 +1,17 @@ -import { Box, Container, Grid, GridItem, Heading, HStack, Select, Text, useColorMode, useToast } from "@chakra-ui/react"; +import { Box, Container, Grid, GridItem, Heading, HStack, Select, Text, useColorMode, useToast, VStack } from "@chakra-ui/react"; import React, { useContext } from "react"; import bannerImage from "../assets/images/bannerImg.png"; import GlobalStateContext from "../Contexts/GlobalStateContext"; import Pagination from "../components/Pagination"; import { MdContentCopy, MdOutlineErrorOutline } from "react-icons/md"; import ToastBox from "../components/ToastBox"; -import { Link } from "react-router-dom"; +import { Link, useNavigate } from "react-router-dom"; const MainNet = () => { const { overview } = useContext(GlobalStateContext); const { colorMode} = useColorMode(); + const navigate = useNavigate() const toast = useToast() @@ -72,132 +73,90 @@ const MainNet = () => { {overview.map((transaction, index) => ( - - {index + 1}. - - - - - {transaction.description} - - - - Sender : + bg={index % 2 === 0 ? (colorMode === "light" ? "#F2EFFF" : "#312F35") : (colorMode === "light" ? "#fff" : "#232127")} + key={transaction.id} + templateColumns="10% 90%" + gap={0} + > + {index + 1}. + + + + {transaction.description} + + + copyToClipboard(transaction.description)}/> - - {transaction.sender} - - copyToClipboard(transaction.sender)} /> - - - - - Receiver : + + + + Sender : + + navigate(`/did-info/${transaction.sender}`)} >{transaction.sender} + + copyToClipboard(transaction.sender)}/> - - {transaction.receiver} - copyToClipboard(transaction.receiver)} /> + + + + Receiver : + + navigate(`/did-info/${transaction.receiver}`)} >{transaction.receiver} + copyToClipboard(transaction.receiver)} /> + + + + + + Smart contract ID dd : + + {transaction.contract} + + + + Date and Time Stamp : + + {transaction.date} + + + + Amount: + + {transaction.amount} + + + + + + + Transaction type : + + {transaction.transactionType} + - - - - - Smart contract ID dd: + + + Main net : + + {transaction.subnetID} - - {transaction.contract} - - - - - Date and Time Stamp : - - - {transaction.date} - - - - - Amount: - - - {transaction.amount} - - - - - - - - - Transaction type : - - - {transaction.transactionType} - - - - - Subnet ID/Main net : - - - {transaction.subnetID} - - - - - - - + + + + + + + ))} diff --git a/src/pages/SmartContract.jsx b/src/pages/SmartContract.jsx index f02dbc7..bcb2470 100644 --- a/src/pages/SmartContract.jsx +++ b/src/pages/SmartContract.jsx @@ -10,13 +10,14 @@ import { } from "@chakra-ui/react"; import React, { useEffect } from "react"; import { MdContentCopy} from "react-icons/md"; - import { Link } from "react-router-dom"; + import { Link, useNavigate } from "react-router-dom"; import RelatedTransactions from "../components/RelatedTransactions/RelatedTransactions"; import bannerImage from "../assets/images/bannerImg.png"; import ToastBox from "../components/ToastBox"; const Transaction = () => { const { colorMode } = useColorMode(); + const navigate = useNavigate() useEffect(() => { window.scrollTo({ top: 0, behavior: "smooth" }); // Scroll to top smoothly when params change }, []); @@ -53,9 +54,9 @@ import ToastBox from "../components/ToastBox"; abc5def6ghi7jkl8mno9pqrs2tuv5wxyzabcdefghijklmnopqrs5674577tuvwxyz !"§ $%& - + {/* copyToClipboard(transaction.sender)}/> - + */} @@ -105,8 +106,8 @@ import ToastBox from "../components/ToastBox"; Network - - abc5def6ghi7jkl8mno9pqrs2tuv5wxyzabcdefghijklmnopqrs5674577tuvwxyz !"§ $%& + + navigate(`/did-info/${transaction.sender}`)}> abc5def6ghi7jkl8mno9pqrs2tuv5wxyzabcdefghijklmnopqrs5674577tuvwxyz !"§ $%& copyToClipboard(transaction.sender)}/> @@ -115,21 +116,21 @@ import ToastBox from "../components/ToastBox"; Executor - abc5def6ghi7jkl8mno9pqrs2tuv5wxyzabcdefghijklmnopqrs5674577tuvwxyz !"§ $%& + navigate(`/did-info/abc5def6ghi7jkl8mno9pqrs2tuv5wxyzabcdefghijklmnopqrs5674577tuvwxyz`)}> abc5def6ghi7jkl8mno9pqrs2tuv5wxyzabcdefghijklmnopqrs5674577tuvwxyz !"§ $%& copyToClipboard(transaction.sender)}/> Deployer - abc5def6ghi7jkl8mno9pqrs2tuv5wxyzabcdefghijklmnopqrs5674577tuvwxyz !"§ $%& + navigate(`/did-info/abc5def6ghi7jkl8mno9pqrs2tuv5wxyzabcdefghijklmnopqrs5674577tuvwxyz`)}> abc5def6ghi7jkl8mno9pqrs2tuv5wxyzabcdefghijklmnopqrs5674577tuvwxyz !"§ $%& copyToClipboard(transaction.sender)}/> Creator - abc5def6ghi7jkl8mno9pqrs2tuv5wxyzabcdefghijklmnopqrs5674577tuvwxyz !"§ $%& + navigate(`/did-info/abc5def6ghi7jkl8mno9pqrs2tuv5wxyzabcdefghijklmnopqrs5674577tuvwxyz`)}> abc5def6ghi7jkl8mno9pqrs2tuv5wxyzabcdefghijklmnopqrs5674577tuvwxyz !"§ $%& copyToClipboard(transaction.sender)}/> diff --git a/src/pages/Subnet.jsx b/src/pages/Subnet.jsx index 597c692..87fb788 100644 --- a/src/pages/Subnet.jsx +++ b/src/pages/Subnet.jsx @@ -1,6 +1,6 @@ -import { Box, Container, Grid, GridItem, Heading, HStack, Select, Text, useColorMode, useToast } from "@chakra-ui/react"; +import { Box, Container, Grid, GridItem, Heading, HStack, Select, Text, useColorMode, useToast, VStack } from "@chakra-ui/react"; import React, { useContext } from "react"; -import { Link } from "react-router-dom"; +import { Link, useNavigate } from "react-router-dom"; import LatestTransactions from "../components/LatestTransactions/LatestTransactions"; import GlobalStateContext from "../Contexts/GlobalStateContext"; import Pagination from "../components/Pagination"; @@ -12,6 +12,7 @@ const Subnet = () => { const { overview } = useContext(GlobalStateContext); const { colorMode} = useColorMode(); + const navigate = useNavigate() const toast = useToast() @@ -72,133 +73,91 @@ const Subnet = () => { {overview.map((transaction, index) => ( - - - {index + 1}. - - - - - {transaction.description} - - - - Sender : - - - {transaction.sender} - - copyToClipboard(transaction.sender)} /> - - - - - Receiver : - - - {transaction.receiver} - copyToClipboard(transaction.receiver)} /> - - - - - - Smart contract ID dd : - - - {transaction.contract} - - - - - Date and Time Stamp : - - - {transaction.date} - - - - - Amount: - - - {transaction.amount} - - - - - - - - - Transaction type : - - - {transaction.transactionType} - - - - - Subnet ID/Main net : - - - {transaction.subnetID} - - - - - - - + + {index + 1}. + + + + {transaction.description} + + + copyToClipboard(transaction.description)}/> + + + + + Sender : + + navigate(`/did-info/${transaction.sender}`)} >{transaction.sender} + + copyToClipboard(transaction.sender)}/> + + + + + Receiver : + + navigate(`/did-info/${transaction.receiver}`)} >{transaction.receiver} + copyToClipboard(transaction.receiver)} /> + + + + + + Smart contract ID dd : + + {transaction.contract} + + + + Date and Time Stamp : + + {transaction.date} + + + + Amount: + + {transaction.amount} + + + + + + + Transaction type : + + {transaction.transactionType} + + + + + Subnet ID/Main net : + + {transaction.subnetID} + + + + + + + + ))} diff --git a/src/pages/Transaction.jsx b/src/pages/Transaction.jsx index 44493e5..c8d1716 100644 --- a/src/pages/Transaction.jsx +++ b/src/pages/Transaction.jsx @@ -71,7 +71,7 @@ const Transaction = () => { copyToClipboard(transaction.sender)}/> - +