fix(Coinify): can cancel logic

blockchain · May 29, 2018 · fd9018a · fd9018a
1 parent 260e7e6
commit fd9018a
Show file tree

Hide file tree

Showing 5 changed files with 28 additions and 7 deletions.
diff --git a/...blockchain-wallet-v4-frontend/src/components/BuySell/OrderHistoryTable/TradeItem/index.js b/...blockchain-wallet-v4-frontend/src/components/BuySell/OrderHistoryTable/TradeItem/index.js
@@ -10,10 +10,10 @@ import OrderStatus from '../OrderStatus'
 const tradeDateHelper = (trade) => type(trade.createdAt) === 'Number' ? new Date(trade.createdAt).toLocaleString() : trade.createdAt.toLocaleString()
 
 const TradeItem = props => {
-  const { conversion, handleClick, handleFinish, handleTradeCancel, trade, status, cancelTradeId } = props
+  const { conversion, handleClick, handleFinish, handleTradeCancel, trade, status, cancelTradeId, canTrade } = props
   const receiveAmount = trade.isBuy ? trade.receiveAmount : Exchange.displayFiatToFiat({ value: trade.receiveAmount })
   const exchangeAmount = trade.isBuy ? Exchange.displayFiatToFiat({ value: trade.sendAmount / conversion }) : trade.sendAmount / conversion
-  const canCancel = trade.state === 'awaiting_transfer_in'
+  const canCancel = canTrade && trade.state === 'awaiting_transfer_in'
 
   return (
     <TableRow>

diff --git a/packages/blockchain-wallet-v4-frontend/src/components/BuySell/OrderHistoryTable/index.js b/packages/blockchain-wallet-v4-frontend/src/components/BuySell/OrderHistoryTable/index.js
@@ -11,7 +11,7 @@ class OrderHistoryTable extends React.PureComponent {
   }
 
   render () {
-    const { conversion, trades, handleTradeCancel, handleFinishTrade, handleDetailsClick, status, cancelTradeId } = this.props
+    const { conversion, trades, handleTradeCancel, handleFinishTrade, handleDetailsClick, status, cancelTradeId, canTrade } = this.props
 
     const isValid = (t) => t.createdAt
     const validTrades = filter(isValid, trades)
@@ -43,7 +43,17 @@ class OrderHistoryTable extends React.PureComponent {
             </Text>
           </TableCell>
         </TableHeader>
-        {sortedTrades.map((trade, index) => <TradeItem key={index} trade={trade} conversion={conversion} handleFinish={handleFinishTrade} handleClick={handleDetailsClick} handleTradeCancel={handleTradeCancel} status={status} cancelTradeId={cancelTradeId} />)}
+        {sortedTrades.map((trade, index) => <TradeItem
+          key={index}
+          trade={trade}
+          conversion={conversion}
+          handleFinish={handleFinishTrade}
+          handleClick={handleDetailsClick}
+          handleTradeCancel={handleTradeCancel}
+          status={status}
+          cancelTradeId={cancelTradeId}
+          canTrade={canTrade}
+        />)}
       </Table>
     )
   }

diff --git a/...chain-wallet-v4-frontend/src/scenes/BuySell/CoinifyCheckout/Content/OrderHistory/index.js b/...chain-wallet-v4-frontend/src/scenes/BuySell/CoinifyCheckout/Content/OrderHistory/index.js
@@ -18,7 +18,7 @@ class OrderHistoryContainer extends React.Component {
   }
 
   render () {
-    const { data, modalActions, coinifyActions, formActions, step, trade, busy, cancelTradeId } = this.props
+    const { data, modalActions, coinifyActions, formActions, step, trade, busy, cancelTradeId, canTrade } = this.props
     const { showModal } = modalActions
     const { finishTrade, cancelTrade } = coinifyActions
     const { change } = formActions
@@ -34,6 +34,7 @@ class OrderHistoryContainer extends React.Component {
         cancelTrade={cancelTrade}
         status={status}
         cancelTradeId={cancelTradeId}
+        canTrade={canTrade}
         changeTab={tab => change('buySellTabStatus', 'status', tab)}
       />,
       Failure: (msg) => <div>Failure: {msg.error}</div>,

diff --git a/...n-wallet-v4-frontend/src/scenes/BuySell/CoinifyCheckout/Content/OrderHistory/selectors.js b/...n-wallet-v4-frontend/src/scenes/BuySell/CoinifyCheckout/Content/OrderHistory/selectors.js
@@ -11,6 +11,7 @@ export const getTrade = (state) => {
 
 export const getData = (state) => ({
   data: selectors.core.data.coinify.getTrades(state),
+  canTrade: selectors.core.data.coinify.canTrade(state),
   trade: getTrade(state),
   step: path(['coinify', 'checkoutStep'], state),
   busy: path(['coinify', 'coinifyBusy'], state),

diff --git a/...t-v4-frontend/src/scenes/BuySell/CoinifyCheckout/Content/OrderHistory/template.success.js b/...t-v4-frontend/src/scenes/BuySell/CoinifyCheckout/Content/OrderHistory/template.success.js
@@ -26,7 +26,7 @@ const isPending = (t) => t.state === 'processing' || t.state === 'awaiting_trans
 const isCompleted = (t) => contains(t.state, ['completed', 'rejected', 'cancelled', 'expired'])
 
 const OrderHistory = (props) => {
-  const { showModal, finishTrade, cancelTrade, trades, step, trade, status, cancelTradeId, changeTab } = props
+  const { showModal, finishTrade, cancelTrade, trades, step, trade, status, cancelTradeId, changeTab, canTrade } = props
 
   if (step === 'isx') {
     return (
@@ -45,7 +45,16 @@ const OrderHistory = (props) => {
           <Text size='15px' weight={400}>
             <FormattedMessage id='scenes.buysell.coinifycheckout.trades.pending' defaultMessage='Pending Orders' />
           </Text>
-          <OrderHistoryTable trades={filter(isPending, trades)} conversion={100} handleFinishTrade={trade => finishTrade(trade)} handleDetailsClick={trade => showModal('CoinifyTradeDetails', { trade })} handleTradeCancel={cancelTrade} status={status} cancelTradeId={cancelTradeId} />
+          <OrderHistoryTable
+            trades={filter(isPending, trades)}
+            conversion={100}
+            handleFinishTrade={trade => finishTrade(trade)}
+            handleDetailsClick={trade => showModal('CoinifyTradeDetails', { trade })}
+            handleTradeCancel={cancelTrade}
+            status={status}
+            canTrade={canTrade.data}
+            cancelTradeId={cancelTradeId}
+          />
         </OrderHistoryContent>
         <OrderHistoryContent>
           <Text size='15px' weight={400}>