From 80e178cfebbd0e0aeb629cdfb62ef4d0f0ff37e2 Mon Sep 17 00:00:00 2001 From: Julian Rubino Date: Thu, 1 Aug 2024 23:29:59 +0900 Subject: [PATCH] Modify Node Syncing docs to show new node snapshots from R2 Cloudflare (#400) Co-authored-by: Julian Rubino --- package.json | 2 + .../Docs/components/NodeSnapshots.tsx | 134 ++++++++++++++++++ src/components/Docs/index.ts | 1 + src/pages/nodes/start-here/syncing.mdx | 22 +-- 4 files changed, 148 insertions(+), 11 deletions(-) create mode 100644 src/components/Docs/components/NodeSnapshots.tsx diff --git a/package.json b/package.json index 5db1bb65..598644b3 100644 --- a/package.json +++ b/package.json @@ -46,6 +46,7 @@ "axios": "1.6.5", "bech32": "2.0.0", "clsx": "1.2.1", + "date-fns": "^3.6.0", "cmdk": "1.0.0", "dotenv": "16.3.1", "ethers": "5.7.2", @@ -88,6 +89,7 @@ "@emotion/babel-plugin": "11.11.0", "@emotion/babel-plugin-jsx-pragmatic": "0.2.1", "@next/eslint-plugin-next": "12.3.4", + "@types/date-fns": "^2.6.0", "@types/eslint": "8.56.2", "@types/lodash-es": "4.17.12", "@types/node": "17.0.45", diff --git a/src/components/Docs/components/NodeSnapshots.tsx b/src/components/Docs/components/NodeSnapshots.tsx new file mode 100644 index 00000000..4292fc16 --- /dev/null +++ b/src/components/Docs/components/NodeSnapshots.tsx @@ -0,0 +1,134 @@ +import axios from "axios"; +import { format } from "date-fns"; +import React, { useEffect, useMemo, useState } from "react"; + +import { LoadingTable, NetworkTypeTabs, networkTypeTabs } from "~/components/shared"; + +interface NodeSnapshotsProps { + apiUrl: string; +} + +interface Snapshot { + environment: string; + type: string; + networkVersion?: string; + height?: number; + creationDate?: string; + link?: string; +} + +const NodeSnapshots: React.FC = ({ apiUrl }) => { + const [mainnetSnapshots, setMainnetSnapshots] = useState([]); + const [testnetSnapshots, setTestnetSnapshots] = useState([]); + const [isLoading, setIsLoading] = useState(true); + const [activeTab, setActiveTab] = useState(networkTypeTabs[0]); + + useEffect(() => { + const fetchData = async () => { + const endpoints = [ + `${apiUrl}/testnet/fullnode/latest.json`, + `${apiUrl}/testnet/archive/latest.json`, + `${apiUrl}/mainnet/fullnode/latest.json`, + `${apiUrl}/mainnet/archive/latest.json`, + ]; + + const fetchEndpoint = async (endpoint: string) => { + try { + const response = await axios.get(endpoint); + if (response.config.url) { + const urlParts = response.config.url.split("/"); + const type = urlParts[urlParts.length - 2]; + const environment = urlParts[urlParts.length - 3]; + return response.data.snapshots.map((snapshot: any) => ({ + ...snapshot, + environment, + type, + })); + } + } catch (error) { + if (axios.isAxiosError(error) && error.response?.status === 404) { + const urlParts = endpoint.split("/"); + const type = urlParts[urlParts.length - 2]; + const environment = urlParts[urlParts.length - 3]; + return [ + { + environment, + type, + }, + ]; + } else { + console.error("Error fetching data", error); + } + } + return []; + }; + + const allData = await Promise.all(endpoints.map((endpoint) => fetchEndpoint(endpoint))); + const combinedData = allData.flat(); + + setMainnetSnapshots(combinedData.filter((snapshot) => snapshot.environment === "mainnet")); + setTestnetSnapshots(combinedData.filter((snapshot) => snapshot.environment === "testnet")); + setIsLoading(false); + }; + + fetchData(); + }, [apiUrl]); + + const formatDate = (dateString?: string) => { + if (!dateString) { + return ""; + } + const date = new Date(dateString); + if (Number.isNaN(date.getTime())) { + return "Invalid date"; + } + return format(date, "PPPpp"); + }; + + const snapshots = useMemo(() => { + return activeTab.networkType === "mainnet" ? mainnetSnapshots : testnetSnapshots; + }, [activeTab.networkType, mainnetSnapshots, testnetSnapshots]); + + return ( +
+ + + {isLoading ? ( + + ) : ( +
+ + + + + + + + + + + + {snapshots.map((snapshot, index) => ( + + + + + + + + ))} + +
TypeNetwork VersionHeightCreation DateDownload
{snapshot.type}{snapshot.networkVersion || ""}{snapshot.height || ""}{formatDate(snapshot.creationDate)} + {snapshot.link ? ( + + + + ) : null} +
+
+ )} +
+ ); +}; + +export default NodeSnapshots; diff --git a/src/components/Docs/index.ts b/src/components/Docs/index.ts index 14e9a09d..58ecac2c 100644 --- a/src/components/Docs/index.ts +++ b/src/components/Docs/index.ts @@ -8,6 +8,7 @@ export * from "./components/ForeignCoinsTable"; export * from "./components/GovParams"; export * from "./components/GovUpgradeProposals"; export * from "./components/NetworkDetails"; +export { default as NodeSnapshots } from "./components/NodeSnapshots"; export * from "./components/ObserverList"; export * from "./components/ObserverParams"; export * from "./components/OpenAPIBrowser"; diff --git a/src/pages/nodes/start-here/syncing.mdx b/src/pages/nodes/start-here/syncing.mdx index 1462b758..e62157a3 100644 --- a/src/pages/nodes/start-here/syncing.mdx +++ b/src/pages/nodes/start-here/syncing.mdx @@ -3,6 +3,7 @@ title: Syncing a Node --- import { Alert } from "~/components/shared"; +import { NodeSnapshots } from "~/components/Docs"; This guide assumes you've completed the [Setting Up Your Node](/nodes/start-here/setup) step. @@ -10,24 +11,23 @@ import { Alert } from "~/components/shared"; # Option 1: Snapshot method -Syncing with a snapshot downloads the data directory from an existing node. +Downloads the data directory backed up from an existing node. -Choose the network and the snapshot type, fetch the URL and follow instructions -returned in response. +Choose the network and snapshot type, download the snapshot and extract the snapshot +inside `~/.zetacored` directory. -| Network | Type | URL | -| ------- | ---------------- | ----------------------------------------------------------------------- | -| Mainnet | Snapshot | https://snapshots.zetachain.com/latest-snapshot?network=mainnet | -| Mainnet | Archive Snapshot | https://snapshots.zetachain.com/latest-archive-snapshot?network=mainnet | -| Testnet | Snapshot | https://snapshots.zetachain.com/latest-snapshot?network=athens3 | -| Testnet | Archive Snapshot | https://snapshots.zetachain.com/latest-archive-snapshot?network=athens3 | + -Untar the file inside `~/.zetacored` and start the node. + + Note: Our nodes database backend is `pebbledb`. Ensure that your node is configured to + use the same backend to utilize our snapshots. + #### Alternative snapshots - https://polkachu.com/tendermint_snapshots/zetachain - https://app.nodejumper.io/zetachain/sync +- https://app.nodejumper.io/zetachain-testnet/sync # Option 2: KYVE's KSYNC method @@ -71,7 +71,7 @@ https://github.com/BlockPILabs/cosmos-db. ### Sync the Node ``` -ksync state-sync --binary="/path/to/zetacored" --chain-id=kaon-1 --snapshot-pool-id=11 +ksync state-sync --binary="/path/to/zetacored" --chain-id=zetachain_7000-1 --snapshot-pool-id=11 ``` # Checking Node Health