Merge pull request #599 from reactioncommerce/refactor-kieckhafer-rem…

…oveDeprecatedField refactor: remove deprecated api field
reactioncommerce · Nov 6, 2019 · f7d2996 · f7d2996
2 parents c115759 + c125a5f
commit f7d2996
Show file tree

Hide file tree

Showing 23 changed files with 82 additions and 65 deletions.
diff --git a/src/components/CartPopover/CartPopover.js b/src/components/CartPopover/CartPopover.js
@@ -90,10 +90,6 @@ class CartPopover extends Component {
            */
         value: PropTypes.string
       })),
-      /**
-       * Current stock quantity of item
-       */
-      currentQuantity: PropTypes.number,
       /**
        * Image url of chosen item
        */

diff --git a/src/components/CartPopover/CartPopover.test.js b/src/components/CartPopover/CartPopover.test.js
@@ -16,7 +16,6 @@ const cartItem = {
       value: "Summer"
     }
   ],
-  currentQuantity: 10,
   imageUrl: "//placehold.it/100",
   isLowInventoryQuantity: false,
   price: {

diff --git a/src/components/CheckoutSummary/CheckoutSummary.test.js b/src/components/CheckoutSummary/CheckoutSummary.test.js
@@ -28,11 +28,11 @@ const testCart = {
       compareAtPrice: {
         displayAmount: "$45.00"
       },
-      currentQuantity: 3,
       imageURLs: {
         small: "//placehold.it/150",
         thumbnail: "//placehold.it/100"
       },
+      currentQuantity: 3,
       isLowQuantity: true,
       price: {
         displayAmount: "$20.00"
@@ -48,11 +48,11 @@ const testCart = {
         { label: "Color", value: "Black" },
         { label: "Size", value: "10" }
       ],
-      currentQuantity: 500,
       imageURLs: {
         small: "//placehold.it/150",
         thumbnail: "//placehold.it/100"
       },
+      currentQuantity: 30,
       isLowQuantity: false,
       price: {
         displayAmount: "$78.00"

diff --git a/src/components/MediaGallery/MediaGallery.test.js b/src/components/MediaGallery/MediaGallery.test.js
@@ -4,7 +4,6 @@ import MediaGallery from "./MediaGallery";
 
 const mediaItems = [
   {
-    toGrid: 1,
     priority: 0,
     productId: "cmVhY3Rpb24vcHJvZHVjdDpCQ1RNWjZIVHhGU3BwSkVTaw==",
     variantId: "cmVhY3Rpb24vcHJvZHVjdDo2cWlxUHdCa2VKZHRkUWM0Rw==",
@@ -17,7 +16,6 @@ const mediaItems = [
     }
   },
   {
-    toGrid: 1,
     priority: 0,
     productId: "cmVhY3Rpb24vcHJvZHVjdDpCQ1RNWjZIVHhGU3BwSkVTaw==",
     variantId: "cmVhY3Rpb24vcHJvZHVjdDo2cWlxUHdCa2VKZHRkUWM0Rw==",

diff --git a/src/components/MediaGalleryItem/MediaGalleryItem.test.js b/src/components/MediaGalleryItem/MediaGalleryItem.test.js
@@ -3,7 +3,6 @@ import renderer from "react-test-renderer";
 import MediaGalleryItem from "./MediaGalleryItem";
 
 const media = {
-  toGrid: 1,
   priority: 0,
   productId: "cmVhY3Rpb24vcHJvZHVjdDpCQ1RNWjZIVHhGU3BwSkVTaw==",
   variantId: "cmVhY3Rpb24vcHJvZHVjdDo2cWlxUHdCa2VKZHRkUWM0Rw==",

diff --git a/src/components/OrderCard/OrderCard.test.js b/src/components/OrderCard/OrderCard.test.js
@@ -33,11 +33,11 @@ const order = {
             compareAtPrice: {
               displayAmount: "$45.00"
             },
-            currentQuantity: 3,
             imageURLs: {
               small: "//placehold.it/150",
               thumbnail: "//placehold.it/100"
             },
+            inventoryAvailableToSell: 3,
             isLowQuantity: true,
             price: {
               displayAmount: "$20.00"
@@ -50,11 +50,11 @@ const order = {
           {
             _id: "456",
             attributes: [{ label: "Color", value: "Black" }, { label: "Size", value: "10" }],
-            currentQuantity: 500,
             imageURLs: {
               small: "//placehold.it/150",
               thumbnail: "//placehold.it/100"
             },
+            inventoryAvailableToSell: 30,
             isLowQuantity: false,
             price: {
               displayAmount: "$78.00"

diff --git a/src/components/OrderCardFulfillmentGroup/OrderCardFulfillmentGroup.js b/src/components/OrderCardFulfillmentGroup/OrderCardFulfillmentGroup.js
@@ -70,12 +70,19 @@ class OrderCardFulfillmentGroup extends Component {
     const { classes, fulfillmentGroup } = this.props;
 
     if (fulfillmentGroup && Array.isArray(fulfillmentGroup.items.nodes)) {
+      const items = fulfillmentGroup.items.nodes.map((item) => ({
+        ...item,
+        // Backwards compatibility until all component library components are updated
+        // to accept `inventoryAvailableToSell`.
+        currentQuantity: item.currentQuantity || item.inventoryAvailableToSell
+      }));
+
       return (
         <Grid className={classes.fulfillmentGroupDetails} item xs={12} md={12}>
           <CartItems
             isMiniCart
             isReadOnly
-            items={fulfillmentGroup.items.nodes}
+            items={items}
           />
         </Grid>
       );

diff --git a/src/components/OrderCardFulfillmentGroup/OrderCardFulfillmentGroup.test.js b/src/components/OrderCardFulfillmentGroup/OrderCardFulfillmentGroup.test.js
@@ -23,11 +23,11 @@ const testFulfillmentGroup = {
         compareAtPrice: {
           displayAmount: "$45.00"
         },
-        currentQuantity: 3,
         imageURLs: {
           small: "//placehold.it/150",
           thumbnail: "//placehold.it/100"
         },
+        inventoryAvailableToSell: 3,
         isLowQuantity: true,
         price: {
           displayAmount: "$20.00"
@@ -40,11 +40,11 @@ const testFulfillmentGroup = {
       {
         _id: "456",
         attributes: [{ label: "Color", value: "Black" }, { label: "Size", value: "10" }],
-        currentQuantity: 500,
         imageURLs: {
           small: "//placehold.it/150",
           thumbnail: "//placehold.it/100"
         },
+        inventoryAvailableToSell: 30,
         isLowQuantity: false,
         price: {
           displayAmount: "$78.00"

diff --git a/src/components/OrderFulfillmentGroup/OrderFulfillmentGroup.js b/src/components/OrderFulfillmentGroup/OrderFulfillmentGroup.js
@@ -67,6 +67,13 @@ class OrderFulfillmentGroup extends Component {
     const { classes, fulfillmentGroup, hasMoreCartItems, loadMoreCartItems } = this.props;
 
     if (fulfillmentGroup && Array.isArray(fulfillmentGroup.items.nodes)) {
+      const items = fulfillmentGroup.items.nodes.map((item) => ({
+        ...item,
+        // Backwards compatibility until all component library components are updated
+        // to accept `inventoryAvailableToSell`.
+        currentQuantity: item.currentQuantity || item.inventoryAvailableToSell
+      }));
+
       return (
         <div className={classes.fulfillmentDetails}>
           <Grid item xs={12}>
@@ -75,7 +82,7 @@ class OrderFulfillmentGroup extends Component {
               isReadOnly
               hasMoreCartItems={hasMoreCartItems}
               onLoadMoreCartItems={loadMoreCartItems}
-              items={fulfillmentGroup.items.nodes}
+              items={items}
               onChangeCartItemQuantity={this.handleItemQuantityChange}
               onRemoveItemFromCart={this.handleRemoveItem}
             />

diff --git a/src/components/OrderFulfillmentGroup/OrderFulfillmentGroup.test.js b/src/components/OrderFulfillmentGroup/OrderFulfillmentGroup.test.js
@@ -23,11 +23,11 @@ const testFulfillmentGroup = {
         compareAtPrice: {
           displayAmount: "$45.00"
         },
-        currentQuantity: 3,
         imageURLs: {
           small: "//placehold.it/150",
           thumbnail: "//placehold.it/100"
         },
+        inventoryAvailableToSell: 3,
         isLowQuantity: true,
         price: {
           displayAmount: "$20.00"
@@ -40,11 +40,11 @@ const testFulfillmentGroup = {
       {
         _id: "456",
         attributes: [{ label: "Color", value: "Black" }, { label: "Size", value: "10" }],
-        currentQuantity: 500,
         imageURLs: {
           small: "//placehold.it/150",
           thumbnail: "//placehold.it/100"
         },
+        inventoryAvailableToSell: 30,
         isLowQuantity: false,
         price: {
           displayAmount: "$78.00"

diff --git a/src/components/OrderSummary/OrderSummary.test.js b/src/components/OrderSummary/OrderSummary.test.js
@@ -23,7 +23,6 @@ const testFulfillmentGroup = {
         compareAtPrice: {
           displayAmount: "$45.00"
         },
-        currentQuantity: 3,
         imageURLs: {
           small: "//placehold.it/150",
           thumbnail: "//placehold.it/100"
@@ -40,7 +39,6 @@ const testFulfillmentGroup = {
       {
         _id: "456",
         attributes: [{ label: "Color", value: "Black" }, { label: "Size", value: "10" }],
-        currentQuantity: 500,
         imageURLs: {
           small: "//placehold.it/150",
           thumbnail: "//placehold.it/100"

diff --git a/src/components/ProductDetail/ProductDetail.test.js b/src/components/ProductDetail/ProductDetail.test.js
@@ -2,6 +2,8 @@ import React from "react";
 import renderer from "react-test-renderer";
 import { MuiThemeProvider } from "@material-ui/core/styles";
 import { Provider } from "mobx-react";
+import { ComponentsProvider } from "@reactioncommerce/components-context";
+import components from "custom/componentsContext";
 import theme from "custom/reactionTheme";
 import ProductDetail from "./ProductDetail";
 import sampleData from "./__mocks__/productData.mock";
@@ -43,11 +45,13 @@ const uiStore = {
 
 test("basic snapshot", () => {
   const component = renderer.create((
-    <MuiThemeProvider theme={theme}>
-      <Provider primaryShopId="J8Bhq3uTtdgwZx3rz" routingStore={routingStore} tags={tags} uiStore={uiStore}>
-        <ProductDetail product={sampleData} shop={shop} currencyCode={"USD"} />
-      </Provider>
-    </MuiThemeProvider>
+    <ComponentsProvider value={components}>
+      <MuiThemeProvider theme={theme}>
+        <Provider primaryShopId="J8Bhq3uTtdgwZx3rz" routingStore={routingStore} tags={tags} uiStore={uiStore}>
+          <ProductDetail product={sampleData} shop={shop} currencyCode={"USD"} />
+        </Provider>
+      </MuiThemeProvider>
+    </ComponentsProvider>
   ));
   const tree = component.toJSON();
   expect(tree).toMatchSnapshot();

diff --git a/src/components/ProductDetail/__mocks__/productData.mock.js b/src/components/ProductDetail/__mocks__/productData.mock.js
@@ -168,7 +168,6 @@ export default {
   ],
   media: [
     {
-      toGrid: 1,
       priority: 0,
       productId: "cmVhY3Rpb24vcHJvZHVjdDpCQ1RNWjZIVHhGU3BwSkVTaw==",
       variantId: "cmVhY3Rpb24vcHJvZHVjdDo2cWlxUHdCa2VKZHRkUWM0Rw==",
@@ -181,7 +180,6 @@ export default {
       }
     },
     {
-      toGrid: 1,
       priority: 0,
       productId: "cmVhY3Rpb24vcHJvZHVjdDpCQ1RNWjZIVHhGU3BwSkVTaw==",
       variantId: "cmVhY3Rpb24vcHJvZHVjdDo2cWlxUHdCa2VKZHRkUWM0Rw==",
@@ -194,7 +192,6 @@ export default {
       }
     },
     {
-      toGrid: 1,
       priority: 0,
       productId: "cmVhY3Rpb24vcHJvZHVjdDpCQ1RNWjZIVHhGU3BwSkVTaw==",
       variantId: "cmVhY3Rpb24vcHJvZHVjdDpTTXI0cmhERm5ZdkZNdERUWA==",
@@ -207,7 +204,6 @@ export default {
       }
     },
     {
-      toGrid: 1,
       priority: 0,
       productId: "cmVhY3Rpb24vcHJvZHVjdDpCQ1RNWjZIVHhGU3BwSkVTaw==",
       variantId: "cmVhY3Rpb24vcHJvZHVjdDpDSm9SQm05dlJyb3JjOW14Wg==",
@@ -220,7 +216,6 @@ export default {
       }
     },
     {
-      toGrid: 1,
       priority: 2,
       productId: "cmVhY3Rpb24vcHJvZHVjdDpCQ1RNWjZIVHhGU3BwSkVTaw==",
       variantId: "cmVhY3Rpb24vcHJvZHVjdDo2cWlxUHdCa2VKZHRkUWM0Rw==",
@@ -233,7 +228,6 @@ export default {
       }
     },
     {
-      toGrid: 1,
       priority: 3,
       productId: "cmVhY3Rpb24vcHJvZHVjdDpCQ1RNWjZIVHhGU3BwSkVTaw==",
       variantId: "cmVhY3Rpb24vcHJvZHVjdDo2cWlxUHdCa2VKZHRkUWM0Rw==",
@@ -246,7 +240,6 @@ export default {
       }
     },
     {
-      toGrid: 1,
       priority: 4,
       productId: "cmVhY3Rpb24vcHJvZHVjdDpCQ1RNWjZIVHhGU3BwSkVTaw==",
       variantId: "cmVhY3Rpb24vcHJvZHVjdDo2cWlxUHdCa2VKZHRkUWM0Rw==",
@@ -259,7 +252,6 @@ export default {
       }
     },
     {
-      toGrid: 1,
       priority: 5,
       productId: "cmVhY3Rpb24vcHJvZHVjdDpCQ1RNWjZIVHhGU3BwSkVTaw==",
       variantId: "cmVhY3Rpb24vcHJvZHVjdDo2cWlxUHdCa2VKZHRkUWM0Rw==",

diff --git a/src/components/ProductDetail/__snapshots__/ProductDetail.test.js.snap b/src/components/ProductDetail/__snapshots__/ProductDetail.test.js.snap
@@ -1,6 +1,20 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`basic snapshot 1`] = `
+.c7 {
+  width: 1.125em;
+  height: 1.125em;
+}
+
+.c2 {
+  position: relative;
+  opacity: 0.5;
+}
+
+.c3 {
+  position: relative;
+}
+
 .c5 {
   -webkit-font-smoothing: antialiased;
   -webkit-align-items: center;
@@ -68,15 +82,6 @@ exports[`basic snapshot 1`] = `
   fill: #ffffff;
 }
 
-.c2 {
-  position: relative;
-  opacity: 0.5;
-}
-
-.c3 {
-  position: relative;
-}
-
 .c4 {
   -webkit-font-smoothing: antialiased;
   color: #cd3f4c;
@@ -921,7 +926,37 @@ Details can be added below the image for more specific product information.
                     "width": 0,
                   }
                 }
-              />
+              >
+                <svg
+                  className="c7"
+                  height="40px"
+                  style={
+                    Object {
+                      "enableBackground": "new 0 0 50 50",
+                    }
+                  }
+                  version="1.1"
+                  viewBox="0 0 50 50"
+                  width="40px"
+                  x="0px"
+                  y="0px"
+                >
+                  <path
+                    d="M43.935,25.145c0-10.318-8.364-18.683-18.683-18.683c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615c8.072,0,14.615,6.543,14.615,14.615H43.935z"
+                    fill="#000"
+                  >
+                    <animateTransform
+                      attributeName="transform"
+                      attributeType="xml"
+                      dur="1s"
+                      from="0 25 25"
+                      repeatCount="indefinite"
+                      to="360 25 25"
+                      type="rotate"
+                    />
+                  </path>
+                </svg>
+              </div>
             </div>
           </div>
         </div>

diff --git a/src/components/ProductDetailAddToCart/ProductDetailAddToCart.js b/src/components/ProductDetailAddToCart/ProductDetailAddToCart.js
@@ -27,7 +27,6 @@ const cartItem = {
       value: "Summer"
     }
   ],
-  currentQuantity: 10,
   imageUrl: "//placehold.it/100",
   isLowInventoryQuantity: false,
   price: {

diff --git a/src/components/ProductGrid/__mocks__/products.mock.js b/src/components/ProductGrid/__mocks__/products.mock.js
@@ -13,7 +13,6 @@ export default [
         isSoldOut: true,
         isBackorder: false,
         primaryImage: {
-          toGrid: 1,
           priority: 0,
           productId: "cmVhY3Rpb24vcHJvZHVjdDpqbmE5NWthOWFOa015dG14aA==",
           URLs: {
@@ -57,7 +56,6 @@ export default [
         isSoldOut: false,
         isBackorder: false,
         primaryImage: {
-          toGrid: 1,
           priority: 0,
           productId: "cmVhY3Rpb24vcHJvZHVjdDpCQ1RNWjZIVHhGU3BwSkVTaw==",
           URLs: {