diff --git a/explorer-nextjs/src/app/api/types.ts b/explorer-nextjs/src/app/api/types.ts
index d860a5bc81..f6ac573c5e 100644
--- a/explorer-nextjs/src/app/api/types.ts
+++ b/explorer-nextjs/src/app/api/types.ts
@@ -106,3 +106,11 @@ type NodeData = {
};
export default NodeData;
+
+export interface CurrencyRates {
+ btc: number;
+ chf: number;
+ eur: number;
+ timestamp: number;
+ usd: number;
+}
diff --git a/explorer-nextjs/src/app/api/urls.ts b/explorer-nextjs/src/app/api/urls.ts
index a10204aee2..d2ec69f27a 100644
--- a/explorer-nextjs/src/app/api/urls.ts
+++ b/explorer-nextjs/src/app/api/urls.ts
@@ -29,6 +29,5 @@ export const NYM_NODE_BONDED =
export const NYM_ACCOUNT_ADDRESS =
"https://explorer.nymtech.net/api/v1/tmp/unstable/account/";
-
export const NYM_PRICES_API =
"https://canary-nym-vpn-chain-payment-watcher.nymte.ch/v1/price/average";
diff --git a/explorer-nextjs/src/components/landingPageComponents/TokenomicsCard.tsx b/explorer-nextjs/src/components/landingPageComponents/TokenomicsCard.tsx
index 75edb19049..7dec2c6423 100644
--- a/explorer-nextjs/src/components/landingPageComponents/TokenomicsCard.tsx
+++ b/explorer-nextjs/src/components/landingPageComponents/TokenomicsCard.tsx
@@ -1,15 +1,29 @@
+import type { CurrencyRates } from "@/app/api/types";
+import { NYM_PRICES_API } from "@/app/api/urls";
import { Box, Stack } from "@mui/material";
import ExplorerCard from "../cards/ExplorerCard";
import ExplorerListItem from "../list/ListItem";
import { TitlePrice } from "../price/TitlePrice";
export const TokenomicsCard = async () => {
- const titlePrice = {
- price: 1.15,
- upDownLine: {
- percentage: 10,
- numberWentUp: true,
+ const nymPrice = await fetch(NYM_PRICES_API, {
+ headers: {
+ Accept: "application/json",
+ "Content-Type": "application/json; charset=utf-8",
},
+ next: { revalidate: 60 },
+ // refresh event list cache at given interval
+ });
+
+ const nymPriceData: CurrencyRates = await nymPrice.json();
+ const nymPriceDataFormated = Number(nymPriceData.usd.toFixed(2));
+
+ const titlePrice = {
+ price: nymPriceDataFormated,
+ // upDownLine: {
+ // percentage: 10,
+ // numberWentUp: true,
+ // },
};
const dataRows = [
{ key: "Market cap", value: "$ 1000000" },
diff --git a/explorer-nextjs/src/components/price/TitlePrice.tsx b/explorer-nextjs/src/components/price/TitlePrice.tsx
index 5f0684ea5d..1fbaeafa29 100644
--- a/explorer-nextjs/src/components/price/TitlePrice.tsx
+++ b/explorer-nextjs/src/components/price/TitlePrice.tsx
@@ -8,7 +8,7 @@ import {
interface ITitlePriceProps {
price: number;
- upDownLine: IUpDownPriceIndicatorProps;
+ upDownLine?: IUpDownPriceIndicatorProps;
}
export const TitlePrice = (props: ITitlePriceProps): React.ReactNode => {
const { price, upDownLine } = props;
@@ -25,7 +25,7 @@ export const TitlePrice = (props: ITitlePriceProps): React.ReactNode => {
${price}
-
+ {upDownLine && }
);
};