@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.
- package/dist/cards/data-card/data-card.js +37 -20
- package/dist/cards/data-card/data-card.module.css.js +1 -1
- package/dist/country-selector/country-selector-dialog/country-selector-dialog.js +1 -5
- package/dist/exports.d.ts +20 -2
- package/dist/forms/form/form.d.ts +7 -3
- package/dist/forms/form/form.js +2 -2
- package/dist/forms/password-validation/password-validation.d.ts +4 -0
- package/dist/forms/password-validation/password-validation.js +32 -0
- package/dist/forms/select/select.d.ts +2 -1
- package/dist/forms/select/select.js +2 -2
- package/dist/index.js +21 -3
- package/dist/intl/translation-id.d.ts +1 -1
- package/dist/intl/use-formatted-message.js +2 -1
- package/dist/lists/menu-list/menu-list.d.ts +2 -1
- package/dist/lists/menu-list/menu-list.js +2 -2
- package/dist/lists/widget-grid/widget-grid.d.ts +5 -0
- package/dist/lists/widget-grid/widget-grid.js +9 -0
- package/dist/lists/widget-grid/widget-grid.module.css.js +3 -0
- package/dist/lists/widget-grid/widget.d.ts +6 -0
- package/dist/lists/widget-grid/widget.js +10 -0
- package/dist/modals/dialog/dialog.d.ts +5 -5
- package/dist/modals/dialog/dialog.js +18 -18
- package/dist/modals/dialog/dialog.module.css.js +1 -1
- package/dist/modals/recover-password/recover-password-dialog.js +1 -3
- package/dist/pages/account/components/create-account-form/create-account-form.js +2 -17
- package/dist/pages/account/create-account-page/create-account-page.js +4 -5
- package/dist/pages/account/layouts/sign-in-page-layout/sign-in-page-layout.js +1 -1
- package/dist/pages/account/sign-in-page/sign-in-page.js +2 -3
- package/dist/pages/checkout/shipping-page/hooks/use-patch-shipping-details.d.ts +1 -0
- package/dist/pages/components/page-container/page-container.js +1 -1
- package/dist/pages/my-sonic/actions/change-customer/change-customer-dialog.d.ts +4 -3
- package/dist/pages/my-sonic/actions/change-customer/change-customer-dialog.js +10 -4
- package/dist/pages/my-sonic/actions/change-customer/change-customer.d.ts +5 -2
- package/dist/pages/my-sonic/actions/change-customer/change-customer.js +16 -7
- package/dist/pages/my-sonic/actions/change-customer/change-customer.module.css.js +1 -1
- package/dist/pages/my-sonic/actions/change-customer/connected-change-customer-dialog.d.ts +7 -2
- package/dist/pages/my-sonic/actions/change-customer/connected-change-customer-dialog.js +9 -6
- package/dist/pages/my-sonic/actions/change-password/change-password-dialog.d.ts +10 -0
- package/dist/pages/my-sonic/actions/change-password/change-password-dialog.js +24 -0
- package/dist/pages/my-sonic/actions/change-password/change-password.d.ts +7 -0
- package/dist/pages/my-sonic/actions/change-password/change-password.js +35 -0
- package/dist/pages/my-sonic/actions/change-password/change-password.module.css.js +3 -0
- package/dist/pages/my-sonic/actions/change-password/connected-change-password-dialog.d.ts +5 -0
- package/dist/pages/my-sonic/actions/change-password/connected-change-password-dialog.js +39 -0
- package/dist/pages/my-sonic/actions/edit-user-info/connected-edit-user-info-dialog.d.ts +5 -0
- package/dist/pages/my-sonic/actions/edit-user-info/connected-edit-user-info-dialog.js +56 -0
- package/dist/pages/my-sonic/actions/edit-user-info/edit-user-info-dialog.d.ts +10 -0
- package/dist/pages/my-sonic/actions/edit-user-info/edit-user-info-dialog.js +15 -0
- package/dist/pages/my-sonic/actions/edit-user-info/edit-user-info.d.ts +11 -0
- package/dist/pages/my-sonic/actions/edit-user-info/edit-user-info.js +29 -0
- package/dist/pages/my-sonic/actions/edit-user-info/edit-user-info.module.css.js +3 -0
- package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-aside.d.ts +4 -0
- package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-aside.js +9 -0
- package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-main.d.ts +4 -0
- package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-main.js +9 -0
- package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-page.d.ts +5 -0
- package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-page.js +10 -0
- package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-pre-aside.d.ts +4 -0
- package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-pre-aside.js +9 -0
- package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-title.d.ts +4 -0
- package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-title.js +10 -0
- package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout.d.ts +5 -0
- package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout.js +10 -0
- package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout.module.css.js +3 -0
- package/dist/pages/my-sonic/navigation/connected-my-sonic-navigation.js +3 -4
- package/dist/pages/my-sonic/navigation/connected-my-sonic-navigation.module.css.js +3 -0
- package/dist/pages/my-sonic/navigation/my-sonic-desktop-navigation.d.ts +2 -1
- package/dist/pages/my-sonic/navigation/my-sonic-desktop-navigation.js +2 -2
- package/dist/pages/my-sonic/navigation/my-sonic-mobile-navigation.d.ts +2 -1
- package/dist/pages/my-sonic/navigation/my-sonic-mobile-navigation.js +2 -2
- package/dist/pages/my-sonic/widgets/connected-customer-information-widget.js +3 -3
- package/dist/pages/my-sonic/widgets/connected-user-account-widget.js +16 -5
- package/dist/shared/api/shared/hooks/use-awaitable-mutation.d.ts +1 -0
- package/dist/shared/api/shared/hooks/use-awaitable-mutation.js +6 -0
- package/dist/shared/api/storefront/hooks/{authentication → account}/use-create-account.d.ts +1 -1
- package/dist/shared/api/storefront/hooks/{authentication → account}/use-create-account.js +3 -1
- package/dist/shared/api/storefront/hooks/{authentication → account}/use-create-guest-account.js +3 -1
- package/dist/shared/api/storefront/hooks/account/use-fetch-current-account.d.ts +3 -0
- package/dist/shared/api/storefront/hooks/account/use-fetch-current-account.js +13 -0
- package/dist/shared/api/storefront/hooks/account/use-patch-current-account.d.ts +11 -0
- package/dist/shared/api/storefront/hooks/account/use-patch-current-account.js +20 -0
- package/dist/shared/api/storefront/hooks/authentication/use-patch-session.d.ts +1 -0
- package/dist/shared/api/storefront/hooks/authentication/use-patch-session.js +1 -1
- package/dist/shared/api/storefront/hooks/cart/use-patch-cart.d.ts +1 -0
- package/dist/shared/api/storefront/hooks/cart/use-place-order.d.ts +1 -0
- package/dist/shared/api/storefront/hooks/customer/use-patch-bill-to-address.d.ts +1 -0
- package/dist/shared/api/storefront/services/account-service.d.ts +31 -0
- package/dist/shared/api/storefront/services/account-service.js +84 -0
- package/dist/shared/api/storefront/services/authentication-service.d.ts +7 -26
- package/dist/shared/api/storefront/services/authentication-service.js +38 -65
- package/dist/styles.css +351 -240
- package/package.json +1 -1
- /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,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,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,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,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,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,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 };
|
|
@@ -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 (
|
|
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 };
|
|
@@ -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
|
|
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:
|
|
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" }),
|
|
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
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
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 };
|
|
@@ -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/
|
|
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
|
|
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();
|
package/dist/shared/api/storefront/hooks/{authentication → account}/use-create-guest-account.js
RENAMED
|
@@ -1,5 +1,7 @@
|
|
|
1
|
+
"use client";
|
|
1
2
|
import { useQueryClient, useMutation } from '@tanstack/react-query';
|
|
2
|
-
import {
|
|
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,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 };
|
|
@@ -7,7 +7,7 @@ function usePatchSession() {
|
|
|
7
7
|
return useAwaitableMutation({
|
|
8
8
|
mutationFn: async ({ session }) => {
|
|
9
9
|
const updatedSession = await patchSession({ session });
|
|
10
|
-
queryClient.
|
|
10
|
+
queryClient.clear();
|
|
11
11
|
return updatedSession;
|
|
12
12
|
},
|
|
13
13
|
});
|
|
@@ -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 {
|
|
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>;
|