fix: token dependency graph (#2371)

* chore: fix dependency graph

* fix: silly error

* fix: remove uneeded generics

apps/token/src/components/vega-wallet/hooks.ts

@@ -11,10 +11,12 @@ import { BigNumber } from '../../lib/bignumber';
 import type { WalletCardAssetProps } from '../wallet-card';
 import { useVegaWallet } from '@vegaprotocol/wallet';
 import { useContracts } from '../../contexts/contracts/contracts-context';
-import type { ERC20Asset } from '@vegaprotocol/assets';
-import { isAssetTypeERC20 } from '@vegaprotocol/assets';
 import * as Schema from '@vegaprotocol/types';
-import { removePaginationWrapper, toBigNum } from '@vegaprotocol/react-helpers';
+import {
+  isAssetTypeERC20,
+  removePaginationWrapper,
+  toBigNum,
+} from '@vegaprotocol/react-helpers';
 import { useAppState } from '../../contexts/app-state/app-state-context';
 import { addDecimal } from '@vegaprotocol/react-helpers';
 import type {
@@ -94,9 +96,8 @@ export const usePollForDelegations = () => {
                 )
                 .map((a) => {
                   const isVega =
-                    isAssetTypeERC20(a.asset as ERC20Asset) &&
+                    isAssetTypeERC20(a.asset) &&
-                    (a.asset as ERC20Asset).source.contractAddress ===
+                    a.asset.source.contractAddress === vegaToken.address;
-                      vegaToken.address;
 
                   return {
                     isVega,
@@ -109,8 +110,8 @@ export const usePollForDelegations = () => {
                     ),
                     image: isVega ? vegaBlack : noIcon,
                     border: isVega,
-                    address: isAssetTypeERC20(a.asset as ERC20Asset)
+                    address: isAssetTypeERC20(a.asset)
-                      ? (a.asset as ERC20Asset).source.contractAddress
+                      ? a.asset.source.contractAddress
                       : undefined,
                   };
                 })

libs/assets/src/lib/assets-data-provider.ts

@@ -8,32 +8,14 @@ import * as Schema from '@vegaprotocol/types';
 import type { AssetsQuery } from './__generated__/Assets';
 import type { Asset } from './asset-data-provider';
 
-export interface ERC20AssetSource {
-  __typename: 'ERC20';
-  contractAddress: string;
-  lifetimeLimit: string;
-  withdrawThreshold: string;
-}
-
 export interface BuiltinAssetSource {
   __typename: 'BuiltinAsset';
 }
 
-export type ERC20Asset = Omit<Asset, 'source'> & {
-  source: ERC20AssetSource;
-};
-
 export type BuiltinAsset = Omit<Asset, 'source'> & {
   source: BuiltinAssetSource;
 };
 
-export const isAssetTypeERC20 = (
-  asset?: Pick<Asset, 'source'>
-): asset is ERC20Asset => {
-  if (!asset?.source) return false;
-  return asset.source.__typename === 'ERC20';
-};
-
 const getData = (responseData: AssetsQuery) =>
   responseData.assetsConnection?.edges
     ?.filter((e) => Boolean(e?.node))

libs/deposits/src/lib/deposit-form.tsx

@@ -1,5 +1,4 @@
 import type { Asset } from '@vegaprotocol/assets';
-import { isAssetTypeERC20 } from '@vegaprotocol/assets';
 import {
   ethereumAddress,
   t,
@@ -9,6 +8,7 @@ import {
   maxSafe,
   addDecimal,
   useLocalStorage,
+  isAssetTypeERC20,
 } from '@vegaprotocol/react-helpers';
 import {
   Button,

libs/deposits/src/lib/use-deposit-balances.ts

@@ -6,7 +6,7 @@ import { useGetAllowance } from './use-get-allowance';
 import { useGetBalanceOfERC20Token } from './use-get-balance-of-erc20-token';
 import { useGetDepositMaximum } from './use-get-deposit-maximum';
 import { useGetDepositedAmount } from './use-get-deposited-amount';
-import { isAssetTypeERC20 } from '@vegaprotocol/assets';
+import { isAssetTypeERC20 } from '@vegaprotocol/react-helpers';
 
 /**
  * Hook which fetches all the balances required for depositing
@@ -15,7 +15,7 @@ import { isAssetTypeERC20 } from '@vegaprotocol/assets';
 export const useDepositBalances = (isFaucetable: boolean) => {
   const { asset, update } = useDepositStore();
   const tokenContract = useTokenContract(
-    isAssetTypeERC20(asset) ? asset : undefined,
+    isAssetTypeERC20(asset) ? asset.source.contractAddress : undefined,
     isFaucetable
   );
   const bridgeContract = useBridgeContract();

libs/deposits/src/lib/use-submit-approval.ts

@@ -1,5 +1,4 @@
-import { removeDecimal } from '@vegaprotocol/react-helpers';
+import { isAssetTypeERC20, removeDecimal } from '@vegaprotocol/react-helpers';
-import { isAssetTypeERC20 } from '@vegaprotocol/assets';
 import * as Sentry from '@sentry/react';
 import type { Token } from '@vegaprotocol/smart-contracts';
 import {
@@ -14,7 +13,7 @@ export const useSubmitApproval = () => {
   const { config } = useEthereumConfig();
   const { asset, update } = useDepositStore();
   const contract = useTokenContract(
-    isAssetTypeERC20(asset) ? asset : undefined,
+    isAssetTypeERC20(asset) ? asset.source.contractAddress : undefined,
     true
   );
   const getAllowance = useGetAllowance(contract, asset);

libs/deposits/src/lib/use-submit-deposit.tsx

@@ -7,8 +7,11 @@ import type {
 import { DepositEventDocument } from './__generated__/Deposit';
 import * as Schema from '@vegaprotocol/types';
 import { useState } from 'react';
-import { remove0x, removeDecimal } from '@vegaprotocol/react-helpers';
+import {
-import { isAssetTypeERC20 } from '@vegaprotocol/assets';
+  isAssetTypeERC20,
+  remove0x,
+  removeDecimal,
+} from '@vegaprotocol/react-helpers';
 import {
   useBridgeContract,
   useEthereumConfig,
@@ -25,7 +28,7 @@ export const useSubmitDeposit = () => {
   const { config } = useEthereumConfig();
   const bridgeContract = useBridgeContract();
   const tokenContract = useTokenContract(
-    isAssetTypeERC20(asset) ? asset : undefined,
+    isAssetTypeERC20(asset) ? asset.source.contractAddress : undefined,
     true
   );
 

libs/deposits/src/lib/use-submit-faucet.ts

@@ -3,12 +3,12 @@ import * as Sentry from '@sentry/react';
 import { useEthereumTransaction, useTokenContract } from '@vegaprotocol/web3';
 import { useDepositStore } from './deposit-store';
 import { useGetBalanceOfERC20Token } from './use-get-balance-of-erc20-token';
-import { isAssetTypeERC20 } from '@vegaprotocol/assets';
+import { isAssetTypeERC20 } from '@vegaprotocol/react-helpers';
 
 export const useSubmitFaucet = () => {
   const { asset, update } = useDepositStore();
   const contract = useTokenContract(
-    isAssetTypeERC20(asset) ? asset : undefined,
+    isAssetTypeERC20(asset) ? asset.source.contractAddress : undefined,
     true
   );
   const getBalance = useGetBalanceOfERC20Token(contract, asset);

libs/react-helpers/src/index.ts

@@ -12,5 +12,6 @@ export * from './lib/storage';
 export * from './lib/time';
 export * from './lib/validate';
 export * from './lib/links';
+export * from './lib/is-asset-erc20';
 export * from './lib/remove-pagination-wrapper';
 export * from './lib/__generated__/ChainId';

libs/react-helpers/src/lib/is-asset-erc20.ts

@@ -0,0 +1,20 @@
+interface Asset {
+  __typename?: 'Asset';
+  source:
+    | { __typename: 'BuiltinAsset' }
+    | {
+        __typename: 'ERC20';
+      };
+}
+
+interface ERC20Asset {
+  __typename?: 'Asset';
+  source: {
+    __typename: 'ERC20';
+  };
+}
+
+export function isAssetTypeERC20(asset?: Asset): asset is ERC20Asset {
+  if (!asset?.source) return false;
+  return asset.source.__typename === 'ERC20';
+}

libs/web3/src/lib/use-token-contract.ts

@@ -1,25 +1,23 @@
-import type { ERC20Asset } from '@vegaprotocol/assets';
 import { Token, TokenFaucetable } from '@vegaprotocol/smart-contracts';
 import { useWeb3React } from '@web3-react/core';
 import { useMemo } from 'react';
 
-export const useTokenContract = (asset?: ERC20Asset, faucetable = false) => {
+export const useTokenContract = (address?: string, faucetable = false) => {
   const { provider } = useWeb3React();
 
   const contract = useMemo(() => {
-    if (!provider || !asset) {
+    if (!provider || !address) {
       return null;
     }
 
     const signer = provider.getSigner();
-    const address = asset.source.contractAddress;
 
     if (faucetable) {
       return new TokenFaucetable(address, signer || provider);
     } else {
       return new Token(address, signer || provider);
     }
-  }, [provider, asset, faucetable]);
+  }, [provider, address, faucetable]);
 
   return contract;
 };

libs/withdraws/src/lib/withdraw-form.tsx

@@ -6,8 +6,8 @@ import {
   removeDecimal,
   required,
   useLocalStorage,
+  isAssetTypeERC20,
 } from '@vegaprotocol/react-helpers';
-import { isAssetTypeERC20 } from '@vegaprotocol/assets';
 import {
   Button,
   FormGroup,