Feature/testnet

src/components/Chart/ApexPie.jsx

@@ -55,7 +55,7 @@ function ApexPie(props) {
 
   return (
     <Chart
-      key={Math.random()}
+      key={options.theme.mode}
       options={options}
       series={series}
       type="donut"

src/components/Chart/ChartsApex.jsx

@@ -15,9 +15,7 @@ import { useNetwork } from 'hooks/useNetwork/useNetwork';
 
 function ChartsApex() {
   const { sharedState } = useAppContext();
-
   const [isDarkMode] = useDarkMode();
-  let apexChartRef = useRef();
 
   // * fetch the blocks first and extract the total number of contracts inside the trasactions
   const [limit, setLimit] = useState(2 * 60);
@@ -193,22 +191,15 @@ function ChartsApex() {
   // Bug tribute: chart not updating when updating state (fixed with adding random key)
   // https://github.com/reactchartjs/react-chartjs-2/issues/90
   return (
-    <div>
-      {/* <input
-        type="number"
-        value={limit}
-        onChange={(e) => setLimit(e.target.value)}></input> */}
-      <Chart
-        className={styles.container}
-        ref={apexChartRef}
-        key={Math.random()}
-        options={chartState.options}
-        series={chartState.series}
-        height={190}
-        width={'100%'}
-        type="area"
-      />
-    </div>
+    <Chart
+      className={styles.container}
+      key={chartState.options.theme.mode}
+      options={chartState.options}
+      series={chartState.series}
+      height={190}
+      width={'100%'}
+      type="area"
+    />
   );
 }
 

src/components/Panel2/Panel2.js

@@ -122,7 +122,7 @@ function Panel2(props) {
 
   return (
     <Rail className={styles.panelTwoContainer} scrollSpeed={1.8}>
-      {network === NETWORKS.MAINNET && (
+      {network.name === NETWORKS.MAINNET.name && (
         <DetailCard
           type
           icon={<GiTwoCoins color="white" size="2.25rem" />}

src/pages/blocks.js

@@ -17,20 +17,6 @@ export default function Blocks(props) {
   const [pageCount, setPageCount] = useState(1);
   const [totalRows, setTotalRows] = useState(0);
 
-  const [mainnetPage, setMainnetPage] = useState({
-    pageSize: 10,
-    pageIndex: 0,
-    pageCount: 1,
-    totalRows: 0,
-  });
-
-  const [testnetPage, setTestnetPage] = useState({
-    pageSize: 10,
-    pageIndex: 0,
-    pageCount: 1,
-    totalRows: 0,
-  });
-
   const columns = [
     {
       Header: 'Block',
@@ -68,18 +54,22 @@ export default function Blocks(props) {
     getBlocks
   );
 
+  useEffect(() => {
+    // reset all pagination props on network change
+    setPageSize(10);
+    setPageIndex(0);
+    setPageCount(1);
+    setTotalRows(0);
+  }, [network]);
+
   useEffect(() => {
     if (data) {
       let height = data[0].height;
-      if (network == NETWORKS.MAINNET) {
-        if (height > totalRows) {
-          setTotalRows(height);
-        }
-      } else if (network == NETWORKS.TESTNET) {
-        setTotalRows(height); // temp fix , need to get the total rows from the testnet
+      if (height > totalRows) {
+        setTotalRows(height);
       }
     }
-  }, [data, pageSize, network]);
+  }, [data, pageSize]);
 
   useEffect(() => {
     setPageCount(totalPages(totalRows, pageSize));
@@ -128,16 +118,3 @@ export default function Blocks(props) {
     );
   }
 }
-
-// export async function getServerSideProps() {
-//   const resp = await fetch(
-//     `${process.env.NEXT_PUBLIC_NEXUS_BASE_URL}/ledger/list/blocks?limit=50`
-//   );
-//   const data = await resp.json();
-
-//   return {
-//     props: {
-//       data: data.result,
-//     },
-//   };
-// }

src/pages/transactions.js

@@ -19,7 +19,7 @@ export default function Transactions(props) {
   const [totalRows, setTotalRows] = useState(0);
   const [rows, setRows] = useState([]);
 
-  const {network, getTransactions} = useNetwork();
+  const { network, getTransactions } = useNetwork();
   const { isLoading, data, error } = useQuery(
     ['transactions', pageIndex, pageSize, network.name],
     getTransactions
@@ -37,6 +37,14 @@ export default function Transactions(props) {
     }
   }, [data]);
 
+  useEffect(() => {
+    // reset all pagination props on network change
+    setPageSize(10);
+    setPageIndex(0);
+    setPageCount(1);
+    setTotalRows(0);
+  }, [network]);
+
   useEffect(() => {
     if (data) {
       // console.log(data)

src/types/FooterTypes.js

@@ -2,6 +2,7 @@ import {
   BsApple,
   BsBook,
   BsChatLeftText,
+  BsDiscord,
   BsFileEarmarkText,
   BsGithub,
   BsGlobe2,
@@ -66,6 +67,12 @@ export const FooterTypes = {
             label: 'Price Talk',
             icon: (props) => <BsChatLeftText {...props} />,
           },
+          {
+            href: 'https://discord.gg/CtSrw26Y',
+            target: '_blank',
+            label: 'Discord',
+            icon: (props) => <BsDiscord {...props} />,
+          },
         ],
       },
       WALLET_LINKS: {