mirror of
https://github.com/oceanprotocol/market.git
synced 2024-12-02 05:57:29 +01:00
kinda working implementation
This commit is contained in:
parent
2fd1833589
commit
0820ff08e5
@ -1,4 +1,5 @@
|
|||||||
#NEXT_PUBLIC_INFURA_PROJECT_ID="xxx"
|
#NEXT_PUBLIC_INFURA_PROJECT_ID="xxx"
|
||||||
|
#NEXT_PUBLIC_WALLETCONNECT_PROJECT_ID="xxx"
|
||||||
#NEXT_PUBLIC_MARKET_FEE_ADDRESS="0xxx"
|
#NEXT_PUBLIC_MARKET_FEE_ADDRESS="0xxx"
|
||||||
#NEXT_PUBLIC_PUBLISHER_MARKET_ORDER_FEE="1"
|
#NEXT_PUBLIC_PUBLISHER_MARKET_ORDER_FEE="1"
|
||||||
#NEXT_PUBLIC_PUBLISHER_MARKET_FIXED_SWAP_FEE="1"
|
#NEXT_PUBLIC_PUBLISHER_MARKET_FIXED_SWAP_FEE="1"
|
||||||
|
5441
package-lock.json
generated
5441
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -12,6 +12,7 @@ import { Web3Modal } from '@web3modal/standalone'
|
|||||||
import { infuraProjectId as infuraId } from '../../app.config'
|
import { infuraProjectId as infuraId } from '../../app.config'
|
||||||
import { LoggerInstance } from '@oceanprotocol/lib'
|
import { LoggerInstance } from '@oceanprotocol/lib'
|
||||||
import { isBrowser } from '@utils/index'
|
import { isBrowser } from '@utils/index'
|
||||||
|
import SignClient from '@walletconnect/sign-client'
|
||||||
import { getEnsProfile } from '@utils/ens'
|
import { getEnsProfile } from '@utils/ens'
|
||||||
import useNetworkMetadata, {
|
import useNetworkMetadata, {
|
||||||
getNetworkDataById,
|
getNetworkDataById,
|
||||||
@ -80,9 +81,10 @@ function Web3Provider({ children }: { children: ReactNode }): ReactElement {
|
|||||||
const [web3, setWeb3] = useState<Web3>()
|
const [web3, setWeb3] = useState<Web3>()
|
||||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||||
const [web3Provider, setWeb3Provider] = useState<any>()
|
const [web3Provider, setWeb3Provider] = useState<any>()
|
||||||
|
const [signClient, setSignClient] = useState<SignClient>()
|
||||||
const [web3Modal, setWeb3Modal] = useState<Web3Modal>()
|
const [web3Modal, setWeb3Modal] = useState<Web3Modal>()
|
||||||
const [web3ProviderInfo, setWeb3ProviderInfo] = useState<IProviderInfo>()
|
// const [web3ProviderInfo, setWeb3ProviderInfo] = useState<IProviderInfo>()
|
||||||
|
|
||||||
const [networkId, setNetworkId] = useState<number>()
|
const [networkId, setNetworkId] = useState<number>()
|
||||||
const [chainId, setChainId] = useState<number>()
|
const [chainId, setChainId] = useState<number>()
|
||||||
const [networkDisplayName, setNetworkDisplayName] = useState<string>()
|
const [networkDisplayName, setNetworkDisplayName] = useState<string>()
|
||||||
@ -103,18 +105,40 @@ function Web3Provider({ children }: { children: ReactNode }): ReactElement {
|
|||||||
// Helper: connect to web3
|
// Helper: connect to web3
|
||||||
// -----------------------------------
|
// -----------------------------------
|
||||||
const connect = useCallback(async () => {
|
const connect = useCallback(async () => {
|
||||||
if (!web3Modal) {
|
if (!web3Modal || !signClient) {
|
||||||
setWeb3Loading(false)
|
setWeb3Loading(false)
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
setWeb3Loading(true)
|
setWeb3Loading(true)
|
||||||
LoggerInstance.log('[web3] Connecting Web3...')
|
LoggerInstance.log('[web3] Connecting Web3...')
|
||||||
|
|
||||||
const provider = await web3Modal?.openModal()
|
if (signClient) {
|
||||||
|
const namespaces = {
|
||||||
|
eip155: {
|
||||||
|
methods: ['eth_sign'],
|
||||||
|
chains: ['eip155:1'],
|
||||||
|
events: ['accountsChanged']
|
||||||
|
}
|
||||||
|
}
|
||||||
|
const { uri, approval } = await signClient.connect({
|
||||||
|
requiredNamespaces: namespaces
|
||||||
|
})
|
||||||
|
if (uri) {
|
||||||
|
const provider = await web3Modal.openModal({
|
||||||
|
uri,
|
||||||
|
standaloneChains: namespaces.eip155.chains
|
||||||
|
})
|
||||||
|
await approval()
|
||||||
setWeb3Provider(provider)
|
setWeb3Provider(provider)
|
||||||
|
web3Modal.closeModal()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const web3 = new Web3(provider)
|
if (!web3Provider) return
|
||||||
|
|
||||||
|
const web3 = new Web3(web3Provider)
|
||||||
setWeb3(web3)
|
setWeb3(web3)
|
||||||
LoggerInstance.log('[web3] Web3 created.', web3)
|
LoggerInstance.log('[web3] Web3 created.', web3)
|
||||||
|
|
||||||
@ -134,7 +158,7 @@ function Web3Provider({ children }: { children: ReactNode }): ReactElement {
|
|||||||
} finally {
|
} finally {
|
||||||
setWeb3Loading(false)
|
setWeb3Loading(false)
|
||||||
}
|
}
|
||||||
}, [web3Modal])
|
}, [web3Modal, web3Provider, signClient])
|
||||||
|
|
||||||
// -----------------------------------
|
// -----------------------------------
|
||||||
// Helper: Get approved base tokens list
|
// Helper: Get approved base tokens list
|
||||||
@ -229,39 +253,36 @@ function Web3Provider({ children }: { children: ReactNode }): ReactElement {
|
|||||||
}
|
}
|
||||||
|
|
||||||
async function init() {
|
async function init() {
|
||||||
// note: needs artificial await here so the log message is reached and output
|
|
||||||
const web3Modal = new Web3Modal({
|
const web3Modal = new Web3Modal({
|
||||||
projectId: '<YOUR_PROJECT_ID>',
|
projectId: process.env.NEXT_PUBLIC_WALLETCONNECT_PROJECT_ID,
|
||||||
standaloneChains: ['eip155:1'],
|
standaloneChains: ['eip155:1']
|
||||||
theme: web3ModalTheme
|
// theme: web3ModalTheme
|
||||||
})
|
})
|
||||||
const signClient = await SignClient.init({
|
const signClient = await SignClient.init({
|
||||||
projectId: '<YOUR_PROJECT_ID>'
|
projectId: process.env.NEXT_PUBLIC_WALLETCONNECT_PROJECT_ID
|
||||||
})
|
})
|
||||||
setWeb3Modal(web3ModalInstance)
|
setWeb3Modal(web3Modal)
|
||||||
LoggerInstance.log(
|
setSignClient(signClient)
|
||||||
'[web3] Web3Modal instance created.',
|
LoggerInstance.log('[web3] Web3Modal instance created.', web3Modal)
|
||||||
web3ModalInstance
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
init()
|
init()
|
||||||
}, [connect, web3Modal])
|
}, [web3Modal])
|
||||||
|
|
||||||
// -----------------------------------
|
// -----------------------------------
|
||||||
// Reconnect automatically for returning users
|
// Reconnect automatically for returning users
|
||||||
// -----------------------------------
|
// -----------------------------------
|
||||||
useEffect(() => {
|
// useEffect(() => {
|
||||||
if (!web3Modal?.cachedProvider) return
|
// if (!web3Modal?.cachedProvider) return
|
||||||
|
|
||||||
async function connectCached() {
|
// async function connectCached() {
|
||||||
LoggerInstance.log(
|
// LoggerInstance.log(
|
||||||
'[web3] Connecting to cached provider: ',
|
// '[web3] Connecting to cached provider: ',
|
||||||
web3Modal.cachedProvider
|
// web3Modal.cachedProvider
|
||||||
)
|
// )
|
||||||
await connect()
|
// await connect()
|
||||||
}
|
// }
|
||||||
connectCached()
|
// connectCached()
|
||||||
}, [connect, web3Modal])
|
// }, [connect, web3Modal])
|
||||||
|
|
||||||
// -----------------------------------
|
// -----------------------------------
|
||||||
// Get and set approved base tokens list
|
// Get and set approved base tokens list
|
||||||
@ -336,12 +357,12 @@ function Web3Provider({ children }: { children: ReactNode }): ReactElement {
|
|||||||
// -----------------------------------
|
// -----------------------------------
|
||||||
// Workaround cause getInjectedProviderName() always returns `MetaMask`
|
// Workaround cause getInjectedProviderName() always returns `MetaMask`
|
||||||
// https://github.com/oceanprotocol/market/issues/332
|
// https://github.com/oceanprotocol/market/issues/332
|
||||||
useEffect(() => {
|
// useEffect(() => {
|
||||||
if (!web3Provider) return
|
// if (!web3Provider) return
|
||||||
|
|
||||||
const providerInfo = getProviderInfo(web3Provider)
|
// const providerInfo = getProviderInfo(web3Provider)
|
||||||
setWeb3ProviderInfo(providerInfo)
|
// setWeb3ProviderInfo(providerInfo)
|
||||||
}, [web3Provider])
|
// }, [web3Provider])
|
||||||
|
|
||||||
// -----------------------------------
|
// -----------------------------------
|
||||||
// Logout helper
|
// Logout helper
|
||||||
@ -353,7 +374,7 @@ function Web3Provider({ children }: { children: ReactNode }): ReactElement {
|
|||||||
}
|
}
|
||||||
/* eslint-enable @typescript-eslint/no-explicit-any */
|
/* eslint-enable @typescript-eslint/no-explicit-any */
|
||||||
|
|
||||||
await web3Modal.clearCachedProvider()
|
// await web3Modal.clearCachedProvider()
|
||||||
}
|
}
|
||||||
// -----------------------------------
|
// -----------------------------------
|
||||||
// Get valid Networks and set isSupportedOceanNetwork
|
// Get valid Networks and set isSupportedOceanNetwork
|
||||||
@ -410,7 +431,6 @@ function Web3Provider({ children }: { children: ReactNode }): ReactElement {
|
|||||||
web3,
|
web3,
|
||||||
web3Provider,
|
web3Provider,
|
||||||
web3Modal,
|
web3Modal,
|
||||||
web3ProviderInfo,
|
|
||||||
accountId,
|
accountId,
|
||||||
accountEns,
|
accountEns,
|
||||||
accountEnsAvatar,
|
accountEnsAvatar,
|
||||||
|
Loading…
Reference in New Issue
Block a user