@sonic-equipment/ui 184.0.0 → 185.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (93) hide show
  1. package/dist/cards/data-card/data-card.js +37 -20
  2. package/dist/cards/data-card/data-card.module.css.js +1 -1
  3. package/dist/country-selector/country-selector-dialog/country-selector-dialog.js +1 -5
  4. package/dist/exports.d.ts +20 -2
  5. package/dist/forms/form/form.d.ts +7 -3
  6. package/dist/forms/form/form.js +2 -2
  7. package/dist/forms/password-validation/password-validation.d.ts +4 -0
  8. package/dist/forms/password-validation/password-validation.js +32 -0
  9. package/dist/forms/select/select.d.ts +2 -1
  10. package/dist/forms/select/select.js +2 -2
  11. package/dist/index.js +21 -3
  12. package/dist/intl/translation-id.d.ts +1 -1
  13. package/dist/intl/use-formatted-message.js +2 -1
  14. package/dist/lists/menu-list/menu-list.d.ts +2 -1
  15. package/dist/lists/menu-list/menu-list.js +2 -2
  16. package/dist/lists/widget-grid/widget-grid.d.ts +5 -0
  17. package/dist/lists/widget-grid/widget-grid.js +9 -0
  18. package/dist/lists/widget-grid/widget-grid.module.css.js +3 -0
  19. package/dist/lists/widget-grid/widget.d.ts +6 -0
  20. package/dist/lists/widget-grid/widget.js +10 -0
  21. package/dist/modals/dialog/dialog.d.ts +5 -5
  22. package/dist/modals/dialog/dialog.js +18 -18
  23. package/dist/modals/dialog/dialog.module.css.js +1 -1
  24. package/dist/modals/recover-password/recover-password-dialog.js +1 -3
  25. package/dist/pages/account/components/create-account-form/create-account-form.js +2 -17
  26. package/dist/pages/account/create-account-page/create-account-page.js +4 -5
  27. package/dist/pages/account/layouts/sign-in-page-layout/sign-in-page-layout.js +1 -1
  28. package/dist/pages/account/sign-in-page/sign-in-page.js +2 -3
  29. package/dist/pages/checkout/shipping-page/hooks/use-patch-shipping-details.d.ts +1 -0
  30. package/dist/pages/components/page-container/page-container.js +1 -1
  31. package/dist/pages/my-sonic/actions/change-customer/change-customer-dialog.d.ts +4 -3
  32. package/dist/pages/my-sonic/actions/change-customer/change-customer-dialog.js +10 -4
  33. package/dist/pages/my-sonic/actions/change-customer/change-customer.d.ts +5 -2
  34. package/dist/pages/my-sonic/actions/change-customer/change-customer.js +16 -7
  35. package/dist/pages/my-sonic/actions/change-customer/change-customer.module.css.js +1 -1
  36. package/dist/pages/my-sonic/actions/change-customer/connected-change-customer-dialog.d.ts +7 -2
  37. package/dist/pages/my-sonic/actions/change-customer/connected-change-customer-dialog.js +9 -6
  38. package/dist/pages/my-sonic/actions/change-password/change-password-dialog.d.ts +10 -0
  39. package/dist/pages/my-sonic/actions/change-password/change-password-dialog.js +24 -0
  40. package/dist/pages/my-sonic/actions/change-password/change-password.d.ts +7 -0
  41. package/dist/pages/my-sonic/actions/change-password/change-password.js +35 -0
  42. package/dist/pages/my-sonic/actions/change-password/change-password.module.css.js +3 -0
  43. package/dist/pages/my-sonic/actions/change-password/connected-change-password-dialog.d.ts +5 -0
  44. package/dist/pages/my-sonic/actions/change-password/connected-change-password-dialog.js +39 -0
  45. package/dist/pages/my-sonic/actions/edit-user-info/connected-edit-user-info-dialog.d.ts +5 -0
  46. package/dist/pages/my-sonic/actions/edit-user-info/connected-edit-user-info-dialog.js +56 -0
  47. package/dist/pages/my-sonic/actions/edit-user-info/edit-user-info-dialog.d.ts +10 -0
  48. package/dist/pages/my-sonic/actions/edit-user-info/edit-user-info-dialog.js +15 -0
  49. package/dist/pages/my-sonic/actions/edit-user-info/edit-user-info.d.ts +11 -0
  50. package/dist/pages/my-sonic/actions/edit-user-info/edit-user-info.js +29 -0
  51. package/dist/pages/my-sonic/actions/edit-user-info/edit-user-info.module.css.js +3 -0
  52. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-aside.d.ts +4 -0
  53. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-aside.js +9 -0
  54. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-main.d.ts +4 -0
  55. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-main.js +9 -0
  56. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-page.d.ts +5 -0
  57. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-page.js +10 -0
  58. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-pre-aside.d.ts +4 -0
  59. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-pre-aside.js +9 -0
  60. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-title.d.ts +4 -0
  61. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-title.js +10 -0
  62. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout.d.ts +5 -0
  63. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout.js +10 -0
  64. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout.module.css.js +3 -0
  65. package/dist/pages/my-sonic/navigation/connected-my-sonic-navigation.js +3 -4
  66. package/dist/pages/my-sonic/navigation/connected-my-sonic-navigation.module.css.js +3 -0
  67. package/dist/pages/my-sonic/navigation/my-sonic-desktop-navigation.d.ts +2 -1
  68. package/dist/pages/my-sonic/navigation/my-sonic-desktop-navigation.js +2 -2
  69. package/dist/pages/my-sonic/navigation/my-sonic-mobile-navigation.d.ts +2 -1
  70. package/dist/pages/my-sonic/navigation/my-sonic-mobile-navigation.js +2 -2
  71. package/dist/pages/my-sonic/widgets/connected-customer-information-widget.js +3 -3
  72. package/dist/pages/my-sonic/widgets/connected-user-account-widget.js +16 -5
  73. package/dist/shared/api/shared/hooks/use-awaitable-mutation.d.ts +1 -0
  74. package/dist/shared/api/shared/hooks/use-awaitable-mutation.js +6 -0
  75. package/dist/shared/api/storefront/hooks/{authentication → account}/use-create-account.d.ts +1 -1
  76. package/dist/shared/api/storefront/hooks/{authentication → account}/use-create-account.js +3 -1
  77. package/dist/shared/api/storefront/hooks/{authentication → account}/use-create-guest-account.js +3 -1
  78. package/dist/shared/api/storefront/hooks/account/use-fetch-current-account.d.ts +3 -0
  79. package/dist/shared/api/storefront/hooks/account/use-fetch-current-account.js +13 -0
  80. package/dist/shared/api/storefront/hooks/account/use-patch-current-account.d.ts +11 -0
  81. package/dist/shared/api/storefront/hooks/account/use-patch-current-account.js +20 -0
  82. package/dist/shared/api/storefront/hooks/authentication/use-patch-session.d.ts +1 -0
  83. package/dist/shared/api/storefront/hooks/authentication/use-patch-session.js +1 -1
  84. package/dist/shared/api/storefront/hooks/cart/use-patch-cart.d.ts +1 -0
  85. package/dist/shared/api/storefront/hooks/cart/use-place-order.d.ts +1 -0
  86. package/dist/shared/api/storefront/hooks/customer/use-patch-bill-to-address.d.ts +1 -0
  87. package/dist/shared/api/storefront/services/account-service.d.ts +31 -0
  88. package/dist/shared/api/storefront/services/account-service.js +84 -0
  89. package/dist/shared/api/storefront/services/authentication-service.d.ts +7 -26
  90. package/dist/shared/api/storefront/services/authentication-service.js +38 -65
  91. package/dist/styles.css +351 -240
  92. package/package.json +1 -1
  93. /package/dist/shared/api/storefront/hooks/{authentication → account}/use-create-guest-account.d.ts +0 -0
