Merge branch 'v6.1.0' of github.com:shopgate/pwa into v6.X

shopgate · Feb 6, 2019 · 359c7ca · 359c7ca
2 parents 726d495 + caeaa8f
commit 359c7ca
Show file tree

Hide file tree

Showing 9 changed files with 1,040 additions and 709 deletions.
diff --git a/libraries/commerce/cart/constants/Portals.js b/libraries/commerce/cart/constants/Portals.js
@@ -5,6 +5,7 @@ const ITEM_LIST = 'item-list';
 const ITEM = 'item';
 const PAYMENT_BAR = 'payment-bar';
 const COUPON_FIELD = 'coupon-field';
+const CHECKOUT_BUTTON = 'checkout-button';
 
 const NAME = 'name';
 const IMAGE = 'image';
@@ -59,3 +60,7 @@ export const CART_PAYMENT_BAR_AFTER = `${CART}.${PAYMENT_BAR}.${AFTER}`;
 export const NAV_MENU_CART_BEFORE = `${NAV_MENU}.${CART}.${BEFORE}`;
 export const NAV_MENU_CART = `${NAV_MENU}.${CART}`;
 export const NAV_MENU_CART_AFTER = `${NAV_MENU}.${CART}.${AFTER}`;
+
+export const CART_CHECKOUT_BUTTON = `${CART}.${CHECKOUT_BUTTON}`;
+export const CART_CHECKOUT_BUTTON_BEFORE = `${CART}.${CHECKOUT_BUTTON}.${BEFORE}`;
+export const CART_CHECKOUT_BUTTON_AFTER = `${CART}.${CHECKOUT_BUTTON}.${AFTER}`;
diff --git a/themes/theme-gmd/pages/Cart/components/PaymentBar/__snapshots__/spec.jsx.snap b/themes/theme-gmd/pages/Cart/components/PaymentBar/__snapshots__/spec.jsx.snap
diff --git a/...nents/PaymentBar/components/Content/components/CheckoutButton/__snapshots__/spec.jsx.snap b/...nents/PaymentBar/components/Content/components/CheckoutButton/__snapshots__/spec.jsx.snap
@@ -19,80 +19,105 @@ exports[`<CheckoutButton /> Checkout is possible should render without any props
       <CheckoutButton
         isActive={false}
       >
-        <Connect(Link)
-          disabled={true}
-          href="/checkout"
+        <Portal
+          name="cart.checkout-button.before"
+          props={
+            Object {
+              "isActive": false,
+            }
+          }
+        />
+        <Portal
+          name="cart.checkout-button"
+          props={
+            Object {
+              "isActive": false,
+            }
+          }
         >
-          <Link
-            className=""
+          <Connect(Link)
             disabled={true}
-            historyPush={[Function]}
-            historyReplace={[Function]}
             href="/checkout"
-            replace={false}
-            state={Object {}}
-            tag="div"
           >
-            <div
-              className="css-c6ki83 "
-              data-test-id="link: /checkout"
-              onClick={[Function]}
-              role="link"
+            <Link
+              className=""
+              disabled={true}
+              historyPush={[Function]}
+              historyReplace={[Function]}
+              href="/checkout"
+              replace={false}
+              state={Object {}}
+              tag="div"
             >
-              <RippleButton
-                className="css-ce5yef"
-                disabled={true}
-                flat={false}
-                onClick={null}
-                rippleClassName=""
-                rippleSize={null}
-                testId="Button"
-                type="regular"
-                wrapContent={true}
+              <div
+                className="css-c6ki83 "
+                data-test-id="link: /checkout"
+                onClick={[Function]}
+                role="link"
               >
-                <Button
+                <RippleButton
                   className="css-ce5yef"
                   disabled={true}
                   flat={false}
                   onClick={null}
+                  rippleClassName=""
+                  rippleSize={null}
                   testId="Button"
                   type="regular"
                   wrapContent={true}
                 >
                   <Button
-                    className="css-4q16hk css-ce5yef"
+                    className="css-ce5yef"
                     disabled={true}
+                    flat={false}
                     onClick={null}
                     testId="Button"
+                    type="regular"
+                    wrapContent={true}
                   >
-                    <button
-                      className="css-4q16hk css-ce5yef css-1rn65c0"
-                      data-test-id="Button"
+                    <Button
+                      className="css-4q16hk css-ce5yef"
                       disabled={true}
                       onClick={null}
+                      testId="Button"
                     >
-                      <div
-                        className="css-kwqjom"
+                      <button
+                        className="css-4q16hk css-ce5yef css-1rn65c0"
+                        data-test-id="Button"
+                        disabled={true}
+                        onClick={null}
                       >
-                        <Translate
-                          className=""
-                          params={Object {}}
-                          string="cart.checkout"
+                        <div
+                          className="css-kwqjom"
                         >
-                          <span
+                          <Translate
                             className=""
+                            params={Object {}}
+                            string="cart.checkout"
                           >
-                            cart.checkout
-                          </span>
-                        </Translate>
-                      </div>
-                    </button>
+                            <span
+                              className=""
+                            >
+                              cart.checkout
+                            </span>
+                          </Translate>
+                        </div>
+                      </button>
+                    </Button>
                   </Button>
-                </Button>
-              </RippleButton>
-            </div>
-          </Link>
-        </Connect(Link)>
+                </RippleButton>
+              </div>
+            </Link>
+          </Connect(Link)>
+        </Portal>
+        <Portal
+          name="cart.checkout-button.after"
+          props={
+            Object {
+              "isActive": false,
+            }
+          }
+        />
       </CheckoutButton>
     </Component>
   </LoadingProvider>

diff --git a/...d/pages/Cart/components/PaymentBar/components/Content/components/CheckoutButton/index.jsx b/...d/pages/Cart/components/PaymentBar/components/Content/components/CheckoutButton/index.jsx
@@ -1,7 +1,13 @@
-import React from 'react';
+import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
 import I18n from '@shopgate/pwa-common/components/I18n';
 import Link from '@shopgate/pwa-common/components/Link';
+import Portal from '@shopgate/pwa-common/components/Portal';
+import {
+  CART_CHECKOUT_BUTTON,
+  CART_CHECKOUT_BUTTON_AFTER,
+  CART_CHECKOUT_BUTTON_BEFORE,
+} from '@shopgate/pwa-common-commerce/cart/constants/Portals';
 import { LoadingContext } from '@shopgate/pwa-common/providers/';
 import { CART_PATH } from '@shopgate/pwa-common-commerce/cart/constants';
 import RippleButton from '@shopgate/pwa-ui-shared/RippleButton';
@@ -15,15 +21,21 @@ import styles from './style';
  * @return {JSX}
  */
 const CheckoutButton = ({ isActive }) => (
-  <Link href={CHECKOUT_PATH} disabled={!isActive}>
-    <RippleButton
-      disabled={!isActive}
-      type="regular"
-      className={isActive ? styles.button : styles.disabledButton}
-    >
-      <I18n.Text string="cart.checkout" />
-    </RippleButton>
-  </Link>
+  <Fragment>
+    <Portal name={CART_CHECKOUT_BUTTON_BEFORE} props={{ isActive }} />
+    <Portal name={CART_CHECKOUT_BUTTON} props={{ isActive }} >
+      <Link href={CHECKOUT_PATH} disabled={!isActive}>
+        <RippleButton
+          disabled={!isActive}
+          type="regular"
+          className={isActive ? styles.button : styles.disabledButton}
+        >
+          <I18n.Text string="cart.checkout" />
+        </RippleButton>
+      </Link>
+    </Portal>
+    <Portal name={CART_CHECKOUT_BUTTON_AFTER} props={{ isActive }} />
+  </Fragment>
 );
 
 CheckoutButton.propTypes = {

diff --git a/themes/theme-gmd/pages/Search/components/Content/index.jsx b/themes/theme-gmd/pages/Search/components/Content/index.jsx
@@ -29,6 +29,7 @@ class SearchContent extends Component {
     return (
       (this.props.showNoResults !== nextProps.showNoResults)
       || (this.props.showFilterBar !== nextProps.showFilterBar)
+      || (this.props.searchPhrase !== nextProps.searchPhrase)
     );
   }