remove all useWeb3 imports

src/@hooks/useNftFactory.ts

@@ -1,18 +1,19 @@
 import { useEffect, useState } from 'react'
 import { NftFactory } from '@oceanprotocol/lib'
-import { useWeb3 } from '@hooks/useBalance'
 import { getOceanConfig } from '@utils/ocean'
+import { useNetwork } from 'wagmi'
 
 function useNftFactory(): NftFactory {
-  const { web3, chainId } = useWeb3()
+  const { chain } = useNetwork()
   const [nftFactory, setNftFactory] = useState<NftFactory>()
 
   useEffect(() => {
-    if (!web3 || !chainId) return
+    if (!web3 || !chain?.id) return
-    const config = getOceanConfig(chainId)
+
+    const config = getOceanConfig(chain.id)
     const factory = new NftFactory(config?.nftFactoryAddress, web3)
     setNftFactory(factory)
-  }, [web3, chainId])
+  }, [web3, chain?.id])
 
   return nftFactory
 }

src/@utils/nft.ts

@@ -67,7 +67,7 @@ export function generateNftCreateData(
   nftMetadata: NftMetadata,
   accountId: string,
   transferable = true
-): any {
+): NftCreateData {
   const nftCreateData: NftCreateData = {
     name: nftMetadata.name,
     symbol: nftMetadata.symbol,

src/components/Asset/AssetActions/ButtonBuy/index.tsx

@@ -2,8 +2,6 @@ import React, { FormEvent, ReactElement } from 'react'
 import Button from '../../../@shared/atoms/Button'
 import styles from './index.module.css'
 import Loader from '../../../@shared/atoms/Loader'
-import { useWeb3 } from '@hooks/useBalance'
-import Web3 from 'web3'
 
 export interface ButtonBuyProps {
   action: 'download' | 'compute'
@@ -185,7 +183,6 @@ export default function ButtonBuy({
   retry,
   isSupportedOceanNetwork
 }: ButtonBuyProps): ReactElement {
-  const { web3 } = useWeb3()
   const buttonText = retry
     ? 'Retry'
     : action === 'download'

src/components/Asset/AssetActions/Compute/FormComputeDataset.tsx

@@ -7,7 +7,6 @@ import { compareAsBN } from '@utils/numbers'
 import ButtonBuy from '../ButtonBuy'
 import PriceOutput from './PriceOutput'
 import { useAsset } from '@context/Asset'
-import { useWeb3 } from '@hooks/useBalance'
 import content from '../../../../../content/pages/startComputeDataset.json'
 import { Asset, ZERO_ADDRESS } from '@oceanprotocol/lib'
 import { getAccessDetails } from '@utils/accessDetailsAndPricing'
@@ -16,6 +15,9 @@ import Alert from '@shared/atoms/Alert'
 import { getTokenBalanceFromSymbol } from '@utils/web3'
 import { MAX_DECIMALS } from '@utils/constants'
 import Decimal from 'decimal.js'
+import { useAccount } from 'wagmi'
+import useBalance from '@hooks/useBalance'
+import useNetworkMetadata from '@hooks/useNetworkMetadata'
 
 export default function FormStartCompute({
   algorithms,
@@ -77,7 +79,9 @@ export default function FormStartCompute({
   retry: boolean
 }): ReactElement {
   const { siteContent } = useMarketMetadata()
-  const { accountId, balance, isSupportedOceanNetwork } = useWeb3()
+  const { address: accountId } = useAccount()
+  const { balance } = useBalance()
+  const { isSupportedOceanNetwork } = useNetworkMetadata()
   const { isValid, values }: FormikContextType<{ algorithm: string }> =
     useFormikContext()
   const { asset, isAssetNetwork } = useAsset()

src/components/Asset/AssetActions/Compute/PriceOutput.tsx

@@ -5,7 +5,7 @@ import Tooltip from '@shared/atoms/Tooltip'
 import styles from './PriceOutput.module.css'
 import { MAX_DECIMALS } from '@utils/constants'
 import Decimal from 'decimal.js'
-import { useWeb3 } from '@hooks/useBalance'
+import useNetworkMetadata from '@hooks/useNetworkMetadata'
 
 interface PriceOutputProps {
   hasPreviousOrder: boolean
@@ -42,7 +42,7 @@ function Row({
   sign?: string
   type?: string
 }) {
-  const { isSupportedOceanNetwork } = useWeb3()
+  const { isSupportedOceanNetwork } = useNetworkMetadata()
 
   return (
     <div className={styles.priceRow}>

src/components/Asset/AssetActions/Compute/index.tsx

@@ -19,7 +19,6 @@ import { toast } from 'react-toastify'
 import Price from '@shared/Price'
 import FileIcon from '@shared/FileIcon'
 import Alert from '@shared/atoms/Alert'
-import { useWeb3 } from '@hooks/useBalance'
 import { Formik } from 'formik'
 import { getInitialValues, validationSchema } from './_constants'
 import FormStartComputeDataset from './FormComputeDataset'
@@ -46,8 +45,10 @@ import { getComputeFeedback } from '@utils/feedback'
 import { initializeProviderForCompute } from '@utils/provider'
 import { useUserPreferences } from '@context/UserPreferences'
 import { useAsset } from '@context/Asset'
+import { useAccount } from 'wagmi'
 
 const refreshInterval = 10000 // 10 sec.
+
 export default function Compute({
   asset,
   dtBalance,
@@ -61,7 +62,7 @@ export default function Compute({
   fileIsLoading?: boolean
   consumableFeedback?: string
 }): ReactElement {
-  const { accountId, web3, isSupportedOceanNetwork, networkId } = useWeb3()
+  const { address: accountId } = useAccount()
   const { chainIds } = useUserPreferences()
   const { isAssetNetwork } = useAsset()
 

src/components/Asset/AssetActions/Download.tsx

@@ -2,7 +2,6 @@ import React, { ReactElement, useEffect, useState } from 'react'
 import FileIcon from '@shared/FileIcon'
 import Price from '@shared/Price'
 import { useAsset } from '@context/Asset'
-import { useWeb3 } from '@hooks/useBalance'
 import ButtonBuy from './ButtonBuy'
 import { secondsToString } from '@utils/ddo'
 import AlgorithmDatasetsListForCompute from './Compute/AlgorithmDatasetsListForCompute'
@@ -17,6 +16,8 @@ import { useIsMounted } from '@hooks/useIsMounted'
 import { useMarketMetadata } from '@context/MarketMetadata'
 import Alert from '@shared/atoms/Alert'
 import Loader from '@shared/atoms/Loader'
+import { useAccount } from 'wagmi'
+import useNetworkMetadata from '@hooks/useNetworkMetadata'
 
 export default function Download({
   asset,
@@ -33,7 +34,8 @@ export default function Download({
   fileIsLoading?: boolean
   consumableFeedback?: string
 }): ReactElement {
-  const { accountId, web3, isSupportedOceanNetwork } = useWeb3()
+  const { address: accountId } = useAccount()
+  const { isSupportedOceanNetwork } = useNetworkMetadata()
   const { getOpcFeeForToken } = useMarketMetadata()
   const { isInPurgatory, isAssetNetwork } = useAsset()
   const isMounted = useIsMounted()

src/components/Asset/Edit/EditComputeDataset.tsx

@@ -1,4 +1,3 @@
-import { useWeb3 } from '@hooks/useBalance'
 import { Formik } from 'formik'
 import React, { ReactElement, useState } from 'react'
 import FormEditComputeDataset from './FormEditComputeDataset'
@@ -24,6 +23,7 @@ import { useAsset } from '@context/Asset'
 import EditFeedback from './EditFeedback'
 import { setNftMetadata } from '@utils/nft'
 import { ComputeEditForm } from './_types'
+import { useAccount } from 'wagmi'
 
 export default function EditComputeDataset({
   asset
@@ -31,7 +31,7 @@ export default function EditComputeDataset({
   asset: AssetExtended
 }): ReactElement {
   const { debug } = useUserPreferences()
-  const { accountId, web3 } = useWeb3()
+  const { address: accountId } = useAccount()
   const { fetchAsset, isAssetNetwork } = useAsset()
   const [success, setSuccess] = useState<string>()
   const [error, setError] = useState<string>()

src/components/Asset/Edit/EditMetadata.tsx

@@ -12,7 +12,6 @@ import {
 import { validationSchema } from './_validation'
 import { getInitialValues } from './_constants'
 import { MetadataEditForm } from './_types'
-import { useWeb3 } from '@hooks/useBalance'
 import { useUserPreferences } from '@context/UserPreferences'
 import Web3Feedback from '@shared/Web3Feedback'
 import FormEditMetadata from './FormEditMetadata'
@@ -28,6 +27,7 @@ import { setNftMetadata } from '@utils/nft'
 import { sanitizeUrl } from '@utils/url'
 import { getEncryptedFiles } from '@utils/provider'
 import { assetStateToNumber } from '@utils/assetState'
+import { useAccount } from 'wagmi'
 
 export default function Edit({
   asset
@@ -36,7 +36,7 @@ export default function Edit({
 }): ReactElement {
   const { debug } = useUserPreferences()
   const { fetchAsset, isAssetNetwork, assetState } = useAsset()
-  const { accountId, web3 } = useWeb3()
+  const { address: accountId } = useAccount()
   const newAbortController = useAbortController()
   const [success, setSuccess] = useState<string>()
   const [paymentCollector, setPaymentCollector] = useState<string>()

src/components/Profile/History/ComputeJobs/Results.tsx

@@ -10,9 +10,9 @@ import Button from '@shared/atoms/Button'
 import styles from './Results.module.css'
 import FormHelp from '@shared/FormInput/Help'
 import content from '../../../../../content/pages/history.json'
-import { useWeb3 } from '@hooks/useBalance'
 import { useCancelToken } from '@hooks/useCancelToken'
 import { getAsset } from '@utils/aquarius'
+import { useAccount } from 'wagmi'
 
 export default function Results({
   job
@@ -20,7 +20,7 @@ export default function Results({
   job: ComputeJobMetaData
 }): ReactElement {
   const providerInstance = new Provider()
-  const { accountId, web3 } = useWeb3()
+  const { address: accountId } = useAccount()
   const isFinished = job.dateFinished !== null
 
   const [datasetProvider, setDatasetProvider] = useState<string>()

src/components/Publish/_utils.ts

@@ -17,7 +17,6 @@ import { mapTimeoutStringToSeconds } from '@utils/ddo'
 import { generateNftCreateData } from '@utils/nft'
 import { getEncryptedFiles } from '@utils/provider'
 import slugify from 'slugify'
-import Web3 from 'web3'
 import { algorithmContainerPresets } from './_constants'
 import { FormPublishData, MetadataAlgorithmContainer } from './_types'
 import {
@@ -28,6 +27,7 @@ import {
 } from '../../../app.config'
 import { sanitizeUrl } from '@utils/url'
 import { getContainerChecksum } from '@utils/docker'
+import { utils } from 'ethers'
 
 function getUrlFileExtension(fileUrl: string): string {
   const splittedFileUrl = fileUrl.split('.')
@@ -206,8 +206,7 @@ export async function createTokensAndPricing(
   values: FormPublishData,
   accountId: string,
   config: Config,
-  nftFactory: NftFactory,
+  nftFactory: NftFactory
-  web3: Web3
 ) {
   const nftCreateData: NftCreateData = generateNftCreateData(
     values.metadata.nft,
@@ -274,8 +273,8 @@ export async function createTokensAndPricing(
       // both will be just 1 for the market
       const dispenserParams: DispenserCreationParams = {
         dispenserAddress: config.dispenserAddress,
-        maxTokens: web3.utils.toWei('1'),
+        maxTokens: utils.parseEther('1').toString(),
-        maxBalance: web3.utils.toWei('1'),
+        maxBalance: utils.parseEther('1').toString(),
         withMint: true,
         allowedSwapper: ZERO_ADDRESS
       }

src/components/Publish/index.tsx

@@ -2,7 +2,6 @@ import React, { ReactElement, useState, useRef } from 'react'
 import { Form, Formik } from 'formik'
 import { initialPublishFeedback, initialValues } from './_constants'
 import { useAccountPurgatory } from '@hooks/useAccountPurgatory'
-import { useWeb3 } from '@hooks/useBalance'
 import { createTokensAndPricing, transformPublishFormToDdo } from './_utils'
 import PageHeader from '@shared/Page/PageHeader'
 import Title from './Title'
@@ -19,6 +18,7 @@ import { getOceanConfig } from '@utils/ocean'
 import { validationSchema } from './_validation'
 import { useAbortController } from '@hooks/useAbortController'
 import { setNFTMetadataAndTokenURI } from '@utils/nft'
+import { useAccount, useNetwork } from 'wagmi'
 
 export default function PublishPage({
   content
@@ -26,7 +26,8 @@ export default function PublishPage({
   content: { title: string; description: string; warning: string }
 }): ReactElement {
   const { debug } = useUserPreferences()
-  const { accountId, web3, chainId } = useWeb3()
+  const { address: accountId } = useAccount()
+  const { chain } = useNetwork()
   const { isInPurgatory, purgatoryData } = useAccountPurgatory(accountId)
   const scrollToRef = useRef()
   const nftFactory = useNftFactory()
@@ -60,17 +61,11 @@ export default function PublishPage({
     }))
 
     try {
-      const config = getOceanConfig(chainId)
+      const config = getOceanConfig(chain?.id)
       LoggerInstance.log('[publish] using config: ', config)
 
       const { erc721Address, datatokenAddress, txHash } =
-        await createTokensAndPricing(
+        await createTokensAndPricing(values, accountId, config, nftFactory)
-          values,
-          accountId,
-          config,
-          nftFactory,
-          web3
-        )
 
       const isSuccess = Boolean(erc721Address && datatokenAddress && txHash)
       if (!isSuccess) throw new Error('No Token created. Please try again.')

src/pages/profile/index.tsx

@@ -15,6 +15,7 @@ export default function PageProfile(): ReactElement {
   const [finalAccountId, setFinalAccountId] = useState<string>()
   const [finalAccountEns, setFinalAccountEns] = useState<string>()
   const [ownAccount, setOwnAccount] = useState(false)
+
   // Have accountId in path take over, if not present fall back to web3
   useEffect(() => {
     async function init() {