GRIN/nym
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add caching on tanstack queries

Browse Source
This commit is contained in:
Yana
2025-03-20 20:09:40 +02:00
parent ba5e86e842
commit 9e70c7a32d
20 changed files with 103 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
explorer-v2/src/app/api/index.tsx
+1
View File
@@ -239,6 +239,7 @@ export const fetchObservatoryNodes = async (): Promise<IObservatoryNode[]> => {
page++; // Move to the next page
}
}
console.log("fetching nodes")
return allNodes;
};
explorer-v2/src/components/accountPageComponents/AccountBalancesCard.tsx
+9 -3
View File
@@ -70,6 +70,9 @@ export const AccountBalancesCard = (props: IAccountBalancesCardProps) => {
queryKey: ["accountBalance", address],
queryFn: () => fetchAccountBalance(address),
enabled: !!address,
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
const {
@@ -79,6 +82,9 @@ export const AccountBalancesCard = (props: IAccountBalancesCardProps) => {
} = useQuery({
queryKey: ["nymPrice"],
queryFn: fetchNymPrice,
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
if (isLoading || isLoadingPrice) {
@@ -120,9 +126,9 @@ export const AccountBalancesCard = (props: IAccountBalancesCardProps) => {
const spendableAllocation =
accountInfo.balances.length > 0
? getAllocation(
Number(accountInfo.balances[0].amount),
Number(accountInfo.total_value.amount),
)
Number(accountInfo.balances[0].amount),
Number(accountInfo.total_value.amount),
)
: 0;
const delegationsNYM = getNymsFormated(
explorer-v2/src/components/accountPageComponents/AccountInfoCard.tsx
+3
View File
@@ -18,6 +18,9 @@ export const AccountInfoCard = (props: IAccountInfoCardProps) => {
queryKey: ["accountBalance", address],
queryFn: () => fetchAccountBalance(address),
enabled: !!address,
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
if (isLoading) {
explorer-v2/src/components/landingPageComponents/NetworkStakeCard.tsx
+16 -13
View File
@@ -15,6 +15,9 @@ export const NetworkStakeCard = () => {
} = useQuery({
queryKey: ["noise"],
queryFn: fetchNoise,
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
if (isStakingLoading) {
@@ -46,20 +49,20 @@ export const NetworkStakeCard = () => {
packetsAndStaking[packetsAndStaking.length - 1]?.total_stake / 1_000_000;
const startDate = new Date("2025-02-26").getTime(); // Convert to timestamp
const startDate = new Date("2025-02-26").getTime(); // Convert to timestamp
const data = packetsAndStakingData
.slice(0, -1) // Exclude the last element
.filter((item: IPacketsAndStakingData) => {
const itemDate = new Date(item.date_utc).getTime(); // Convert each date to timestamp
return itemDate >= startDate; // Compare timestamps
})
.map((item: IPacketsAndStakingData) => ({
date_utc: item.date_utc,
numericData: item.total_stake / 1000000,
}));
const data = packetsAndStakingData
.slice(0, -1) // Exclude the last element
.filter((item: IPacketsAndStakingData) => {
const itemDate = new Date(item.date_utc).getTime(); // Convert each date to timestamp
return itemDate >= startDate; // Compare timestamps
})
.map((item: IPacketsAndStakingData) => ({
date_utc: item.date_utc,
numericData: item.total_stake / 1000000,
}));
const stakeLineGraphData = {
color: "#00CA33",
explorer-v2/src/components/landingPageComponents/NoiseCard.tsx
+4 -1
View File
@@ -13,6 +13,9 @@ export const NoiseCard = () => {
const { data, isLoading, isError } = useQuery({
queryKey: ["noise"],
queryFn: fetchNoise,
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
if (isLoading) {
@@ -43,7 +46,7 @@ export const NoiseCard = () => {
const noiseLast24H =
todaysData.total_packets_sent + todaysData.total_packets_received;
const noisePrevious24H =
yesterdaysData.total_packets_sent + yesterdaysData.total_packets_received;
explorer-v2/src/components/landingPageComponents/StakersNumberCard.tsx
+7 -4
View File
@@ -7,12 +7,15 @@ import ExplorerCard from "../cards/ExplorerCard";
export const RewardsCard = () => {
const {
data: observatoryNodes,
data: nymNodes,
isLoading,
isError,
} = useQuery({
queryKey: ["observatoryNodes"],
queryKey: ["nymNodes"],
queryFn: () => fetchObservatoryNodes(),
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
if (isLoading) {
@@ -23,7 +26,7 @@ export const RewardsCard = () => {
);
}
if (isError || !observatoryNodes) {
if (isError || !nymNodes) {
return (
<ExplorerCard label="Number of delegations">
<Typography variant="h3" sx={{ color: "pine.950" }}>
@@ -38,7 +41,7 @@ export const RewardsCard = () => {
0,
);
};
const allStakers = getActiveStakersNumber(observatoryNodes);
const allStakers = getActiveStakersNumber(nymNodes);
return (
<ExplorerCard label="Number of delegations">
explorer-v2/src/components/landingPageComponents/TokenomicsCard.tsx
+9
View File
@@ -16,6 +16,9 @@ export const TokenomicsCard = () => {
} = useQuery({
queryKey: ["nymPrice"],
queryFn: fetchNymPrice,
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
const {
@@ -25,6 +28,9 @@ export const TokenomicsCard = () => {
} = useQuery({
queryKey: ["epochRewards"],
queryFn: fetchEpochRewards,
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
const {
@@ -34,6 +40,9 @@ export const TokenomicsCard = () => {
} = useQuery({
queryKey: ["noise"],
queryFn: fetchNoise,
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
if (isLoading || isEpochLoading || isStakingLoading) {
explorer-v2/src/components/nodeTable/NodeTableWithAction.tsx
+6
View File
@@ -66,6 +66,9 @@ const NodeTableWithAction = () => {
} = useQuery({
queryKey: ["epochRewards"],
queryFn: fetchEpochRewards,
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
// Use React Query to fetch Nym nodes
@@ -76,6 +79,9 @@ const NodeTableWithAction = () => {
} = useQuery({
queryKey: ["nymNodes"],
queryFn: fetchObservatoryNodes,
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
// Handle loading state
explorer-v2/src/components/nymNodePageComponents/BasicInfoCard.tsx
+3
View File
@@ -20,6 +20,9 @@ export const BasicInfoCard = ({ id }: IBasicInfoCardProps) => {
} = useQuery({
queryKey: ["nodeInfo", id],
queryFn: () => fetchNodeInfo(id),
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
if (isLoading) {
explorer-v2/src/components/nymNodePageComponents/NodeDataCard.tsx
+6
View File
@@ -20,6 +20,9 @@ export const NodeDataCard = ({ id }: INodeMetricsCardProps) => {
} = useQuery({
queryKey: ["epochRewards"],
queryFn: fetchEpochRewards,
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
// Fetch node information
@@ -30,6 +33,9 @@ export const NodeDataCard = ({ id }: INodeMetricsCardProps) => {
} = useQuery({
queryKey: ["nodeInfo", id],
queryFn: () => fetchNodeInfo(id),
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
if (isEpochLoading || isNodeLoading) {
explorer-v2/src/components/nymNodePageComponents/NodeDelegationsCard.tsx
+3
View File
@@ -18,6 +18,9 @@ const NodeDelegationsCard = ({ id }: NodeDelegationsCardProps) => {
} = useQuery({
queryKey: ["nodeDelegations", id],
queryFn: () => fetchNodeDelegations(id),
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
if (isLoading) {
explorer-v2/src/components/nymNodePageComponents/NodeParametersCard.tsx
+6
View File
@@ -21,6 +21,9 @@ export const NodeParametersCard = ({ id }: INodeParametersCardProps) => {
} = useQuery({
queryKey: ["epochRewards"],
queryFn: fetchEpochRewards,
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
// Fetch node information
@@ -31,6 +34,9 @@ export const NodeParametersCard = ({ id }: INodeParametersCardProps) => {
} = useQuery({
queryKey: ["nodeInfo", id],
queryFn: () => fetchNodeInfo(id),
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
if (isEpochLoading || isNodeLoading) {
explorer-v2/src/components/nymNodePageComponents/NodeProfileCard.tsx
+3
View File
@@ -42,6 +42,9 @@ export const NodeProfileCard = ({ id }: INodeProfileCardProps) => {
} = useQuery({
queryKey: ["nodeInfo", id],
queryFn: () => fetchNodeInfo(id),
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
const handleStakeOnNode = async ({
explorer-v2/src/components/nymNodePageComponents/NodeRoleCard.tsx
+9
View File
@@ -152,6 +152,9 @@ export const NodeRoleCard = ({ id }: INodeRoleCardProps) => {
} = useQuery({
queryKey: ["nodeInfo", id],
queryFn: () => fetchNodeInfo(id),
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
const {
data: epochRewardsData,
@@ -160,6 +163,9 @@ export const NodeRoleCard = ({ id }: INodeRoleCardProps) => {
} = useQuery({
queryKey: ["epochRewards"],
queryFn: fetchEpochRewards,
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
// Extract node roles once `nodeInfo` is available
@@ -177,6 +183,9 @@ export const NodeRoleCard = ({ id }: INodeRoleCardProps) => {
queryKey: ["gatewayStatus", nodeInfo?.identity_key],
queryFn: () => fetchGatewayStatus(nodeInfo?.identity_key || ""),
enabled: !!nodeInfo?.identity_key && shouldFetchGatewayStatus, // ✅ Only fetch if needed
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
if (isLoading || isEpochLoading) {
explorer-v2/src/components/staking/OriginalStakeCard.tsx
+3
View File
@@ -19,6 +19,9 @@ const OriginalStakeCard = () => {
queryKey: ["originalStake", address],
queryFn: () => fetchOriginalStake(address || ""),
enabled: !!address, // Only fetch if address exists
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
if (!address) {
explorer-v2/src/components/staking/StakeTableWithAction.tsx
+6
View File
@@ -64,6 +64,9 @@ const StakeTableWithAction = () => {
} = useQuery({
queryKey: ["epochRewards"],
queryFn: fetchEpochRewards,
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
// Use React Query to fetch Nym nodes
@@ -74,6 +77,9 @@ const StakeTableWithAction = () => {
} = useQuery({
queryKey: ["nymNodes"],
queryFn: fetchObservatoryNodes,
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
// Handle loading state
explorer-v2/src/components/staking/SubHeaderRowActions.tsx
+3
View File
@@ -59,6 +59,9 @@ const SubHeaderRowActions = () => {
queryKey: ["totalStakerRewards", address],
queryFn: () => fetchTotalStakerRewards(address || ""),
enabled: !!address, // Only fetch if address is available
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
const handleRefetch = useCallback(async () => {
explorer-v2/src/components/staking/TotalRewardsCard.tsx
+3
View File
@@ -19,6 +19,9 @@ const TotalRewardsCard = () => {
queryKey: ["totalStakerRewards", address],
queryFn: () => fetchTotalStakerRewards(address || ""),
enabled: !!address, // Only fetch if address exists
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
if (!address) {
explorer-v2/src/components/staking/TotalStakeCard.tsx
+3
View File
@@ -19,6 +19,9 @@ const TotalStakeCard = () => {
queryKey: ["totalStake", address],
queryFn: () => fetchBalances(address || ""),
enabled: !!address, // Only fetch if address exists
staleTime: 10 * 60 * 1000, // 10 minutes
refetchOnWindowFocus: false, // Prevents unnecessary refetching
refetchOnReconnect: false,
});
if (!address) {
explorer-v2/src/providers/QueryProvider.tsx
-1
View File
@@ -11,7 +11,6 @@ interface QueryProviderProps {
export const QueryProvider = ({ children }: QueryProviderProps) => {
// Create QueryClient instance
const [queryClient] = useState(() => new QueryClient());
return (
<QueryClientProvider client={queryClient}>
{children}