@faststore/core 4.4.0-dev.0 → 4.4.0-dev.1

package/src/components/account/orders/OrderDetails/orderDetailsLabels.ts

@@ -0,0 +1,204 @@
+export type OrderDetailsHeaderLabels = {
+  orderNumberPrefix?: string
+  goBackLabel?: string
+  cancelOrderLabel?: string
+  reorderLabel?: string
+  notNowLabel?: string
+  cancelConfirmMessage?: string
+  cancelSuccessToast?: string
+  cancelErrorToast?: string
+  approveLabel?: string
+  rejectLabel?: string
+  rejectModalTitle?: string
+  /** Supports the `{policy}` placeholder, replaced with the policy name. */
+  rejectModalMessage?: string
+  rejectModalConfirmText?: string
+}
+
+export type OrderStatusSectionLabels = {
+  statusTitle?: string
+  orderPlacedStep?: string
+  paymentPendingStep?: string
+  handlingStep?: string
+  invoicedStep?: string
+  deliveredStep?: string
+}
+
+export type OrderPaymentSectionLabels = {
+  paymentTitle?: string
+  billingLabel?: string
+  bankInvoiceLabel?: string
+  paypalLabel?: string
+  giftCardLabel?: string
+  endingInLabel?: string
+  tidLabel?: string
+  authIdLabel?: string
+  invoiceNumberLabel?: string
+  printBankInvoiceLabel?: string
+  installmentCopy?: string
+}
+
+export type OrderDeliverySectionLabels = {
+  deliveryTitle?: string
+  recipientLabel?: string
+  deliveryAddressLabel?: string
+  storeAddressLabel?: string
+  storeHoursLabel?: string
+  fromLabel?: string
+  toLabel?: string
+  itemCountTemplate?: string
+  eachLabel?: string
+  taxesLabel?: string
+  totalLabel?: string
+}
+
+export type OrderSummarySectionLabels = {
+  summaryTitle?: string
+  totalLabel?: string
+  interestLabel?: string
+}
+
+export type OrderOrderedBySectionLabels = {
+  orderedByTitle?: string
+}
+
+export type OrderBudgetsSectionLabels = {
+  budgetsTitle?: string
+  nameLabel?: string
+  availableLabel?: string
+  toBeSpentLabel?: string
+  remainingLabel?: string
+}
+
+export type OrderMoreInfoSectionLabels = {
+  moreInfoTitle?: string
+}
+
+export const defaultOrderDetailsHeaderLabels: Required<OrderDetailsHeaderLabels> =
+  {
+    orderNumberPrefix: 'Order #',
+    goBackLabel: 'Go back',
+    cancelOrderLabel: 'Cancel order',
+    reorderLabel: 'Reorder',
+    notNowLabel: 'Not now',
+    cancelConfirmMessage:
+      "Are you sure you want to cancel this order? This action can't be undone.",
+    cancelSuccessToast: 'Order canceled successfully',
+    cancelErrorToast: "Order couldn't be canceled due to a technical issue.",
+    approveLabel: 'Approve',
+    rejectLabel: 'Reject',
+    rejectModalTitle: 'Reject approval request',
+    rejectModalMessage:
+      "You're about to reject this approval request, triggered by the {policy} policy. Rejecting any approval request will deny the entire order.\n\nThis action is permanent and cannot be undone.",
+    rejectModalConfirmText: 'Reject',
+  }
+
+export const defaultOrderStatusLabels: Required<OrderStatusSectionLabels> = {
+  statusTitle: 'Status',
+  orderPlacedStep: 'Order placed',
+  paymentPendingStep: 'Payment Pending',
+  handlingStep: 'Handling order',
+  invoicedStep: 'Invoiced',
+  deliveredStep: 'Delivered',
+}
+
+export const defaultOrderPaymentLabels: Required<OrderPaymentSectionLabels> = {
+  paymentTitle: 'Payment',
+  billingLabel: 'Billing',
+  bankInvoiceLabel: 'Bank Invoice',
+  paypalLabel: 'PayPal',
+  giftCardLabel: 'Gift Card',
+  endingInLabel: 'ending in',
+  tidLabel: 'Tid:',
+  authIdLabel: 'AuthId:',
+  invoiceNumberLabel: 'Invoice Number:',
+  printBankInvoiceLabel: 'Print Bank Invoice',
+  installmentCopy: '{count}x of {value}',
+}
+
+export const defaultOrderDeliveryLabels: Required<OrderDeliverySectionLabels> =
+  {
+    deliveryTitle: 'Delivery',
+    recipientLabel: 'Recipient',
+    deliveryAddressLabel: 'Delivery address',
+    storeAddressLabel: 'Store address',
+    storeHoursLabel: 'Store Hours',
+    fromLabel: 'From:',
+    toLabel: 'To:',
+    itemCountTemplate: '{count} item(s)',
+    eachLabel: 'Each',
+    taxesLabel: 'Taxes',
+    totalLabel: 'Total',
+  }
+
+export const defaultOrderSummaryLabels: Required<OrderSummarySectionLabels> = {
+  summaryTitle: 'Summary',
+  totalLabel: 'Total',
+  interestLabel: 'Interest',
+}
+
+export const defaultOrderOrderedByLabels: Required<OrderOrderedBySectionLabels> =
+  {
+    orderedByTitle: 'Ordered by',
+  }
+
+export const defaultOrderBudgetsLabels: Required<OrderBudgetsSectionLabels> = {
+  budgetsTitle: 'Budgets',
+  nameLabel: 'Name',
+  availableLabel: 'Available',
+  toBeSpentLabel: 'To be spent',
+  remainingLabel: 'Remaining',
+}
+
+export const defaultOrderMoreInfoLabels: Required<OrderMoreInfoSectionLabels> =
+  {
+    moreInfoTitle: 'More information',
+  }
+
+export function resolveOrderDetailsHeaderLabels(
+  labels?: OrderDetailsHeaderLabels
+): Required<OrderDetailsHeaderLabels> {
+  return { ...defaultOrderDetailsHeaderLabels, ...labels }
+}
+
+export function resolveOrderStatusLabels(
+  labels?: OrderStatusSectionLabels
+): Required<OrderStatusSectionLabels> {
+  return { ...defaultOrderStatusLabels, ...labels }
+}
+
+export function resolveOrderPaymentLabels(
+  labels?: OrderPaymentSectionLabels
+): Required<OrderPaymentSectionLabels> {
+  return { ...defaultOrderPaymentLabels, ...labels }
+}
+
+export function resolveOrderDeliveryLabels(
+  labels?: OrderDeliverySectionLabels
+): Required<OrderDeliverySectionLabels> {
+  return { ...defaultOrderDeliveryLabels, ...labels }
+}
+
+export function resolveOrderSummaryLabels(
+  labels?: OrderSummarySectionLabels
+): Required<OrderSummarySectionLabels> {
+  return { ...defaultOrderSummaryLabels, ...labels }
+}
+
+export function resolveOrderOrderedByLabels(
+  labels?: OrderOrderedBySectionLabels
+): Required<OrderOrderedBySectionLabels> {
+  return { ...defaultOrderOrderedByLabels, ...labels }
+}
+
+export function resolveOrderBudgetsLabels(
+  labels?: OrderBudgetsSectionLabels
+): Required<OrderBudgetsSectionLabels> {
+  return { ...defaultOrderBudgetsLabels, ...labels }
+}
+
+export function resolveOrderMoreInfoLabels(
+  labels?: OrderMoreInfoSectionLabels
+): Required<OrderMoreInfoSectionLabels> {
+  return { ...defaultOrderMoreInfoLabels, ...labels }
+}

