From 550bd302eea9ee20225bd0b84f7ed6c6c4a7d907 Mon Sep 17 00:00:00 2001 From: Kimmo Puputti Date: Fri, 15 Sep 2017 15:10:12 +0300 Subject: [PATCH] Handle banned customer in Sale page --- .../SaleDetailsPanel/SaleDetailsPanel.js | 38 ++++++++++++------- .../SaleDetailsPanel/SaleDetailsPanel.test.js | 9 +++-- .../__snapshots__/SalePage.test.js.snap | 4 +- src/translations/en.json | 2 + 4 files changed, 34 insertions(+), 19 deletions(-) diff --git a/src/components/SaleDetailsPanel/SaleDetailsPanel.js b/src/components/SaleDetailsPanel/SaleDetailsPanel.js index b9744a73..cc710a23 100644 --- a/src/components/SaleDetailsPanel/SaleDetailsPanel.js +++ b/src/components/SaleDetailsPanel/SaleDetailsPanel.js @@ -1,9 +1,9 @@ import React, { PropTypes } from 'react'; -import { FormattedDate, FormattedMessage } from 'react-intl'; +import { injectIntl, intlShape, FormattedDate, FormattedMessage } from 'react-intl'; import classNames from 'classnames'; import * as propTypes from '../../util/propTypes'; import { createSlug } from '../../util/urlHelpers'; -import { ensureListing, ensureTransaction, ensureUser } from '../../util/data'; +import { ensureListing, ensureTransaction, ensureUser, userDisplayName } from '../../util/data'; import { AvatarLarge, AvatarMedium, @@ -99,7 +99,7 @@ const saleMessage = (saleState, customerName, lastTransitionedAt, lastTransition } }; -const SaleDetailsPanel = props => { +export const SaleDetailsPanelComponent = props => { const { rootClassName, className, @@ -107,12 +107,19 @@ const SaleDetailsPanel = props => { onAcceptSale, onRejectSale, acceptOrRejectInProgress, + intl, } = props; const currentTransaction = ensureTransaction(transaction); const currentListing = ensureListing(currentTransaction.listing); const currentCustomer = ensureUser(currentTransaction.customer); + const customerLoaded = !!currentCustomer.id; + const isCustomerBanned = customerLoaded && currentCustomer.attributes.banned; - const customerDisplayName = currentCustomer.attributes.profile.displayName; + const bannedUserDisplayName = intl.formatMessage({ + id: 'SaleDetailsPanel.bannedUserDisplayName', + }); + + const customerDisplayName = userDisplayName(currentCustomer, bannedUserDisplayName); const transactionState = currentTransaction.attributes.state; const lastTransitionedAt = currentTransaction.attributes.lastTransitionedAt; const lastTransition = currentTransaction.attributes.lastTransition; @@ -132,12 +139,11 @@ const SaleDetailsPanel = props => { const bookingInfo = breakdown(currentTransaction); const title = saleTitle(transactionState, listingLink, customerDisplayName, lastTransition); - const message = saleMessage( - transactionState, - customerDisplayName, - lastTransitionedAt, - lastTransition - ); + const message = isCustomerBanned + ? intl.formatMessage({ + id: 'SaleDetailsPanel.customerBannedStatus', + }) + : saleMessage(transactionState, customerDisplayName, lastTransitionedAt, lastTransition); const listingTitle = currentListing.attributes.title; const firstImage = currentListing.images && currentListing.images.length > 0 @@ -146,7 +152,8 @@ const SaleDetailsPanel = props => { const isPreauthorizedState = currentTransaction.attributes.state === propTypes.TX_STATE_PREAUTHORIZED; - const actionButtons = isPreauthorizedState + const canShowButtons = isPreauthorizedState && !isCustomerBanned; + const actionButtons = canShowButtons ?
{ ); }; -SaleDetailsPanel.defaultProps = { +SaleDetailsPanelComponent.defaultProps = { rootClassName: null, className: null, lastTransition: null, @@ -232,13 +239,18 @@ SaleDetailsPanel.defaultProps = { const { string, func, bool } = PropTypes; -SaleDetailsPanel.propTypes = { +SaleDetailsPanelComponent.propTypes = { rootClassName: string, className: string, transaction: propTypes.transaction.isRequired, onAcceptSale: func.isRequired, onRejectSale: func.isRequired, acceptOrRejectInProgress: bool.isRequired, + + // from injectIntl + intl: intlShape.isRequired, }; +const SaleDetailsPanel = injectIntl(SaleDetailsPanelComponent); + export default SaleDetailsPanel; diff --git a/src/components/SaleDetailsPanel/SaleDetailsPanel.test.js b/src/components/SaleDetailsPanel/SaleDetailsPanel.test.js index 004273a4..1a8028be 100644 --- a/src/components/SaleDetailsPanel/SaleDetailsPanel.test.js +++ b/src/components/SaleDetailsPanel/SaleDetailsPanel.test.js @@ -3,8 +3,9 @@ import { shallow } from 'enzyme'; import { types } from '../../util/sdkLoader'; import { createTransaction, createBooking, createListing, createUser } from '../../util/test-data'; import { renderShallow } from '../../util/test-helpers'; +import { fakeIntl } from '../../util/test-data'; import { BookingBreakdown } from '../../components'; -import SaleDetailsPanel from './SaleDetailsPanel.js'; +import { SaleDetailsPanelComponent } from './SaleDetailsPanel.js'; const noop = () => null; @@ -29,8 +30,9 @@ describe('SaleDetailsPanel', () => { onAcceptSale: noop, onRejectSale: noop, acceptOrRejectInProgress: false, + intl: fakeIntl, }; - const tree = renderShallow(); + const tree = renderShallow(); expect(tree).toMatchSnapshot(); }); it('renders correct total price', () => { @@ -53,8 +55,9 @@ describe('SaleDetailsPanel', () => { onAcceptSale: noop, onRejectSale: noop, acceptOrRejectInProgress: false, + intl: fakeIntl, }; - const panel = shallow(); + const panel = shallow(); const breakdownProps = panel.find(BookingBreakdown).props(); // Total price for the provider should be transaction total minus the commission. diff --git a/src/containers/SalePage/__snapshots__/SalePage.test.js.snap b/src/containers/SalePage/__snapshots__/SalePage.test.js.snap index f55d7f84..a9ae5965 100644 --- a/src/containers/SalePage/__snapshots__/SalePage.test.js.snap +++ b/src/containers/SalePage/__snapshots__/SalePage.test.js.snap @@ -44,13 +44,11 @@ exports[`SalePage matches snapshot 1`] = ` sendVerificationEmailError={null} sendVerificationEmailInProgress={false} />
-