diff --git a/explorer-nextjs/src/components/landingPageComponents/NoiseCard.tsx b/explorer-nextjs/src/components/landingPageComponents/NoiseCard.tsx index c722184f7b..e7f9645763 100644 --- a/explorer-nextjs/src/components/landingPageComponents/NoiseCard.tsx +++ b/explorer-nextjs/src/components/landingPageComponents/NoiseCard.tsx @@ -17,7 +17,7 @@ export const NoiseCard = () => { if (isLoading) { return ( - + @@ -28,7 +28,7 @@ export const NoiseCard = () => { if (isError || !data) { return ( - + Failed to load data @@ -91,7 +91,7 @@ export const NoiseCard = () => { }); return ( - + { ); } - // Function to calculate active set probability - const getActiveSetProbability = ( - totalStake: number, - stakeSaturationPoint: string, - ): string => { - const saturation = Number.parseFloat(stakeSaturationPoint); - - if (Number.isNaN(saturation) || saturation <= 0) { - throw new Error("Invalid stake saturation point provided"); - } - - const ratio = (totalStake / saturation) * 100; - - if (ratio > 70) { - return "High"; - } - if (ratio >= 40 && ratio <= 70) { - return "Medium"; - } - return "Low"; - }; - - const activeSetProb = getActiveSetProbability( - nodeInfo.total_stake, - epochRewardsData.interval.stake_saturation_point, - ); - const softwareUpdateTime = format( new Date(nodeInfo.description.build_information.build_timestamp), "dd/MM/yyyy", @@ -105,12 +78,6 @@ export const NodeDataCard = ({ id }: INodeMetricsCardProps) => { label="Version" value={nodeInfo.description.build_information.build_version} /> - { queryKey: ["nodeInfo", id], queryFn: () => fetchNodeInfo(id), }); + const { + data: epochRewardsData, + isLoading: isEpochLoading, + isError: isEpochError, + } = useQuery({ + queryKey: ["epochRewards"], + queryFn: fetchEpochRewards, + }); // Extract node roles once `nodeInfo` is available const nodeRoles = nodeInfo @@ -167,7 +179,7 @@ export const NodeRoleCard = ({ id }: INodeRoleCardProps) => { enabled: !!nodeInfo?.identity_key && shouldFetchGatewayStatus, // ✅ Only fetch if needed }); - if (isLoading) { + if (isLoading || isEpochLoading) { return ( @@ -177,7 +189,7 @@ export const NodeRoleCard = ({ id }: INodeRoleCardProps) => { ); } - if (isError || !nodeInfo) { + if (isError || !nodeInfo || !epochRewardsData) { return ( @@ -210,6 +222,32 @@ export const NodeRoleCard = ({ id }: INodeRoleCardProps) => { const nodeIsMixNodeOnly = NodeRoles.length === 1 && nodeRoles[0] === "Mix Node"; + // Function to calculate active set probability + const getActiveSetProbability = ( + totalStake: number, + stakeSaturationPoint: string, + ): string => { + const saturation = Number.parseFloat(stakeSaturationPoint); + + if (Number.isNaN(saturation) || saturation <= 0) { + throw new Error("Invalid stake saturation point provided"); + } + + const ratio = (totalStake / saturation) * 100; + + if (ratio > 70) { + return "High"; + } + if (ratio >= 40 && ratio <= 70) { + return "Medium"; + } + return "Low"; + }; + const activeSetProb = getActiveSetProbability( + nodeInfo.total_stake, + epochRewardsData.interval.stake_saturation_point, + ); + return ( { value={} /> )} + ); };