Skip to content

Commit b38b527

Browse files
glo82145glo82145
authored
PWA-3178::Order statuses are decoupled from the back-end (#4229)
* PWA-3178::Order statuses are decoupled from the back-end * PWA-3178::Order statuses are decoupled from the back-end * PWA-3178::Order statuses are decoupled from the back-end * PWA-3178::Order statuses are decoupled from the back-end * PWA-3178::Order statuses are decoupled from the back-end * PWA-3178::Order statuses are decoupled from the back-end * PWA-3178::Order statuses are decoupled from the back-end * PWA-3178::Order statuses are decoupled from the back-end * PWA-3178::Order statuses are decoupled from the back-end * PWA-3178::Order statuses are decoupled from the back-end * PWA-3178::Order statuses are decoupled from the back-end * PWA-3178::Order statuses are decoupled from the back-end * Resolved issue * Resolved issue * Resolved issue
1 parent 812105a commit b38b527

File tree

6 files changed

+39
-92
lines changed

6 files changed

+39
-92
lines changed

‎packages/peregrine/lib/talons/OrderHistoryPage/orderHistoryPage.gql.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,7 @@ const CustomerOrdersFragment = gql`
6060
}
6161
shipping_method
6262
status
63+
state
6364
total {
6465
discounts {
6566
amount {

‎packages/venia-ui/i18n/en_US.json

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -313,11 +313,15 @@
313313
"orderHistoryPage.ordersCount": "You have {count} orders in your history",
314314
"orderHistoryPage.search": "Search by Order Number",
315315
"orderItems.itemsHeading": "Items",
316-
"orderProgressBar.deliveredText": "Delivered",
317-
"orderProgressBar.processingText": "Processing",
316+
"orderProgressBar.deliveredText": "complete",
317+
"orderProgressBar.processingText": "processing",
318+
"orderProgressBar.newText": "new",
319+
"orderProgressBar.pendingPaymentText": "Pending Payment",
320+
"orderProgressBar.paymentReviewText": "Payment Review",
318321
"orderProgressBar.readyToShipText": "Ready to ship",
319322
"orderProgressBar.shippedText": "Shipped",
320-
"orderRow.deliveredText": "Delivered",
323+
"orderRow.deliveredText": "complete",
324+
"orderProgressBar.closedText": "Closed",
321325
"orderRow.orderDateText": "Order Date",
322326
"orderRow.orderNumberText": "Order #",
323327
"orderRow.orderTotalText": "Order Total",

‎packages/venia-ui/lib/components/OrderHistoryPage/__tests__/__snapshots__/orderRow.spec.js.snap

Lines changed: 4 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -119,11 +119,10 @@ exports[`it does not render order details if loading is true 1`] = `
119119
<span
120120
className="orderStatusBadge"
121121
>
122-
Delivered
122+
Complete
123123
</span>
124124
<div
125125
componentName="OrderProgressBar"
126-
status="Delivered"
127126
/>
128127
</div>
129128
<button
@@ -278,11 +277,10 @@ exports[`it renders collapsed order row 1`] = `
278277
<span
279278
className="orderStatusBadge"
280279
>
281-
Delivered
280+
Complete
282281
</span>
283282
<div
284283
componentName="OrderProgressBar"
285-
status="Delivered"
286284
/>
287285
</div>
288286
<button
@@ -565,11 +563,10 @@ exports[`it renders open order row 1`] = `
565563
<span
566564
className="orderStatusBadge"
567565
>
568-
Delivered
566+
Complete
569567
</span>
570568
<div
571569
componentName="OrderProgressBar"
572-
status="Delivered"
573570
/>
574571
</div>
575572
<button
@@ -862,11 +859,10 @@ exports[`it renders with missing order information 1`] = `
862859
<span
863860
className="orderStatusBadge"
864861
>
865-
Shipped
862+
Received
866863
</span>
867864
<div
868865
componentName="OrderProgressBar"
869-
status="Shipped"
870866
/>
871867
</div>
872868
<button

‎packages/venia-ui/lib/components/OrderHistoryPage/__tests__/orderRow.spec.js

Lines changed: 0 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -226,48 +226,6 @@ test('it renders open order row', () => {
226226
expect(tree.toJSON()).toMatchSnapshot();
227227
});
228228

229-
test('it renders shipped status', () => {
230-
useOrderRow.mockReturnValue({
231-
loading: false,
232-
imagesData,
233-
isOpen: false,
234-
handleContentToggle: jest.fn()
235-
});
236-
237-
const orderWithInvoice = {
238-
...mockOrder,
239-
invoices: [1]
240-
};
241-
const tree = createTestInstance(<OrderRow order={orderWithInvoice} />);
242-
const { root } = tree;
243-
const orderProgressProps = root.findByProps({
244-
componentName: 'OrderProgressBar'
245-
}).props;
246-
247-
expect(orderProgressProps.status).toBe('Delivered');
248-
});
249-
250-
test('it renders delivered status', () => {
251-
useOrderRow.mockReturnValue({
252-
loading: false,
253-
imagesData,
254-
isOpen: false,
255-
handleContentToggle: jest.fn()
256-
});
257-
258-
const completedOrder = {
259-
...mockOrder,
260-
status: 'Complete'
261-
};
262-
const tree = createTestInstance(<OrderRow order={completedOrder} />);
263-
const { root } = tree;
264-
const orderProgressProps = root.findByProps({
265-
componentName: 'OrderProgressBar'
266-
}).props;
267-
268-
expect(orderProgressProps.status).toBe('Delivered');
269-
});
270-
271229
test('it renders with missing order information', () => {
272230
useOrderRow.mockReturnValue({
273231
loading: false,

‎packages/venia-ui/lib/components/OrderHistoryPage/orderProgressBar.js

Lines changed: 22 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -13,35 +13,49 @@ const OrderProgressBar = props => {
1313
const statusStepMap = new Map([
1414
[
1515
formatMessage({
16-
id: 'orderProgressBar.processingText',
17-
defaultMessage: 'Processing'
16+
id: 'orderProgressBar.newText',
17+
defaultMessage: 'new'
1818
}),
1919
1
2020
],
2121
[
2222
formatMessage({
23-
id: 'orderProgressBar.readyToShipText',
24-
defaultMessage: 'Ready to ship'
23+
id: 'orderProgressBar.processingText',
24+
defaultMessage: 'Progressing'
2525
}),
2626
2
2727
],
2828
[
2929
formatMessage({
30-
id: 'orderProgressBar.shippedText',
31-
defaultMessage: 'Shipped'
30+
id: 'orderProgressBar.pendingPaymentText',
31+
defaultMessage: 'pending_payment'
32+
}),
33+
3
34+
],
35+
[
36+
formatMessage({
37+
id: 'orderProgressBar.paymentReviewText',
38+
defaultMessage: 'payment_review'
3239
}),
3340
3
3441
],
3542
[
3643
formatMessage({
3744
id: 'orderProgressBar.deliveredText',
38-
defaultMessage: 'Delivered'
45+
defaultMessage: 'complete'
3946
}),
4047
4
48+
],
49+
[
50+
formatMessage({
51+
id: 'orderProgressBar.closedText',
52+
defaultMessage: 'Closed'
53+
}),
54+
0
4155
]
4256
]);
43-
const currentStep = statusStepMap.get(status);
4457

58+
const currentStep = statusStepMap.get(status);
4559
const classes = useStyle(defaultClasses, props.classes);
4660

4761
const stepElements = useMemo(() => {

‎packages/venia-ui/lib/components/OrderHistoryPage/orderRow.js

Lines changed: 5 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from 'react';
22
import { arrayOf, number, shape, string } from 'prop-types';
33
import { ChevronDown, ChevronUp } from 'react-feather';
4-
import { FormattedMessage, useIntl } from 'react-intl';
4+
import { FormattedMessage } from 'react-intl';
55
import Price from '@magento/venia-ui/lib/components/Price';
66
import { useOrderRow } from '@magento/peregrine/lib/talons/OrderHistoryPage/useOrderRow';
77

@@ -14,14 +14,12 @@ import defaultClasses from './orderRow.module.css';
1414

1515
const OrderRow = props => {
1616
const { order } = props;
17-
const { formatMessage } = useIntl();
1817
const {
19-
invoices,
2018
items,
2119
number: orderNumber,
2220
order_date: orderDate,
23-
shipments,
2421
status,
22+
state,
2523
total
2624
} = order;
2725
const { grand_total: grandTotal } = total;
@@ -38,30 +36,8 @@ const OrderRow = props => {
3836
}
3937
);
4038

41-
const hasInvoice = !!invoices.length;
42-
const hasShipment = !!shipments.length;
43-
let derivedStatus;
44-
if (status === 'Complete') {
45-
derivedStatus = formatMessage({
46-
id: 'orderRow.deliveredText',
47-
defaultMessage: 'Delivered'
48-
});
49-
} else if (hasShipment) {
50-
derivedStatus = formatMessage({
51-
id: 'orderRow.shippedText',
52-
defaultMessage: 'Shipped'
53-
});
54-
} else if (hasInvoice) {
55-
derivedStatus = formatMessage({
56-
id: 'orderRow.readyToShipText',
57-
defaultMessage: 'Ready to ship'
58-
});
59-
} else {
60-
derivedStatus = formatMessage({
61-
id: 'orderRow.processingText',
62-
defaultMessage: 'Processing'
63-
});
64-
}
39+
const derivedStatus = status;
40+
const derivedProgress = state;
6541

6642
const talonProps = useOrderRow({ items });
6743
const { loading, isOpen, handleContentToggle, imagesData } = talonProps;
@@ -88,7 +64,6 @@ const OrderRow = props => {
8864
) : (
8965
'-'
9066
);
91-
9267
return (
9368
<li className={classes.root}>
9469
<div className={classes.orderNumberContainer}>
@@ -125,7 +100,7 @@ const OrderRow = props => {
125100
<span className={classes.orderStatusBadge}>
126101
{derivedStatus}
127102
</span>
128-
<OrderProgressBar status={derivedStatus} />
103+
<OrderProgressBar status={derivedProgress} />
129104
</div>
130105
<button
131106
className={classes.contentToggleContainer}
@@ -141,7 +116,6 @@ const OrderRow = props => {
141116
};
142117

143118
export default OrderRow;
144-
145119
OrderRow.propTypes = {
146120
classes: shape({
147121
root: string,

0 commit comments

Comments
 (0)