From 7bd32ba3ba065cf999dcfd39bbbbc532e375d5fd Mon Sep 17 00:00:00 2001 From: Vesa Luusua Date: Wed, 29 Nov 2017 16:35:41 +0200 Subject: [PATCH] Review changes --- .../FieldReviewRating/FieldReviewRating.css | 1 + .../OrderDetailsPanel/OrderDetailsPanel.js | 8 +++--- src/components/ReviewModal/ReviewModal.css | 4 +++ src/components/ReviewModal/ReviewModal.js | 3 ++- .../SaleDetailsPanel/SaleDetailsPanel.js | 8 +++--- src/containers/OrderPage/OrderPage.duck.js | 14 +++++------ src/containers/OrderPage/OrderPage.js | 4 +-- src/containers/ReviewForm/ReviewForm.css | 2 +- src/containers/ReviewForm/ReviewForm.js | 25 ++++++++++--------- src/containers/SalePage/SalePage.duck.js | 14 +++++------ src/containers/SalePage/SalePage.js | 4 +-- src/ducks/marketplaceData.duck.js | 11 -------- 12 files changed, 47 insertions(+), 51 deletions(-) diff --git a/src/components/FieldReviewRating/FieldReviewRating.css b/src/components/FieldReviewRating/FieldReviewRating.css index 08e000c8..0161ab21 100644 --- a/src/components/FieldReviewRating/FieldReviewRating.css +++ b/src/components/FieldReviewRating/FieldReviewRating.css @@ -20,6 +20,7 @@ .label { width: 30px; + cursor: pointer; } .star { diff --git a/src/components/OrderDetailsPanel/OrderDetailsPanel.js b/src/components/OrderDetailsPanel/OrderDetailsPanel.js index 5ba09ee4..f60a843c 100644 --- a/src/components/OrderDetailsPanel/OrderDetailsPanel.js +++ b/src/components/OrderDetailsPanel/OrderDetailsPanel.js @@ -101,9 +101,11 @@ export class OrderDetailsPanelComponent extends Component { const currentTransaction = ensureTransaction(transaction); const { reviewRating, reviewContent } = values; const rating = Number.parseInt(reviewRating, 10); - onSendReview(currentTransaction.id, rating, reviewContent).then(r => - this.setState({ isReviewModalOpen: false, reviewSubmitted: true }) - ); + onSendReview(currentTransaction, rating, reviewContent) + .then(r => this.setState({ isReviewModalOpen: false, reviewSubmitted: true })) + .catch(e => { + // Do nothing. + }); } render() { diff --git a/src/components/ReviewModal/ReviewModal.css b/src/components/ReviewModal/ReviewModal.css index 30fa5059..4b6ceafc 100644 --- a/src/components/ReviewModal/ReviewModal.css +++ b/src/components/ReviewModal/ReviewModal.css @@ -23,6 +23,10 @@ @apply --marketplaceModalTitleStyles; } +.reviewee { + white-space: nowrap; +} + /* Paragraph for the Modal */ .modalMessage { @apply --marketplaceModalParagraphStyles; diff --git a/src/components/ReviewModal/ReviewModal.js b/src/components/ReviewModal/ReviewModal.js index 1632bdb8..91196e11 100644 --- a/src/components/ReviewModal/ReviewModal.js +++ b/src/components/ReviewModal/ReviewModal.js @@ -26,6 +26,7 @@ const ReviewModal = props => { const classes = classNames(rootClassName || css.root, className); const closeButtonMessage = intl.formatMessage({ id: 'ReviewModal.later' }); + const reviewee = {revieweeName}; return ( { >

- +

diff --git a/src/components/SaleDetailsPanel/SaleDetailsPanel.js b/src/components/SaleDetailsPanel/SaleDetailsPanel.js index 532e010b..2676d0f5 100644 --- a/src/components/SaleDetailsPanel/SaleDetailsPanel.js +++ b/src/components/SaleDetailsPanel/SaleDetailsPanel.js @@ -110,9 +110,11 @@ export class SaleDetailsPanelComponent extends Component { const currentTransaction = ensureTransaction(transaction); const { reviewRating, reviewContent } = values; const rating = Number.parseInt(reviewRating, 10); - onSendReview(currentTransaction.id, rating, reviewContent).then(r => - this.setState({ isReviewModalOpen: false, reviewSubmitted: true }) - ); + onSendReview(currentTransaction, rating, reviewContent) + .then(r => this.setState({ isReviewModalOpen: false, reviewSubmitted: true })) + .catch(e => { + // Do nothing. + }); } render() { diff --git a/src/containers/OrderPage/OrderPage.duck.js b/src/containers/OrderPage/OrderPage.duck.js index 3d5d23c0..4a9bd003 100644 --- a/src/containers/OrderPage/OrderPage.duck.js +++ b/src/containers/OrderPage/OrderPage.duck.js @@ -2,7 +2,7 @@ import { pick } from 'lodash'; import { types } from '../../util/sdkLoader'; import { isTransactionsTransitionInvalidTransition, storableError } from '../../util/errors'; import * as propTypes from '../../util/propTypes'; -import { addMarketplaceEntities, getTransactionsById } from '../../ducks/marketplaceData.duck'; +import { addMarketplaceEntities } from '../../ducks/marketplaceData.duck'; import { updatedEntities, denormalisedEntities } from '../../util/data'; const MESSAGES_PAGE_SIZE = 100; @@ -284,7 +284,7 @@ const sendReviewAsFirst = (id, params, dispatch, sdk) => { .catch(e => { // If transaction transition is invalid, lets try another endpoint. if (isTransactionsTransitionInvalidTransition(e)) { - sendReviewAsSecond(id, params, dispatch, sdk); + return sendReviewAsSecond(id, params, dispatch, sdk); } else { dispatch(sendReviewError(storableError(e))); @@ -295,18 +295,16 @@ const sendReviewAsFirst = (id, params, dispatch, sdk) => { }); }; -export const sendReview = (orderId, reviewRating, reviewContent) => (dispatch, getState, sdk) => { +export const sendReview = (tx, reviewRating, reviewContent) => (dispatch, getState, sdk) => { const params = { reviewRating, reviewContent }; - const txs = getTransactionsById(getState(), [orderId]); const txStateProviderFirst = - txs.length === 1 && - txs[0].attributes.lastTransition === propTypes.TX_TRANSITION_REVIEW_BY_PROVIDER_FIRST; + tx.attributes.lastTransition === propTypes.TX_TRANSITION_REVIEW_BY_PROVIDER_FIRST; dispatch(sendReviewRequest()); return txStateProviderFirst - ? sendReviewAsSecond(orderId, params, dispatch, sdk) - : sendReviewAsFirst(orderId, params, dispatch, sdk); + ? sendReviewAsSecond(tx.id, params, dispatch, sdk) + : sendReviewAsFirst(tx.id, params, dispatch, sdk); }; // loadData is a collection of async calls that need to be made diff --git a/src/containers/OrderPage/OrderPage.js b/src/containers/OrderPage/OrderPage.js index d284ce14..208efe61 100644 --- a/src/containers/OrderPage/OrderPage.js +++ b/src/containers/OrderPage/OrderPage.js @@ -210,8 +210,8 @@ const mapDispatchToProps = dispatch => ({ dispatch(manageDisableScrolling(componentId, disableScrolling)), onShowMoreMessages: orderId => dispatch(fetchMoreMessages(orderId)), onSendMessage: (orderId, message) => dispatch(sendMessage(orderId, message)), - onSendReview: (orderId, reviewRating, reviewContent) => - dispatch(sendReview(orderId, reviewRating, reviewContent)), + onSendReview: (tx, reviewRating, reviewContent) => + dispatch(sendReview(tx, reviewRating, reviewContent)), onResetForm: formName => dispatch(resetForm(formName)), }); diff --git a/src/containers/ReviewForm/ReviewForm.css b/src/containers/ReviewForm/ReviewForm.css index c37173ca..ec900bb2 100644 --- a/src/containers/ReviewForm/ReviewForm.css +++ b/src/containers/ReviewForm/ReviewForm.css @@ -41,7 +41,7 @@ .submitButton { margin-top: auto; - margin-bottom: 24px; + margin-bottom: 96px; flex-shrink: 0; @media (--viewportMedium) { diff --git a/src/containers/ReviewForm/ReviewForm.js b/src/containers/ReviewForm/ReviewForm.js index f98a8297..4ea14f42 100644 --- a/src/containers/ReviewForm/ReviewForm.js +++ b/src/containers/ReviewForm/ReviewForm.js @@ -14,6 +14,7 @@ import css from './ReviewForm.css'; const ReviewFormComponent = props => { const { className, + rootClassName, disabled, handleSubmit, intl, @@ -38,23 +39,22 @@ const ReviewFormComponent = props => { id: 'ReviewForm.reviewContentRequired', }); - const errorMessage = - sendReviewError && isTransactionsTransitionAlreadyReviewed(sendReviewError) ? ( -

- -

- ) : ( -

- -

- ); + const errorMessage = isTransactionsTransitionAlreadyReviewed(sendReviewError) ? ( +

+ +

+ ) : ( +

+ +

+ ); const errorArea = sendReviewError ? errorMessage :

; const reviewSubmitMessage = intl.formatMessage({ id: 'ReviewForm.reviewSubmit', }); - const classes = classNames(css.root, className); + const classes = classNames(rootClassName || css.root, className); const submitInProgress = submitting || sendReviewInProgress; const submitDisabled = invalid || disabled || submitInProgress; @@ -92,13 +92,14 @@ const ReviewFormComponent = props => { ); }; -ReviewFormComponent.defaultProps = { className: null, sendReviewError: null }; +ReviewFormComponent.defaultProps = { className: null, rootClassName: null, sendReviewError: null }; const { bool, func, string } = PropTypes; ReviewFormComponent.propTypes = { ...formPropTypes, className: string, + rootClassName: string, intl: intlShape.isRequired, onSubmit: func.isRequired, reviewSent: bool.isRequired, diff --git a/src/containers/SalePage/SalePage.duck.js b/src/containers/SalePage/SalePage.duck.js index 83dd56b3..9ec9d37c 100644 --- a/src/containers/SalePage/SalePage.duck.js +++ b/src/containers/SalePage/SalePage.duck.js @@ -4,7 +4,7 @@ import { isTransactionsTransitionInvalidTransition, storableError } from '../../ import * as propTypes from '../../util/propTypes'; import * as log from '../../util/log'; import { updatedEntities, denormalisedEntities } from '../../util/data'; -import { addMarketplaceEntities, getTransactionsById } from '../../ducks/marketplaceData.duck'; +import { addMarketplaceEntities } from '../../ducks/marketplaceData.duck'; import { fetchCurrentUserNotifications } from '../../ducks/user.duck'; const MESSAGES_PAGE_SIZE = 100; @@ -353,7 +353,7 @@ const sendReviewAsFirst = (id, params, dispatch, sdk) => { .catch(e => { // If transaction transition is invalid, lets try another endpoint. if (isTransactionsTransitionInvalidTransition(e)) { - sendReviewAsSecond(id, params, dispatch, sdk); + return sendReviewAsSecond(id, params, dispatch, sdk); } else { dispatch(sendReviewError(storableError(e))); @@ -364,18 +364,16 @@ const sendReviewAsFirst = (id, params, dispatch, sdk) => { }); }; -export const sendReview = (orderId, reviewRating, reviewContent) => (dispatch, getState, sdk) => { +export const sendReview = (tx, reviewRating, reviewContent) => (dispatch, getState, sdk) => { const params = { reviewRating, reviewContent }; - const txs = getTransactionsById(getState(), [orderId]); const txStateProviderFirst = - txs.length === 1 && - txs[0].attributes.lastTransition === propTypes.TX_TRANSITION_REVIEW_BY_CUSTOMER_FIRST; + tx.attributes.lastTransition === propTypes.TX_TRANSITION_REVIEW_BY_CUSTOMER_FIRST; dispatch(sendReviewRequest()); return txStateProviderFirst - ? sendReviewAsSecond(orderId, params, dispatch, sdk) - : sendReviewAsFirst(orderId, params, dispatch, sdk); + ? sendReviewAsSecond(tx.id, params, dispatch, sdk) + : sendReviewAsFirst(tx.id, params, dispatch, sdk); }; // loadData is a collection of async calls that need to be made diff --git a/src/containers/SalePage/SalePage.js b/src/containers/SalePage/SalePage.js index 0975ed5a..1f6ab948 100644 --- a/src/containers/SalePage/SalePage.js +++ b/src/containers/SalePage/SalePage.js @@ -233,8 +233,8 @@ const mapDispatchToProps = dispatch => { onResetForm: formName => dispatch(resetForm(formName)), onManageDisableScrolling: (componentId, disableScrolling) => dispatch(manageDisableScrolling(componentId, disableScrolling)), - onSendReview: (orderId, reviewRating, reviewContent) => - dispatch(sendReview(orderId, reviewRating, reviewContent)), + onSendReview: (tx, reviewRating, reviewContent) => + dispatch(sendReview(tx, reviewRating, reviewContent)), }; }; diff --git a/src/ducks/marketplaceData.duck.js b/src/ducks/marketplaceData.duck.js index 83cf3632..e15919e0 100644 --- a/src/ducks/marketplaceData.duck.js +++ b/src/ducks/marketplaceData.duck.js @@ -68,17 +68,6 @@ export const getMarketplaceEntities = (state, entityRefs) => { } }; -/** - * Get the denormalised transaction entities with the given IDs - * - * @param {Object} state the full Redux store - * @param {Array} transactionIds transaction IDs to select from the store - */ -export const getTransactionsById = (state, transactionIds) => { - const entityRefs = transactionIds.map(id => ({ id, type: 'transaction' })); - return getMarketplaceEntities(state, entityRefs); -}; - // ================ Action creators ================ // export const addMarketplaceEntities = apiResponse => ({