diff --git a/.env.example b/.env.example index 9c9a62cb3..5dbecc20e 100644 --- a/.env.example +++ b/.env.example @@ -2,5 +2,4 @@ GATSBY_NETWORK="rinkeby" #GATSBY_INFURA_PROJECT_ID="xxx" -#GATSBY_METADATA_CACHE_URI="xxx" #GATSBY_MARKET_FEE_ADDRESS="0xxx" diff --git a/app.config.js b/app.config.js index f2340a49f..359f6018e 100644 --- a/app.config.js +++ b/app.config.js @@ -1,7 +1,6 @@ module.exports = { network: process.env.GATSBY_NETWORK || 'rinkeby', infuraProjectId: process.env.GATSBY_INFURA_PROJECT_ID || 'xxx', - metadataCacheUri: process.env.GATSBY_METADATA_CACHE_URI, // The ETH address the marketplace fee will be sent to. marketFeeAddress: process.env.GATSBY_MARKET_FEE_ADDRESS || diff --git a/src/helpers/NetworkMonitor.tsx b/src/helpers/NetworkMonitor.tsx index 9ba5c7d49..606c36012 100644 --- a/src/helpers/NetworkMonitor.tsx +++ b/src/helpers/NetworkMonitor.tsx @@ -1,47 +1,58 @@ import React, { ReactElement, useEffect } from 'react' import { useOcean } from '@oceanprotocol/react' import { getOceanConfig } from './wrapRootElement' -import appConfig from '../../app.config' import { Logger } from '@oceanprotocol/lib' export function NetworkMonitor(): ReactElement { - const { metadataCacheUri } = appConfig const { connect, web3Provider } = useOcean() + async function handleNetworkChanged(chainId: string) { + const initialNewConfig = getOceanConfig(Number(chainId.replace('0x', ''))) + + const newConfig = { + ...initialNewConfig, + + // add local dev values + ...(chainId === '8996' && { + factoryAddress: '0x312213d6f6b5FCF9F56B7B8946A6C727Bf4Bc21f', + poolFactoryAddress: '0xF9E633CBeEB2A474D3Fe22261046C99e805beeC4', + fixedRateExchangeAddress: '0xefdcb16b16C7842ec27c6fdCf56adc316B9B29B8', + metadataContractAddress: '0xEBe77E16736359Bf0F9013F6017242a5971cAE76' + }) + } + + try { + await connect(newConfig) + } catch (error) { + Logger.error(error.message) + } + } + + // Re-connect on mount when network is different from user network + // useEffect(() => { + // if (!web3 || !networkId) return + + // async function init() { + // if ( + // (await web3.eth.getChainId()) === + // (config as ConfigHelperConfig).networkId + // ) + // return + // await handleNetworkChanged(networkId) + // } + // init() + // }, [web3, networkId]) + + // Handle network change events useEffect(() => { if (!web3Provider) return - async function handleNetworkChanged(chainId: string) { - const initialConfig = getOceanConfig(Number(chainId.replace('0x', ''))) - - const newConfig = { - ...initialConfig, - // add metadataCacheUri only when defined - ...(metadataCacheUri && { metadataCacheUri }) - } - if (chainId === '8996') { - newConfig.factoryAddress = '0x312213d6f6b5FCF9F56B7B8946A6C727Bf4Bc21f' - newConfig.poolFactoryAddress = - '0xF9E633CBeEB2A474D3Fe22261046C99e805beeC4' - newConfig.fixedRateExchangeAddress = - '0xefdcb16b16C7842ec27c6fdCf56adc316B9B29B8' - newConfig.metadataContractAddress = - '0xEBe77E16736359Bf0F9013F6017242a5971cAE76' - } - - try { - await connect(newConfig) - } catch (error) { - Logger.error(error.message) - } - } - web3Provider.on('chainChanged', handleNetworkChanged) return () => { web3Provider.removeListener('chainChanged', handleNetworkChanged) } - }, [web3Provider, connect, metadataCacheUri]) + }, [web3Provider]) return <> } diff --git a/src/helpers/wrapRootElement.tsx b/src/helpers/wrapRootElement.tsx index f8fcfcaba..e00ebe1c0 100644 --- a/src/helpers/wrapRootElement.tsx +++ b/src/helpers/wrapRootElement.tsx @@ -24,17 +24,14 @@ export default function wrapRootElement({ }: { element: ReactElement }): ReactElement { - const { metadataCacheUri, network } = appConfig + const { network } = appConfig const oceanInitialConfig = getOceanConfig(network) - const initialConfig = { - ...oceanInitialConfig, - // add metadataCacheUri only when defined - ...(metadataCacheUri && { metadataCacheUri }) - } - return ( - + {element}