feat(nfts): remove orderflow asset because its duplicated data

blockchain · May 7, 2022 · 0159e3a · 0159e3a
1 parent 80ad391
commit 0159e3a
Show file tree

Hide file tree

Showing 17 changed files with 613 additions and 659 deletions.
diff --git a/packages/blockchain-wallet-v4-frontend/src/data/components/nfts/sagas.ts b/packages/blockchain-wallet-v4-frontend/src/data/components/nfts/sagas.ts
@@ -671,40 +671,8 @@ export default ({ api }: { api: APIType }) => {
     }
   }
 
-  // DEPRECATED 👇👇👇👇👇👇👇👇👇👇👇👇👇
-  // When you open the order flow you can open directly to the following operations:
-  // 1: Buy
-  // 2: Sell
-  // 3: Cancel Offer (Made by user)
-  // Other operations are opened from within the flow itself, so you WILL NOT find
-  // find those in this function. Those include:
-  // 1: Transfer
-  // 2: Accept Offer
-  // 3: Cancel Listing
-  // DEPRECATED 👆👆👆👆👆👆👆👆👆👆👆👆👆
-
-  // explorer-gateway v2
-  // With the introduction of the explorer-gateway graphql API the flow will need to change a bit
-  // we should require:
-  // 1. operation (a.k.a step) (buy, sell, make offer, transfer)
-  // 2. token_id
-  // 3. contract_address
-  const nftOrderFlowOpen = function* (action: ReturnType<typeof A.nftOrderFlowOpen>) {
-    const { asset_contract_address, token_id } = action.payload
+  const nftOrderFlowOpen = function* () {
     yield put(actions.modals.showModal(ModalName.NFT_ORDER, { origin: 'Unknown' }))
-
-    try {
-      yield put(actions.components.nfts.fetchNftOrderAssetLoading())
-      const asset: ReturnType<typeof api.getOpenSeaAsset> = yield call(
-        api.getOpenSeaAsset,
-        asset_contract_address,
-        token_id
-      )
-      yield put(actions.components.nfts.fetchNftOrderAssetSuccess(asset))
-    } catch (e) {
-      const error = errorHandler(e)
-      yield put(actions.components.nfts.fetchNftOrderAssetFailure(error))
-    }
   }
 
   const nftOrderFlowClose = function* () {

diff --git a/packages/blockchain-wallet-v4-frontend/src/data/components/nfts/slice.ts b/packages/blockchain-wallet-v4-frontend/src/data/components/nfts/slice.ts
@@ -33,7 +33,6 @@ const initialState: NftsStateType = {
   openSeaAsset: Remote.NotAsked,
   openSeaStatus: Remote.NotAsked,
   orderFlow: {
-    asset: Remote.NotAsked,
     fees: Remote.NotAsked,
     isSubmitting: false,
     listingToCancel: null,
@@ -188,15 +187,6 @@ const nftsSlice = createSlice({
       state.orderFlow.matchingOrder = Remote.Success(action.payload)
     },
     fetchNftOrderAsset: () => {},
-    fetchNftOrderAssetFailure: (state, action: PayloadAction<string>) => {
-      state.orderFlow.asset = Remote.Failure(action.payload)
-    },
-    fetchNftOrderAssetLoading: (state) => {
-      state.orderFlow.asset = Remote.Loading
-    },
-    fetchNftOrderAssetSuccess: (state, action: PayloadAction<NftAsset>) => {
-      state.orderFlow.asset = Remote.Success(action.payload)
-    },
     fetchOpenSeaAsset: (
       state,
       action: PayloadAction<{
@@ -225,17 +215,7 @@ const nftsSlice = createSlice({
     },
     handleRouterChange: (state, action: PayloadAction<{ location: { pathname: string } }>) => {},
     nftOrderFlowClose: (state) => {
-      state.orderFlow.walletUserIsAssetOwnerHack = false
-
-      state.orderFlow.isSubmitting = false
-
-      state.orderFlow.offerToCancel = null
-      state.orderFlow.listingToCancel = null
-      state.orderFlow.orderToMatch = null
-      state.orderFlow.matchingOrder = Remote.NotAsked
-      state.orderFlow.asset = Remote.NotAsked
-      state.orderFlow.fees = Remote.NotAsked
-      state.orderFlow.wrapEthFees = Remote.NotAsked
+      state.orderFlow = initialState.orderFlow
     },
     nftOrderFlowOpen: (
       state,
@@ -274,7 +254,6 @@ const nftsSlice = createSlice({
           }
       >
     ) => {
-      state.orderFlow.asset = Remote.Loading
       state.orderFlow.step = action.payload.step
       state.orderFlow.walletUserIsAssetOwnerHack = action.payload.walletUserIsAssetOwnerHack
 

diff --git a/packages/blockchain-wallet-v4-frontend/src/data/components/nfts/types.ts b/packages/blockchain-wallet-v4-frontend/src/data/components/nfts/types.ts
@@ -60,7 +60,6 @@ export type NftsStateType = {
     }
   >
   orderFlow: {
-    asset: RemoteDataType<string, NftAsset>
     fees: RemoteDataType<string, Await<ReturnType<typeof calculateGasFees>>>
     isSubmitting: boolean
     listingToCancel: RawOrder | null

diff --git a/packages/blockchain-wallet-v4-frontend/src/modals/Nfts/NftOrder/AcceptOffer/selectors.ts b/packages/blockchain-wallet-v4-frontend/src/modals/Nfts/NftOrder/AcceptOffer/selectors.ts
@@ -5,16 +5,16 @@ import { createDeepEqualSelector } from '@core/utils'
 import { selectors } from 'data'
 
 export const getData = createDeepEqualSelector(
-  [selectors.components.nfts.getOrderFlow],
-  (orderflow: ReturnType<typeof selectors.components.nfts.getOrderFlow>) => {
+  [selectors.components.nfts.getOpenSeaAsset, selectors.components.nfts.getOrderFlow],
+  (assetR, orderflow) => {
     const transform = (
-      asset: ExtractSuccess<typeof orderflow['asset']>,
+      asset: ExtractSuccess<typeof assetR>,
       fees: ExtractSuccess<typeof orderflow['fees']>,
       matchingOrder: ExtractSuccess<typeof orderflow['matchingOrder']>
     ) => ({
       asset,
       matchingOrder
     })
-    return lift(transform)(orderflow.asset, orderflow.fees, orderflow.matchingOrder)
+    return lift(transform)(assetR, orderflow.fees, orderflow.matchingOrder)
   }
 )
diff --git a/packages/blockchain-wallet-v4-frontend/src/modals/Nfts/NftOrder/Buy/cta.tsx b/packages/blockchain-wallet-v4-frontend/src/modals/Nfts/NftOrder/Buy/cta.tsx
@@ -27,8 +27,16 @@ import { Props as OwnProps } from '..'
 import { getData } from './selectors'
 
 const CTA: React.FC<Props> = (props) => {
-  const { amount, amtToBuy, ethBalancesR, isAuthenticated, maxBuyPossible, nftActions, orderFlow } =
-    props
+  const {
+    amount,
+    amtToBuy,
+    ethBalancesR,
+    isAuthenticated,
+    maxBuyPossible,
+    nftActions,
+    openSeaAssetR,
+    orderFlow
+  } = props
   const { orderToMatch } = orderFlow
   const [selfCustodyBalance, custodialBalance] = ethBalancesR.getOrElse([
     new BigNumber(0),
@@ -49,7 +57,7 @@ const CTA: React.FC<Props> = (props) => {
   if (!isAuthenticated) {
     return (
       <>
-        {orderFlow.asset.cata({
+        {openSeaAssetR.cata({
           Failure: () => null,
           Loading: () => null,
           NotAsked: () => null,

diff --git a/packages/blockchain-wallet-v4-frontend/src/modals/Nfts/NftOrder/Buy/index.tsx b/packages/blockchain-wallet-v4-frontend/src/modals/Nfts/NftOrder/Buy/index.tsx
@@ -30,7 +30,16 @@ import BuyCta from './cta'
 import BuyFees from './fees'
 
 const Buy: React.FC<Props> = (props) => {
-  const { close, ethBalancesR, formValues, nftActions, orderFlow, rates, walletCurrency } = props
+  const {
+    close,
+    ethBalancesR,
+    formValues,
+    nftActions,
+    openSeaAssetR,
+    orderFlow,
+    rates,
+    walletCurrency
+  } = props
   const { amount, coin, fix } = formValues
   const { orderToMatch } = orderFlow
 
@@ -49,7 +58,7 @@ const Buy: React.FC<Props> = (props) => {
     new BigNumber(0)
   ])
 
-  const openSeaAsset = useRemote(selectors.components.nfts.getOpenSeaAsset)
+  const openSeaAsset = useRemote(() => openSeaAssetR)
   const sellOrders =
     openSeaAsset.data?.orders?.filter((x) => {
       return x.side === 1
@@ -71,7 +80,7 @@ const Buy: React.FC<Props> = (props) => {
 
   return (
     <>
-      {orderFlow.asset.cata({
+      {openSeaAssetR.cata({
         Failure: (e) => <Text>{e}</Text>,
         Loading: () => <NftFlyoutLoader />,
         NotAsked: () => null,
@@ -105,7 +114,7 @@ const Buy: React.FC<Props> = (props) => {
                       />
                       <div>
                         <Text size='16px' color='grey900' weight={600}>
-                          {val?.name}
+                          {val.name}
                         </Text>
                         {val.collection.safelist_request_status === 'verified' ? (
                           <Text

diff --git a/packages/blockchain-wallet-v4-frontend/src/modals/Nfts/NftOrder/Buy/selectors.ts b/packages/blockchain-wallet-v4-frontend/src/modals/Nfts/NftOrder/Buy/selectors.ts
@@ -5,17 +5,17 @@ import { createDeepEqualSelector } from '@core/utils'
 import { selectors } from 'data'
 
 export const getData = createDeepEqualSelector(
-  [selectors.components.nfts.getOrderFlow],
-  (orderflow: ReturnType<typeof selectors.components.nfts.getOrderFlow>) => {
+  [selectors.components.nfts.getOpenSeaAsset, selectors.components.nfts.getOrderFlow],
+  (assetR, orderflow) => {
     const transform = (
-      asset: ExtractSuccess<typeof orderflow['asset']>,
+      asset: ExtractSuccess<typeof assetR>,
       fees: ExtractSuccess<typeof orderflow['fees']>,
       matchingOrder: ExtractSuccess<typeof orderflow['matchingOrder']>
     ) => ({
       asset,
       fees,
       matchingOrder
     })
-    return lift(transform)(orderflow.asset, orderflow.fees, orderflow.matchingOrder)
+    return lift(transform)(assetR, orderflow.fees, orderflow.matchingOrder)
   }
 )