Merge pull request #2294 from Uniswap/revert-hooks

Revert "hooks json"

src/components/card.js

@@ -82,7 +82,7 @@ export default function Card({ id, list, name }) {
       <section>
         <NameText>{actualName}</NameText>
         <TokensListed>
-          {list?.hooks?.length >= 0 ? `${list.hooks.length} Hooks` : list === null ? 'Error' : 'Loading...'}
+          {list?.tokens?.length > 0 ? `${list.tokens.length} tokens` : list === null ? 'Error' : 'Loading...'}
         </TokensListed>
       </section>
     </StyledCard>

src/components/list-info.js

@@ -1,9 +1,9 @@
 import React from 'react'
-import Moment from 'react-moment'
 import styled from 'styled-components'
-import { getListURLFromListID } from '../utils/useMultiFetch'
 import Card from './card'
+import Moment from 'react-moment'
 import CopyHelper from './copy'
+import { getListURLFromListID } from '../utils/useMultiFetch'
 
 const StyledInfo = styled.section`
   display: grid;
@@ -91,7 +91,8 @@ export default function Info({ listID, list }) {
           </p>
         </span>
         <span>
-          <small>Version</small> <p>{`${list.version.major}.${list.version.minor}.${list.version.patch}`}</p>
+          <small>Version</small>
+          <p>{`${list.version.major}.${list.version.minor}.${list.version.patch}`}</p>
         </span>
       </InfoDescription>
     </StyledInfo>

src/components/list-tokens.js

@@ -1,8 +1,8 @@
-import React, { memo, useState } from 'react'
+import React, { useState, memo } from 'react'
 import styled from 'styled-components'
-import { lookUpchain, lookupScanner } from '../utils/getChainId'
-import CopyHelper from './copy'
 import Search from './search'
+import CopyHelper from './copy'
+import { lookUpchain, lookupScanner } from '../utils/getChainId'
 
 import { toChecksumAddress } from 'ethereumjs-util'
 import FilterResults from 'react-filter-search'
@@ -86,9 +86,9 @@ const Chain = styled.span`
 `
 
 export const ListItem = memo(function ListItem({ token }) {
-  const scanner = lookupScanner(token.chainId)
-  const tokenAddress = toChecksumAddress(token.address)
-  const scannerUrl = scanner == '' ? '' : scanner + tokenAddress
+  const scanner = lookupScanner(token.chainId); 
+  const tokenAddress = toChecksumAddress(token.address); 
+  const scannerUrl = scanner == "" ? "" : scanner + tokenAddress; 
   return (
     <TokenItem>
       <TokenInfo>
@@ -182,8 +182,9 @@ const ListHeader = styled.div`
 
 export default function Tokens({ tokens }) {
   const [value, setValue] = useState('')
-  const sortedTokens = tokens.sort((a, b) => {
-    return a.name > b.name ? 1 : a.name < b.name ? -1 : 0
+  const sortedTokens = tokens.sort((a,b) =>{ 
+    return a.symbol > b.symbol ? 1 : 
+      a.symbol < b.symbol ? -1 : 0; 
   })
 
   function handleChange(e) {

src/pages/list.js

@@ -69,7 +69,7 @@ function List() {
       ) : (
         <Content>
           <Info listID={listID} list={list} />
-          <Tokens tokens={list.hooks} />
+          <Tokens tokens={list.tokens} />
         </Content>
       )}
     </div>

src/token-lists.json

@@ -1,34 +1,138 @@
 {
-  "arrakis": {
-    "name": "Arrakis",
+  "tokens.1inch.eth": {
+    "name": "1inch",
     "homepage": ""
   },
-  "blackrock": {
-    "name": "Blackrock",
+  "tokenlist.aave.eth": {
+    "name": "Aave Token List",
     "homepage": ""
   },
-  "euler": {
-    "name": "Euler",
+  "datafi.theagora.eth": {
+    "name": "Agora dataFi Tokens",
     "homepage": ""
   },
-  "froggy": {
-    "name": "Froggy Friends",
+  "https://raw.githubusercontent.com/The-Blockchain-Association/sec-notice-list/master/ba-sec-list.json": {
+    "name": "Blockchain Association SEC Non Compliant List",
     "homepage": ""
   },
-  "infinity": {
-    "name": "Infinity Pool",
+  "defi.cmc.eth": {
+    "name": "CMC DeFi",
     "homepage": ""
   },
-  "chase": {
-    "name": "J.P. Morgan Chase",
+  "stablecoin.cmc.eth": {
+    "name": "CMC Stablecoin",
     "homepage": ""
   },
-  "panoptic": {
-    "name": "Panoptic",
+  "erc20.cmc.eth": {
+    "name": "CMC200 ERC20",
     "homepage": ""
   },
-  "sushi": {
-    "name": "Sushiswap",
+  "https://compli.fi/complifi.tokenlist.json": {
+    "name": "CompliFi Originals",
+    "homepage": ""
+  },
+  "https://tokens.coingecko.com/uniswap/all.json": {
+    "name": "CoinGecko",
+    "homepage": ""
+  },
+  "https://www.coingecko.com/tokens_list/uniswap/defi_100/v_0_0_0.json": {
+    "name": "CoinGecko DeFi 100",
+    "homepage": ""
+  },
+  "https://raw.githubusercontent.com/compound-finance/token-list/master/compound.tokenlist.json": {
+    "name": "Compound",
+    "homepage": ""
+  },
+  "https://defiprime.com/defiprime.tokenlist.json": {
+    "name": "Defiprime",
+    "homepage": ""
+  },
+  "https://raw.githubusercontent.com/b-u-i-d-l/bazar-tokens-list/master/dist/decentralizedFlexibleOrganizations.json": {
+    "name": "DFO Flexible Org",
+    "homepage": ""
+  },
+  "tokenlist.dharma.eth": {
+    "name": "Dharma Token List",
+    "homepage": ""
+  },
+  "https://cdn.furucombo.app/furucombo.tokenlist.json": {
+    "name": "Furucombo",
+    "homepage": ""
+  },
+  "https://www.gemini.com/uniswap/manifest.json": {
+    "name": "Gemini Token List",
+    "homepage": "https://www.gemini.com/"
+  },
+  "t2crtokens.eth": {
+    "name": "Kleros T2CR",
+    "homepage": ""
+  },
+  "https://api.kyber.network/tokenlist": {
+    "name": "Kyber",
+    "homepage": ""
+  },
+  "https://messari.io/tokenlist/messari-verified": {
+    "name": "Messari Verified",
+    "homepage": ""
+  },
+  "https://uniswap.mycryptoapi.com/": {
+    "name": "MyCrypto",
+    "homepage": ""
+  },
+  "https://raw.githubusercontent.com/opynfinance/opyn-tokenlist/master/opyn-v1.tokenlist.json": {
+    "name": "Opyn Token List",
+    "homepage": ""
+  },
+  "https://static.optimism.io/optimism.tokenlist.json": {
+    "name": "Optimism",
+    "homepage": "https://optimism.io/"
+  },
+  "https://app.tryroll.com/tokens.json": {
+    "name": "Roll Social Money",
+    "homepage": ""
+  },
+  "https://raw.githubusercontent.com/SetProtocol/uniswap-tokenlist/main/set.tokenlist.json": {
+    "name": "Set Protocol",
+    "homepage": ""
+  },
+  "synths.snx.eth": {
+    "name": "Synthetix",
+    "homepage": ""
+  },
+  "testnet.tokenlist.eth": {
+    "name": "Testnet Tokens",
+    "homepage": ""
+  },
+  "list.tkn.eth": {
+    "name": "TokenDao",
+    "homepage": "https://tkn.eth.limo"
+  },
+  "https://gateway.ipfs.io/ipns/tokens.uniswap.org": {
+    "name": "Uniswap Default List",
+    "homepage": ""
+  },
+  "https://raw.githubusercontent.com/jab416171/uniswap-pairtokens/master/uniswap_pair_tokens.json": {
+    "name": "Uniswap Token Pairs",
+    "homepage": ""
+  },
+  "https://umaproject.org/uma.tokenlist.json": {
+    "name": "UMA",
+    "homepage": ""
+  },
+  "wrapped.tokensoft.eth": {
+    "name": "Wrapped Tokens",
+    "homepage": ""
+  },
+  "https://yearn.science/static/tokenlist.json": {
+    "name": "Yearn",
+    "homepage": "https://yearn.finance/"
+  },
+  "https://zapper.fi/api/token-list": {
+    "name": "Zapper Token List",
+    "homepage": ""
+  },
+  "tokenlist.zerion.eth": {
+    "name": "Zerion Explore",
     "homepage": ""
   }
 }

src/utils/useMultiFetch.ts

@@ -1,5 +1,4 @@
-import { useEffect, useMemo, useState } from 'react'
-import hooksLists from '../hooks.json'
+import { useState, useEffect, useMemo } from 'react'
 
 interface ListReturn {
   list: any | undefined | null // TODO replace any
@@ -8,15 +7,14 @@ interface ListReturn {
 }
 
 export function getListURLFromListID(listID: string): string {
-  // if (listID.startsWith('https://')) {
-  //   return listID
-  // } else if (listID?.endsWith('.eth')) {
-  //   // proxy http urls through a CF worker
-  //   return `https://wispy-bird-88a7.uniswap.workers.dev/?url=${`http://${listID}.link`}`
-  // } else {
-  //   throw Error(`Unrecognized listId ${listID}`)
-  // }
-  return listID
+  if (listID.startsWith('https://')) {
+    return listID
+  } else if (listID?.endsWith('.eth')) {
+    // proxy http urls through a CF worker
+    return `https://wispy-bird-88a7.uniswap.workers.dev/?url=${`http://${listID}.link`}`
+  } else {
+    throw Error(`Unrecognized listId ${listID}`)
+  }
 }
 
 export function useMultiFetch(listIDs: string[] = []): { [listID: string]: ListReturn } {
@@ -26,10 +24,26 @@ export function useMultiFetch(listIDs: string[] = []): { [listID: string]: ListR
     if (listIDs.length > 0) {
       let stale = false
 
-      listIDs.forEach((listID) => {
-        const list = (hooksLists as Record<string, any>)[listID]
-        setLists((lists) => ({ ...lists, [listID]: list }))
-      })
+      listIDs.forEach((listID) =>
+        fetch(getListURLFromListID(listID))
+          .then((response) => {
+            if (!response.ok) {
+              throw new Error('Network response was not ok')
+            }
+            return response.json()
+          })
+          .then((list) => {
+            if (!stale) {
+              setLists((lists) => ({ ...lists, [listID]: list }))
+            }
+          })
+          .catch((error) => {
+            if (!stale) {
+              console.error(`Failed to fetch ${listID} at ${getListURLFromListID(listID)}`, error)
+              setLists((lists) => ({ ...lists, [listID]: null }))
+            }
+          })
+      )
 
       return () => {
         stale = true