package/src/components/account/orders/{MyAccountOrderDetails → OrderDetails}/section.module.scss

@@ -9,20 +9,20 @@
   @include meta.load-css("~@faststore/ui/src/components/molecules/Card/styles.scss");
   @include meta.load-css("~@faststore/ui/src/components/molecules/Alert/styles.scss");
   @include meta.load-css("~@faststore/ui/src/components/molecules/Dropdown/styles.scss");
-  @include meta.load-css("../../components/MyAccountAccordion/styles.scss");
-  @include meta.load-css("../../components/MyAccountCard/styles.scss");
-  @include meta.load-css("../../components/MyAccountStatusBadge/styles.scss");
-  @include meta.load-css("./MyAccountSummaryCard/styles.scss");
-  @include meta.load-css("./MyAccountOrderedByCard/styles.scss");
-  @include meta.load-css("./MyAccountDeliveryCard/styles.scss");
-  @include meta.load-css("./MyAccountPaymentCard/styles.scss");
-  @include meta.load-css("./MyAccountDeliveryOptionAccordion/styles.scss");
-  @include meta.load-css("./MyAccountOrderActions/styles.scss");
-  @include meta.load-css("./MyAccountReorderButton/styles.scss");
-  @include meta.load-css("./MyAccountStatusCard/styles.scss");
-  @include meta.load-css("./MyAccountMoreInformationCard/styles.scss");
-  @include meta.load-css("./MyAccountBuyingPolicyAlert/styles.scss");
-  @include meta.load-css("./MyAccountBudgetsCard/styles.scss");
+  @include meta.load-css("../../components/Accordion/styles.scss");
+  @include meta.load-css("../../components/Card/styles.scss");
+  @include meta.load-css("../../components/StatusBadge/styles.scss");
+  @include meta.load-css("./SummaryCard/styles.scss");
+  @include meta.load-css("./OrderedByCard/styles.scss");
+  @include meta.load-css("./DeliveryCard/styles.scss");
+  @include meta.load-css("./PaymentCard/styles.scss");
+  @include meta.load-css("./DeliveryOptionAccordion/styles.scss");
+  @include meta.load-css("./OrderActions/styles.scss");
+  @include meta.load-css("./ReorderButton/styles.scss");
+  @include meta.load-css("./StatusCard/styles.scss");
+  @include meta.load-css("./MoreInformationCard/styles.scss");
+  @include meta.load-css("./BuyingPolicyAlert/styles.scss");
+  @include meta.load-css("./BudgetsCard/styles.scss");
 
   // --------------------------------------------------------
   // Design Tokens

