@sonic-equipment/ui 259.0.3 → 259.0.5

package/dist/header/header.js

@@ -73,7 +73,7 @@ function Header({ className, headerNavigationSection, sticky, }) {
     const mainNavigationSection = headerNavigationSection?.items
         .filter(isNavigationSection)
         .find(item => item.key === 'main-navigation');
-    return (jsxs(Fragment, { children: [jsx("header", { ref: headerRef, className: clsx(styles['header'], sticky && styles['sticky'], className), "data-test-selector": "pageHeader", children: jsx(HeaderLayout, { hamburgerButton: jsx(HamburgerButton, { "aria-controls": "mobile-navigation", "data-test-selector": "pageHeaderHamburgerButton", isActive: mobileNavigationOpen, onActiveChange: toggleMobileNavigation }), hasDrawersOpen: hasDrawersOpen, logo: jsx(SonicLogo, { "data-test-selector": "pageHeaderLogo", href: homeLink?.href || undefined, title: t('Home') }), mainNavigation: jsx(NavigationLinkList, { activeLink: activeLinkGroup, "data-test-selector": "pageHeaderMainNavigation", navigationSection: mainNavigationSection, onSubmenuToggle: toggleActiveSubmenu }), navigationActions: jsxs(Fragment, { children: [jsx(ConnectedAccountButton, { "data-test-selector": "pageHeaderAccountButton" }), jsx(ConnectedFavoritesButton, { "data-test-selector": "pageHeaderFavoritesButton", href: "abc" }), jsx(ConnectedCartButton, { "data-test-selector": "pageHeaderCartButton", href: paths.CART })] }), search: jsx(SearchButton, { "aria-controls": "global-search", "data-test-selector": "pageHeaderSearchButton", isActive: searchOpen, onActiveChange: toggleSearch }) }) }), jsx(SearchDrawer, { groupId: searchGroupId, instanceId: searchInstanceId }), !isXl && (jsx(MobileNavigationDrawer, { groupId: mobileNavigationDrawer.groupId, instanceId: mobileNavigationDrawer.instanceId, linkItems: mainNavigationSection?.items.filter(isNavigationLinkItem) })), isXl && (jsx(DesktopNavigationDrawer, { groupId: desktopNavigationDrawer.groupId, instanceId: desktopNavigationDrawer.instanceId, linkGroup: activeLinkGroup, onClosed: () => setActiveLinkGroup(undefined) }))] }));
+    return (jsxs(Fragment, { children: [jsx("header", { ref: headerRef, className: clsx(styles['header'], sticky && styles['sticky'], className), "data-test-selector": "pageHeader", children: jsx(HeaderLayout, { hamburgerButton: jsx(HamburgerButton, { "aria-controls": "mobile-navigation", "data-test-selector": "pageHeaderHamburgerButton", isActive: mobileNavigationOpen, onActiveChange: toggleMobileNavigation }), hasDrawersOpen: hasDrawersOpen, logo: jsx(SonicLogo, { "data-test-selector": "pageHeaderLogo", href: homeLink?.href || undefined, title: t('Home') }), mainNavigation: jsx(NavigationLinkList, { activeLink: activeLinkGroup, "data-test-selector": "pageHeaderMainNavigation", navigationSection: mainNavigationSection, onSubmenuToggle: toggleActiveSubmenu }), navigationActions: jsxs(Fragment, { children: [jsx(ConnectedAccountButton, { "data-test-selector": "pageHeaderAccountButton" }), jsx(ConnectedFavoritesButton, { "data-test-selector": "pageHeaderFavoritesButton", href: paths.FAVORITES }), jsx(ConnectedCartButton, { "data-test-selector": "pageHeaderCartButton", href: paths.CART })] }), search: jsx(SearchButton, { "aria-controls": "global-search", "data-test-selector": "pageHeaderSearchButton", isActive: searchOpen, onActiveChange: toggleSearch }) }) }), jsx(SearchDrawer, { groupId: searchGroupId, instanceId: searchInstanceId }), !isXl && (jsx(MobileNavigationDrawer, { groupId: mobileNavigationDrawer.groupId, instanceId: mobileNavigationDrawer.instanceId, linkItems: mainNavigationSection?.items.filter(isNavigationLinkItem) })), isXl && (jsx(DesktopNavigationDrawer, { groupId: desktopNavigationDrawer.groupId, instanceId: desktopNavigationDrawer.instanceId, linkGroup: activeLinkGroup, onClosed: () => setActiveLinkGroup(undefined) }))] }));
 }
 
 export { Header };

