Use variant prices in add product modal (#1698)

* Replace channel price with variant price; add new price label

* Update fixtures

* Remove unused code

* Remove unused style

* Lint fix

* Remove type conversion

* lint fix

* update queries and types

* CR Fixes

* Money align right

src/components/DiscountedPrice/DiscountedPrice.tsx

@@ -0,0 +1,28 @@
+import { Typography } from "@material-ui/core";
+import React from "react";
+
+import Money, { IMoney } from "../Money";
+import { useStyles } from "./styles";
+
+interface DiscountedPriceProps {
+  regularPrice: IMoney;
+  discountedPrice: IMoney;
+}
+
+const DiscountedPrice: React.FC<DiscountedPriceProps> = ({
+  regularPrice,
+  discountedPrice
+}) => {
+  const classes = useStyles();
+
+  return (
+    <>
+      <Typography className={classes.strike}>
+        <Money money={regularPrice} />
+      </Typography>
+      <Money money={discountedPrice} />
+    </>
+  );
+};
+
+export default DiscountedPrice;

src/components/DiscountedPrice/styles.ts

@@ -0,0 +1,12 @@
+import { makeStyles } from "@saleor/macaw-ui";
+
+export const useStyles = makeStyles(
+  theme => ({
+    strike: {
+      textDecoration: "line-through",
+      color: theme.palette.grey[400],
+      fontSize: "smaller"
+    }
+  }),
+  { name: "DiscountedPrice" }
+);

src/fragments/orders.ts

@@ -313,6 +313,9 @@ export const fragmentOrderDetails = gql`
       name
       currencyCode
       slug
+      defaultCountry {
+        code
+      }
     }
     isPaid
   }

src/fragments/types/OrderDetailsFragment.ts

@@ -539,6 +539,11 @@ export interface OrderDetailsFragment_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderDetailsFragment_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderDetailsFragment_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -546,6 +551,7 @@ export interface OrderDetailsFragment_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderDetailsFragment_channel_defaultCountry;
 }
 
 export interface OrderDetailsFragment {

src/misc.ts

@@ -14,6 +14,7 @@ import {
   orderStatusMessages,
   paymentStatusMessages
 } from "./intl";
+import { OrderDetails_order_shippingAddress } from "./orders/types/OrderDetails";
 import {
   MutationResultAdditionalProps,
   PartialMutationProviderOutput,
@@ -354,6 +355,16 @@ export function findInEnum<TEnum extends {}>(needle: string, haystack: TEnum) {
   throw new Error(`Key ${needle} not found in enum`);
 }
 
+export function addressToAddressInput<T>(
+  address: T & OrderDetails_order_shippingAddress
+): AddressInput {
+  const { id, __typename, ...rest } = address;
+  return {
+    ...rest,
+    country: findInEnum(address.country.code, CountryCode)
+  };
+}
+
 export function findValueInEnum<TEnum extends {}>(
   needle: string,
   haystack: TEnum

src/orders/components/OrderPriceLabel/OrderPriceLabel.tsx

@@ -0,0 +1,30 @@
+import DiscountedPrice from "@saleor/components/DiscountedPrice/DiscountedPrice";
+import Money from "@saleor/components/Money";
+import { SearchOrderVariant_search_edges_node_variants_pricing } from "@saleor/orders/types/SearchOrderVariant";
+import * as React from "react";
+
+import { useStyles } from "./styles";
+
+interface OrderPriceLabelProps {
+  pricing: SearchOrderVariant_search_edges_node_variants_pricing;
+}
+
+const OrderPriceLabel: React.FC<OrderPriceLabelProps> = ({ pricing }) => {
+  const classes = useStyles();
+
+  if (pricing.onSale) {
+    const { price, priceUndiscounted } = pricing;
+    return (
+      <div className={classes.percentDiscountLabelContainer}>
+        <DiscountedPrice
+          discountedPrice={price.gross}
+          regularPrice={priceUndiscounted.gross}
+        />
+      </div>
+    );
+  }
+
+  return <Money money={pricing.priceUndiscounted.gross} align="right" />;
+};
+
+export default OrderPriceLabel;

src/orders/components/OrderPriceLabel/styles.ts

@@ -0,0 +1,13 @@
+import { makeStyles } from "@saleor/macaw-ui";
+
+export const useStyles = makeStyles(
+  () => ({
+    percentDiscountLabelContainer: {
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "flex-end",
+      justifyContent: "flex-end"
+    }
+  }),
+  { name: "OrderPriceLabel" }
+);

src/orders/components/OrderProductAddDialog/OrderProductAddDialog.tsx

@@ -16,7 +16,6 @@ import ConfirmButton, {
   ConfirmButtonTransitionState
 } from "@saleor/components/ConfirmButton";
 import FormSpacer from "@saleor/components/FormSpacer";
-import Money from "@saleor/components/Money";
 import ResponsiveTable from "@saleor/components/ResponsiveTable";
 import TableCellAvatar from "@saleor/components/TableCellAvatar";
 import { OrderErrorFragment } from "@saleor/fragments/types/OrderErrorFragment";
@@ -36,6 +35,7 @@ import {
   SearchOrderVariant_search_edges_node,
   SearchOrderVariant_search_edges_node_variants
 } from "../../types/SearchOrderVariant";
+import OrderPriceLabel from "../OrderPriceLabel/OrderPriceLabel";
 
 const useStyles = makeStyles(
   theme => ({
@@ -365,9 +365,7 @@ const OrderProductAddDialog: React.FC<OrderProductAddDialogProps> = props => {
                             )}
                           </TableCell>
                           <TableCell className={classes.textRight}>
-                            {variant?.channelListings[0]?.price && (
-                              <Money money={variant.channelListings[0].price} />
-                            )}
+                            <OrderPriceLabel pricing={variant.pricing} />
                           </TableCell>
                         </TableRow>
                       ))}

src/orders/fixtures.ts

@@ -837,7 +837,11 @@ export const order = (placeholder: string): OrderDetails_order => ({
     currencyCode: "USD",
     id: "123454",
     isActive: true,
-    name: "Default Channel"
+    name: "Default Channel",
+    defaultCountry: {
+      code: "CA",
+      __typename: "CountryDisplay"
+    }
   },
   created: "2018-09-11T09:37:28.185874+00:00",
   customerNote: "Lorem ipsum dolor sit amet",
@@ -1424,7 +1428,11 @@ export const draftOrder = (placeholder: string): OrderDetails_order => ({
     currencyCode: "USD",
     id: "123454",
     isActive: true,
-    name: "Default Channel"
+    name: "Default Channel",
+    defaultCountry: {
+      code: "CA",
+      __typename: "CountryDisplay"
+    }
   },
   created: "2018-09-20T23:23:39.811428+00:00",
   customerNote: "Lorem ipsum dolor sit",
@@ -1695,7 +1703,27 @@ export const orderLineSearch = (
         ],
         id: "UHJvZHVjdFZhcmlhbnQ6MjAy",
         name: "500ml",
-        sku: "93855755"
+        sku: "93855755",
+        pricing: {
+          __typename: "VariantPricingInfo",
+          onSale: false,
+          price: {
+            __typename: "TaxedMoney",
+            gross: {
+              amount: 1,
+              currency: "USD",
+              __typename: "Money"
+            }
+          },
+          priceUndiscounted: {
+            __typename: "TaxedMoney",
+            gross: {
+              amount: 1,
+              currency: "USD",
+              __typename: "Money"
+            }
+          }
+        }
       },
       {
         __typename: "ProductVariant" as "ProductVariant",
@@ -1733,7 +1761,27 @@ export const orderLineSearch = (
         ],
         id: "UHJvZHVjdFZhcmlhbnQ6MjAz",
         name: "1l",
-        sku: "43226647"
+        sku: "43226647",
+        pricing: {
+          __typename: "VariantPricingInfo",
+          onSale: false,
+          price: {
+            __typename: "TaxedMoney",
+            gross: {
+              amount: 1,
+              currency: "USD",
+              __typename: "Money"
+            }
+          },
+          priceUndiscounted: {
+            __typename: "TaxedMoney",
+            gross: {
+              amount: 1,
+              currency: "USD",
+              __typename: "Money"
+            }
+          }
+        }
       },
       {
         __typename: "ProductVariant" as "ProductVariant",
@@ -1771,7 +1819,27 @@ export const orderLineSearch = (
         ],
         id: "UHJvZHVjdFZhcmlhbnQ6MjA0",
         name: "2l",
-        sku: "80884671"
+        sku: "80884671",
+        pricing: {
+          __typename: "VariantPricingInfo",
+          onSale: false,
+          price: {
+            __typename: "TaxedMoney",
+            gross: {
+              amount: 1,
+              currency: "USD",
+              __typename: "Money"
+            }
+          },
+          priceUndiscounted: {
+            __typename: "TaxedMoney",
+            gross: {
+              amount: 1,
+              currency: "USD",
+              __typename: "Money"
+            }
+          }
+        }
       }
     ]
   },
@@ -1820,7 +1888,27 @@ export const orderLineSearch = (
         ],
         id: "UHJvZHVjdFZhcmlhbnQ6MjEx",
         name: "500ml",
-        sku: "43200242"
+        sku: "43200242",
+        pricing: {
+          __typename: "VariantPricingInfo",
+          onSale: false,
+          price: {
+            __typename: "TaxedMoney",
+            gross: {
+              amount: 1,
+              currency: "USD",
+              __typename: "Money"
+            }
+          },
+          priceUndiscounted: {
+            __typename: "TaxedMoney",
+            gross: {
+              amount: 1,
+              currency: "USD",
+              __typename: "Money"
+            }
+          }
+        }
       },
       {
         __typename: "ProductVariant" as "ProductVariant",
@@ -1858,7 +1946,27 @@ export const orderLineSearch = (
         ],
         id: "UHJvZHVjdFZhcmlhbnQ6MjEy",
         name: "1l",
-        sku: "79129513"
+        sku: "79129513",
+        pricing: {
+          __typename: "VariantPricingInfo",
+          onSale: false,
+          price: {
+            __typename: "TaxedMoney",
+            gross: {
+              amount: 1,
+              currency: "USD",
+              __typename: "Money"
+            }
+          },
+          priceUndiscounted: {
+            __typename: "TaxedMoney",
+            gross: {
+              amount: 1,
+              currency: "USD",
+              __typename: "Money"
+            }
+          }
+        }
       },
       {
         __typename: "ProductVariant" as "ProductVariant",
@@ -1896,7 +2004,27 @@ export const orderLineSearch = (
         ],
         id: "UHJvZHVjdFZhcmlhbnQ6MjEz",
         name: "2l",
-        sku: "75799450"
+        sku: "75799450",
+        pricing: {
+          __typename: "VariantPricingInfo",
+          onSale: false,
+          price: {
+            __typename: "TaxedMoney",
+            gross: {
+              amount: 1,
+              currency: "USD",
+              __typename: "Money"
+            }
+          },
+          priceUndiscounted: {
+            __typename: "TaxedMoney",
+            gross: {
+              amount: 1,
+              currency: "USD",
+              __typename: "Money"
+            }
+          }
+        }
       }
     ]
   }

src/orders/queries.ts

@@ -169,11 +169,13 @@ export const useOrderQuery = makeQuery<OrderDetails, OrderDetailsVariables>(
 );
 
 export const searchOrderVariant = gql`
+  ${fragmentMoney}
   query SearchOrderVariant(
     $channel: String!
     $first: Int!
     $query: String!
     $after: String
+    $address: AddressInput
   ) {
     search: products(
       first: $first
@@ -192,6 +194,19 @@ export const searchOrderVariant = gql`
             id
             name
             sku
+            pricing(address: $address) {
+              priceUndiscounted {
+                gross {
+                  ...Money
+                }
+              }
+              price {
+                gross {
+                  ...Money
+                }
+              }
+              onSale
+            }
             channelListings {
               channel {
                 id

src/orders/types/FulfillOrder.ts

@@ -548,6 +548,11 @@ export interface FulfillOrder_orderFulfill_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface FulfillOrder_orderFulfill_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface FulfillOrder_orderFulfill_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -555,6 +560,7 @@ export interface FulfillOrder_orderFulfill_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: FulfillOrder_orderFulfill_order_channel_defaultCountry;
 }
 
 export interface FulfillOrder_orderFulfill_order {

src/orders/types/OrderCancel.ts

@@ -546,6 +546,11 @@ export interface OrderCancel_orderCancel_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderCancel_orderCancel_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderCancel_orderCancel_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderCancel_orderCancel_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderCancel_orderCancel_order_channel_defaultCountry;
 }
 
 export interface OrderCancel_orderCancel_order {

src/orders/types/OrderCapture.ts

@@ -546,6 +546,11 @@ export interface OrderCapture_orderCapture_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderCapture_orderCapture_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderCapture_orderCapture_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderCapture_orderCapture_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderCapture_orderCapture_order_channel_defaultCountry;
 }
 
 export interface OrderCapture_orderCapture_order {

src/orders/types/OrderConfirm.ts

@@ -546,6 +546,11 @@ export interface OrderConfirm_orderConfirm_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderConfirm_orderConfirm_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderConfirm_orderConfirm_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderConfirm_orderConfirm_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderConfirm_orderConfirm_order_channel_defaultCountry;
 }
 
 export interface OrderConfirm_orderConfirm_order {

src/orders/types/OrderDetails.ts

@@ -539,6 +539,11 @@ export interface OrderDetails_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderDetails_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderDetails_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -546,6 +551,7 @@ export interface OrderDetails_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderDetails_order_channel_defaultCountry;
 }
 
 export interface OrderDetails_order {

src/orders/types/OrderDiscountAdd.ts

@@ -546,6 +546,11 @@ export interface OrderDiscountAdd_orderDiscountAdd_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderDiscountAdd_orderDiscountAdd_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderDiscountAdd_orderDiscountAdd_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderDiscountAdd_orderDiscountAdd_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderDiscountAdd_orderDiscountAdd_order_channel_defaultCountry;
 }
 
 export interface OrderDiscountAdd_orderDiscountAdd_order {

src/orders/types/OrderDiscountDelete.ts

@@ -546,6 +546,11 @@ export interface OrderDiscountDelete_orderDiscountDelete_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderDiscountDelete_orderDiscountDelete_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderDiscountDelete_orderDiscountDelete_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderDiscountDelete_orderDiscountDelete_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderDiscountDelete_orderDiscountDelete_order_channel_defaultCountry;
 }
 
 export interface OrderDiscountDelete_orderDiscountDelete_order {

src/orders/types/OrderDiscountUpdate.ts

@@ -546,6 +546,11 @@ export interface OrderDiscountUpdate_orderDiscountUpdate_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderDiscountUpdate_orderDiscountUpdate_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderDiscountUpdate_orderDiscountUpdate_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderDiscountUpdate_orderDiscountUpdate_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderDiscountUpdate_orderDiscountUpdate_order_channel_defaultCountry;
 }
 
 export interface OrderDiscountUpdate_orderDiscountUpdate_order {

src/orders/types/OrderDraftCancel.ts

@@ -546,6 +546,11 @@ export interface OrderDraftCancel_draftOrderDelete_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderDraftCancel_draftOrderDelete_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderDraftCancel_draftOrderDelete_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderDraftCancel_draftOrderDelete_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderDraftCancel_draftOrderDelete_order_channel_defaultCountry;
 }
 
 export interface OrderDraftCancel_draftOrderDelete_order {

src/orders/types/OrderDraftFinalize.ts

@@ -546,6 +546,11 @@ export interface OrderDraftFinalize_draftOrderComplete_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderDraftFinalize_draftOrderComplete_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderDraftFinalize_draftOrderComplete_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderDraftFinalize_draftOrderComplete_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderDraftFinalize_draftOrderComplete_order_channel_defaultCountry;
 }
 
 export interface OrderDraftFinalize_draftOrderComplete_order {

src/orders/types/OrderDraftUpdate.ts

@@ -546,6 +546,11 @@ export interface OrderDraftUpdate_draftOrderUpdate_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderDraftUpdate_draftOrderUpdate_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderDraftUpdate_draftOrderUpdate_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderDraftUpdate_draftOrderUpdate_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderDraftUpdate_draftOrderUpdate_order_channel_defaultCountry;
 }
 
 export interface OrderDraftUpdate_draftOrderUpdate_order {

src/orders/types/OrderFulfillmentApprove.ts

@@ -546,6 +546,11 @@ export interface OrderFulfillmentApprove_orderFulfillmentApprove_order_invoices
   status: JobStatusEnum;
 }
 
+export interface OrderFulfillmentApprove_orderFulfillmentApprove_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderFulfillmentApprove_orderFulfillmentApprove_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderFulfillmentApprove_orderFulfillmentApprove_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderFulfillmentApprove_orderFulfillmentApprove_order_channel_defaultCountry;
 }
 
 export interface OrderFulfillmentApprove_orderFulfillmentApprove_order {

src/orders/types/OrderFulfillmentCancel.ts

@@ -546,6 +546,11 @@ export interface OrderFulfillmentCancel_orderFulfillmentCancel_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderFulfillmentCancel_orderFulfillmentCancel_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderFulfillmentCancel_orderFulfillmentCancel_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderFulfillmentCancel_orderFulfillmentCancel_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderFulfillmentCancel_orderFulfillmentCancel_order_channel_defaultCountry;
 }
 
 export interface OrderFulfillmentCancel_orderFulfillmentCancel_order {

src/orders/types/OrderFulfillmentRefundProducts.ts

@@ -648,6 +648,11 @@ export interface OrderFulfillmentRefundProducts_orderFulfillmentRefundProducts_o
   status: JobStatusEnum;
 }
 
+export interface OrderFulfillmentRefundProducts_orderFulfillmentRefundProducts_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderFulfillmentRefundProducts_orderFulfillmentRefundProducts_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -655,6 +660,7 @@ export interface OrderFulfillmentRefundProducts_orderFulfillmentRefundProducts_o
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderFulfillmentRefundProducts_orderFulfillmentRefundProducts_order_channel_defaultCountry;
 }
 
 export interface OrderFulfillmentRefundProducts_orderFulfillmentRefundProducts_order {

src/orders/types/OrderFulfillmentUpdateTracking.ts

@@ -546,6 +546,11 @@ export interface OrderFulfillmentUpdateTracking_orderFulfillmentUpdateTracking_o
   status: JobStatusEnum;
 }
 
+export interface OrderFulfillmentUpdateTracking_orderFulfillmentUpdateTracking_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderFulfillmentUpdateTracking_orderFulfillmentUpdateTracking_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderFulfillmentUpdateTracking_orderFulfillmentUpdateTracking_o
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderFulfillmentUpdateTracking_orderFulfillmentUpdateTracking_order_channel_defaultCountry;
 }
 
 export interface OrderFulfillmentUpdateTracking_orderFulfillmentUpdateTracking_order {

src/orders/types/OrderLineDelete.ts

@@ -546,6 +546,11 @@ export interface OrderLineDelete_orderLineDelete_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderLineDelete_orderLineDelete_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderLineDelete_orderLineDelete_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderLineDelete_orderLineDelete_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderLineDelete_orderLineDelete_order_channel_defaultCountry;
 }
 
 export interface OrderLineDelete_orderLineDelete_order {

src/orders/types/OrderLineDiscountRemove.ts

@@ -546,6 +546,11 @@ export interface OrderLineDiscountRemove_orderLineDiscountRemove_order_invoices
   status: JobStatusEnum;
 }
 
+export interface OrderLineDiscountRemove_orderLineDiscountRemove_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderLineDiscountRemove_orderLineDiscountRemove_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderLineDiscountRemove_orderLineDiscountRemove_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderLineDiscountRemove_orderLineDiscountRemove_order_channel_defaultCountry;
 }
 
 export interface OrderLineDiscountRemove_orderLineDiscountRemove_order {

src/orders/types/OrderLineDiscountUpdate.ts

@@ -546,6 +546,11 @@ export interface OrderLineDiscountUpdate_orderLineDiscountUpdate_order_invoices
   status: JobStatusEnum;
 }
 
+export interface OrderLineDiscountUpdate_orderLineDiscountUpdate_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderLineDiscountUpdate_orderLineDiscountUpdate_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderLineDiscountUpdate_orderLineDiscountUpdate_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderLineDiscountUpdate_orderLineDiscountUpdate_order_channel_defaultCountry;
 }
 
 export interface OrderLineDiscountUpdate_orderLineDiscountUpdate_order {

src/orders/types/OrderLineUpdate.ts

@@ -546,6 +546,11 @@ export interface OrderLineUpdate_orderLineUpdate_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderLineUpdate_orderLineUpdate_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderLineUpdate_orderLineUpdate_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderLineUpdate_orderLineUpdate_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderLineUpdate_orderLineUpdate_order_channel_defaultCountry;
 }
 
 export interface OrderLineUpdate_orderLineUpdate_order {

src/orders/types/OrderLinesAdd.ts

@@ -546,6 +546,11 @@ export interface OrderLinesAdd_orderLinesCreate_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderLinesAdd_orderLinesCreate_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderLinesAdd_orderLinesCreate_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderLinesAdd_orderLinesCreate_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderLinesAdd_orderLinesCreate_order_channel_defaultCountry;
 }
 
 export interface OrderLinesAdd_orderLinesCreate_order {

src/orders/types/OrderMarkAsPaid.ts

@@ -546,6 +546,11 @@ export interface OrderMarkAsPaid_orderMarkAsPaid_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderMarkAsPaid_orderMarkAsPaid_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderMarkAsPaid_orderMarkAsPaid_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderMarkAsPaid_orderMarkAsPaid_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderMarkAsPaid_orderMarkAsPaid_order_channel_defaultCountry;
 }
 
 export interface OrderMarkAsPaid_orderMarkAsPaid_order {

src/orders/types/OrderRefund.ts

@@ -546,6 +546,11 @@ export interface OrderRefund_orderRefund_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderRefund_orderRefund_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderRefund_orderRefund_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderRefund_orderRefund_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderRefund_orderRefund_order_channel_defaultCountry;
 }
 
 export interface OrderRefund_orderRefund_order {

src/orders/types/OrderShippingMethodUpdate.ts

@@ -554,6 +554,11 @@ export interface OrderShippingMethodUpdate_orderUpdateShipping_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderShippingMethodUpdate_orderUpdateShipping_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderShippingMethodUpdate_orderUpdateShipping_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -561,6 +566,7 @@ export interface OrderShippingMethodUpdate_orderUpdateShipping_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderShippingMethodUpdate_orderUpdateShipping_order_channel_defaultCountry;
 }
 
 export interface OrderShippingMethodUpdate_orderUpdateShipping_order {

src/orders/types/OrderUpdate.ts

@@ -546,6 +546,11 @@ export interface OrderUpdate_orderUpdate_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderUpdate_orderUpdate_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderUpdate_orderUpdate_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderUpdate_orderUpdate_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderUpdate_orderUpdate_order_channel_defaultCountry;
 }
 
 export interface OrderUpdate_orderUpdate_order {

src/orders/types/OrderVoid.ts

@@ -546,6 +546,11 @@ export interface OrderVoid_orderVoid_order_invoices {
   status: JobStatusEnum;
 }
 
+export interface OrderVoid_orderVoid_order_channel_defaultCountry {
+  __typename: "CountryDisplay";
+  code: string;
+}
+
 export interface OrderVoid_orderVoid_order_channel {
   __typename: "Channel";
   isActive: boolean;
@@ -553,6 +558,7 @@ export interface OrderVoid_orderVoid_order_channel {
   name: string;
   currencyCode: string;
   slug: string;
+  defaultCountry: OrderVoid_orderVoid_order_channel_defaultCountry;
 }
 
 export interface OrderVoid_orderVoid_order {

src/orders/types/SearchOrderVariant.ts

@@ -3,6 +3,8 @@
 // @generated
 // This file was automatically generated and should not be edited.
 
+import { AddressInput } from "./../../types/globalTypes";
+
 // ====================================================
 // GraphQL query operation: SearchOrderVariant
 // ====================================================
@@ -12,6 +14,35 @@ export interface SearchOrderVariant_search_edges_node_thumbnail {
   url: string;
 }
 
+export interface SearchOrderVariant_search_edges_node_variants_pricing_priceUndiscounted_gross {
+  __typename: "Money";
+  amount: number;
+  currency: string;
+}
+
+export interface SearchOrderVariant_search_edges_node_variants_pricing_priceUndiscounted {
+  __typename: "TaxedMoney";
+  gross: SearchOrderVariant_search_edges_node_variants_pricing_priceUndiscounted_gross;
+}
+
+export interface SearchOrderVariant_search_edges_node_variants_pricing_price_gross {
+  __typename: "Money";
+  amount: number;
+  currency: string;
+}
+
+export interface SearchOrderVariant_search_edges_node_variants_pricing_price {
+  __typename: "TaxedMoney";
+  gross: SearchOrderVariant_search_edges_node_variants_pricing_price_gross;
+}
+
+export interface SearchOrderVariant_search_edges_node_variants_pricing {
+  __typename: "VariantPricingInfo";
+  priceUndiscounted: SearchOrderVariant_search_edges_node_variants_pricing_priceUndiscounted | null;
+  price: SearchOrderVariant_search_edges_node_variants_pricing_price | null;
+  onSale: boolean | null;
+}
+
 export interface SearchOrderVariant_search_edges_node_variants_channelListings_channel {
   __typename: "Channel";
   id: string;
@@ -37,6 +68,7 @@ export interface SearchOrderVariant_search_edges_node_variants {
   id: string;
   name: string;
   sku: string | null;
+  pricing: SearchOrderVariant_search_edges_node_variants_pricing | null;
   channelListings: SearchOrderVariant_search_edges_node_variants_channelListings[] | null;
 }
 
@@ -76,4 +108,5 @@ export interface SearchOrderVariantVariables {
   first: number;
   query: string;
   after?: string | null;
+  address?: AddressInput | null;
 }

src/orders/utils/data.ts

@@ -1,7 +1,13 @@
 import { IMoney, subtractMoney } from "@saleor/components/Money";
 import { WarehouseFragment } from "@saleor/fragments/types/WarehouseFragment";
 import { FormsetData } from "@saleor/hooks/useFormset";
-import { FulfillmentStatus, OrderErrorCode } from "@saleor/types/globalTypes";
+import { addressToAddressInput } from "@saleor/misc";
+import {
+  AddressInput,
+  CountryCode,
+  FulfillmentStatus,
+  OrderErrorCode
+} from "@saleor/types/globalTypes";
 
 import {
   LineItemData,
@@ -298,3 +304,17 @@ export const isStockError = (
 
   return isQuantityLargerThanAvailable || isError;
 };
+
+export const getVariantSearchAddress = (
+  order: OrderDetails_order
+): AddressInput => {
+  if (order.shippingAddress) {
+    return addressToAddressInput(order.shippingAddress);
+  }
+
+  if (order.billingAddress) {
+    return addressToAddressInput(order.billingAddress);
+  }
+
+  return { country: order.channel.defaultCountry.code as CountryCode };
+};

src/orders/views/OrderDetails/OrderDraftDetails/index.tsx

@@ -13,6 +13,7 @@ import {
 } from "@saleor/orders/components/OrderCustomerChangeDialog/form";
 import OrderCustomerChangeDialog from "@saleor/orders/components/OrderCustomerChangeDialog/OrderCustomerChangeDialog";
 import { OrderDetails } from "@saleor/orders/types/OrderDetails";
+import { getVariantSearchAddress } from "@saleor/orders/utils/data";
 import { OrderDiscountProvider } from "@saleor/products/components/OrderDiscountProviders/OrderDiscountProvider";
 import { OrderLineDiscountProvider } from "@saleor/products/components/OrderDiscountProviders/OrderLineDiscountProvider";
 import useCustomerSearch from "@saleor/searches/useCustomerSearch";
@@ -73,7 +74,11 @@ export const OrderDraftDetails: React.FC<OrderDraftDetailsProps> = ({
     search: variantSearch,
     result: variantSearchOpts
   } = useOrderVariantSearch({
-    variables: { ...DEFAULT_INITIAL_SEARCH_DATA, channel: order.channel.slug }
+    variables: {
+      ...DEFAULT_INITIAL_SEARCH_DATA,
+      channel: order.channel.slug,
+      address: getVariantSearchAddress(order)
+    }
   });
 
   const {