feat(sell): add api call to fiat transactions with comments

packages/blockchain-wallet-v4-frontend/src/modals/SimpleBuy/OrderSummary/template.loading.tsx

@@ -1,31 +1,31 @@
-import { FormattedMessage } from 'react-intl'
-import { SpinningLoader, Text } from 'blockchain-info-components'
-import React from 'react'
-import styled from 'styled-components'
+// import { FormattedMessage } from 'react-intl'
+// import { SpinningLoader, Text } from 'blockchain-info-components'
+// import React from 'react'
+// import styled from 'styled-components'
 
-interface Props {}
+// interface Props {}
 
-const Wrapper = styled.div`
-  width: 100%;
-  height: 100%;
-  align-items: center;
-  justify-content: center;
-  display: flex;
-  flex-direction: column;
-`
+// const Wrapper = styled.div`
+//   width: 100%;
+//   height: 100%;
+//   align-items: center;
+//   justify-content: center;
+//   display: flex;
+//   flex-direction: column;
+// `
 
-const Loading: React.FC<Props> = () => {
-  return (
-    <Wrapper>
-      <SpinningLoader />
-      <Text weight={600} color='grey600' style={{ marginTop: '24px' }}>
-        <FormattedMessage
-          id='modals.simplebuy.gatheringinfo'
-          defaultMessage='Gathering Some Info...'
-        />
-      </Text>
-    </Wrapper>
-  )
-}
+// const Loading: React.FC<Props> = () => {
+//   return (
+//     <Wrapper>
+//       <SpinningLoader />
+//       <Text weight={600} color='grey600' style={{ marginTop: '24px' }}>
+//         <FormattedMessage
+//           id='modals.simplebuy.gatheringinfo'
+//           defaultMessage='Gathering Some Info...'
+//         />
+//       </Text>
+//     </Wrapper>
+//   )
+// }
 
-export default Loading
+// export default Loading

packages/blockchain-wallet-v4-frontend/src/modals/SimpleBuy/SellOrderSummary/index.tsx

@@ -1,13 +1,11 @@
-import { actions, selectors } from 'data'
+import { actions } from 'data'
 import { bindActionCreators, Dispatch } from 'redux'
 import { connect, ConnectedProps } from 'react-redux'
-import {
-  FiatTypeEnum,
-  SupportedCoinType,
-  SupportedWalletCurrenciesType,
-  SwapOrderType
-} from 'core/types'
+import { ExtractSuccess, RemoteDataType } from 'core/types'
+import { getData } from './selectors'
 import { RootState } from 'data/rootReducer'
+import DataError from 'components/DataError'
+import Loading from '../AddCard/template.loading'
 import React, { PureComponent } from 'react'
 import Success from './template.success'
 
