Merge branch 'develop' into PWA-3162-V3

magento · Oct 17, 2023 · 78552e8 · 78552e8
2 parents 6497374 + 76fbf76
commit 78552e8
Show file tree

Hide file tree

Showing 51 changed files with 391 additions and 143 deletions.
diff --git a/packages/pagebuilder/lib/ContentTypes/Row/__tests__/row.spec.js b/packages/pagebuilder/lib/ContentTypes/Row/__tests__/row.spec.js
@@ -38,12 +38,7 @@ test('render row with parallax initializes Jarallax', () => {
         }
     });
 
-    expect(mockJarallax).toHaveBeenCalledWith(true, {
-        speed: 0.75,
-        imgPosition: 'center center',
-        imgRepeat: 'repeat',
-        imgSize: 'cover'
-    });
+    expect(mockJarallax).toHaveBeenCalledWith(true, 'destroy');
 });
 
 test('render row with parallax initializes JarallaxVideo', () => {
@@ -99,15 +94,7 @@ test('row unmount causes Jarallax to be destroyed', () => {
     });
 
     expect(mockJarallax.mock.calls).toEqual([
-        [
-            true,
-            {
-                speed: 0.75,
-                imgPosition: 'top left',
-                imgRepeat: 'no-repeat',
-                imgSize: 'contain'
-            }
-        ],
+        [true, 'destroy'],
         [true, 'destroy']
     ]);
 });

