diff --git a/explorer-nextjs/src/app/(pages)/nym-node/[id]/page.tsx b/explorer-nextjs/src/app/(pages)/nym-node/[id]/page.tsx
index 7089dacac9..84daa3c76c 100644
--- a/explorer-nextjs/src/app/(pages)/nym-node/[id]/page.tsx
+++ b/explorer-nextjs/src/app/(pages)/nym-node/[id]/page.tsx
@@ -2,12 +2,12 @@ import { fetchNodeIdByIdentityKey, fetchNodeInfo } from "@/app/api";
import { ContentLayout } from "@/components/contentLayout/ContentLayout";
import SectionHeading from "@/components/headings/SectionHeading";
import { BasicInfoCard } from "@/components/nymNodePageComponents/BasicInfoCard";
+import { NodeDataCard } from "@/components/nymNodePageComponents/NodeDataCard";
// import { NodeChatCard } from "@/components/nymNodePageComponents/ChatCard";
import NodeDelegationsCard from "@/components/nymNodePageComponents/NodeDelegationsCard";
-import { NodeMetricsCard } from "@/components/nymNodePageComponents/NodeMetricsCard";
+import { NodeParametersCard } from "@/components/nymNodePageComponents/NodeParametersCard";
import { NodeProfileCard } from "@/components/nymNodePageComponents/NodeProfileCard";
-import { NodeRewardsCard } from "@/components/nymNodePageComponents/NodeRewardsCard";
-import { QualityIndicatorsCard } from "@/components/nymNodePageComponents/QualityIndicatorsCard";
+import { NodeRoleCard } from "@/components/nymNodePageComponents/NodeRoleCard";
import ExplorerButtonGroup from "@/components/toggleButton/ToggleButton";
import { Box } from "@mui/material";
import Grid from "@mui/material/Grid2";
@@ -15,7 +15,7 @@ import Grid from "@mui/material/Grid2";
export default async function NymNode({
params,
}: {
- params: Promise<{ id: string }>;
+ params: Promise<{ id: string }>; // node_id or identity_key
}) {
try {
let id: string | number;
@@ -82,7 +82,7 @@ export default async function NymNode({
md: 4,
}}
>
-
+
-
+
-
+
{
>
{title}
- {stakeLineGraphData && (
+ {/* {stakeLineGraphData && (
- )}
+ )} */}
);
diff --git a/explorer-nextjs/src/components/landingPageComponents/StakersNumberCard.tsx b/explorer-nextjs/src/components/landingPageComponents/StakersNumberCard.tsx
index 59ef4ba213..c287a39a05 100644
--- a/explorer-nextjs/src/components/landingPageComponents/StakersNumberCard.tsx
+++ b/explorer-nextjs/src/components/landingPageComponents/StakersNumberCard.tsx
@@ -17,7 +17,7 @@ export const RewardsCard = () => {
if (isLoading) {
return (
-
+
);
@@ -25,7 +25,7 @@ export const RewardsCard = () => {
if (isError || !observatoryNodes) {
return (
-
+
Failed to load node data.
@@ -41,7 +41,7 @@ export const RewardsCard = () => {
const allStakers = getActiveStakersNumber(observatoryNodes);
return (
-
+
{allStakers}
diff --git a/explorer-nextjs/src/components/nymNodePageComponents/BasicInfoCard.tsx b/explorer-nextjs/src/components/nymNodePageComponents/BasicInfoCard.tsx
index 265146c543..db7403c0a6 100644
--- a/explorer-nextjs/src/components/nymNodePageComponents/BasicInfoCard.tsx
+++ b/explorer-nextjs/src/components/nymNodePageComponents/BasicInfoCard.tsx
@@ -46,19 +46,11 @@ export const BasicInfoCard = ({ id }: IBasicInfoCardProps) => {
);
}
- const timeBonded = format(
- new Date(nodeInfo.description.build_information.build_timestamp),
- "dd/MM/yyyy",
- );
-
const selfBond = formatBigNum(
Number(nodeInfo.rewarding_details.operator) / 1_000_000,
);
const selfBondFormatted = `${selfBond} NYM`;
- const totalStake = formatBigNum(Number(nodeInfo.total_stake) / 1_000_000);
- const totalStakeFormatted = `${totalStake} NYM`;
-
return (
@@ -104,20 +96,14 @@ export const BasicInfoCard = ({ id }: IBasicInfoCardProps) => {
}
/>
-
+
-
-
+
);
diff --git a/explorer-nextjs/src/components/nymNodePageComponents/NodeMetricsCard.tsx b/explorer-nextjs/src/components/nymNodePageComponents/NodeDataCard.tsx
similarity index 84%
rename from explorer-nextjs/src/components/nymNodePageComponents/NodeMetricsCard.tsx
rename to explorer-nextjs/src/components/nymNodePageComponents/NodeDataCard.tsx
index 4a708e8df7..81898d8cff 100644
--- a/explorer-nextjs/src/components/nymNodePageComponents/NodeMetricsCard.tsx
+++ b/explorer-nextjs/src/components/nymNodePageComponents/NodeDataCard.tsx
@@ -4,6 +4,7 @@ import { useQuery } from "@tanstack/react-query";
import { fetchEpochRewards, fetchNodeInfo } from "../../app/api";
import { Skeleton, Typography } from "@mui/material";
+import { format } from "date-fns";
import ExplorerCard from "../cards/ExplorerCard";
import ExplorerListItem from "../list/ListItem";
@@ -11,7 +12,7 @@ interface INodeMetricsCardProps {
id: number; // Node ID
}
-export const NodeMetricsCard = ({ id }: INodeMetricsCardProps) => {
+export const NodeDataCard = ({ id }: INodeMetricsCardProps) => {
const {
data: epochRewardsData,
isLoading: isEpochLoading,
@@ -79,6 +80,11 @@ export const NodeMetricsCard = ({ id }: INodeMetricsCardProps) => {
epochRewardsData.interval.stake_saturation_point,
);
+ const softwareUpdateTime = format(
+ new Date(nodeInfo.description.build_information.build_timestamp),
+ "dd/MM/yyyy",
+ );
+
return (
{
label="Version"
value={nodeInfo.description.build_information.build_version}
/>
-
+
+
);
};
diff --git a/explorer-nextjs/src/components/nymNodePageComponents/NodeRewardsCard.tsx b/explorer-nextjs/src/components/nymNodePageComponents/NodeParametersCard.tsx
similarity index 81%
rename from explorer-nextjs/src/components/nymNodePageComponents/NodeRewardsCard.tsx
rename to explorer-nextjs/src/components/nymNodePageComponents/NodeParametersCard.tsx
index 42b0bbadac..305896f3b0 100644
--- a/explorer-nextjs/src/components/nymNodePageComponents/NodeRewardsCard.tsx
+++ b/explorer-nextjs/src/components/nymNodePageComponents/NodeParametersCard.tsx
@@ -1,5 +1,6 @@
"use client";
+import { formatBigNum } from "@/utils/formatBigNumbers";
import { Skeleton, Typography } from "@mui/material";
import { useQuery } from "@tanstack/react-query";
import { fetchEpochRewards, fetchNodeInfo } from "../../app/api";
@@ -7,11 +8,11 @@ import type { RewardingDetails } from "../../app/api/types";
import ExplorerCard from "../cards/ExplorerCard";
import ExplorerListItem from "../list/ListItem";
-interface INodeRewardsCardProps {
+interface INodeParametersCardProps {
id: number; // Node ID
}
-export const NodeRewardsCard = ({ id }: INodeRewardsCardProps) => {
+export const NodeParametersCard = ({ id }: INodeParametersCardProps) => {
// Fetch epoch rewards
const {
data: epochRewardsData,
@@ -34,10 +35,7 @@ export const NodeRewardsCard = ({ id }: INodeRewardsCardProps) => {
if (isEpochLoading || isNodeLoading) {
return (
-
+
@@ -48,10 +46,7 @@ export const NodeRewardsCard = ({ id }: INodeRewardsCardProps) => {
if (isEpochError || isNodeError || !nodeInfo || !epochRewardsData) {
return (
-
+
Failed to load node data.
@@ -59,11 +54,11 @@ export const NodeRewardsCard = ({ id }: INodeRewardsCardProps) => {
);
}
+ const totalStake = formatBigNum(Number(nodeInfo.total_stake) / 1_000_000);
+ const totalStakeFormatted = `${totalStake} NYM`;
+
// Extract reward details
const rewardDetails: RewardingDetails = nodeInfo.rewarding_details;
- // Calculated data
- const operatorRewards = Number(rewardDetails.operator) / 1_000_000;
- const operatorRewardsFormated = `${operatorRewards.toFixed(2)} NYM`;
const profitMarginPercent =
Number(rewardDetails.cost_params.profit_margin_percent) * 100;
@@ -95,16 +90,19 @@ export const NodeRewardsCard = ({ id }: INodeRewardsCardProps) => {
);
return (
-
+
+ {/*
+ /> */}
{
+export const NodeRoleCard = ({ id }: INodeRoleCardProps) => {
// Fetch node info
const {
data: nodeInfo,
@@ -169,7 +169,7 @@ export const QualityIndicatorsCard = ({ id }: IQualityIndicatorsCardProps) => {
if (isLoading) {
return (
-
+
@@ -179,7 +179,7 @@ export const QualityIndicatorsCard = ({ id }: IQualityIndicatorsCardProps) => {
if (isError || !nodeInfo) {
return (
-
+
Failed to load node data.
@@ -211,7 +211,7 @@ export const QualityIndicatorsCard = ({ id }: IQualityIndicatorsCardProps) => {
NodeRoles.length === 1 && nodeRoles[0] === "Mix Node";
return (
-
+