Change usages of order error order line prop (#1175)

* Change usages of order error order line prop to order lines

* Fix fixture

* Fixes after review

schema.graphql

@@ -3027,6 +3027,7 @@ type Order implements Node & ObjectWithMetadata {
   discountName: String @deprecated(reason: "Use discounts field. This field will be removed in Saleor 4.0.")
   translatedDiscountName: String @deprecated(reason: "Use discounts field. This field will be removed in Saleor 4.0.")
   discounts: [OrderDiscount!]
+  errors: [OrderError!]!
 }
 
 enum OrderAction {
@@ -3140,7 +3141,7 @@ type OrderError {
   message: String
   code: OrderErrorCode!
   warehouse: ID
-  orderLine: ID
+  orderLines: [ID!]
   variants: [ID!]
   addressType: AddressTypeEnum
 }
@@ -3260,6 +3261,8 @@ enum OrderEventsEnum {
   ORDER_DISCOUNT_DELETED
   ORDER_LINE_DISCOUNT_UPDATED
   ORDER_LINE_DISCOUNT_REMOVED
+  ORDER_LINE_PRODUCT_DELETED
+  ORDER_LINE_VARIANT_DELETED
   UPDATED_ADDRESS
   EMAIL_SENT
   CONFIRMED

src/orders/components/OrderFulfillPage/OrderFulfillPage.stories.tsx

@@ -36,7 +36,7 @@ storiesOf("Views / Orders / Fulfill order", module)
           __typename: "OrderError",
           code: OrderErrorCode.INSUFFICIENT_STOCK,
           field: null,
-          orderLine: orderToFulfill.lines[0].id,
+          orderLines: [orderToFulfill.lines[0].id],
           warehouse: warehouseList[0].id,
           addressType: null
         }

src/orders/components/OrderFulfillPage/OrderFulfillPage.tsx

@@ -215,6 +215,31 @@ const OrderFulfillPage: React.FC<OrderFulfillPageProps> = props => {
     return isAtLeastOneFulfilled && areProperlyFulfilled;
   };
 
+  const isStockError = (
+    overfulfill: boolean,
+    formsetStock: { quantity: number },
+    availableQuantity: number,
+    warehouse: WarehouseFragment,
+    line: OrderFulfillData_order_lines,
+    errors: FulfillOrder_orderFulfill_errors[]
+  ) => {
+    if (overfulfill) {
+      return true;
+    }
+
+    const isQuantityLargerThanAvailable =
+      line.variant.trackInventory && formsetStock.quantity > availableQuantity;
+
+    const isError = !!errors?.find(
+      err =>
+        err.warehouse === warehouse.id &&
+        err.orderLines.find((id: string) => id === line.id) &&
+        err.code === OrderErrorCode.INSUFFICIENT_STOCK
+    );
+
+    return isQuantityLargerThanAvailable || isError;
+  };
+
   return (
     <Container>
       <AppHeader onBack={onBack}>
@@ -422,19 +447,14 @@ const OrderFulfillPage: React.FC<OrderFulfillPageProps> = props => {
                                       )
                                     )
                                   }
-                                  error={
+                                  error={isStockError(
-                                    overfulfill ||
+                                    overfulfill,
-                                    (line.variant.trackInventory &&
+                                    formsetStock,
-                                      formsetStock.quantity >
+                                    availableQuantity,
-                                        availableQuantity) ||
+                                    warehouse,
-                                    !!errors?.find(
+                                    line,
-                                      err =>
+                                    errors
-                                        err.warehouse === warehouse.id &&
+                                  )}
-                                        err.orderLine === line.id &&
-                                        err.code ===
-                                          OrderErrorCode.INSUFFICIENT_STOCK
-                                    )
-                                  }
                                   InputProps={{
                                     endAdornment: line.variant
                                       .trackInventory && (

src/orders/mutations.ts

@@ -675,7 +675,7 @@ const fulfillOrder = gql`
       errors {
         ...OrderErrorFragment
         warehouse
-        orderLine
+        orderLines
       }
       order {
         ...OrderDetailsFragment

src/orders/types/FulfillOrder.ts

@@ -15,7 +15,7 @@ export interface FulfillOrder_orderFulfill_errors {
   field: string | null;
   addressType: AddressTypeEnum | null;
   warehouse: string | null;
-  orderLine: string | null;
+  orderLines: string[] | null;
 }
 
 export interface FulfillOrder_orderFulfill_order_metadata {

src/types/globalTypes.ts

@@ -679,6 +679,8 @@ export enum OrderEventsEnum {
   ORDER_FULLY_PAID = "ORDER_FULLY_PAID",
   ORDER_LINE_DISCOUNT_REMOVED = "ORDER_LINE_DISCOUNT_REMOVED",
   ORDER_LINE_DISCOUNT_UPDATED = "ORDER_LINE_DISCOUNT_UPDATED",
+  ORDER_LINE_PRODUCT_DELETED = "ORDER_LINE_PRODUCT_DELETED",
+  ORDER_LINE_VARIANT_DELETED = "ORDER_LINE_VARIANT_DELETED",
   ORDER_MARKED_AS_PAID = "ORDER_MARKED_AS_PAID",
   ORDER_REPLACEMENT_CREATED = "ORDER_REPLACEMENT_CREATED",
   OTHER = "OTHER",