From cbdda30a3aa87e826f3504650c46638022e5033d Mon Sep 17 00:00:00 2001
From: Grzegorz Derdak <grzegorz.derdak@gmail.com>
Date: Wed, 28 Oct 2020 12:42:28 +0100
Subject: [PATCH] Update logic based on new API fields

---
 .../OrderFulfillPage/OrderFulfillPage.tsx     | 20 ++++++++--
 .../components/OrderFulfillPage/fixtures.ts   |  3 ++
 src/orders/queries.ts                         |  6 +++
 src/orders/types/OrderFulfillData.ts          | 13 +++++++
 .../__snapshots__/Stories.test.ts.snap        | 38 +++++++++----------
 5 files changed, 57 insertions(+), 23 deletions(-)

diff --git a/src/orders/components/OrderFulfillPage/OrderFulfillPage.tsx b/src/orders/components/OrderFulfillPage/OrderFulfillPage.tsx
index ffa1fdbb2..eb882f046 100644
--- a/src/orders/components/OrderFulfillPage/OrderFulfillPage.tsx
+++ b/src/orders/components/OrderFulfillPage/OrderFulfillPage.tsx
@@ -257,7 +257,7 @@ const OrderFulfillPage: React.FC<OrderFulfillPageProps> = props => {
                 <TableBody>
                   {renderCollection(
                     order?.lines.filter(line => getRemainingQuantity(line) > 0),
-                    (line, lineIndex) => {
+                    (line: OrderFulfillData_order_lines, lineIndex) => {
                       if (!line) {
                         return (
                           <TableRow key={lineIndex}>
@@ -340,6 +340,17 @@ const OrderFulfillPage: React.FC<OrderFulfillPageProps> = props => {
                               );
                             }
 
+                            const warehouseAllocation = line.allocations.find(
+                              allocation =>
+                                allocation.warehouse.id === warehouse.id
+                            );
+                            const allocatedQuantityForLine =
+                              warehouseAllocation?.quantity || 0;
+                            const availableQuantity =
+                              warehouseStock.quantity -
+                              warehouseStock.quantityAllocated +
+                              allocatedQuantityForLine;
+
                             return (
                               <TableCell
                                 className={classes.colQuantity}
@@ -357,7 +368,7 @@ const OrderFulfillPage: React.FC<OrderFulfillPageProps> = props => {
                                     ),
                                     max: (
                                       line.variant.trackInventory &&
-                                      warehouseStock.quantity
+                                      availableQuantity
                                     ).toString(),
                                     min: 0,
                                     style: { textAlign: "right" }
@@ -384,7 +395,7 @@ const OrderFulfillPage: React.FC<OrderFulfillPageProps> = props => {
                                     overfulfill ||
                                     (line.variant.trackInventory &&
                                       formsetStock.quantity >
-                                        warehouseStock.quantityAllocated) ||
+                                        availableQuantity) ||
                                     !!errors?.find(
                                       err =>
                                         err.warehouse === warehouse.id &&
@@ -399,7 +410,7 @@ const OrderFulfillPage: React.FC<OrderFulfillPageProps> = props => {
                                       <div
                                         className={classes.remainingQuantity}
                                       >
-                                        / {warehouseStock.quantityAllocated}
+                                        / {availableQuantity}
                                       </div>
                                     )
                                   }}
@@ -407,6 +418,7 @@ const OrderFulfillPage: React.FC<OrderFulfillPageProps> = props => {
                               </TableCell>
                             );
                           })}
+
                           <TableCell
                             className={classes.colQuantityTotal}
                             key="total"
diff --git a/src/orders/components/OrderFulfillPage/fixtures.ts b/src/orders/components/OrderFulfillPage/fixtures.ts
index cdeae6a24..5ecae5147 100644
--- a/src/orders/components/OrderFulfillPage/fixtures.ts
+++ b/src/orders/components/OrderFulfillPage/fixtures.ts
@@ -15,6 +15,7 @@ export const orderToFulfill: OrderFulfillData_order = {
       productName: "T-Shirt",
       quantity: 3,
       quantityFulfilled: 1,
+      allocations: [],
       variant: {
         __typename: "ProductVariant",
         id: "UHJvZHVjdFZhcmlhbnQ6Mjk2",
@@ -76,6 +77,7 @@ export const orderToFulfill: OrderFulfillData_order = {
       productName: "Lemon Juice",
       quantity: 4,
       quantityFulfilled: 0,
+      allocations: [],
       variant: {
         __typename: "ProductVariant",
         id: "UHJvZHVjdFZhcmlhbnQ6MTgx",
@@ -130,6 +132,7 @@ export const orderToFulfill: OrderFulfillData_order = {
       productName: "Orange Juice",
       quantity: 3,
       quantityFulfilled: 2,
+      allocations: [],
       variant: {
         __typename: "ProductVariant",
         id: "UHJvZHVjdFZhcmlhbnQ6MTgy",
diff --git a/src/orders/queries.ts b/src/orders/queries.ts
index 334c15538..45747bd88 100644
--- a/src/orders/queries.ts
+++ b/src/orders/queries.ts
@@ -195,6 +195,12 @@ const orderFulfillData = gql`
         isShippingRequired
         productName
         quantity
+        allocations {
+          quantity
+          warehouse {
+            id
+          }
+        }
         quantityFulfilled
         variant {
           id
diff --git a/src/orders/types/OrderFulfillData.ts b/src/orders/types/OrderFulfillData.ts
index 047fc94c0..1e344b827 100644
--- a/src/orders/types/OrderFulfillData.ts
+++ b/src/orders/types/OrderFulfillData.ts
@@ -52,6 +52,7 @@ export interface OrderFulfillData_order_lines {
   productName: string;
   quantity: number;
   quantityFulfilled: number;
+  allocations: OrderFulfillData_order_allocation[];
   variant: OrderFulfillData_order_lines_variant | null;
   thumbnail: OrderFulfillData_order_lines_thumbnail | null;
 }
@@ -70,3 +71,15 @@ export interface OrderFulfillData {
 export interface OrderFulfillDataVariables {
   orderId: string;
 }
+
+export interface OrderFulfillData_order_allocation {
+  __typename: "Allocation";
+  id: string;
+  quantity: number;
+  warehouse: OrderFulfillData_order_allocation_warehouse;
+}
+
+export interface OrderFulfillData_order_allocation_warehouse {
+  __typename: "Warehouse";
+  id: string;
+}
diff --git a/src/storybook/__snapshots__/Stories.test.ts.snap b/src/storybook/__snapshots__/Stories.test.ts.snap
index 80fc3417c..6a5530223 100644
--- a/src/storybook/__snapshots__/Stories.test.ts.snap
+++ b/src/storybook/__snapshots__/Stories.test.ts.snap
@@ -85627,7 +85627,7 @@ exports[`Storyshots Views / Orders / Fulfill order default 1`] = `
                       <input
                         aria-invalid="false"
                         class="MuiInputBase-input-id MuiOutlinedInput-input-id OrderFulfillPage-quantityInnerInput-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
-                        max="760"
+                        max="758"
                         min="0"
                         style="text-align:right"
                         type="number"
@@ -85636,7 +85636,7 @@ exports[`Storyshots Views / Orders / Fulfill order default 1`] = `
                       <div
                         class="OrderFulfillPage-remainingQuantity-id"
                       >
-                        / 2
+                        / 758
                       </div>
                       <fieldset
                         aria-hidden="true"
@@ -85667,7 +85667,7 @@ exports[`Storyshots Views / Orders / Fulfill order default 1`] = `
                       <input
                         aria-invalid="false"
                         class="MuiInputBase-input-id MuiOutlinedInput-input-id OrderFulfillPage-quantityInnerInput-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
-                        max="760"
+                        max="727"
                         min="0"
                         style="text-align:right"
                         type="number"
@@ -85676,7 +85676,7 @@ exports[`Storyshots Views / Orders / Fulfill order default 1`] = `
                       <div
                         class="OrderFulfillPage-remainingQuantity-id"
                       >
-                        / 33
+                        / 727
                       </div>
                       <fieldset
                         aria-hidden="true"
@@ -85707,7 +85707,7 @@ exports[`Storyshots Views / Orders / Fulfill order default 1`] = `
                       <input
                         aria-invalid="false"
                         class="MuiInputBase-input-id MuiOutlinedInput-input-id OrderFulfillPage-quantityInnerInput-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
-                        max="760"
+                        max="756"
                         min="0"
                         style="text-align:right"
                         type="number"
@@ -85716,7 +85716,7 @@ exports[`Storyshots Views / Orders / Fulfill order default 1`] = `
                       <div
                         class="OrderFulfillPage-remainingQuantity-id"
                       >
-                        / 4
+                        / 756
                       </div>
                       <fieldset
                         aria-hidden="true"
@@ -85801,7 +85801,7 @@ exports[`Storyshots Views / Orders / Fulfill order default 1`] = `
                       <div
                         class="OrderFulfillPage-remainingQuantity-id"
                       >
-                        / 0
+                        / 587
                       </div>
                       <fieldset
                         aria-hidden="true"
@@ -85837,7 +85837,7 @@ exports[`Storyshots Views / Orders / Fulfill order default 1`] = `
                       <input
                         aria-invalid="false"
                         class="MuiInputBase-input-id MuiOutlinedInput-input-id OrderFulfillPage-quantityInnerInput-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
-                        max="587"
+                        max="586"
                         min="0"
                         style="text-align:right"
                         type="number"
@@ -85846,7 +85846,7 @@ exports[`Storyshots Views / Orders / Fulfill order default 1`] = `
                       <div
                         class="OrderFulfillPage-remainingQuantity-id"
                       >
-                        / 1
+                        / 586
                       </div>
                       <fieldset
                         aria-hidden="true"
@@ -86280,7 +86280,7 @@ exports[`Storyshots Views / Orders / Fulfill order error 1`] = `
                       <input
                         aria-invalid="false"
                         class="MuiInputBase-input-id MuiOutlinedInput-input-id OrderFulfillPage-quantityInnerInput-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
-                        max="760"
+                        max="758"
                         min="0"
                         style="text-align:right"
                         type="number"
@@ -86289,7 +86289,7 @@ exports[`Storyshots Views / Orders / Fulfill order error 1`] = `
                       <div
                         class="OrderFulfillPage-remainingQuantity-id"
                       >
-                        / 2
+                        / 758
                       </div>
                       <fieldset
                         aria-hidden="true"
@@ -86320,7 +86320,7 @@ exports[`Storyshots Views / Orders / Fulfill order error 1`] = `
                       <input
                         aria-invalid="false"
                         class="MuiInputBase-input-id MuiOutlinedInput-input-id OrderFulfillPage-quantityInnerInput-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
-                        max="760"
+                        max="727"
                         min="0"
                         style="text-align:right"
                         type="number"
@@ -86329,7 +86329,7 @@ exports[`Storyshots Views / Orders / Fulfill order error 1`] = `
                       <div
                         class="OrderFulfillPage-remainingQuantity-id"
                       >
-                        / 33
+                        / 727
                       </div>
                       <fieldset
                         aria-hidden="true"
@@ -86360,7 +86360,7 @@ exports[`Storyshots Views / Orders / Fulfill order error 1`] = `
                       <input
                         aria-invalid="false"
                         class="MuiInputBase-input-id MuiOutlinedInput-input-id OrderFulfillPage-quantityInnerInput-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
-                        max="760"
+                        max="756"
                         min="0"
                         style="text-align:right"
                         type="number"
@@ -86369,7 +86369,7 @@ exports[`Storyshots Views / Orders / Fulfill order error 1`] = `
                       <div
                         class="OrderFulfillPage-remainingQuantity-id"
                       >
-                        / 4
+                        / 756
                       </div>
                       <fieldset
                         aria-hidden="true"
@@ -86454,7 +86454,7 @@ exports[`Storyshots Views / Orders / Fulfill order error 1`] = `
                       <div
                         class="OrderFulfillPage-remainingQuantity-id"
                       >
-                        / 0
+                        / 587
                       </div>
                       <fieldset
                         aria-hidden="true"
@@ -86490,7 +86490,7 @@ exports[`Storyshots Views / Orders / Fulfill order error 1`] = `
                       <input
                         aria-invalid="false"
                         class="MuiInputBase-input-id MuiOutlinedInput-input-id OrderFulfillPage-quantityInnerInput-id MuiInputBase-inputAdornedEnd-id MuiOutlinedInput-inputAdornedEnd-id"
-                        max="587"
+                        max="586"
                         min="0"
                         style="text-align:right"
                         type="number"
@@ -86499,7 +86499,7 @@ exports[`Storyshots Views / Orders / Fulfill order error 1`] = `
                       <div
                         class="OrderFulfillPage-remainingQuantity-id"
                       >
-                        / 1
+                        / 586
                       </div>
                       <fieldset
                         aria-hidden="true"
@@ -87058,7 +87058,7 @@ exports[`Storyshots Views / Orders / Fulfill order one warehouse 1`] = `
                       <div
                         class="OrderFulfillPage-remainingQuantity-id"
                       >
-                        / 0
+                        / 587
                       </div>
                       <fieldset
                         aria-hidden="true"