package/src/components/account/profile/profile.module.scss

@@ -2,6 +2,6 @@
 
 @layer components {
   .section {
-    @include meta.load-css("../components/MyAccountTable/styles.scss");
+    @include meta.load-css("../components/Table/styles.scss");
   }
 }

package/src/components/account/profile/profile.tsx

@@ -1,7 +1,6 @@
 import { Link } from '@faststore/ui'
-import AccountTable from '../components/MyAccountTable'
-import AccountHeader from '../components/MyAccountHeader'
-import { strings } from './i18n'
+import AccountTable from '../components/Table'
+import AccountHeader from '../components/Header'
 import styles from './profile.module.scss'
 import { useDateFormatter } from './use-date-formatter'
 
@@ -12,9 +11,26 @@ interface UserProfile {
   createdDate?: string | null
 }
 
+export type ProfileSectionLabels = {
+  pageTitle?: string
+  nameLabel?: string
+  emailLabel?: string
+  idLabel?: string
+  createdDateLabel?: string
+}
+
+const defaultProfileLabels: Required<ProfileSectionLabels> = {
+  pageTitle: 'Profile',
+  nameLabel: 'Name',
+  emailLabel: 'Email',
+  idLabel: 'ID',
+  createdDateLabel: 'Created date',
+}
+
 export interface ProfileSectionProps {
   profile?: UserProfile
   locale?: string
+  labels?: ProfileSectionLabels
 }
 
 /*
@@ -23,27 +39,34 @@ export interface ProfileSectionProps {
 export function ProfileSection({
   profile,
   locale = 'en-US',
+  labels,
 }: ProfileSectionProps) {
   const { formatStringDate } = useDateFormatter(locale)
+  const pageTitle = labels?.pageTitle ?? defaultProfileLabels.pageTitle
+  const nameLabel = labels?.nameLabel ?? defaultProfileLabels.nameLabel
+  const emailLabel = labels?.emailLabel ?? defaultProfileLabels.emailLabel
+  const idLabel = labels?.idLabel ?? defaultProfileLabels.idLabel
+  const createdDateLabel =
+    labels?.createdDateLabel ?? defaultProfileLabels.createdDateLabel
 
   return (
     <div data-fs-account-profile-section className={styles.section}>
-      <AccountHeader pageTitle={strings.profile} />
+      <AccountHeader pageTitle={pageTitle} />
       <section data-fs-account-profile-body>
         <AccountTable
           rows={[
-            { heading: strings.name, data: profile?.name },
+            { heading: nameLabel, data: profile?.name },
             {
-              heading: strings.email,
+              heading: emailLabel,
               data: (
                 <Link href={`mailto:${profile?.email}`}>{profile?.email}</Link>
               ),
             },
-            { heading: strings.id, data: profile?.id },
+            { heading: idLabel, data: profile?.id },
             ...(profile?.createdDate
               ? [
                   {
-                    heading: strings.createdDate,
+                    heading: createdDateLabel,
                     data: formatStringDate(profile.createdDate),
                   },
                 ]

package/src/components/account/section.module.scss

@@ -1,5 +1,5 @@
 @use "sass:meta";
 
 @layer components {
-  @include meta.load-css("./MyAccountLayout/styles.scss");
+  @include meta.load-css("./Layout/styles.scss");
 }

package/src/components/account/security/SecurityDrawer.tsx

@@ -11,6 +11,10 @@ import {
 } from '@faststore/ui'
 
 import { useSetPassword } from 'src/sdk/account/useSetPassword'
+import {
+  type SecuritySectionLabels,
+  resolveSecurityLabels,
+} from './securityLabels'
 import styles from './styles.module.scss'
 
 type SecurityDrawerProps = {
@@ -18,21 +22,24 @@ type SecurityDrawerProps = {
   isOpen: boolean
   onClose: () => void
   accountName?: string
+  labels?: SecuritySectionLabels
 }
 
-const validations = [
-  { label: '8 characters', test: (v: string) => v.length >= 8 },
-  { label: '1 uppercase letter', test: (v: string) => /[A-Z]/.test(v) },
-  { label: '1 lowercase letter', test: (v: string) => /[a-z]/.test(v) },
-  { label: '1 number', test: (v: string) => /\d/.test(v) },
-]
-
 export const SecurityDrawer = ({
   userEmail,
   accountName,
   isOpen,
   onClose,
+  labels: labelsProp,
 }: SecurityDrawerProps) => {
+  const labels = resolveSecurityLabels(labelsProp)
+
+  const validations = [
+    { label: labels.rule8Chars, test: (v: string) => v.length >= 8 },
+    { label: labels.rule1Uppercase, test: (v: string) => /[A-Z]/.test(v) },
+    { label: labels.rule1Lowercase, test: (v: string) => /[a-z]/.test(v) },
+    { label: labels.rule1Number, test: (v: string) => /\d/.test(v) },
+  ]
   const { fade, fadeOut } = useFadeEffect()
   const { pushToast } = useUI()
 
@@ -64,17 +71,17 @@ export const SecurityDrawer = ({
 
   const handleSetPassword = async () => {
     if (!userEmail) {
-      setFormError('Email is required to set a new password.')
+      setFormError(labels.emailRequiredError)
       return
     }
 
     if (!newPassword || !currentPassword) {
-      setFormError('All fields are required to set a new password.')
+      setFormError(labels.allFieldsRequiredError)
       return
     }
 
     if (newPassword === currentPassword) {
-      setFormError('New password cannot be the same as the current password.')
+      setFormError(labels.samePasswordError)
       return
     }
 
@@ -100,7 +107,7 @@ export const SecurityDrawer = ({
         pushToast({
           title: 'Success setting password',
           status: 'INFO',
-          message: 'Password updated successfully',
+          message: labels.passwordUpdatedToast,
           icon: <Icon width={30} height={30} name="CircleWavyCheck" />,
         })
 
@@ -111,7 +118,7 @@ export const SecurityDrawer = ({
       pushToast({
         title: 'Error setting password',
         status: 'ERROR',
-        message: 'Failed to set password.',
+        message: labels.passwordFailedToast,
         icon: <Icon width={30} height={30} name="CircleWavyWarning" />,
       })
     }
@@ -129,7 +136,9 @@ export const SecurityDrawer = ({
       overlayProps={{ className: styles.section }}
     >
       <SlideOverHeader data-fs-security-drawer-header onClose={handleClose}>
-        <h1 data-fs-security-drawer-header-title>Reset password</h1>
+        <h1 data-fs-security-drawer-header-title>
+          {labels.resetPasswordLabel}
+        </h1>
       </SlideOverHeader>
 
       <div data-fs-security-drawer-body>
@@ -138,7 +147,7 @@ export const SecurityDrawer = ({
             data-fs-security-drawer-input
             id="security-drawer-input-current-password"
             type={showCurrentPassword ? 'text' : 'password'}
-            placeholder="Current Password"
+            placeholder={labels.currentPasswordLabel}
             inputMode="text"
             value={currentPassword}
             onChange={(e) => {
@@ -149,7 +158,7 @@ export const SecurityDrawer = ({
           <IconButton
             data-fs-security-drawer-input-password-toggle
             size="small"
-            aria-label="Show Password"
+            aria-label={labels.showPasswordAria}
             onClick={() => setShowCurrentPassword((prev) => !prev)}
             icon={
               showCurrentPassword ? (
@@ -166,7 +175,7 @@ export const SecurityDrawer = ({
             data-fs-security-drawer-input
             id="security-drawer-input-new-password"
             type={showNewPassword ? 'text' : 'password'}
-            placeholder="New Password"
+            placeholder={labels.newPasswordLabel}
             inputMode="text"
             value={newPassword}
             onChange={(e) => {
@@ -177,7 +186,7 @@ export const SecurityDrawer = ({
           <IconButton
             data-fs-security-drawer-input-password-toggle
             size="small"
-            aria-label="Show Password"
+            aria-label={labels.showPasswordAria}
             onClick={() => setShowNewPassword((prev) => !prev)}
             icon={
               showNewPassword ? <Icon name="EyeSlash" /> : <Icon name="Eye" />
@@ -200,7 +209,7 @@ export const SecurityDrawer = ({
         {newPassword.length > 0 && (
           <div data-fs-security-drawer-password-rules-container>
             <p data-fs-security-drawer-password-rules-title>
-              Your password must have at least:
+              {labels.passwordRulesIntro}
             </p>
 
             <ul data-fs-security-drawer-password-rules-list>
@@ -225,7 +234,7 @@ export const SecurityDrawer = ({
 
       <footer data-fs-security-drawer-footer>
         <Button variant="secondary" onClick={handleClose}>
-          Cancel
+          {labels.cancelLabel}
         </Button>
 
         <Button
@@ -235,7 +244,7 @@ export const SecurityDrawer = ({
           disabled={loading || !currentPassword || !newPassword || !allValid}
           onClick={handleSetPassword}
         >
-          Save Password
+          {labels.savePasswordLabel}
         </Button>
       </footer>
     </SlideOver>

package/src/components/account/security/SecuritySection.tsx

@@ -1,18 +1,28 @@
 import { useState } from 'react'
 import { Button } from '@faststore/ui'
 
-import AccountTable from '../components/MyAccountTable'
-import AccountHeader from '../components/MyAccountHeader'
+import AccountTable from '../components/Table'
+import AccountHeader from '../components/Header'
 
 import { SecurityDrawer } from './SecurityDrawer'
+import {
+  type SecuritySectionLabels,
+  resolveSecurityLabels,
+} from './securityLabels'
 import styles from './styles.module.scss'
 
-type SecuritySectionProps = { userEmail: string; accountName?: string }
+type SecuritySectionProps = {
+  userEmail: string
+  accountName?: string
+  labels?: SecuritySectionLabels
+}
 
 export const SecuritySection = ({
   userEmail,
   accountName,
+  labels: labelsProp,
 }: SecuritySectionProps) => {
+  const labels = resolveSecurityLabels(labelsProp)
   const [isDrawerOpen, setIsDrawerOpen] = useState(false)
   return (
     <>
@@ -22,17 +32,18 @@ export const SecuritySection = ({
           accountName={accountName}
           isOpen={isDrawerOpen}
           onClose={() => setIsDrawerOpen(false)}
+          labels={labels}
         />
       )}
 
       <section data-fs-securiry-section className={styles.section}>
-        <AccountHeader pageTitle="Security" />
+        <AccountHeader pageTitle={labels.pageTitle} />
 
         <div data-fs-security-container>
           <AccountTable
             rows={[
               {
-                heading: 'Password',
+                heading: labels.passwordLabel,
                 data: (
                   <>
                     <span data-fs-security-table-data-text>••••••••••</span>
@@ -41,7 +52,7 @@ export const SecuritySection = ({
                       data-fs-security-table-action-button
                       onClick={() => setIsDrawerOpen(true)}
                     >
-                      Reset password
+                      {labels.resetPasswordLabel}
                     </Button>
                   </>
                 ),

package/src/components/account/security/securityLabels.ts

@@ -0,0 +1,47 @@
+export type SecuritySectionLabels = {
+  pageTitle?: string
+  passwordLabel?: string
+  resetPasswordLabel?: string
+  currentPasswordLabel?: string
+  newPasswordLabel?: string
+  showPasswordAria?: string
+  cancelLabel?: string
+  savePasswordLabel?: string
+  passwordRulesIntro?: string
+  rule8Chars?: string
+  rule1Uppercase?: string
+  rule1Lowercase?: string
+  rule1Number?: string
+  emailRequiredError?: string
+  allFieldsRequiredError?: string
+  samePasswordError?: string
+  passwordUpdatedToast?: string
+  passwordFailedToast?: string
+}
+
+export const defaultSecurityLabels: Required<SecuritySectionLabels> = {
+  pageTitle: 'Security',
+  passwordLabel: 'Password',
+  resetPasswordLabel: 'Reset password',
+  currentPasswordLabel: 'Current Password',
+  newPasswordLabel: 'New Password',
+  showPasswordAria: 'Show Password',
+  cancelLabel: 'Cancel',
+  savePasswordLabel: 'Save Password',
+  passwordRulesIntro: 'Your password must have at least:',
+  rule8Chars: '8 characters',
+  rule1Uppercase: '1 uppercase letter',
+  rule1Lowercase: '1 lowercase letter',
+  rule1Number: '1 number',
+  emailRequiredError: 'Email is required',
+  allFieldsRequiredError: 'All fields are required',
+  samePasswordError: 'New password cannot be the same as the current password',
+  passwordUpdatedToast: 'Password updated successfully',
+  passwordFailedToast: 'Failed to set password.',
+}
+
+export function resolveSecurityLabels(
+  labels?: SecuritySectionLabels
+): Required<SecuritySectionLabels> {
+  return { ...defaultSecurityLabels, ...labels }
+}

package/src/components/account/security/styles.module.scss

@@ -8,7 +8,7 @@
     @include meta.load-css("~@faststore/ui/src/components/atoms/Input/styles.scss");
     @include meta.load-css("~@faststore/ui/src/components/atoms/Icon/styles.scss");
     @include meta.load-css("~@faststore/ui/src/components/organisms/SlideOver/styles.scss");
-    @include meta.load-css("../components/MyAccountTable/styles.scss");
+    @include meta.load-css("../components/Table/styles.scss");
 
     // --------------------------------------------------------
     // Design Tokens

package/src/components/cms/account/Components.ts

@@ -0,0 +1,53 @@
+import type { ComponentType } from 'react'
+
+import AccountNavigation from 'src/components/sections/Account/AccountNavigation'
+import AccountOrderBudgets from 'src/components/sections/Account/AccountOrderBudgets'
+import AccountOrderDelivery from 'src/components/sections/Account/AccountOrderDelivery'
+import AccountOrderDetails from 'src/components/sections/Account/AccountOrderDetails'
+import AccountOrderMoreInfo from 'src/components/sections/Account/AccountOrderMoreInfo'
+import AccountOrderOrderedBy from 'src/components/sections/Account/AccountOrderOrderedBy'
+import AccountOrderPayment from 'src/components/sections/Account/AccountOrderPayment'
+import AccountOrderStatus from 'src/components/sections/Account/AccountOrderStatus'
+import AccountOrderSummary from 'src/components/sections/Account/AccountOrderSummary'
+import AccountOrdersList from 'src/components/sections/Account/AccountOrdersList'
+import AccountProfile from 'src/components/sections/Account/AccountProfile'
+import AccountSecurity from 'src/components/sections/Account/AccountSecurity'
+import AccountUnauthorized from 'src/components/sections/Account/AccountUnauthorized'
+import AccountUserDetails from 'src/components/sections/Account/AccountUserDetails'
+import { getComponentKey } from 'src/utils/cms'
+import { default as GLOBAL_COMPONENTS } from '../global/Components'
+
+import CUSTOM_COMPONENTS from 'src/customizations/src/components'
+import PLUGINS_COMPONENTS from 'src/plugins'
+
+const ACCOUNT_COMPONENTS: Record<string, ComponentType<any>> = {
+  ...GLOBAL_COMPONENTS,
+  [getComponentKey(AccountNavigation, 'AccountNavigation')]: AccountNavigation,
+  [getComponentKey(AccountProfile, 'AccountProfile')]: AccountProfile,
+  [getComponentKey(AccountOrdersList, 'AccountOrdersList')]: AccountOrdersList,
+  [getComponentKey(AccountUserDetails, 'AccountUserDetails')]:
+    AccountUserDetails,
+  [getComponentKey(AccountSecurity, 'AccountSecurity')]: AccountSecurity,
+  [getComponentKey(AccountOrderDetails, 'AccountOrderDetails')]:
+    AccountOrderDetails,
+  [getComponentKey(AccountOrderStatus, 'AccountOrderStatus')]:
+    AccountOrderStatus,
+  [getComponentKey(AccountOrderPayment, 'AccountOrderPayment')]:
+    AccountOrderPayment,
+  [getComponentKey(AccountOrderDelivery, 'AccountOrderDelivery')]:
+    AccountOrderDelivery,
+  [getComponentKey(AccountOrderSummary, 'AccountOrderSummary')]:
+    AccountOrderSummary,
+  [getComponentKey(AccountOrderOrderedBy, 'AccountOrderOrderedBy')]:
+    AccountOrderOrderedBy,
+  [getComponentKey(AccountOrderBudgets, 'AccountOrderBudgets')]:
+    AccountOrderBudgets,
+  [getComponentKey(AccountOrderMoreInfo, 'AccountOrderMoreInfo')]:
+    AccountOrderMoreInfo,
+  [getComponentKey(AccountUnauthorized, 'AccountUnauthorized')]:
+    AccountUnauthorized,
+  ...PLUGINS_COMPONENTS,
+  ...CUSTOM_COMPONENTS,
+}
+
+export default ACCOUNT_COMPONENTS

package/src/components/navigation/Navbar/Navbar.tsx

@@ -4,7 +4,7 @@ import { useCallback, useRef, useState } from 'react'
 import { Icon as UIIcon, useScrollDirection, useUI } from '@faststore/ui'
 
 import { Skeleton as UISkeleton } from '@faststore/ui'
-import { OrganizationSignInButton } from 'src/components/account/MyAccountDrawer/OrganizationSignInButton'
+import { OrganizationSignInButton } from 'src/components/account/Drawer/OrganizationSignInButton'
 import CartToggle from 'src/components/cart/CartToggle'
 import type { SearchInputRef } from 'src/components/search/SearchInput'
 import SearchInput from 'src/components/search/SearchInput'

package/src/components/navigation/NavbarSlider/NavbarSlider.tsx

@@ -10,7 +10,7 @@ import Logo from 'src/components/ui/Logo'
 
 import type { NavbarProps } from '../Navbar'
 
-import { OrganizationSignInButton } from 'src/components/account/MyAccountDrawer/OrganizationSignInButton'
+import { OrganizationSignInButton } from 'src/components/account/Drawer/OrganizationSignInButton'
 import { useOverrideComponents } from 'src/sdk/overrides/OverrideContext'
 import { useSession } from 'src/sdk/session'
 import styles from './section.module.scss'