@@ -0,0 +1,29 @@
1
+ "use client";
2
+ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
3
+ import { TextField } from '../../../../forms/text-field/text-field.js';
4
+ import { useFormattedMessage } from '../../../../intl/use-formatted-message.js';
5
+ import { ProgressCircle } from '../../../../loading/progress-circle.js';
6
+ import { Message } from '../../../../message/message.js';
7
+ import { UnauthorizedRequestError } from '../../../../shared/fetch/request.js';
8
+ import { validateEmail } from '../../../../shared/model/address.js';
9
+ import styles from './edit-user-info.module.css.js';
10
+
11
+ function EditUserInfo({ account, error, isLoading = false, }) {
12
+ const t = useFormattedMessage();
13
+ if (error instanceof UnauthorizedRequestError) {
14
+ return (jsx(Message, { type: "danger", children: t('You are not authorized to perform this action') }));
15
+ }
16
+ if (isLoading) {
17
+ return (jsx("div", { className: styles['loading-panel'], children: jsx(ProgressCircle, { variant: "gray" }) }));
18
+ }
19
+ if (!account) {
20
+ return jsx(Message, { type: "danger", children: t('An unexpected error occured') });
21
+ }
22
+ return (jsxs(Fragment, { children: [jsx(TextField, { autoComplete: "username", "data-test-selector": "email", defaultValue: account.email, inputMode: "email", isRequired: true, label: t('Email'), name: "email", type: "email", validate: value => {
23
+ if (!value)
24
+ return value;
25
+ return validateEmail(value) || t('Please enter a valid email address');
26
+ } }), jsx(TextField, { "data-test-selector": "firstName", defaultValue: account.firstName, isRequired: true, label: t('First name'), name: "firstName" }), jsx(TextField, { "data-test-selector": "lastName", defaultValue: account.lastName, isRequired: true, label: t('Last name'), name: "lastName" }), error && (jsx(Message, { className: styles['error-message'], type: "danger", children: t('An unexpected error occured') }))] }));
27
+ }
28
+
29
+ export { EditUserInfo };
@@ -0,0 +1,3 @@
1
+ var styles = {"loading-panel":"edit-user-info-module-yQOre","error-message":"edit-user-info-module-2CzVn"};
2
+
3
+ export { styles as default };
@@ -0,0 +1,4 @@
1
+ import { ReactNode } from 'react';
2
+ export declare function MySonicLayoutAside({ children }: {
3
+ children?: ReactNode;
4
+ }): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,9 @@
1
+ "use client";
2
+ import { jsx } from 'react/jsx-runtime';
3
+ import styles from './my-sonic-layout.module.css.js';
4
+
5
+ function MySonicLayoutAside({ children }) {
6
+ return jsx("aside", { className: styles.aside, children: children });
7
+ }
8
+
9
+ export { MySonicLayoutAside };
@@ -0,0 +1,4 @@
1
+ import { ReactNode } from 'react';
2
+ export declare function MySonicLayoutMain({ children }: {
3
+ children?: ReactNode;
4
+ }): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,9 @@
1
+ "use client";
2
+ import { jsx } from 'react/jsx-runtime';
3
+ import styles from './my-sonic-layout.module.css.js';
4
+
5
+ function MySonicLayoutMain({ children }) {
6
+ return jsx("main", { className: styles.main, children: children });
7
+ }
8
+
9
+ export { MySonicLayoutMain };
@@ -0,0 +1,5 @@
1
+ import { ReactNode } from 'react';
2
+ export declare function MySonicLayoutPage({ children, title, }: {
3
+ children?: ReactNode;
4
+ title: string;
5
+ }): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,10 @@
1
+ "use client";
2
+ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
3
+ import { MySonicLayoutMain } from './my-sonic-layout-main.js';
4
+ import { MySonicLayoutTitle } from './my-sonic-layout-title.js';
5
+
6
+ function MySonicLayoutPage({ children, title, }) {
7
+ return (jsxs(Fragment, { children: [jsx(MySonicLayoutTitle, { children: title }), jsx(MySonicLayoutMain, { children: children })] }));
8
+ }
9
+
10
+ export { MySonicLayoutPage };
@@ -0,0 +1,4 @@
1
+ import { ReactNode } from 'react';
2
+ export declare function MySonicLayoutPreAside({ children }: {
3
+ children?: ReactNode;
4
+ }): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,9 @@
1
+ "use client";
2
+ import { jsx } from 'react/jsx-runtime';
3
+ import styles from './my-sonic-layout.module.css.js';
4
+
5
+ function MySonicLayoutPreAside({ children }) {
6
+ return jsx("div", { className: styles['pre-aside'], children: children });
7
+ }
8
+
9
+ export { MySonicLayoutPreAside };
@@ -0,0 +1,4 @@
1
+ import { ReactNode } from 'react';
2
+ export declare function MySonicLayoutTitle({ children }: {
3
+ children?: ReactNode;
4
+ }): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,10 @@
1
+ "use client";
2
+ import { jsx } from 'react/jsx-runtime';
3
+ import { Heading } from '../../../../typography/heading/heading.js';
4
+ import styles from './my-sonic-layout.module.css.js';
5
+
6
+ function MySonicLayoutTitle({ children }) {
7
+ return (jsx(Heading, { italic: true, breakpoints: { lg: 'm' }, className: styles['title'], "data-test-selector": "pageTitle", size: "s", tag: "h1", children: children }));
8
+ }
9
+
10
+ export { MySonicLayoutTitle };
@@ -0,0 +1,5 @@
1
+ import { ReactNode } from 'react';
2
+ export interface MySonicLayoutProps {
3
+ children: ReactNode;
4
+ }
5
+ export declare function MySonicLayout({ children }: MySonicLayoutProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,10 @@
1
+ "use client";
2
+ import { jsx } from 'react/jsx-runtime';
3
+ import clsx from 'clsx';
4
+ import styles from './my-sonic-layout.module.css.js';
5
+
6
+ function MySonicLayout({ children }) {
7
+ return jsx("div", { className: clsx(styles['my-sonic-layout']), children: children });
8
+ }
9
+
10
+ export { MySonicLayout };
@@ -0,0 +1,3 @@
1
+ var styles = {"my-sonic-layout":"my-sonic-layout-module-ep0n3","title":"my-sonic-layout-module-yMdPQ","main":"my-sonic-layout-module-f0Bhf","pre-aside":"my-sonic-layout-module-6pWHC","aside":"my-sonic-layout-module--OEV-"};
2
+
3
+ export { styles as default };
@@ -1,17 +1,16 @@
1
1
  "use client";
2
- import { jsx } from 'react/jsx-runtime';
2
+ import { jsxs, jsx } from 'react/jsx-runtime';
3
3
  import Cookies from 'js-cookie';
4
4
  import { logger } from '../../../logging/logger.js';
5
5
  import { useSignOut } from '../../../shared/api/storefront/hooks/authentication/use-sign-out.js';
6
- import { useIsBreakpoint } from '../../../shared/hooks/use-is-breakpoint.js';
7
6
  import { useLocation } from '../../../shared/routing/use-location.js';
8
7
  import { useNavigate } from '../../../shared/routing/use-navigate.js';
9
8
  import { PATHS } from '../../paths.js';
10
9
  import { MySonicDesktopNavigation } from './my-sonic-desktop-navigation.js';
11
10
  import { MySonicMobileNavigation } from './my-sonic-mobile-navigation.js';
11
+ import styles from './connected-my-sonic-navigation.module.css.js';
12
12
 
13
13
  function ConnectedMySonicNavigation() {
14
- const isXl = useIsBreakpoint('xl');
15
14
  const { pathname } = useLocation();
16
15
  const { navigate } = useNavigate();
17
16
  const { mutate } = useSignOut({
@@ -22,7 +21,7 @@ function ConnectedMySonicNavigation() {
22
21
  navigate(PATHS.HOME, { reload: true });
23
22
  },
24
23
  });
25
- return (jsx("div", { style: { display: 'grid' }, children: isXl ? (jsx(MySonicDesktopNavigation, { currentPath: pathname, onLogout: mutate })) : (jsx(MySonicMobileNavigation, { currentPath: pathname, onLogout: mutate })) }));
24
+ return (jsxs("div", { style: { display: 'grid' }, children: [jsx(MySonicDesktopNavigation, { className: styles['large'], currentPath: pathname, onLogout: mutate }), jsx(MySonicMobileNavigation, { className: styles['small'], currentPath: pathname, onLogout: mutate })] }));
26
25
  }
27
26
 
28
27
  export { ConnectedMySonicNavigation };
@@ -0,0 +1,3 @@
1
+ var styles = {"small":"connected-my-sonic-navigation-module-2iY0-","large":"connected-my-sonic-navigation-module-MgsX2"};
2
+
3
+ export { styles as default };
@@ -1,6 +1,7 @@
1
1
  interface MySonicDesktopNavigationProps {
2
+ className?: string;
2
3
  currentPath?: string;
3
4
  onLogout?: VoidFunction;
4
5
  }
5
- export declare function MySonicDesktopNavigation({ currentPath, onLogout, }: MySonicDesktopNavigationProps): import("react/jsx-runtime").JSX.Element;
6
+ export declare function MySonicDesktopNavigation({ className, currentPath, onLogout, }: MySonicDesktopNavigationProps): import("react/jsx-runtime").JSX.Element;
6
7
  export {};
@@ -5,8 +5,8 @@ import { MenuListItem } from '../../../lists/menu-list/menu-list-item.js';
5
5
  import { mySonicNavigationItems } from './my-sonic-navigation-items.js';
6
6
  import styles from './my-sonic-desktop-navigation.module.css.js';
7
7
 
8
- function MySonicDesktopNavigation({ currentPath, onLogout, }) {
9
- return (jsx(MenuList, { children: mySonicNavigationItems.map(item => (jsx(MenuListItem, { hasChildren: true, badge: jsx(item.Icon, {}), ...(item.type === 'action'
8
+ function MySonicDesktopNavigation({ className, currentPath, onLogout, }) {
9
+ return (jsx(MenuList, { className: className, children: mySonicNavigationItems.map(item => (jsx(MenuListItem, { hasChildren: true, badge: jsx(item.Icon, {}), ...(item.type === 'action'
10
10
  ? item.action === 'logout'
11
11
  ? { onClick: onLogout }
12
12
  : {}
@@ -1,4 +1,5 @@
1
- export declare function MySonicMobileNavigation({ currentPath, onLogout, }: {
1
+ export declare function MySonicMobileNavigation({ className, currentPath, onLogout, }: {
2
+ className?: string;
2
3
  currentPath?: string;
3
4
  onLogout: () => void;
4
5
  }): import("react/jsx-runtime").JSX.Element;
@@ -5,10 +5,10 @@ import { useFormattedMessage } from '../../../intl/use-formatted-message.js';
5
5
  import { useNavigate } from '../../../shared/routing/use-navigate.js';
6
6
  import { mySonicNavigationItems } from './my-sonic-navigation-items.js';
7
7
 
8
- function MySonicMobileNavigation({ currentPath, onLogout, }) {
8
+ function MySonicMobileNavigation({ className, currentPath, onLogout, }) {
9
9
  const { navigate } = useNavigate();
10
10
  const t = useFormattedMessage();
11
- return (jsx(Select, { label: t('Navigate to...'), onChange: option => {
11
+ return (jsx(Select, { className: className, label: t('Navigate to...'), onChange: option => {
12
12
  if (option === 'logout')
13
13
  return onLogout();
14
14
  return navigate(option);
@@ -12,7 +12,7 @@ function ConnectedCustomerInformationWidget() {
12
12
  const [isOpenChangeCustomerDialog, setIsOpenChangeCustomerDialog] = useState(false);
13
13
  const { data: billToAddress, error: fetchBillToAddressError, isLoading: isLoadingFetchCurrentBillToAddress, } = useFetchCurrentBillToAddress();
14
14
  const { data: billToAddresses, error: fetchBillToAddressesError, isLoading: isLoadingFetchBillToAddresses, } = useFetchBillToAddresses();
15
- const hasBillToAddresses = Boolean(billToAddresses?.pagination?.totalItemCount);
15
+ const hasMoreThanOneBillToAddress = Boolean((billToAddresses?.pagination?.totalItemCount || 0) > 1);
16
16
  const data = billToAddress
17
17
  ? [
18
18
  {
@@ -45,11 +45,11 @@ function ConnectedCustomerInformationWidget() {
45
45
  function onChangeCustomer() {
46
46
  setIsOpenChangeCustomerDialog(true);
47
47
  }
48
- return (jsxs(Fragment, { children: [jsx(DataCard, { actions: hasBillToAddresses
48
+ return (jsxs(Fragment, { children: [jsx(DataCard, { actions: hasMoreThanOneBillToAddress
49
49
  ? [
50
50
  jsx(Button, { color: "secondary", onClick: onChangeCustomer, size: "sm", variant: "outline", children: jsx(FormattedMessage, { id: "Select other customer" }) }, "edit"),
51
51
  ]
52
- : undefined, data: data, "data-test-selector": "customer-information-widget", isLoading: isLoadingFetchCurrentBillToAddress || isLoadingFetchBillToAddresses, showError: fetchBillToAddressError || fetchBillToAddressesError, title: "Selected customer" }), hasBillToAddresses && (jsx(ConnectedChangeCustomerDialog, { isOpen: isOpenChangeCustomerDialog, onClose: () => setIsOpenChangeCustomerDialog(false), onCustomerSelected: () => {
52
+ : undefined, data: data, "data-test-selector": "customer-information-widget", isLoading: isLoadingFetchCurrentBillToAddress || isLoadingFetchBillToAddresses, showError: fetchBillToAddressError || fetchBillToAddressesError, title: "Selected customer" }), hasMoreThanOneBillToAddress && (jsx(ConnectedChangeCustomerDialog, { allowSetDefault: true, isOpen: isOpenChangeCustomerDialog, onClose: () => setIsOpenChangeCustomerDialog(false), onCustomerSelected: () => {
53
53
  window?.location.reload();
54
54
  } }, billToAddress?.id))] }));
55
55
  }
@@ -1,11 +1,16 @@
1
1
  "use client";
2
- import { jsx } from 'react/jsx-runtime';
2
+ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
3
+ import { useState } from 'react';
3
4
  import { Button } from '../../../buttons/button/button.js';
4
5
  import { DataCard } from '../../../cards/data-card/data-card.js';
5
6
  import { FormattedMessage } from '../../../intl/formatted-message.js';
6
7
  import { useFetchSession } from '../../../shared/api/storefront/hooks/authentication/use-fetch-session.js';
8
+ import { ConnectedChangePasswordDialog } from '../actions/change-password/connected-change-password-dialog.js';
9
+ import { ConnectedEditUserInfoDialog } from '../actions/edit-user-info/connected-edit-user-info-dialog.js';
7
10
 
8
11
  function ConnectedUserAccountWidget() {
12
+ const [isOpenEditUserInfoDialog, setIsOpenEditUserInfoDialog] = useState(false);
13
+ const [isOpenChangePasswordDialog, setIsOpenChangePasswordDialog] = useState(false);
9
14
  const { data: session, error, isLoading } = useFetchSession();
10
15
  const data = session
11
16
  ? [
@@ -24,10 +29,16 @@ function ConnectedUserAccountWidget() {
24
29
  },
25
30
  ]
26
31
  : [];
27
- return (jsx(DataCard, { actions: [
28
- jsx(Button, { isDisabled: true, color: "secondary", size: "sm", variant: "outline", children: jsx(FormattedMessage, { id: "Edit" }) }, "edit"),
29
- jsx(Button, { isDisabled: true, color: "secondary", size: "sm", variant: "outline", children: jsx(FormattedMessage, { id: "Change password" }) }, "change-pasword"),
30
- ], data: data, "data-test-selector": "user-account-widget", isLoading: isLoading, showError: error, title: "Sonic account" }));
32
+ function onEditUserInfo() {
33
+ setIsOpenEditUserInfoDialog(true);
34
+ }
35
+ function onChangePassword() {
36
+ setIsOpenChangePasswordDialog(true);
37
+ }
38
+ return (jsxs(Fragment, { children: [jsx(DataCard, { actions: [
39
+ jsx(Button, { color: "secondary", onClick: onEditUserInfo, size: "sm", variant: "outline", children: jsx(FormattedMessage, { id: "Edit" }) }, "edit"),
40
+ jsx(Button, { color: "secondary", onClick: onChangePassword, size: "sm", variant: "outline", children: jsx(FormattedMessage, { id: "Change password" }) }, "change-pasword"),
41
+ ], data: data, "data-test-selector": "user-account-widget", isLoading: isLoading, showError: error, title: "Sonic account" }), isOpenEditUserInfoDialog && (jsx(ConnectedEditUserInfoDialog, { isOpen: isOpenEditUserInfoDialog, onClose: () => setIsOpenEditUserInfoDialog(false) })), isOpenChangePasswordDialog && (jsx(ConnectedChangePasswordDialog, { isOpen: isOpenChangePasswordDialog, onClose: () => setIsOpenChangePasswordDialog(false) }))] }));
31
42
  }
32
43
 
33
44
  export { ConnectedUserAccountWidget };
@@ -27,4 +27,5 @@ export declare function useAwaitableMutation<T extends (...args: any) => Promise
27
27
  isLoading: boolean;
28
28
  isSuccess: boolean;
29
29
  mutate: (...args: Parameters<T>) => Promise<TResult>;
30
+ reset: () => void;
30
31
  };
@@ -7,6 +7,11 @@ function useAwaitableMutation({ mutationFn, onComplete, onError, onSuccess, }) {
7
7
  const [isLoading, setIsLoading] = useState(false);
8
8
  const [isSuccess, setIsSuccess] = useState(false);
9
9
  const [error, setError] = useState();
10
+ const reset = useCallback(() => {
11
+ setIsLoading(false);
12
+ setIsSuccess(false);
13
+ setError(undefined);
14
+ }, []);
10
15
  const mutate = useCallback(async (...args) => {
11
16
  let result;
12
17
  let error;
@@ -35,6 +40,7 @@ function useAwaitableMutation({ mutationFn, onComplete, onError, onSuccess, }) {
35
40
  isLoading,
36
41
  isSuccess,
37
42
  mutate,
43
+ reset,
38
44
  };
39
45
  }
40
46
 
@@ -1,3 +1,3 @@
1
1
  import { AccountModel } from 'shared/api/storefront/model/storefront.model';
2
- import { CreateAccountRequestBody } from 'shared/api/storefront/services/authentication-service';
2
+ import { CreateAccountRequestBody } from 'shared/api/storefront/services/account-service';
3
3
  export declare function useCreateAccount(): import("@tanstack/react-query").UseMutationResult<AccountModel, Error, CreateAccountRequestBody, unknown>;
@@ -1,5 +1,7 @@
1
+ "use client";
1
2
  import { useQueryClient, useMutation } from '@tanstack/react-query';
2
- import { createAccount, createSession } from '../../services/authentication-service.js';
3
+ import { createAccount } from '../../services/account-service.js';
4
+ import { createSession } from '../../services/authentication-service.js';
3
5
 
4
6
  function useCreateAccount() {
5
7
  const queryClient = useQueryClient();
@@ -1,5 +1,7 @@
1
+ "use client";
1
2
  import { useQueryClient, useMutation } from '@tanstack/react-query';
2
- import { fetchSession, createGuestAccount, createSession } from '../../services/authentication-service.js';
3
+ import { createGuestAccount } from '../../services/account-service.js';
4
+ import { fetchSession, createSession } from '../../services/authentication-service.js';
3
5
 
4
6
  function useCreateGuestAccount() {
5
7
  const queryClient = useQueryClient();
@@ -0,0 +1,3 @@
1
+ export declare function useFetchCurrentAccount({ isEnabled, }?: {
2
+ isEnabled?: boolean;
3
+ }): import("@tanstack/react-query").UseQueryResult<import("../../model/storefront.model").AccountModel, Error>;
@@ -0,0 +1,13 @@
1
+ "use client";
2
+ import { useQuery } from '@tanstack/react-query';
3
+ import { fetchCurrentAccount } from '../../services/account-service.js';
4
+
5
+ function useFetchCurrentAccount({ isEnabled = true, } = {}) {
6
+ return useQuery({
7
+ enabled: isEnabled,
8
+ queryFn: fetchCurrentAccount,
9
+ queryKey: ['account', 'current'],
10
+ });
11
+ }
12
+
13
+ export { useFetchCurrentAccount };
@@ -0,0 +1,11 @@
1
+ import { AccountModel } from '../../model/storefront.model';
2
+ export declare function usePatchCurrentAccount(): {
3
+ error: unknown;
4
+ isError: boolean;
5
+ isLoading: boolean;
6
+ isSuccess: boolean;
7
+ mutate: (args_0: {
8
+ account: Partial<AccountModel>;
9
+ }) => Promise<AccountModel>;
10
+ reset: () => void;
11
+ };
@@ -0,0 +1,20 @@
1
+ "use client";
2
+ import { useQueryClient } from '@tanstack/react-query';
3
+ import { useAwaitableMutation } from '../../../shared/hooks/use-awaitable-mutation.js';
4
+ import { patchCurrentAccount } from '../../services/account-service.js';
5
+
6
+ function usePatchCurrentAccount() {
7
+ const queryClient = useQueryClient();
8
+ return useAwaitableMutation({
9
+ mutationFn: async ({ account }) => {
10
+ const updatedAccount = await patchCurrentAccount({ account });
11
+ /* Completely clear out the client side cache.
12
+ * By patching the account also the session and
13
+ * cart are potentially invalid/changed */
14
+ queryClient.clear();
15
+ return updatedAccount;
16
+ },
17
+ });
18
+ }
19
+
20
+ export { usePatchCurrentAccount };
@@ -15,4 +15,5 @@ export declare function usePatchSession(): {
15
15
  shipToId?: string | null;
16
16
  }>;
17
17
  }) => Promise<import("../../model/storefront.model").SessionModel>;
18
+ reset: () => void;
18
19
  };
@@ -7,7 +7,7 @@ function usePatchSession() {
7
7
  return useAwaitableMutation({
8
8
  mutationFn: async ({ session }) => {
9
9
  const updatedSession = await patchSession({ session });
10
- queryClient.setQueriesData({ exact: true, queryKey: ['session'] }, updatedSession);
10
+ queryClient.clear();
11
11
  return updatedSession;
12
12
  },
13
13
  });
@@ -7,4 +7,5 @@ export declare function usePatchCart(): {
7
7
  cart: import("../../model/storefront.model").PatchCartModel;
8
8
  forceRecalculation?: boolean;
9
9
  }) => Promise<import("../../model/storefront.model").CartModel>;
10
+ reset: () => void;
10
11
  };
@@ -7,4 +7,5 @@ export declare const usePlaceOrder: () => {
7
7
  cart: import("../../model/storefront.model").PatchCartModel;
8
8
  isPending?: boolean;
9
9
  }) => Promise<import("../../model/storefront.model").CartModel>;
10
+ reset: () => void;
10
11
  };
@@ -8,4 +8,5 @@ export declare function usePatchBillToAddress({ skipInvalidation, }?: {
8
8
  mutate: (args_0: {
9
9
  billTo: import("../../model/storefront.model").PatchBillToModel;
10
10
  }) => Promise<import("../../model/storefront.model").BillToModel>;
11
+ reset: () => void;
11
12
  };
@@ -0,0 +1,31 @@
1
+ import { RequestError } from '../../../fetch/request';
2
+ import { AccountModel } from '../model/storefront.model';
3
+ export declare function fetchCurrentAccount(): Promise<AccountModel>;
4
+ export declare class ExistingAccountError extends RequestError {
5
+ constructor(error: Error);
6
+ }
7
+ export interface CreateAccountRequestBase {
8
+ email: string;
9
+ firstName?: string;
10
+ isSubscribed: boolean;
11
+ lastName: string;
12
+ password: string;
13
+ }
14
+ export interface CreatePrivateAccountRequestBody extends CreateAccountRequestBase {
15
+ companyName?: string | undefined;
16
+ countryCode: string;
17
+ isPrivateAccount: true;
18
+ }
19
+ export interface CreateBusinessAccountRequestBody extends CreateAccountRequestBase {
20
+ companyName: string;
21
+ countryCode: string;
22
+ isPrivateAccount: false;
23
+ }
24
+ export type CreateAccountRequestBody = CreatePrivateAccountRequestBody | CreateBusinessAccountRequestBody;
25
+ export declare function createAccount({ companyName, countryCode, email, firstName, isPrivateAccount, isSubscribed, lastName, password, }: CreateAccountRequestBody): Promise<AccountModel>;
26
+ export declare function createGuestAccount({ defaultWarehouseId, }: {
27
+ defaultWarehouseId: string;
28
+ }): Promise<AccountModel>;
29
+ export declare function patchCurrentAccount({ account, }: {
30
+ account: Partial<AccountModel>;
31
+ }): Promise<AccountModel>;
@@ -0,0 +1,84 @@
1
+ import { config } from '../../../../config.js';
2
+ import { request, RequestError, isRequestError } from '../../../fetch/request.js';
3
+
4
+ async function fetchCurrentAccount() {
5
+ const { body } = await request({
6
+ url: `${config.SHOP_API_URL}/api/v1/accounts/current`,
7
+ });
8
+ return body;
9
+ }
10
+ class ExistingAccountError extends RequestError {
11
+ constructor(error) {
12
+ super(error);
13
+ this.name = 'ExistingAccountError';
14
+ }
15
+ }
16
+ async function createAccount({ companyName, countryCode, email, firstName, isPrivateAccount, isSubscribed, lastName, password, }) {
17
+ try {
18
+ const { body } = await request({
19
+ body: {
20
+ email,
21
+ firstName,
22
+ isSubscribed,
23
+ lastName,
24
+ password,
25
+ properties: {
26
+ PrivateAccount: isPrivateAccount,
27
+ companyName,
28
+ countryCode,
29
+ },
30
+ userName: '',
31
+ },
32
+ headers: {
33
+ 'Content-Type': 'application/json',
34
+ },
35
+ method: 'POST',
36
+ url: `${config.SHOP_API_URL}/api/v1/accounts`,
37
+ });
38
+ return body;
39
+ }
40
+ catch (error) {
41
+ if (isRequestError(error) &&
42
+ error.status === 400 &&
43
+ error.body?.message === 'Email Address already exists')
44
+ throw new ExistingAccountError(error);
45
+ throw error;
46
+ }
47
+ }
48
+ async function createGuestAccount({ defaultWarehouseId, }) {
49
+ const { body } = await request({
50
+ body: {
51
+ defaultFulfillmentMethod: 'Ship',
52
+ defaultWarehouseId,
53
+ isGuest: true,
54
+ },
55
+ headers: {
56
+ 'Content-Type': 'application/json',
57
+ },
58
+ method: 'POST',
59
+ url: `${config.SHOP_API_URL}/api/v1/accounts`,
60
+ });
61
+ return body;
62
+ }
63
+ async function patchCurrentAccount({ account, }) {
64
+ try {
65
+ const { body } = await request({
66
+ body: account,
67
+ headers: {
68
+ 'Content-Type': 'application/json',
69
+ },
70
+ method: 'PATCH',
71
+ url: `${config.SHOP_API_URL}/api/v1/accounts/current`,
72
+ });
73
+ return body;
74
+ }
75
+ catch (error) {
76
+ if (isRequestError(error) &&
77
+ error.status === 400 &&
78
+ error.body?.message === 'Email Address already exists')
79
+ throw new ExistingAccountError(error);
80
+ throw error;
81
+ }
82
+ }
83
+
84
+ export { ExistingAccountError, createAccount, createGuestAccount, fetchCurrentAccount, patchCurrentAccount };
@@ -1,6 +1,12 @@
1
1
  import { RequestError } from '../../../fetch/request';
2
- import { AccountModel, PatchSessionModel, SessionModel } from '../model/storefront.model';
2
+ import { PatchSessionModel, SessionModel } from '../model/storefront.model';
3
3
  export declare function fetchSession(): Promise<SessionModel>;
4
+ export declare class InvalidPasswordError extends Error {
5
+ constructor(error: RequestError);
6
+ }
7
+ export declare class NonUniquePasswordError extends Error {
8
+ constructor(error: RequestError);
9
+ }
4
10
  export declare function patchSession({ session, }: {
5
11
  session: PatchSessionModel;
6
12
  }): Promise<SessionModel>;
@@ -26,31 +32,6 @@ export declare function createSession({ accessToken, isGuest, keepMeSignedIn, pa
26
32
  accessToken: string;
27
33
  } & CreateSessionRequestBody): Promise<SessionModel>;
28
34
  export declare function signOut(): Promise<void>;
29
- export declare function createGuestAccount({ defaultWarehouseId, }: {
30
- defaultWarehouseId: string;
31
- }): Promise<AccountModel>;
32
35
  export declare function recoverPassword({ userName, }: {
33
36
  userName: string;
34
37
  }): Promise<SessionModel>;
35
- export declare class ExistingAccountError extends RequestError {
36
- constructor(error: Error);
37
- }
38
- export interface CreateAccountRequestBase {
39
- email: string;
40
- firstName?: string;
41
- isSubscribed: boolean;
42
- lastName: string;
43
- password: string;
44
- }
45
- export interface CreatePrivateAccountRequestBody extends CreateAccountRequestBase {
46
- companyName?: string | undefined;
47
- countryCode: string;
48
- isPrivateAccount: true;
49
- }
50
- export interface CreateBusinessAccountRequestBody extends CreateAccountRequestBase {
51
- companyName: string;
52
- countryCode: string;
53
- isPrivateAccount: false;
54
- }
55
- export type CreateAccountRequestBody = CreatePrivateAccountRequestBody | CreateBusinessAccountRequestBody;
56
- export declare function createAccount({ companyName, countryCode, email, firstName, isPrivateAccount, isSubscribed, lastName, password, }: CreateAccountRequestBody): Promise<AccountModel>;