package/dist/pages/checkout/shipping-page/shipping-page.js

@@ -82,7 +82,7 @@ function ShippingPage() {
     }, [cart, createEcommerceEvent, dataLayer]);
     if (errorFetchCart)
         return jsx(ErrorPage, { error: errorFetchCart });
-    if (isLoading || isNavigating || isError || isSuccess)
+    if (isLoading || isNavigating || isSuccess)
         return jsx(LoadingPage, {});
     if (hasNoBillToAddress && !countries)
         throw new Error('Countries are missing');
@@ -97,29 +97,35 @@ function ShippingPage() {
     async function handleSubmit({ address, cart, notes, }) {
         if (!cart.billTo)
             throw new Error('No billTo address found');
-        await patchShippingDetails({
-            billTo: {
-                ...cart.billTo,
-                address1: address.address1,
-                address2: address.address2,
-                address3: address.address3,
-                attention: address.attention,
-                city: address.city,
-                companyName: address.companyName,
-                country: { id: address.country.id },
-                email: address.email,
-                firstName: address.firstName,
-                lastName: address.lastName,
-                phone: address.phone,
-                postalCode: address.postalCode,
-            },
-            cart,
-            notes,
-        });
-        dataLayer.push(createEcommerceEvent({
-            cart,
-            event: { event: 'add_shipping_info' },
-        }));
+        try {
+            await patchShippingDetails({
+                billTo: {
+                    ...cart.billTo,
+                    address1: address.address1,
+                    address2: address.address2,
+                    address3: address.address3,
+                    attention: address.attention,
+                    city: address.city,
+                    companyName: address.companyName,
+                    country: { id: address.country.id },
+                    email: address.email,
+                    firstName: address.firstName,
+                    lastName: address.lastName,
+                    phone: address.phone,
+                    postalCode: address.postalCode,
+                },
+                cart,
+                notes,
+            });
+            dataLayer.push(createEcommerceEvent({
+                cart,
+                event: { event: 'add_shipping_info' },
+            }));
+        }
+        catch {
+            // Error is tracked by usePatchShippingDetails via isError/error state,
+            // surfaced to the UI via errorPatchBillingAddress
+        }
     }
     return (jsx(ShippingPageContent, { cart: cart, 
         // TODO: Combine editAddress and readOnlyAddress into one section in order
@@ -157,28 +163,34 @@ function ShippingPage() {
         }, readOnlyAddress: jsx(ReadOnlyAddresses, { billTo: cart.billTo, cartId: cart.id, countries: countries || [], currentCountry: currentCountry, isLoading: isPatching, isPickup: isPickup, notes: cart.notes, onSubmit: async ({ cart: updatedCart, notes, shipTo }) => {
                 if (!cart.billTo)
                     return;
-                if (notes ||
-                    cart.shipTo === null ||
-                    (shipTo && shipTo.id !== cart.shipTo?.id) ||
-                    (updatedCart &&
-                        (updatedCart.shipTo?.id !== cart.shipTo?.id ||
-                            updatedCart.shipTo === null))) {
-                    await patchShippingDetails({
-                        cart: {
-                            ...cart,
-                            ...updatedCart,
-                        },
-                        notes,
-                        shipTo,
-                    });
+                try {
+                    if (notes ||
+                        cart.shipTo === null ||
+                        (shipTo && shipTo.id !== cart.shipTo?.id) ||
+                        (updatedCart &&
+                            (updatedCart.shipTo?.id !== cart.shipTo?.id ||
+                                updatedCart.shipTo === null))) {
+                        await patchShippingDetails({
+                            cart: {
+                                ...cart,
+                                ...updatedCart,
+                            },
+                            notes,
+                            shipTo,
+                        });
+                    }
+                    else {
+                        navigate(paths.REVIEW_AND_SUBMIT);
+                    }
+                    dataLayer.push(createEcommerceEvent({
+                        cart,
+                        event: { event: 'add_shipping_info' },
+                    }));
                 }
-                else {
-                    navigate(paths.REVIEW_AND_SUBMIT);
+                catch {
+                    // Error is tracked by usePatchShippingDetails via isError/error state,
+                    // surfaced to the UI via errorPatchBillingAddress
                 }
-                dataLayer.push(createEcommerceEvent({
-                    cart,
-                    event: { event: 'add_shipping_info' },
-                }));
             }, shipTo: cart.shipTo }) }));
 }
 

package/dist/shared/error/default-error-view.js

@@ -6,12 +6,15 @@ import { Details } from '../../display/details/details.js';
 import { StrokeRecentIcon } from '../../icons/stroke/stroke-recent-icon.js';
 import { useFormattedMessage } from '../../intl/use-formatted-message.js';
 import { Heading } from '../../typography/heading/heading.js';
+import { isRequestError } from '../fetch/request.js';
 import { isProductionEnvironment } from '../utils/environment.js';
 import styles from './default-error-view.module.css.js';
 
 function DefaultErrorView({ className, error, errorInfo, resetError, resetLabel, showErrorDetails = !isProductionEnvironment, showReset, title, }) {
     const t = useFormattedMessage();
-    return (jsxs("section", { className: clsx(styles['default-error-view'], className), children: [title && (jsx(Heading, { className: styles['title'], size: "s", tag: "h1", children: title || t('Something went wrong') })), jsx("p", { children: error.message || t('An unexpected error occured. Please try again.') }), showErrorDetails && (jsxs(Details, { className: styles['error-details'], lang: "en", summary: "Technical Details (only visible in development mode)", children: [jsx("output", { className: styles['error-kind'], children: error.toString() }), error.stack && (jsxs("div", { className: styles['error-info'], children: [jsx(Heading, { className: styles['error-info-title'], size: "xs", tag: "h2", children: "Stack:" }), jsx("pre", { className: styles['error-info-data'], children: error.stack })] })), errorInfo?.componentStack && (jsxs("div", { className: styles['component-info'], children: [jsx(Heading, { className: styles['error-info-title'], size: "xs", tag: "h2", children: "Component stack:" }), jsx("pre", { className: styles['error-info-data'], children: errorInfo.componentStack })] }))] })), showReset && resetError && (jsx(Button, { light: true, className: styles['reset-button'], color: "secondary", icon: jsx(StrokeRecentIcon, {}), onClick: resetError, size: "sm", type: "button", variant: "outline", children: resetLabel || t('Reset') }))] }));
+    return (jsxs("section", { className: clsx(styles['default-error-view'], className), children: [title && (jsx(Heading, { className: styles['title'], size: "s", tag: "h1", children: title || t('Something went wrong') })), jsx("p", { children: !isRequestError(error) && error.message
+                    ? error.message
+                    : t('An unexpected error occured. Please try again.') }), showErrorDetails && (jsxs(Details, { className: styles['error-details'], lang: "en", summary: "Technical Details (only visible in development mode)", children: [jsx("output", { className: styles['error-kind'], children: error.toString() }), error.stack && (jsxs("div", { className: styles['error-info'], children: [jsx(Heading, { className: styles['error-info-title'], size: "xs", tag: "h2", children: "Stack:" }), jsx("pre", { className: styles['error-info-data'], children: error.stack })] })), errorInfo?.componentStack && (jsxs("div", { className: styles['component-info'], children: [jsx(Heading, { className: styles['error-info-title'], size: "xs", tag: "h2", children: "Component stack:" }), jsx("pre", { className: styles['error-info-data'], children: errorInfo.componentStack })] }))] })), showReset && resetError && (jsx(Button, { light: true, className: styles['reset-button'], color: "secondary", icon: jsx(StrokeRecentIcon, {}), onClick: resetError, size: "sm", type: "button", variant: "outline", children: resetLabel || t('Reset') }))] }));
 }
 
 export { DefaultErrorView };

package/dist/shared/fetch/request.js

@@ -68,6 +68,19 @@ class RequestError extends Error {
         this.options = options?.options;
         // eslint-disable-next-line unicorn/custom-error-definition
         this.name = this.name || this.constructor.name || 'RequestError';
+        // Replace the non-serializable Response cause with a plain object so error
+        // reporting tools (e.g. Sentry) can capture full request/response context.
+        this.cause = {
+            request: {
+                method: this.options?.method ?? 'GET',
+                url: this.options?.url,
+            },
+            response: {
+                body: this.body,
+                status: this.status,
+                statusText: this.statusText,
+            },
+        };
     }
     toJSON() {
         return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sonic-equipment/ui",
-  "version": "259.0.3",
+  "version": "259.0.5",
   "type": "module",
   "license": "MIT",
   "engines": {