From da4c11e3d01b99e0f8b3631573436f3472d5f315 Mon Sep 17 00:00:00 2001
From: Lantt <laanfor@gmail.com>
Date: Tue, 14 Jun 2022 01:48:53 +0800
Subject: [PATCH 1/2] fix: add collectible owner check

---
 .../Wallets/components/AddCollectibleDialog/index.tsx      | 7 ++-----
 packages/plugins/EVM/src/state/Connection/connection.ts    | 4 +++-
 packages/plugins/EVM/src/state/Hub/hub.ts                  | 2 +-
 packages/web3-providers/src/opensea/index.ts               | 1 +
 4 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/packages/dashboard/src/pages/Wallets/components/AddCollectibleDialog/index.tsx b/packages/dashboard/src/pages/Wallets/components/AddCollectibleDialog/index.tsx
index f06233eb138d..de17fa633637 100644
--- a/packages/dashboard/src/pages/Wallets/components/AddCollectibleDialog/index.tsx
+++ b/packages/dashboard/src/pages/Wallets/components/AddCollectibleDialog/index.tsx
@@ -61,13 +61,10 @@ export const AddCollectibleDialog = memo<AddCollectibleDialogProps>(({ open, onC
         const tokenAsset = await hub?.getNonFungibleAsset(address ?? '', tokenId)
         const token = await connection?.getNonFungibleToken(address ?? '', tokenId, SchemaType.ERC721)
         const tokenDetailed = { ...token, ...tokenAsset }
+        const isOwner = await connection?.getNonFungibleTokenOwnership(address, account, tokenId)
 
         // If the NonFungible token is belong this account
-        if (
-            (tokenDetailed && !isSameAddress(tokenDetailed?.contract?.owner, account)) ||
-            !tokenDetailed ||
-            !tokenDetailed.contract?.owner
-        ) {
+        if (!isOwner) {
             throw new Error(FormErrorType.NotExist)
         } else {
             await Token?.addToken?.(tokenDetailed)
diff --git a/packages/plugins/EVM/src/state/Connection/connection.ts b/packages/plugins/EVM/src/state/Connection/connection.ts
index ae5b72b012a6..cc0dd19ec140 100644
--- a/packages/plugins/EVM/src/state/Connection/connection.ts
+++ b/packages/plugins/EVM/src/state/Connection/connection.ts
@@ -301,7 +301,9 @@ class Connection implements EVM_Connection {
 
         if (actualSchema !== SchemaType.ERC1155) {
             const contract = await this.getERC721Contract(address, options)
-            ownerId = await contract?.methods.ownerOf(tokenId).call()
+            try {
+                ownerId = await contract?.methods.ownerOf(tokenId).call()
+            } catch {}
         }
 
         return createNonFungibleToken<ChainId, SchemaType>(
diff --git a/packages/plugins/EVM/src/state/Hub/hub.ts b/packages/plugins/EVM/src/state/Hub/hub.ts
index 0f47378015a1..9fd4a6219b44 100644
--- a/packages/plugins/EVM/src/state/Hub/hub.ts
+++ b/packages/plugins/EVM/src/state/Hub/hub.ts
@@ -147,7 +147,7 @@ class Hub implements EVM_Hub {
         account: string,
         options?: HubOptions<ChainId> | undefined,
     ): Promise<Pageable<NonFungibleTokenCollection<ChainId>>> {
-        return OpenSea.getCollections(account, options)
+        return OpenSea.getCollections(account, { ...options, chainId: options?.chainId ?? this.chainId })
     }
     getFungibleTokenPrice(
         chainId: ChainId,
diff --git a/packages/web3-providers/src/opensea/index.ts b/packages/web3-providers/src/opensea/index.ts
index 6b7efffef852..b59961621531 100644
--- a/packages/web3-providers/src/opensea/index.ts
+++ b/packages/web3-providers/src/opensea/index.ts
@@ -391,6 +391,7 @@ export class OpenSeaAPI implements NonFungibleTokenAPI.Provider<ChainId, SchemaT
         address: string,
         { chainId = ChainId.Mainnet, indicator, size = 50 }: HubOptions<ChainId> = {},
     ) {
+        if (chainId !== ChainId.Mainnet) return createPageable([], createIndicator(indicator))
         const response = await fetchFromOpenSea<OpenSeaCollection[]>(
             urlcat('/api/v1/collections', {
                 asset_owner: address,

From 16dd617f6967b1df7b3507e014080b5cea0a6250 Mon Sep 17 00:00:00 2001
From: Lantt <laanfor@gmail.com>
Date: Tue, 14 Jun 2022 15:56:02 +0800
Subject: [PATCH 2/2] fix: dashboard add nft with chain id and send nft from
 nft list

---
 .../components/AddCollectibleDialog/index.tsx | 27 +++++---
 .../pages/Wallets/components/Assets/index.tsx |  6 +-
 .../components/CollectibleList/index.tsx      |  9 +--
 .../components/Transfer/TransferERC721.tsx    | 66 +++++++++++--------
 .../Wallets/components/Transfer/index.tsx     |  4 +-
 5 files changed, 63 insertions(+), 49 deletions(-)

diff --git a/packages/dashboard/src/pages/Wallets/components/AddCollectibleDialog/index.tsx b/packages/dashboard/src/pages/Wallets/components/AddCollectibleDialog/index.tsx
index de17fa633637..d8b6c537e829 100644
--- a/packages/dashboard/src/pages/Wallets/components/AddCollectibleDialog/index.tsx
+++ b/packages/dashboard/src/pages/Wallets/components/AddCollectibleDialog/index.tsx
@@ -9,17 +9,18 @@ import { Controller, useForm } from 'react-hook-form'
 import { zodResolver } from '@hookform/resolvers/zod'
 import {
     useWeb3Connection,
-    useChainId,
     useNonFungibleTokenContract,
     useAccount,
     useWeb3State,
     useTrustedNonFungibleTokens,
     useCurrentWeb3NetworkPluginID,
     useWeb3Hub,
+    Web3Helper,
 } from '@masknet/plugin-infra/web3'
-import { SchemaType } from '@masknet/web3-shared-evm'
+import type { ChainId } from '@masknet/web3-shared-evm'
 
 export interface AddCollectibleDialogProps {
+    selectedNetwork: Web3Helper.NetworkDescriptorAll
     open: boolean
     onClose: () => void
 }
@@ -34,22 +35,24 @@ enum FormErrorType {
     NotExist = 'NOT_EXIST',
 }
 
-export const AddCollectibleDialog = memo<AddCollectibleDialogProps>(({ open, onClose }) => {
+export const AddCollectibleDialog = memo<AddCollectibleDialogProps>(({ open, onClose, selectedNetwork }) => {
     const currentNetworkPluginID = useCurrentWeb3NetworkPluginID()
     const account = useAccount(NetworkPluginID.PLUGIN_EVM)
     const { Token } = useWeb3State<'all'>()
     const trustedNonFungibleTokens = useTrustedNonFungibleTokens(currentNetworkPluginID)
     const hub = useWeb3Hub()
     const connection = useWeb3Connection(NetworkPluginID.PLUGIN_EVM)
-    const chainId = useChainId(NetworkPluginID.PLUGIN_EVM)
 
     const [address, setAddress] = useState('')
     const [tokenId, setTokenId] = useState('')
 
-    const { value, loading } = useNonFungibleTokenContract(NetworkPluginID.PLUGIN_EVM, address)
+    const { value: contract, loading } = useNonFungibleTokenContract(NetworkPluginID.PLUGIN_EVM, address, undefined, {
+        chainId: selectedNetwork.chainId as ChainId,
+    })
 
     const onSubmit = useCallback(async () => {
-        if (loading || !account || !value || !hub?.getNonFungibleAsset) return
+        if (loading || !account || !hub?.getNonFungibleAsset) return
+        if (address && tokenId && !contract) throw new Error(FormErrorType.NotExist)
 
         // If the NonFungible token is added
         const tokenInDB = trustedNonFungibleTokens.find(
@@ -58,10 +61,14 @@ export const AddCollectibleDialog = memo<AddCollectibleDialogProps>(({ open, onC
         )
         if (tokenInDB) throw new Error(FormErrorType.Added)
 
-        const tokenAsset = await hub?.getNonFungibleAsset(address ?? '', tokenId)
-        const token = await connection?.getNonFungibleToken(address ?? '', tokenId, SchemaType.ERC721)
+        const tokenAsset = await hub?.getNonFungibleAsset(address ?? '', tokenId, { chainId: selectedNetwork.chainId })
+        const token = await connection?.getNonFungibleToken(address ?? '', tokenId, undefined, {
+            chainId: selectedNetwork.chainId as ChainId,
+        })
         const tokenDetailed = { ...token, ...tokenAsset }
-        const isOwner = await connection?.getNonFungibleTokenOwnership(address, account, tokenId)
+        const isOwner = await connection?.getNonFungibleTokenOwnership(address, account, tokenId, undefined, {
+            chainId: selectedNetwork.chainId as ChainId,
+        })
 
         // If the NonFungible token is belong this account
         if (!isOwner) {
@@ -74,7 +81,7 @@ export const AddCollectibleDialog = memo<AddCollectibleDialogProps>(({ open, onC
         account,
         address,
         tokenId,
-        value,
+        contract,
         loading,
         hub?.getNonFungibleAsset,
         connection?.getNonFungibleToken,
diff --git a/packages/dashboard/src/pages/Wallets/components/Assets/index.tsx b/packages/dashboard/src/pages/Wallets/components/Assets/index.tsx
index cb4828a3ca50..5e8ec2a59171 100644
--- a/packages/dashboard/src/pages/Wallets/components/Assets/index.tsx
+++ b/packages/dashboard/src/pages/Wallets/components/Assets/index.tsx
@@ -75,7 +75,7 @@ export const Assets = memo<TokenAssetsProps>(({ network }) => {
                                     <Tab key={key} value={key} label={assetTabsLabel[key]} />
                                 ))}
                         </TabList>
-                        {pluginId === NetworkPluginID.PLUGIN_EVM && (
+                        {pluginId === NetworkPluginID.PLUGIN_EVM && (currentTab === AssetTab.Token ? true : !!network) && (
                             <Button
                                 size="small"
                                 color="secondary"
@@ -109,7 +109,9 @@ export const Assets = memo<TokenAssetsProps>(({ network }) => {
                     </TabPanel>
                 </TabContext>
             </ContentContainer>
-            {addCollectibleOpen && <AddCollectibleDialog open onClose={() => setAddCollectibleOpen(false)} />}
+            {addCollectibleOpen && network && (
+                <AddCollectibleDialog selectedNetwork={network} open onClose={() => setAddCollectibleOpen(false)} />
+            )}
         </>
     )
 })
diff --git a/packages/dashboard/src/pages/Wallets/components/CollectibleList/index.tsx b/packages/dashboard/src/pages/Wallets/components/CollectibleList/index.tsx
index 3ca2893a10f8..fbefd90e4a9a 100644
--- a/packages/dashboard/src/pages/Wallets/components/CollectibleList/index.tsx
+++ b/packages/dashboard/src/pages/Wallets/components/CollectibleList/index.tsx
@@ -83,7 +83,7 @@ export const CollectibleList = memo<CollectibleListProps>(({ selectedChain }) =>
             navigate(DashboardRoutes.WalletsTransfer, {
                 state: {
                     type: TransferTab.Collectibles,
-                    erc721Token: detail,
+                    nonFungibleToken: detail,
                 },
             })
         },
@@ -146,12 +146,7 @@ export const CollectibleListUI = memo<CollectibleListUIProps>(
                             <div className={classes.root}>
                                 {dataSource.map((x, index) => (
                                     <div className={classes.card} key={index}>
-                                        <CollectibleCard
-                                            token={x}
-                                            renderOrder={index}
-                                            // TODO: transfer not support multi chain, should remove is after supported
-                                            onSend={() => onSend(x as unknown as any)}
-                                        />
+                                        <CollectibleCard token={x} renderOrder={index} onSend={() => onSend(x)} />
                                     </div>
                                 ))}
                             </div>
diff --git a/packages/dashboard/src/pages/Wallets/components/Transfer/TransferERC721.tsx b/packages/dashboard/src/pages/Wallets/components/Transfer/TransferERC721.tsx
index 85248ca838b0..5e1535e2588a 100644
--- a/packages/dashboard/src/pages/Wallets/components/Transfer/TransferERC721.tsx
+++ b/packages/dashboard/src/pages/Wallets/components/Transfer/TransferERC721.tsx
@@ -10,7 +10,14 @@ import {
     multipliedBy,
     NetworkPluginID,
 } from '@masknet/web3-shared-base'
-import { SchemaType, formatWeiToEther, NetworkType, ChainId, explorerResolver } from '@masknet/web3-shared-evm'
+import {
+    SchemaType,
+    formatWeiToEther,
+    NetworkType,
+    ChainId,
+    explorerResolver,
+    isValidAddress,
+} from '@masknet/web3-shared-evm'
 // import { useERC721TokenDetailedOwnerList } from '@masknet/web3-providers'
 import { FormattedAddress } from '@masknet/shared'
 import { useDashboardI18N } from '../../../../locales'
@@ -38,6 +45,7 @@ import {
     useWeb3State,
     useNativeToken,
     useNativeTokenPrice,
+    useWeb3Connection,
 } from '@masknet/plugin-infra/web3'
 import { RightIcon } from '@masknet/icons'
 import { useGasLimit, useNonFungibleOwnerTokens, useTokenTransferCallback } from '@masknet/plugin-infra/web3-evm'
@@ -60,10 +68,12 @@ export const TransferERC721 = memo(() => {
     const t = useDashboardI18N()
     const chainId = useChainId(NetworkPluginID.PLUGIN_EVM)
     const anchorEl = useRef<HTMLDivElement | null>(null)
+    const connection = useWeb3Connection(NetworkPluginID.PLUGIN_EVM)
 
     const { state } = useLocation() as {
-        state: { erc721Token?: NonFungibleToken<ChainId, SchemaType>; type?: TransferTab } | null
+        state: { nonFungibleToken?: NonFungibleToken<ChainId, SchemaType>; type?: TransferTab } | null
     }
+
     const { classes } = useStyles()
     const [defaultToken, setDefaultToken] = useState<NonFungibleToken<ChainId, SchemaType> | null>(null)
     const navigate = useNavigate()
@@ -108,14 +118,13 @@ export const TransferERC721 = memo(() => {
 
     useEffect(() => {
         if (!state) return
-        if (!state.erc721Token || state.type !== TransferTab.Collectibles) return
-        if (state.erc721Token.chainId !== chainId) return
-        if (!isSameAddress(contract?.address, state.erc721Token.address)) return
+        if (!state.nonFungibleToken || state.type !== TransferTab.Collectibles) return
+        if (state.nonFungibleToken.chainId !== chainId) return
 
-        setContract(state.erc721Token.contract)
-        setValue('contract', state.erc721Token.contract?.name ?? '')
-        setValue('tokenId', state.erc721Token.tokenId)
-        setDefaultToken(state.erc721Token)
+        setContract(state.nonFungibleToken.contract)
+        setValue('contract', state.nonFungibleToken.contract?.name ?? '')
+        setValue('tokenId', state.nonFungibleToken.tokenId)
+        setDefaultToken(state.nonFungibleToken)
     }, [state])
 
     const allFormFields = watch()
@@ -130,25 +139,26 @@ export const TransferERC721 = memo(() => {
 
     // #region check contract address and account address
     useAsync(async () => {
-        // const recipient = allFormFields.recipient
-        // setRecipientError(null)
-        // if (!recipient && !registeredAddress) return
-        // if (!isValidAddress(recipient) && !isValidAddress(registeredAddress)) return
-        // clearErrors()
-        // if (isSameAddress(recipient, account) || isSameAddress(registeredAddress, account)) {
-        //     setRecipientError({
-        //         type: 'account',
-        //         message: t.wallets_transfer_error_same_address_with_current_account(),
-        //     })
-        // }
-        // const result = await EVM_RPC.getCode(recipient)
-        // if (result !== '0x') {
-        //     setRecipientError({
-        //         type: 'contractAddress',
-        //         message: t.wallets_transfer_error_is_contract_address(),
-        //     })
-        // }
-    }, [allFormFields.recipient, clearErrors, registeredAddress])
+        const recipient = allFormFields.recipient
+        setRecipientError(null)
+        if (!recipient && !registeredAddress) return
+        if (!isValidAddress(recipient) && !isValidAddress(registeredAddress)) return
+        clearErrors()
+        if (isSameAddress(recipient, account) || isSameAddress(registeredAddress, account)) {
+            setRecipientError({
+                type: 'account',
+                message: t.wallets_transfer_error_same_address_with_current_account(),
+            })
+        }
+        if (!connection) return
+        const result = await connection?.getCode(recipient)
+        if (result !== '0x') {
+            setRecipientError({
+                type: 'contractAddress',
+                message: t.wallets_transfer_error_is_contract_address(),
+            })
+        }
+    }, [allFormFields.recipient, clearErrors, registeredAddress, connection])
     // #endregion
 
     const erc721GasLimit = useGasLimit(
diff --git a/packages/dashboard/src/pages/Wallets/components/Transfer/index.tsx b/packages/dashboard/src/pages/Wallets/components/Transfer/index.tsx
index 13a58bd68212..8772e7dcfbfb 100644
--- a/packages/dashboard/src/pages/Wallets/components/Transfer/index.tsx
+++ b/packages/dashboard/src/pages/Wallets/components/Transfer/index.tsx
@@ -21,7 +21,7 @@ export const Transfer = memo(() => {
     const { state } = useLocation() as {
         state: {
             token?: FungibleToken<ChainId, SchemaType>
-            erc721Token?: FungibleToken<ChainId, SchemaType>
+            nonFungibleToken?: FungibleToken<ChainId, SchemaType>
             type?: TransferTab
         } | null
     }
@@ -34,7 +34,7 @@ export const Transfer = memo(() => {
 
     useEffect(() => {
         if (!state) return
-        if (!state.erc721Token || state.type !== TransferTab.Collectibles) return
+        if (!state.nonFungibleToken || state.type !== TransferTab.Collectibles) return
 
         setTab(TransferTab.Collectibles)
     }, [state])