Add spectreDao tokenomics to landing page

explorer-nextjs/src/app/api/types.ts

@@ -384,3 +384,40 @@ export type ObservatoryBalance = {
   self_bonded: BalanceDetails;
   spendable: BalanceDetails;
 };
+
+export type Quote = {
+  ath_date: string;
+  ath_price: number;
+  market_cap: number;
+  market_cap_change_24h: number;
+  percent_change_12h: number;
+  percent_change_15m: number;
+  percent_change_1h: number;
+  percent_change_1y: number;
+  percent_change_24h: number;
+  percent_change_30d: number;
+  percent_change_30m: number;
+  percent_change_6h: number;
+  percent_change_7d: number;
+  percent_from_price_ath: number;
+  price: number;
+  volume_24h: number;
+  volume_24h_change_24h: number;
+};
+
+export type Quotes = {
+  USD: Quote;
+};
+
+export type NymTokenomics = {
+  beta_value: number;
+  first_data_at: string;
+  id: string;
+  last_updated: string;
+  max_supply: number;
+  name: string;
+  quotes: Quotes;
+  rank: number;
+  symbol: string;
+  total_supply: number;
+};

explorer-nextjs/src/app/api/urls.ts

@@ -28,8 +28,7 @@ export const NYM_NODE_BONDED =
   "https://validator.nymtech.net/api/v1/nym-nodes/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";
+export const NYM_PRICES_API = "https://api.nym.spectredao.net/api/v1/nym-price";
 export const VALIDATOR_BASE_URL =
   process.env.NEXT_PUBLIC_VALIDATOR_URL || "https://rpc.nymtech.net";
 export const DATA_OBSERVATORY_NODES_URL =

explorer-nextjs/src/components/landingPageComponents/TokenomicsCard.tsx

@@ -1,4 +1,4 @@
-import type { CurrencyRates } from "@/app/api/types";
+import type { CurrencyRates, NymTokenomics } from "@/app/api/types";
 import { NYM_PRICES_API } from "@/app/api/urls";
 import { Box, Stack } from "@mui/material";
 import ExplorerCard from "../cards/ExplorerCard";
@@ -15,8 +15,8 @@ export const TokenomicsCard = async () => {
     // refresh event list cache at given interval
   });
 
-  const nymPriceData: CurrencyRates = await nymPrice.json();
-  const nymPriceDataFormated = Number(nymPriceData.usd.toFixed(2));
+  const nymPriceData: NymTokenomics = await nymPrice.json();
+  const nymPriceDataFormated = Number(nymPriceData.quotes.USD.price.toFixed(2));
 
   const titlePrice = {
     price: nymPriceDataFormated,
@@ -25,9 +25,11 @@ export const TokenomicsCard = async () => {
     //   numberWentUp: true,
     // },
   };
+  const marketCap = nymPriceData.quotes.USD.market_cap;
+  const volume24H = nymPriceData.quotes.USD.volume_24h.toFixed(2);
   const dataRows = [
-    { key: "Market cap", value: "$ 1000000" },
-    { key: "24H VOL", value: "$ 1000000" },
+    { key: "Market cap", value: `$ ${marketCap}` },
+    { key: "24H VOL", value: `$ ${volume24H}` },
   ];
 
   return (