diff --git a/packages/pagebuilder/lib/ContentTypes/Row/row.js b/packages/pagebuilder/lib/ContentTypes/Row/row.js
@@ -160,12 +160,7 @@ const Row = props => {
         if (enableParallax && bgImageStyle && backgroundType !== 'video') {
             ({ jarallax } = require('jarallax'));
             parallaxElement = backgroundElement.current;
-            jarallax(parallaxElement, {
-                speed: parallaxSpeed,
-                imgSize: backgroundSize,
-                imgPosition: backgroundPosition,
-                imgRepeat: backgroundRepeat
-            });
+            jarallax(parallaxElement, 'destroy');
         }
 
         if (backgroundType === 'video') {

diff --git a/packages/peregrine/lib/talons/CheckoutPage/BillingAddress/useBillingAddress.js b/packages/peregrine/lib/talons/CheckoutPage/BillingAddress/useBillingAddress.js
@@ -178,10 +178,13 @@ export const useBillingAddress = props => {
      * shipping address.
      */
     const setShippingAddressAsBillingAddress = useCallback(() => {
-        const shippingAddress = shippingAddressData
+        var shippingAddress = shippingAddressData
             ? mapAddressData(shippingAddressData.cart.shippingAddresses[0])
             : {};
 
+        shippingAddress.region =
+            shippingAddress.region == null ? '' : shippingAddress.region;
+
         updateBillingAddress({
             variables: {
                 cartId,

diff --git a/...ages/peregrine/lib/talons/CheckoutPage/PaymentInformation/__tests__/useCreditCard.spec.js b/...ages/peregrine/lib/talons/CheckoutPage/PaymentInformation/__tests__/useCreditCard.spec.js
@@ -1095,6 +1095,7 @@ describe('missing data', () => {
             Object {
               "variables": Object {
                 "cartId": "123",
+                "region": "",
                 "sameAsShipping": true,
               },
             }

diff --git a/packages/peregrine/lib/talons/CheckoutPage/PaymentInformation/useCreditCard.js b/packages/peregrine/lib/talons/CheckoutPage/PaymentInformation/useCreditCard.js
@@ -234,10 +234,13 @@ export const useCreditCard = props => {
      * shipping address.
      */
     const setShippingAddressAsBillingAddress = useCallback(() => {
-        const shippingAddress = shippingAddressData
+        var shippingAddress = shippingAddressData
             ? mapAddressData(shippingAddressData.cart.shippingAddresses[0])
             : {};
 
+        shippingAddress.region =
+            shippingAddress.region == null ? '' : shippingAddress.region;
+
         updateBillingAddress({
             variables: {
                 cartId,

diff --git a/packages/peregrine/lib/talons/CheckoutPage/ShippingInformation/AddressForm/useGuestForm.js b/packages/peregrine/lib/talons/CheckoutPage/ShippingInformation/AddressForm/useGuestForm.js
@@ -70,17 +70,15 @@ export const useGuestForm = props => {
                             ...address,
                             // Cleans up the street array when values are null or undefined
                             street: address.street.filter(e => e),
-                            // region_id is used for field select and region is used for field input
-                            region: region.region_id || region.region,
-                            country_code: country
+                            country_code: country,
+                            region: region.region_id || region.region
                         }
                     }
                 });
                 dispatchEvent();
             } catch {
                 return;
             }
-
             if (afterSubmit) {
                 afterSubmit();
             }

diff --git a/packages/peregrine/lib/talons/Header/cartTriggerFragments.gql.js b/packages/peregrine/lib/talons/Header/cartTriggerFragments.gql.js
@@ -4,5 +4,6 @@ export const CartTriggerFragment = gql`
     fragment CartTriggerFragment on Cart {
         id
         total_quantity
+        total_summary_quantity_including_config
     }
 `;
diff --git a/packages/peregrine/lib/talons/Header/useCartTrigger.js b/packages/peregrine/lib/talons/Header/useCartTrigger.js
@@ -52,7 +52,7 @@ export const useCartTrigger = props => {
         errorPolicy: 'all'
     });
 
-    const itemCount = data?.cart?.total_quantity || 0;
+    const itemCount = data?.cart?.total_summary_quantity_including_config || 0;
 
     const handleTriggerClick = useCallback(() => {
         // Open the mini cart.

diff --git a/packages/peregrine/lib/talons/ProductFullDetail/productFullDetail.gql.ce.js b/packages/peregrine/lib/talons/ProductFullDetail/productFullDetail.gql.ce.js
@@ -11,6 +11,10 @@ export const ADD_PRODUCT_TO_CART = gql`
                 ...CartTriggerFragment
                 ...MiniCartFragment
             }
+            user_errors {
+                code
+                message
+            }
         }
     }
     ${CartTriggerFragment}

diff --git a/packages/peregrine/lib/talons/ProductFullDetail/useProductFullDetail.js b/packages/peregrine/lib/talons/ProductFullDetail/useProductFullDetail.js
@@ -289,7 +289,11 @@ export const useProductFullDetail = props => {
 
     const [
         addProductToCart,
-        { error: errorAddingProductToCart, loading: isAddProductLoading }
+        {
+            data: addToCartResponseData,
+            error: errorAddingProductToCart,
+            loading: isAddProductLoading
+        }
     ] = useMutation(operations.addProductToCartMutation);
 
     const breadcrumbCategoryId = useMemo(
@@ -556,12 +560,14 @@ export const useProductFullDetail = props => {
             deriveErrorMessage([
                 errorAddingSimpleProduct,
                 errorAddingConfigurableProduct,
-                errorAddingProductToCart
+                errorAddingProductToCart,
+                ...(addToCartResponseData?.addProductsToCart?.user_errors || [])
             ]),
         [
             errorAddingConfigurableProduct,
             errorAddingProductToCart,
-            errorAddingSimpleProduct
+            errorAddingSimpleProduct,
+            addToCartResponseData
         ]
     );
 

diff --git a/packages/peregrine/lib/talons/RootComponents/Category/useCategory.js b/packages/peregrine/lib/talons/RootComponents/Category/useCategory.js
@@ -100,10 +100,7 @@ export const useCategory = props => {
         called: introspectionCalled,
         data: introspectionData,
         loading: introspectionLoading
-    } = useQuery(getFilterInputsQuery, {
-        fetchPolicy: 'cache-and-network',
-        nextFetchPolicy: 'cache-first'
-    });
+    } = useQuery(getFilterInputsQuery);
 
     // Create a type map we can reference later to ensure we pass valid args
     // to the graphql query.

diff --git a/packages/peregrine/lib/talons/SearchPage/__tests__/__snapshots__/useSearchPage.spec.js.snap b/packages/peregrine/lib/talons/SearchPage/__tests__/__snapshots__/useSearchPage.spec.js.snap
@@ -2,12 +2,7 @@
 
 exports[`searchCategory returns the correct shape 1`] = `
 Object {
-  "availableSortMethods": Array [
-    Object {
-      "label": "Position",
-      "value": "position",
-    },
-  ],
+  "availableSortMethods": undefined,
   "currentStoreName": "Store 1",
   "data": Object {
     "products": Object {

diff --git a/packages/peregrine/lib/talons/SearchPage/searchPage.gql.js b/packages/peregrine/lib/talons/SearchPage/searchPage.gql.js
@@ -27,6 +27,16 @@ export const GET_PRODUCT_FILTERS_BY_SEARCH = gql`
     }
 `;
 
+export const GET_SEARCH_TERM_DATA = gql`
+    query getSearchTermData($search: String) {
+        searchTerm(Search: $search) {
+            query_text
+            redirect
+            popularity
+        }
+    }
+`;
+
 export const PRODUCT_SEARCH = gql`
     query ProductSearch(
         $currentPage: Int = 1
@@ -106,6 +116,7 @@ export const GET_SEARCH_AVAILABLE_SORT_METHODS = gql`
 export default {
     getFilterInputsQuery: GET_FILTER_INPUTS,
     getPageSize: GET_PAGE_SIZE,
+    getSearchTermData: GET_SEARCH_TERM_DATA,
     getProductFiltersBySearchQuery: GET_PRODUCT_FILTERS_BY_SEARCH,
     getSearchAvailableSortMethods: GET_SEARCH_AVAILABLE_SORT_METHODS,
     productSearchQuery: PRODUCT_SEARCH

diff --git a/packages/peregrine/lib/talons/SearchPage/useSearchPage.js b/packages/peregrine/lib/talons/SearchPage/useSearchPage.js
@@ -26,6 +26,7 @@ export const useSearchPage = (props = {}) => {
     const {
         getFilterInputsQuery,
         getPageSize,
+        getSearchTermData,
         getProductFiltersBySearchQuery,
         getSearchAvailableSortMethods,
         productSearchQuery
@@ -36,6 +37,18 @@ export const useSearchPage = (props = {}) => {
         nextFetchPolicy: 'cache-first'
     });
 
+    const [getSearchTermMethod, { data: SearchTermQueryData }] = useLazyQuery(
+        getSearchTermData
+    );
+
+    if (SearchTermQueryData !== undefined) {
+        const [...redirectData] = [SearchTermQueryData];
+        const redirectUrl = redirectData[0].searchTerm?.redirect;
+        if (redirectUrl !== null) {
+            window.location.replace(redirectUrl);
+        }
+    }
+
     const [getSortMethods, { data: sortData }] = useLazyQuery(
         getSearchAvailableSortMethods,
         {
@@ -231,6 +244,16 @@ export const useSearchPage = (props = {}) => {
         };
     }, [data, setTotalPages]);
 
+    useEffect(() => {
+        if (inputText) {
+            getSearchTermMethod({
+                variables: {
+                    search: inputText
+                }
+            });
+        }
+    }, [inputText, getSearchTermMethod]);
+
     useEffect(() => {
         if (inputText) {
             getSortMethods({
@@ -273,7 +296,7 @@ export const useSearchPage = (props = {}) => {
     useScrollTopOnChange(currentPage);
 
     const availableSortMethods = sortData
-        ? sortData.products.sort_fields.options
+        ? sortData.products.sort_fields?.options
         : null;
 
     return {

diff --git a/packages/peregrine/lib/talons/SignIn/__tests__/useSignIn.spec.js b/packages/peregrine/lib/talons/SignIn/__tests__/useSignIn.spec.js
@@ -89,7 +89,8 @@ const initialProps = {
     getCartDetailsQuery: 'getCartDetailsQuery',
     setDefaultUsername: jest.fn(),
     showCreateAccount: jest.fn(),
-    showForgotPassword: jest.fn()
+    showForgotPassword: jest.fn(),
+    handleTriggerClick: jest.fn()
 };
 
 const clearCacheData = jest.fn();

diff --git a/packages/peregrine/lib/talons/SignIn/useSignIn.js b/packages/peregrine/lib/talons/SignIn/useSignIn.js
@@ -13,6 +13,7 @@ import { useEventingContext } from '../../context/eventing';
 
 export const useSignIn = props => {
     const {
+        handleTriggerClick,
         getCartDetailsQuery,
         setDefaultUsername,
         showCreateAccount,
@@ -66,6 +67,7 @@ export const useSignIn = props => {
     const handleSubmit = useCallback(
         async ({ email, password }) => {
             setIsSigningIn(true);
+            handleTriggerClick();
             try {
                 // Get source cart id (guest cart id).
                 const sourceCartId = cartId;
@@ -142,7 +144,8 @@ export const useSignIn = props => {
             fetchUserDetails,
             getCartDetails,
             fetchCartDetails,
-            dispatch
+            dispatch,
+            handleTriggerClick
         ]
     );
 

diff --git a/packages/venia-ui/i18n/en_US.json b/packages/venia-ui/i18n/en_US.json
@@ -27,6 +27,7 @@
     "addressBookPage.addressBookText": "Address Book",
     "addressBookPage.editDialogTitle": "Edit Address",
     "addressBookPage.makeDefaultAddress": "Make this my default address",
+    "addressBookPage.addAddressMessage": "You have added {count} address in your address book.",
     "addressBookPage.telephone": "Phone {telephone}",
     "addressCard.defaultText": "Default",
     "addToCartButton.addItemToCart": "ADD TO CART",
@@ -309,6 +310,7 @@
     "orderHistoryPage.loadMore": "Load More",
     "orderHistoryPage.pageInfo": "Showing {current} of {total}",
     "orderHistoryPage.pageTitleText": "Order History",
+    "orderHistoryPage.ordersCount": "You have {count} orders in your history",
     "orderHistoryPage.search": "Search by Order Number",
     "orderItems.itemsHeading": "Items",
     "orderProgressBar.deliveredText": "Delivered",
@@ -393,6 +395,7 @@
     "savedPaymentsPage.addButtonText": "Add a credit card",
     "savedPaymentsPage.creditCard.errorRemoving": "Something went wrong deleting this payment method. Please refresh and try again.",
     "savedPaymentsPage.noSavedPayments": "You have no saved payments.",
+    "savedPaymentsPage.Message": "You have {count} saved payments.",
     "savedPaymentsPage.title": "Saved Payments",
     "searchBar.heading": "Product Suggestions",
     "searchBar.label": " in {label}",
@@ -480,6 +483,7 @@
     "wishlistPage.headingText": "{count, plural, one {Favorites List} other {Favorites Lists}}",
     "wishlistPage.wishlistDisabledMessage": "The wishlist is not currently available.",
     "wishlist.itemCountOpen": "Showing {currentCount} of {count} items in this list",
+    "wishlist.itemsMessage": "You have {count} items in your wishlist",
     "wishlist.itemCountClosed": "You have {count} {count, plural, one {item} other {items}} in this list",
     "wishlist.loadMore": "Load More",
     "LegacyMiniCart.buttonExpanded":"More Options Expanded",

diff --git a/...ages/venia-ui/lib/components/AccountChip/__tests__/__snapshots__/accountChip.spec.js.snap b/...ages/venia-ui/lib/components/AccountChip/__tests__/__snapshots__/accountChip.spec.js.snap
@@ -31,7 +31,7 @@ exports[`it renders a loading indicator when appropriate 1`] = `
   </span>
   <span
     aria-atomic="true"
-    aria-label="Toggle My Account Menu"
+    aria-label="Hiundefined"
     aria-live="polite"
     className="text"
   >

diff --git a/packages/venia-ui/lib/components/AccountChip/accountChip.js b/packages/venia-ui/lib/components/AccountChip/accountChip.js
@@ -35,10 +35,13 @@ const AccountChip = props => {
     const classes = useStyle(defaultClasses, props.classes);
     const { formatMessage } = useIntl();
 
-    const ariaLabelMyMenu = formatMessage({
-        id: 'accountTrigger.ariaLabelMyMenu',
-        defaultMessage: 'Toggle My Account Menu'
-    });
+    const ariaLabelMyMenu =
+        currentUser != null
+            ? formatMessage({
+                  id: 'Hi' + currentUser.firstname,
+                  defaultMessage: 'Hi' + currentUser.firstname
+              })
+            : '';
 
     const ariaLabel = isUserSignedIn ? ariaLabelMyMenu : '';
 

diff --git a/...onents/AccountInformationPage/__tests__/__snapshots__/accountInformationPage.spec.js.snap b/...onents/AccountInformationPage/__tests__/__snapshots__/accountInformationPage.spec.js.snap
@@ -5,15 +5,15 @@ exports[`renders form error 1`] = `
   className="root"
 >
   Account Information
-  <h1
+  <div
     aria-live="polite"
     className="title"
   >
     <mock-FormattedMessage
       defaultMessage="Account Information"
       id="accountInformationPage.accountInformation"
     />
-  </h1>
+  </div>
   <p
     className="root"
   >

diff --git a/packages/venia-ui/lib/components/AccountInformationPage/accountInformationPage.js b/packages/venia-ui/lib/components/AccountInformationPage/accountInformationPage.js
@@ -126,7 +126,7 @@ const AccountInformationPage = props => {
                     defaultMessage: 'Account Information'
                 })}
             </StoreTitle>
-            <h1
+            <div
                 aria-live="polite"
                 className={classes.title}
                 data-cy="AccountInformationPage-title"
@@ -135,7 +135,7 @@ const AccountInformationPage = props => {
                     id={'accountInformationPage.accountInformation'}
                     defaultMessage={'Account Information'}
                 />
-            </h1>
+            </div>
             {errorMessage ? errorMessage : pageContent}
         </div>
     );