@@ -27,24 +25,17 @@ class SellOrderSummary extends PureComponent<Props> {
   }
 
   render () {
-    return <Success {...this.props} />
+    return this.props.data.cata({
+      Success: val => <Success {...this.props} {...val} />,
+      Failure: () => <DataError onClick={this.handleRefresh} />,
+      Loading: () => <Loading />,
+      NotAsked: () => <Loading />
+    })
   }
 }
 
 const mapStateToProps = (state: RootState): LinkStatePropsType => ({
-  sellOrder: selectors.components.simpleBuy.getSellOrder(state),
-  supportedCoins: selectors.core.walletOptions
-    .getSupportedCoins(state)
-    .getOrElse({
-      ALGO: { colorCode: 'algo' } as SupportedCoinType,
-      BTC: { colorCode: 'btc' } as SupportedCoinType,
-      BCH: { colorCode: 'bch' } as SupportedCoinType,
-      ETH: { colorCode: 'eth' } as SupportedCoinType,
-      PAX: { colorCode: 'pax' } as SupportedCoinType,
-      USDT: { colorCode: 'usdt' } as SupportedCoinType,
-      WDGLD: { colorCode: 'wdgld' } as SupportedCoinType,
-      XLM: { colorCode: 'xlm' } as SupportedCoinType
-    } as Omit<SupportedWalletCurrenciesType, keyof FiatTypeEnum>)
+  data: getData(state)
 })
 
 const mapDispatchToProps = (dispatch: Dispatch) => ({
@@ -56,10 +47,10 @@ const connector = connect(mapStateToProps, mapDispatchToProps)
 export type OwnProps = {
   handleClose: () => void
 }
+export type SuccessStateType = ExtractSuccess<ReturnType<typeof getData>>
 
 type LinkStatePropsType = {
-  sellOrder: SwapOrderType | undefined,
-  supportedCoins: SupportedWalletCurrenciesType
+  data: RemoteDataType<string, SuccessStateType>
 }
 export type Props = OwnProps & ConnectedProps<typeof connector>
 

packages/blockchain-wallet-v4-frontend/src/modals/SimpleBuy/SellOrderSummary/selectors.ts

@@ -0,0 +1,14 @@
+import { ExtractSuccess } from 'core/types'
+import { lift } from 'ramda'
+import { RootState } from 'data/rootReducer'
+import { selectors } from 'data'
+
+export const getData = (state: RootState) => {
+  const sellOrder = selectors.components.simpleBuy.getSellOrder(state)
+  const supportedCoinsR = selectors.core.walletOptions.getSupportedCoins(state)
+
+  return lift((supportedCoins: ExtractSuccess<typeof supportedCoinsR>) => ({
+    sellOrder,
+    supportedCoins
+  }))(supportedCoinsR)
+}

packages/blockchain-wallet-v4-frontend/src/modals/SimpleBuy/SellOrderSummary/template.success.tsx

@@ -14,7 +14,7 @@ import {
 import styled from 'styled-components'
 
 import { BuyOrSell } from '../model'
-import { Props as OwnProps } from '.'
+import { Props as OwnProps, SuccessStateType } from '.'
 import { Status } from './model'
 
 const Wrapper = styled.div`
@@ -171,6 +171,6 @@ const Success: React.FC<Props> = props => {
   ) : null
 }
 
-type Props = OwnProps
+type Props = OwnProps & SuccessStateType
 
 export default Success

packages/blockchain-wallet-v4/src/redux/data/custodial/sagas.ts

@@ -7,7 +7,6 @@ import { APIType } from 'core/network/api'
 import {
   CoinType,
   CoinTypeEnum,
-  FiatType,
   ProcessedSwapOrderType,
   SBPendingTransactionStateEnum,
   WalletCurrencyType
@@ -124,29 +123,8 @@ export default ({ api }: { api: APIType }) => {
         ...swap,
         insertedAt: swap.createdAt
       }))
-
-      // 4. sell p3 trades. Will eventually be used to fetch buy trades as well
-      const sellOrders: ReturnType<typeof api.getUnifiedSellTrades> = yield call(
-        api.getUnifiedSellTrades,
-        currency as FiatType,
-        20,
-        before,
-        after
-      )
-      const processedSells: Array<ProcessedSwapOrderType> = sellOrders.map(
-        sellOrder => ({
-          ...sellOrder,
-          insertedAt: sellOrder.createdAt
-        })
-      )
-
       const response: FetchCustodialOrdersAndTransactionsReturnType = {
-        orders: [
-          ...filteredOrders,
-          ...transactions.items,
-          ...processedSwaps,
-          ...processedSells
-        ]
+        orders: [...filteredOrders, ...transactions.items, ...processedSwaps]
       }
 
       return response

packages/blockchain-wallet-v4/src/redux/data/fiat/sagas.ts

@@ -33,6 +33,10 @@ export default ({ api }: { api: APIType }) => {
         action.payload.currency,
         reset ? undefined : next
       )
+      // Here's the api call to get sell orders. Now we have to flatten the two responses to one array, and then sort by time created.
+      // sell orders use 'createdAt' while SB transactions use 'insertedAt'
+      // const sellOrders: ReturnType<typeof api.getUnifiedSellTrades> = yield call(api.getUnifiedSellTrades, action.payload.currency)
+
       yield put(
         A.fetchTransactionsSuccess(action.payload.currency, response, reset)
       )