diff --git a/src/components/chainlist.jsx b/src/components/chainlist.jsx
index b19ab7440..8cb57fde6 100644
--- a/src/components/chainlist.jsx
+++ b/src/components/chainlist.jsx
@@ -1,6 +1,46 @@
-import { useState, useEffect } from 'react'
+import { useState, useEffect, useMemo } from 'react'
+import { mainnet as mainnetEvmMetadata, testnet as testnetEvmMetadata } from "../../src/data/evm_chains.json"
+import { mainnet as mainnetCosmosMetadata, testnet as testnetCosmosMetadata } from "../../src/data/cosmos_chains.json"
+import AddKeplr from "./keplr"
+
+function ChainListRow({ chainId, name, identifier, environment }) {
+ return (
+
+ {identifier} |
+ {name} |
+ {chainId} |
+
+
+ |
+
+ )
+}
+
+
+const createChainIndex = (chains) => {
+ const index = new Map();
+ for (const chain of chains) {
+ if (index.has(chain.chain_id)) {
+ console.error(`duplicate chain ${chain.chain_id}. Removing to be safe`)
+ index.delete(chain.chain_id)
+ }
+ index.set(chain.network_id, chain)
+ }
+ return index
+}
export default ({ environment }) => {
+ const chainIndex = useMemo(() => {
+ switch (environment) {
+ case `mainnet`:
+ return createChainIndex([...mainnetEvmMetadata, ...mainnetCosmosMetadata])
+ case `testnet`:
+ return createChainIndex([...testnetEvmMetadata, ...testnetCosmosMetadata])
+ default:
+ console.error(`invalid environment ${environment}`)
+ return null
+ }
+ }, [environment]);
const [fetching, setFetching] = useState(false)
const [response, setResponse] = useState(null)
@@ -11,34 +51,63 @@ export default ({ environment }) => {
}, [response])
const request = async () => {
-
+
setFetching(true)
-
- const endpoint_url = environment === `testnet`
- ? `https://lcd-axelar-testnet.imperator.co/axelar/nexus/v1beta1/chains?status=1`
- : `https://lcd-axelar.imperator.co/axelar/nexus/v1beta1/chains?status=1`;
- fetch(endpoint_url)
- .then(data => data.json())
- .then(chains => setResponse(chains))
- .catch(error => setError(true))
- .finally(() => setFetching(false))
+ const endpoint_url = environment === `testnet`
+ ? `https://lcd-axelar-testnet.imperator.co/axelar/nexus/v1beta1/chains?status=1`
+ : `https://lcd-axelar.imperator.co/axelar/nexus/v1beta1/chains?status=1`;
+ fetch(endpoint_url)
+ .then(data => data.json())
+ .then(chains => setResponse(chains))
+ .catch(error => setError(true))
+ .finally(() => setFetching(false))
}
- if (fetching)
+ const tableRowData = useMemo(() => {
+ if (!response) return null
+ return response.chains.map((chainIdentifier, idx) => {
+ const chainData = chainIndex.get(chainIdentifier)
+ if (!chainData) {
+ console.error(`chain ${chainIdentifier} not found in chain index`)
+ return null
+ }
+
+ return
+ });
+ }, [response, environment])
+
+ if (fetching)
return
- Fetching active chains...
+ Fetching active chains...
- if (error)
+ if (error)
return
- Error loading chains. Please refresh this page.
+ Error loading chains. Please refresh this page.
-
+
return (
- {response && response.chains && response.chains.map(chain =>
* {chain}
)}
+
+
+
+ Chain Identifier |
+ Chain Name |
+ Chain ID (EVM) |
+ Add Chain |
+
+
+
+ {tableRowData}
+
+
)
}
\ No newline at end of file