{
e.target.onerror = null;
e.target.src = "/chains/unknown-logo.png";
@@ -107,7 +108,7 @@ export default function Chain({ chain }) {
className={ classes.avatar }
/>
- 
- Manage over 120 tokens and multi-chain assets with fully supported cross chain transactions.
- }
- >
- Try out multichain.xyz
-
-
-
-
-
-
@@ -136,101 +142,111 @@ function Home({ changeTheme, theme, sortedChains }) {
-
-
-
- Chainlist
- Helping users connect to EVM powered networks
- Chainlist is a list of EVM networks. Users can use the information to connect their wallets and Web3 middleware providers to the appropriate Chain ID and Network ID to connect to the correct chain.
+
+
+
+
+ Chainlist
+
+
+ Helping users connect to EVM powered networks
+
+
+ Chainlist is a list of EVM networks. Users can use the information to connect their wallets and Web3
+ middleware providers to the appropriate Chain ID and Network ID to connect to the correct chain.
+
}
>
- Add Your Network
+ Add Your Network
-
-
-
-
-
+
- )
+ );
}
-export default withTheme(Home)
-
-// export const getStaticProps = async () => {
-//
-// try {
-// const chainsResponse = await fetch('https://chainid.network/chains.json')
-// const chainsJson = await chainsResponse.json()
-//
-// return {
-// props: {
-// chains: chainsJson
-// },
-// revalidate: 60,
-// }
-// } catch (ex) {
-// return {
-// props: {
-// chains: []
-// }
-// }
-// }
-//
-// }
+export default withTheme(Home);
diff --git a/pages/index.module.css b/pages/index.module.css
index acb09b508..98e03d3c4 100644
--- a/pages/index.module.css
+++ b/pages/index.module.css
@@ -148,6 +148,12 @@
justify-content: space-between;
}
+.form {
+ display: flex;
+ justify-content: center;
+ margin-bottom: 20px;
+}
+
@media screen and (max-width: 1700px) {
.cardsContainer {
grid-template-columns: calc(50% - 15px) calc(50% - 15px);
diff --git a/theme/coreTheme.js b/theme/coreTheme.js
index 173d08b21..ba8026e58 100644
--- a/theme/coreTheme.js
+++ b/theme/coreTheme.js
@@ -1,5 +1,3 @@
-import { createMuiTheme } from '@material-ui/core/styles';
-
export const colors = {
blue: "#2F80ED",
red: '#ed4337',
diff --git a/theme/dark.js b/theme/dark.js
index 93d56c66a..028d11167 100644
--- a/theme/dark.js
+++ b/theme/dark.js
@@ -1,8 +1,8 @@
-import { createMuiTheme } from '@material-ui/core/styles';
+import { createTheme } from '@material-ui/core/styles';
import coreTheme from './coreTheme';
// Create a theme instance.
-const theme = createMuiTheme({
+const theme = createTheme({
...coreTheme,
palette: {
...coreTheme.palette,
diff --git a/theme/light.js b/theme/light.js
index 82531a580..bf7d82d8b 100644
--- a/theme/light.js
+++ b/theme/light.js
@@ -1,9 +1,8 @@
-import { createMuiTheme } from '@material-ui/core/styles';
-import { red } from '@material-ui/core/colors';
+import { createTheme } from '@material-ui/core/styles';
import coreTheme from './coreTheme';
// Create a theme instance.
-const theme = createMuiTheme({
+const theme = createTheme({
...coreTheme,
palette: {
...coreTheme.palette,
From d89f901c044d2130807eae2e34d512fbf72d3b8b Mon Sep 17 00:00:00 2001
From: 0xngmi <0xngmi@protonmail.com>
Date: Mon, 7 Mar 2022 11:37:53 +0000
Subject: [PATCH 010/975] add chainlist.org domain
---
pages/_app.js | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/pages/_app.js b/pages/_app.js
index 76f22c8f4..8708f57dc 100644
--- a/pages/_app.js
+++ b/pages/_app.js
@@ -40,7 +40,7 @@ function MyApp({ Component, pageProps }) {
useEffect(() => {
Fathom.load('TKCNGGEZ', {
- includedDomains: ['chainlist.defillama.com'],
+ includedDomains: ['chainlist.defillama.com', 'chainlist.org'],
url: 'https://surprising-powerful.llama.fi/script.js',
})
From ac9d7110cd1f240df4e996aaeeec19b558a88613 Mon Sep 17 00:00:00 2001
From: mintdart <96025197+mintdart@users.noreply.github.com>
Date: Mon, 7 Mar 2022 07:56:51 -0800
Subject: [PATCH 011/975] add chain icons
---
components/chain/chain.js | 171 +++++++++++++++--------------
components/chain/chain.module.css | 4 +-
pages/index.js | 2 +-
public/chains/arbitrum.jpeg | Bin 0 -> 2545 bytes
public/chains/aurora.jpeg | Bin 0 -> 1577 bytes
public/chains/avalanche.jpeg | Bin 0 -> 1571 bytes
public/chains/binance.jpeg | Bin 0 -> 1771 bytes
public/chains/bittorrent.jpeg | Bin 0 -> 1783 bytes
public/chains/boba.jpeg | Bin 0 -> 1471 bytes
public/chains/callisto.jpeg | Bin 0 -> 1854 bytes
public/chains/celo.jpeg | Bin 0 -> 1619 bytes
public/chains/conflux.jpeg | Bin 0 -> 1565 bytes
public/chains/cronos.jpeg | Bin 0 -> 1045 bytes
public/chains/elastos.jpeg | Bin 0 -> 1473 bytes
public/chains/energi.jpeg | Bin 0 -> 1840 bytes
public/chains/energyweb.jpeg | Bin 0 -> 2668 bytes
public/chains/eos.jpeg | Bin 0 -> 1511 bytes
public/chains/ethereum.jpeg | Bin 0 -> 521 bytes
public/chains/ethereumclassic.jpeg | Bin 0 -> 2278 bytes
public/chains/fantom.jpeg | Bin 0 -> 1021 bytes
public/chains/fuse.jpeg | Bin 0 -> 1661 bytes
public/chains/fusion.jpeg | Bin 0 -> 1683 bytes
public/chains/gnosis.jpeg | Bin 0 -> 1088 bytes
public/chains/gochain.jpeg | Bin 0 -> 1845 bytes
public/chains/harmony.jpeg | Bin 0 -> 1646 bytes
public/chains/iotex.jpeg | Bin 0 -> 1598 bytes
public/chains/karura.jpeg | Bin 0 -> 1623 bytes
public/chains/kcc.jpeg | Bin 0 -> 1190 bytes
public/chains/meter.jpeg | Bin 0 -> 1865 bytes
public/chains/metis.jpeg | Bin 0 -> 1675 bytes
public/chains/moonbeam.jpeg | Bin 0 -> 1025 bytes
public/chains/moonriver.jpeg | Bin 0 -> 2441 bytes
public/chains/okexchain.jpeg | Bin 0 -> 1666 bytes
public/chains/ontology.jpeg | Bin 0 -> 754 bytes
public/chains/optimism.jpeg | Bin 0 -> 1880 bytes
public/chains/palm.jpeg | Bin 0 -> 1984 bytes
public/chains/polis.jpeg | Bin 0 -> 1693 bytes
public/chains/polygon.jpeg | Bin 0 -> 1588 bytes
public/chains/rsk.jpeg | Bin 0 -> 1542 bytes
public/chains/shiden.jpeg | Bin 0 -> 1547 bytes
public/chains/songbird.jpeg | Bin 0 -> 1517 bytes
public/chains/syscoin.jpeg | Bin 0 -> 2247 bytes
public/chains/telos.jpeg | Bin 0 -> 3093 bytes
public/chains/theta.jpeg | Bin 0 -> 1591 bytes
public/chains/thundercore.jpeg | Bin 0 -> 1064 bytes
public/chains/tomochain.jpeg | Bin 0 -> 1608 bytes
public/chains/ubiq.jpeg | Bin 0 -> 1052 bytes
public/chains/velas.jpeg | Bin 0 -> 1626 bytes
public/chains/wanchain.jpeg | Bin 0 -> 1781 bytes
public/chains/zyx.jpeg | Bin 0 -> 983 bytes
utils/icons.js | 49 +++++++++
51 files changed, 139 insertions(+), 87 deletions(-)
create mode 100644 public/chains/arbitrum.jpeg
create mode 100644 public/chains/aurora.jpeg
create mode 100644 public/chains/avalanche.jpeg
create mode 100644 public/chains/binance.jpeg
create mode 100644 public/chains/bittorrent.jpeg
create mode 100644 public/chains/boba.jpeg
create mode 100644 public/chains/callisto.jpeg
create mode 100644 public/chains/celo.jpeg
create mode 100644 public/chains/conflux.jpeg
create mode 100644 public/chains/cronos.jpeg
create mode 100644 public/chains/elastos.jpeg
create mode 100644 public/chains/energi.jpeg
create mode 100644 public/chains/energyweb.jpeg
create mode 100644 public/chains/eos.jpeg
create mode 100644 public/chains/ethereum.jpeg
create mode 100644 public/chains/ethereumclassic.jpeg
create mode 100644 public/chains/fantom.jpeg
create mode 100644 public/chains/fuse.jpeg
create mode 100644 public/chains/fusion.jpeg
create mode 100644 public/chains/gnosis.jpeg
create mode 100644 public/chains/gochain.jpeg
create mode 100644 public/chains/harmony.jpeg
create mode 100644 public/chains/iotex.jpeg
create mode 100644 public/chains/karura.jpeg
create mode 100644 public/chains/kcc.jpeg
create mode 100644 public/chains/meter.jpeg
create mode 100644 public/chains/metis.jpeg
create mode 100644 public/chains/moonbeam.jpeg
create mode 100644 public/chains/moonriver.jpeg
create mode 100644 public/chains/okexchain.jpeg
create mode 100644 public/chains/ontology.jpeg
create mode 100644 public/chains/optimism.jpeg
create mode 100644 public/chains/palm.jpeg
create mode 100644 public/chains/polis.jpeg
create mode 100644 public/chains/polygon.jpeg
create mode 100644 public/chains/rsk.jpeg
create mode 100644 public/chains/shiden.jpeg
create mode 100644 public/chains/songbird.jpeg
create mode 100644 public/chains/syscoin.jpeg
create mode 100644 public/chains/telos.jpeg
create mode 100644 public/chains/theta.jpeg
create mode 100644 public/chains/thundercore.jpeg
create mode 100644 public/chains/tomochain.jpeg
create mode 100644 public/chains/ubiq.jpeg
create mode 100644 public/chains/velas.jpeg
create mode 100644 public/chains/wanchain.jpeg
create mode 100644 public/chains/zyx.jpeg
create mode 100644 utils/icons.js
diff --git a/components/chain/chain.js b/components/chain/chain.js
index 2ff436ecd..9203915bf 100644
--- a/components/chain/chain.js
+++ b/components/chain/chain.js
@@ -1,51 +1,47 @@
-import React, { useState, useEffect } from 'react';
-import { Typography, Paper, Grid, Button, Tooltip } from '@material-ui/core'
-import Skeleton from '@material-ui/lab/Skeleton';
-import { useRouter } from 'next/router'
-import Web3 from 'web3';
+import React, { useState, useEffect, useMemo } from "react";
+import { Typography, Paper, Grid, Button, Tooltip } from "@material-ui/core";
+import Skeleton from "@material-ui/lab/Skeleton";
+import { useRouter } from "next/router";
+import Web3 from "web3";
-import classes from './chain.module.css'
+import classes from "./chain.module.css";
-import stores from '../../stores/index.js'
-import { getProvider } from '../../utils'
+import stores from "../../stores/index.js";
+import { getProvider } from "../../utils";
-import {
- ERROR,
- CONNECT_WALLET,
- TRY_CONNECT_WALLET,
- ACCOUNT_CONFIGURED
-} from '../../stores/constants'
-import Image from 'next/image'
+import { ERROR, CONNECT_WALLET, TRY_CONNECT_WALLET, ACCOUNT_CONFIGURED } from "../../stores/constants";
+import Image from "next/image";
+import { icons } from "../../utils/icons";
export default function Chain({ chain }) {
- const router = useRouter()
+ const router = useRouter();
- const [ account, setAccount ] = useState(null)
+ const [account, setAccount] = useState(null);
useEffect(() => {
const accountConfigure = () => {
- const accountStore = stores.accountStore.getStore('account')
- setAccount(accountStore)
- }
+ const accountStore = stores.accountStore.getStore("account");
+ setAccount(accountStore);
+ };
- stores.emitter.on(ACCOUNT_CONFIGURED, accountConfigure)
+ stores.emitter.on(ACCOUNT_CONFIGURED, accountConfigure);
- const accountStore = stores.accountStore.getStore('account')
- setAccount(accountStore)
+ const accountStore = stores.accountStore.getStore("account");
+ setAccount(accountStore);
return () => {
- stores.emitter.removeListener(ACCOUNT_CONFIGURED, accountConfigure)
- }
- }, [])
+ stores.emitter.removeListener(ACCOUNT_CONFIGURED, accountConfigure);
+ };
+ }, []);
const toHex = (num) => {
- return '0x'+num.toString(16)
- }
+ return "0x" + num.toString(16);
+ };
const addToNetwork = () => {
- if(!(account && account.address)) {
- stores.dispatcher.dispatch({ type: TRY_CONNECT_WALLET })
- return
+ if (!(account && account.address)) {
+ stores.dispatcher.dispatch({ type: TRY_CONNECT_WALLET });
+ return;
}
const params = {
@@ -57,83 +53,92 @@ export default function Chain({ chain }) {
decimals: chain.nativeCurrency.decimals,
},
rpcUrls: chain.rpc,
- blockExplorerUrls: [ ((chain.explorers && chain.explorers.length > 0 && chain.explorers[0].url) ? chain.explorers[0].url : chain.infoURL) ]
- }
+ blockExplorerUrls: [
+ chain.explorers && chain.explorers.length > 0 && chain.explorers[0].url
+ ? chain.explorers[0].url
+ : chain.infoURL,
+ ],
+ };
window.web3.eth.getAccounts((error, accounts) => {
- window.ethereum.request({
- method: 'wallet_addEthereumChain',
- params: [params, accounts[0]],
- })
- .then((result) => {
- console.log(result)
- })
- .catch((error) => {
- stores.emitter.emit(ERROR, error.message ? error.message : error)
- console.log(error)
- });
- })
- }
+ window.ethereum
+ .request({
+ method: "wallet_addEthereumChain",
+ params: [params, accounts[0]],
+ })
+ .then((result) => {
+ console.log(result);
+ })
+ .catch((error) => {
+ stores.emitter.emit(ERROR, error.message ? error.message : error);
+ console.log(error);
+ });
+ });
+ };
const renderProviderText = () => {
-
- if(account && account.address) {
+ if (account && account.address) {
const providerTextList = {
- Metamask: 'Add to Metamask',
- imToken: 'Add to imToken',
- Wallet: 'Add to Wallet'
- }
- return providerTextList[getProvider()]
+ Metamask: "Add to Metamask",
+ imToken: "Add to imToken",
+ Wallet: "Add to Wallet",
+ };
+ return providerTextList[getProvider()];
} else {
- return 'Connect wallet'
+ return "Connect wallet";
}
+ };
- }
+ const icon = useMemo(() => {
+ const chainName = chain.name.toLowerCase().split(" ")[0];
+ return (chain.icon && icons[chain.icon]) || (chainName && icons[chainName]) || "/chains/unknown-logo.png";
+ }, [chain]);
- if(!chain) {
- return
+ if (!chain) {
+ return ;
}
return (
-
+
+
-
+
-
-
- Search Networks
-
-
+ endAdornment: (
+
+
+ ),
+ startAdornment: (
+
+ Search Networks
+
+ ),
}}
/>
-
-
- {
- (search === ''? data: data.filter((chain) => {
+
+
+ {(search === ""
+ ? chains
+ : chains.filter((chain) => {
//filter
- return (chain.chain.toLowerCase().includes(search.toLowerCase()) ||
- chain.chainId.toString().toLowerCase().includes(search.toLowerCase()) ||
- chain.name.toLowerCase().includes(search.toLowerCase()) ||
- (chain.nativeCurrency ? chain.nativeCurrency.symbol : '').toLowerCase().includes(search.toLowerCase()))
- })).map((chain, idx) => {
- return
+
+
{
+ src={icon}
+ onError={(e) => {
e.target.onerror = null;
e.target.src = "/chains/unknown-logo.png";
}}
- width={ 28 }
- height={ 28 }
- className={ classes.avatar }
+ width={28}
+ height={28}
+ className={classes.avatar}
/>
-
-
-
- { chain.name }
+
+
+
+
+ {chain.name}
-
-
- ChainID
- { chain.chainId }
+
+
+
+ ChainID
+
+ {chain.chainId}
-
- Currency
- { chain.nativeCurrency ? chain.nativeCurrency.symbol : 'none' }
+
-
+
+ Currency
+
+ {chain.nativeCurrency ? chain.nativeCurrency.symbol : "none"}
-