@weareconceptstudio/account 0.4.6 → 0.4.8

package/dist/modules/account/AccountBalanceTemplate/HistoryBalance/ItemHistory/index.js

@@ -27,15 +27,15 @@ const ItemHistory = ({ date, activity, value, action_type }) => {
         React.createElement("div", { className: 'inner-wrapper-info', ref: innerWrapperRef },
             React.createElement(Text, { className: 'account-primary-color1 account-font-medium account-p account-p1 date-info-text' },
                 React.createElement(Text, { className: 'account-primary-color1 account-font-medium account-p1 mobile-date-info-text first-letter', tag: 'span' },
-                    translate('balanceCategoryDate'),
+                    translate('account.balance_promotions.balanceCategoryDate'),
                     ":"),
-                ' ',
+                "\u00A0",
                 date),
             React.createElement("div", { className: 'wrapper-activity-text' },
                 React.createElement(Text, { className: 'account-primary-color1 account-font-medium account-p account-p1 activity-info-text' }, activity)),
             React.createElement(Text, { className: `account-primary-color1 account-font-medium account-p account-p1 amount-info-text ${action_type}` },
-                React.createElement(Text, { className: 'account-primary-color1 account-font-medium account-p1 mobile-amount-info-text first-letter', tag: 'span' }, translate('balanceCategoryAmount')),
-                ' ',
+                React.createElement(Text, { className: 'account-primary-color1 account-font-medium account-p1 mobile-amount-info-text first-letter', tag: 'span' }, translate('account.balance_promotions.balanceCategoryAmount')),
+                "\u00A0",
                 value)),
         React.createElement("div", { className: 'line-info' })));
 };

package/dist/modules/account/AccountBalanceTemplate/HistoryBalance/index.js

@@ -5,7 +5,7 @@ import HistoryBalanceStyle from './style';
 //* Component
 import ItemHistory from './ItemHistory';
 import { Pagination } from '../../../../components';
-const dataCategoryName = ['balanceCategoryDate', 'balanceCategoryActivity', 'balanceCategoryAmount'];
+const dataCategoryName = ['account.balance_promotions.balanceCategoryDate', 'account.balance_promotions.balanceCategoryActivity', 'account.balance_promotions.balanceCategoryAmount'];
 const HistoryBalance = ({ linkEarnPage }) => {
     const { translate, selectedLang } = useTranslation();
     const [currentPage, setCurrentPage] = useState(1);
@@ -28,9 +28,9 @@ const HistoryBalance = ({ linkEarnPage }) => {
     return data && data.length ? (React.createElement(HistoryBalanceStyle, null,
         React.createElement("div", { className: 'wrapper-title-section-history' },
             React.createElement("div", { className: 'wrapper-history-link' },
-                React.createElement(Text, { className: 'account-primary-color1 account-font-medium account-p account-p1 first-letter title-section-history', text: 'balanceRecentActivity' }),
+                React.createElement(Text, { className: 'account-primary-color1 account-font-medium account-p account-p1 first-letter title-section-history', text: 'account.balance_promotions.balanceRecentActivity' }),
                 linkEarnPage ? (React.createElement(Link, { href: '/muramoney' },
-                    React.createElement(Text, { className: 'account-primary-color1 account-font-bold account-p account-p4 first-letter how-earn-text', text: 'balanceHowToEarn' }))) : null),
+                    React.createElement(Text, { className: 'account-primary-color1 account-font-bold account-p account-p4 first-letter how-earn-text', text: 'account.balance_promotions.balanceHowToEarn' }))) : null),
             React.createElement("div", { className: 'line-title' })),
         React.createElement("div", { className: 'wrapper-history-container' },
             React.createElement("div", { className: 'wrapper-history-category-title', id: 'history-category-title' }, dataCategoryName.map((item, i) => {

package/dist/modules/account/AccountBalanceTemplate/StatusBalance/ItemStatus/index.d.ts

@@ -1,8 +1,9 @@
 export default ItemStatus;
-declare function ItemStatus({ title, cashback, value, className }: {
+declare function ItemStatus({ title, cashback, value, className, currency }: {
     title: any;
     cashback: any;
     value: any;
     className: any;
+    currency: any;
 }): React.JSX.Element;
 import React from 'react';

package/dist/modules/account/AccountBalanceTemplate/StatusBalance/ItemStatus/index.js

@@ -1,21 +1,21 @@
 import { handlePriceCheckFunc, Text, useTranslation } from '@weareconceptstudio/core';
 import React from 'react';
-const ItemStatus = ({ title, cashback, value, className }) => {
+const ItemStatus = ({ title, cashback, value, className, currency }) => {
     const { translate } = useTranslation();
-    return (React.createElement("div", { className: `wrapper-item-status ${className}` },
+    return (React.createElement("div", { className: `wrapper-item-status ${className || ''}` },
         React.createElement("div", { className: 'title' },
-            React.createElement(Text, { className: 'account-primary-color1 account-font-medium account-p account-p3 first-letter title-status-progress' }, title)),
+            React.createElement(Text, { className: 'account-primary-color1 account-font-medium account-p account-p3 first-letter title-status-progress', text: `account.user_status.${title}` })),
         React.createElement("div", { className: 'circle-line' },
             React.createElement("div", { className: 'circle' })),
         React.createElement("div", { className: 'cashback' },
             React.createElement(Text, { className: 'account-primary-color1 account-p account-p4 first-letter text-progress-cashback' },
                 cashback + '%',
                 " ",
-                translate('balanceCashback'))),
+                translate('account.balance_promotions.balanceCashback'))),
         React.createElement("div", { className: 'value' },
             React.createElement(Text, { className: 'account-primary-color1 account-p account-p4 first-letter text-progress-value' }, value ? (React.createElement(React.Fragment, null,
-                translate('balanceStarting'),
+                translate('account.balance_promotions.balanceStarting'),
                 " ",
-                handlePriceCheckFunc(value, translate('priceValue')))) : (translate('balanceFirstOrderStatus'))))));
+                handlePriceCheckFunc(value, currency))) : (translate('account.balance_promotions.balanceFirstOrderStatus'))))));
 };
 export default ItemStatus;

package/dist/modules/account/AccountBalanceTemplate/StatusBalance/index.d.ts

@@ -1,6 +1,7 @@
 export default StatusBalance;
-declare function StatusBalance({ allItem, activeStatus }: {
+declare function StatusBalance({ allItem, activeStatus, currency }: {
     allItem: any;
     activeStatus: any;
+    currency: any;
 }): React.JSX.Element;
 import React from 'react';

package/dist/modules/account/AccountBalanceTemplate/StatusBalance/index.js

@@ -4,7 +4,7 @@ import { Text, useResizeObserver, useUi } from '@weareconceptstudio/core';
 import StatusBalanceStyle from './style';
 //* Component
 import ItemStatus from './ItemStatus';
-const StatusBalance = ({ allItem, activeStatus }) => {
+const StatusBalance = ({ allItem, activeStatus, currency }) => {
     const { winWidth } = useUi();
     //! Refs
     const wrapperStatusRef = useRef();
@@ -38,14 +38,14 @@ const StatusBalance = ({ allItem, activeStatus }) => {
     }, [resizes, winWidth]);
     return (React.createElement(StatusBalanceStyle, { ref: styleRef, className: 'account-progress-status-wrapper' },
         React.createElement("div", { className: 'wrapper-title-section' },
-            React.createElement(Text, { className: 'account-primary-color1 account-font-medium account-p account-p1 first-letter status-title-section-progress', text: 'balanceStatus' }),
+            React.createElement(Text, { className: 'account-primary-color1 account-font-medium account-p account-p1 first-letter status-title-section-progress', text: 'account.balance_promotions.balanceStatus' }),
             React.createElement("div", { className: 'line-title' })),
         React.createElement("div", { ref: outsideContentRef, className: 'outside-wrapper-content' },
             React.createElement("div", { ref: contentRef, className: 'content-wrapper' },
                 React.createElement("div", { ref: wrapperStatusRef, className: 'wrapper-status' }, allItem.length &&
                     statusActiveItem.current !== false &&
                     allItem.map((item, i, arr) => {
-                        return (React.createElement(ItemStatus, { className: `${i == 0 ? 'start-item' : i == arr.length - 1 ? 'end-item' : ''} ${i <= statusActiveItem.current ? 'active-status' : ''}`, key: i, title: item.name, cashback: item.cashback, value: item.value }));
+                        return (React.createElement(ItemStatus, { key: i, title: item.name, value: item.value, currency: currency, cashback: item.cashback, className: `${i == 0 ? 'start-item' : i == arr.length - 1 ? 'end-item' : ''} ${i <= statusActiveItem.current ? 'active-status' : ''}` }));
                     })),
                 React.createElement("div", { className: 'wrapper-line-all' }, allItem.length &&
                     statusActiveItem.current !== false &&

package/dist/modules/account/AccountBalanceTemplate/index.js

@@ -1,5 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import { api, useTranslation } from '@weareconceptstudio/core';
+import { useAccountContext } from '../../../AccountProvider';
 //* Style
 import AccountBalanceTemplateStyle from './style';
 //* Component
@@ -8,6 +9,7 @@ import HistoryBalance from './HistoryBalance';
 import StatusBalance from './StatusBalance';
 const AccountBalanceTemplate = ({ iconValue, dataItem, linkEarnPage, className }) => {
     const { selectedLang } = useTranslation();
+    const { currency } = useAccountContext();
     //! State
     const [dataBalance, setDataBalance] = useState(false);
     useEffect(() => {
@@ -16,7 +18,7 @@ const AccountBalanceTemplate = ({ iconValue, dataItem, linkEarnPage, className }
         });
     }, []);
     return dataBalance ? (React.createElement(AccountBalanceTemplateStyle, { className: className || '' },
-        React.createElement(HeroBalance, { cashback: dataBalance.cashback, balance: dataBalance.balance, title: dataBalance.info.status, totalSpent: dataBalance.info.spent.current, nextStatusValue: dataBalance.info.spent.next, progress: dataBalance.info.timeline, nextStatusTitle: 'Resident', iconValue: iconValue, description: (() => {
+        React.createElement(HeroBalance, { currency: currency, iconValue: iconValue, nextStatusTitle: 'resident', balance: dataBalance.balance, title: dataBalance.info.status.toLowerCase(), cashback: dataBalance.cashback, progress: dataBalance.info.timeline, totalSpent: dataBalance.info.spent.current, nextStatusValue: dataBalance.info.spent.next, description: (() => {
                 if (dataItem) {
                     const { description1, description2 } = dataItem.find((item) => item.name?.toLowerCase() === dataBalance.info.status?.toLowerCase()) || {};
                     return { description1, description2 };
@@ -25,7 +27,7 @@ const AccountBalanceTemplate = ({ iconValue, dataItem, linkEarnPage, className }
                     return false;
                 }
             })() }),
-        React.createElement(StatusBalance, { activeStatus: dataBalance.info.status, allItem: dataItem }),
+        React.createElement(StatusBalance, { allItem: dataItem, currency: currency, activeStatus: dataBalance.info.status }),
         React.createElement(HistoryBalance, { linkEarnPage: linkEarnPage }))) : null;
 };
 export default AccountBalanceTemplate;

package/dist/modules/account/AccountSettingsTemplate/AccountInfo/index.js

@@ -1,16 +1,17 @@
 import React, { useState, useCallback } from 'react';
-import { Text, useUi } from '@weareconceptstudio/core';
+import { Text, useTranslation, useUi } from '@weareconceptstudio/core';
 import { FormBuilder } from '@weareconceptstudio/form';
 import { AccountButton, WarningMessageForPopup } from '../../../../components';
 import AccountInfoStyle from './style';
 import { defaultDisplayFields, defaultFormFields } from './utils';
 const AccountInfo = ({ user, onAccountUpdate, displayFields = defaultDisplayFields, formFields = defaultFormFields }) => {
     const { openPopup } = useUi();
+    const { translate } = useTranslation();
     //! State
     const [edit, setEdit] = useState(false);
     //! Handle Popup
     const handleSuccessPopup = useCallback(() => {
-        openPopup(React.createElement(WarningMessageForPopup, { title: 'yourSettingsHaveBeenSaved', description: 'yourSettingsHaveBeenSaved' }), {
+        openPopup(React.createElement(WarningMessageForPopup, { title: 'account.order_balance.yourSettingsHaveBeenSaved', description: 'account.password_management.yourPasswordHaveBeenChanged' }), {
             className: 'messagePopup',
             accountIcon: true,
         });
@@ -23,18 +24,20 @@ const AccountInfo = ({ user, onAccountUpdate, displayFields = defaultDisplayFiel
         });
     }, [edit]);
     return (user && (React.createElement(AccountInfoStyle, { className: `account-info` },
-        React.createElement(Text, { text: `accountInformation`, className: `account-p account-p1 account-font-bold account-primary-color1` }),
+        React.createElement(Text, { text: `account.account_info.accountInformation`, className: `account-p account-p1 account-font-bold account-primary-color1` }),
         !edit ? (React.createElement(React.Fragment, null,
             React.createElement("div", { className: `info-wrap` }, displayFields.map((displayField, index) => (React.createElement("div", { key: index, className: `info-item-wrap` },
-                React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1`, text: `${displayField.label}` }),
+                React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1` },
+                    `${translate(displayField.label)}`,
+                    ":"),
                 "\u00A0",
                 React.createElement(Text, { className: `account-p account-p3 account-font-regular account-primary-color1`, text: user[displayField.value] || '-' }))))),
-            React.createElement(AccountButton, { text: `edit`, btnType: `green-large-text`, onClick: () => setEdit(true) }))) : (React.createElement(React.Fragment, null,
+            React.createElement(AccountButton, { text: `account.general_actions.edit`, btnType: `green-large-text`, onClick: () => setEdit(true) }))) : (React.createElement(React.Fragment, null,
             React.createElement(FormBuilder, { fields: formFields, onSubmit: onFinish, className: 'form-items-wrap', formOptions: {
                     initialValues: user,
                 } },
                 React.createElement("div", { className: `cancel-and-save-and-apply-wrap` },
-                    React.createElement(AccountButton, { text: `cancel`, btnType: `green-large-text`, onClick: () => setEdit(false) }),
-                    React.createElement(AccountButton, { type: 'submit', text: `saveChanges`, btnType: `full-width` }))))))));
+                    React.createElement(AccountButton, { btnType: `green-large-text`, onClick: () => setEdit(false), text: `account.general_actions.cancel` }),
+                    React.createElement(AccountButton, { type: 'submit', btnType: `full-width`, text: `account.general_actions.saveChanges` }))))))));
 };
 export default AccountInfo;

package/dist/modules/account/AccountSettingsTemplate/AccountInfo/utils.js

@@ -1,41 +1,41 @@
 export const defaultDisplayFields = [
-    { label: 'first_name', value: 'first_name' },
-    { label: 'last_name', value: 'last_name' },
-    { label: 'phone_', value: 'phone' },
-    { label: 'email_', value: 'email' },
+    { label: 'account.account_info.firstName', value: 'first_name' },
+    { label: 'account.account_info.lastName', value: 'last_name' },
+    { label: 'account.account_info.phone', value: 'phone' },
+    { label: 'account.account_info.email', value: 'email' },
 ];
 export const defaultFormFields = [
     {
         fieldType: 'input',
         labelProps: {
-            label: 'firstName',
+            label: 'account.account_info.firstName',
             name: 'first_name',
         },
         fieldProps: {
-            placeholder: 'firstNamePlaceholder',
+            placeholder: 'account.account_info.firstNamePlaceholder',
         },
     },
     {
         fieldType: 'input',
         labelProps: {
-            label: 'lastName',
+            label: 'account.account_info.lastName',
             name: 'last_name',
         },
         fieldProps: {
-            placeholder: 'lastNamePlaceholder',
+            placeholder: 'account.account_info.lastNamePlaceholder',
         },
     },
     {
         fieldType: 'phone',
         labelProps: {
-            label: 'phone_input',
+            label: 'account.account_info.phone',
             name: 'phone',
         },
     },
     {
         fieldType: 'input',
         labelProps: {
-            label: 'email',
+            label: 'account.account_info.email',
             name: 'email',
         },
         fieldProps: {

package/dist/modules/account/AccountSettingsTemplate/AccountPassword/index.js

@@ -10,7 +10,7 @@ const AccountPassword = ({ formFields = defaultFormFields, onPasswordUpdate }) =
     const [edit, setEdit] = useState(false);
     //! Handle Popup
     const handleSuccessPopup = useCallback(() => {
-        openPopup(React.createElement(WarningMessageForPopup, { title: 'yourSettingsHaveBeenSaved', description: 'yourPasswordHaveBeenChanged' }), {
+        openPopup(React.createElement(WarningMessageForPopup, { title: 'account.order_balance.yourSettingsHaveBeenSaved', description: 'account.password_management.yourPasswordHaveBeenChanged' }), {
             className: 'messagePopup',
             accountIcon: true,
         });
@@ -23,17 +23,17 @@ const AccountPassword = ({ formFields = defaultFormFields, onPasswordUpdate }) =
         });
     }, []);
     return (React.createElement(AccountPasswordStyle, { className: `account-password` },
-        React.createElement(Text, { className: `account-p account-p1 account-font-bold account-primary-color1`, text: `password_title` }),
+        React.createElement(Text, { className: `account-p account-p1 account-font-bold account-primary-color1`, text: `account.password_management.password` }),
         !edit ? (React.createElement(React.Fragment, null,
             React.createElement("div", { className: `info-item-wrap` },
-                React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1`, text: `password_` }),
+                React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1`, text: `account.password_management.password` }),
                 "\u00A0",
                 React.createElement(Text, { className: `account-p account-p3 account-font-regular account-primary-color1`, text: '****************' })),
-            React.createElement(AccountButton, { text: `edit`, btnType: `green-large-text`, onClick: () => setEdit(true) }))) : (React.createElement(FormBuilder, { formOptions: {
+            React.createElement(AccountButton, { text: `account.general_actions.edit`, btnType: `green-large-text`, onClick: () => setEdit(true) }))) : (React.createElement(FormBuilder, { formOptions: {
                 className: 'password-form-wrapper',
             }, className: 'form-items-wrap', onSubmit: onFinish, fields: formFields },
             React.createElement("div", { className: `cancel-and-save-and-apply-wrap` },
-                React.createElement(AccountButton, { text: `cancel`, btnType: `green-large-text`, onClick: () => setEdit(false) }),
-                React.createElement(AccountButton, { type: 'submit', text: `saveChanges`, btnType: `full-width` }))))));
+                React.createElement(AccountButton, { btnType: `green-large-text`, onClick: () => setEdit(false), text: `account.general_actions.cancel` }),
+                React.createElement(AccountButton, { type: 'submit', btnType: `full-width`, text: `account.general_actions.saveChanges` }))))));
 };
 export default AccountPassword;

package/dist/modules/account/AccountSettingsTemplate/AccountPassword/utils.js

@@ -2,23 +2,23 @@ export const defaultFormFields = [
     {
         fieldType: 'password',
         labelProps: {
-            label: 'enterCurrentPassword',
+            label: 'account.password_management.enterCurrentPassword',
             name: 'current_password',
             rules: [{ type: 'password' }],
         },
         fieldProps: {
-            placeholder: 'enterCurrentPasswordPlaceholder',
+            placeholder: 'account.password_management.enterCurrentPasswordPlaceholder',
         },
     },
     {
         fieldType: 'password',
         labelProps: {
-            label: 'enterNewPassword',
+            label: 'account.password_management.enterNewPassword',
             name: 'password',
             rules: [{ type: 'new-password' }],
         },
         fieldProps: {
-            placeholder: 'enterNewPasswordPlaceholder',
+            placeholder: 'account.password_management.enterNewPasswordPlaceholder',
         },
     },
 ];

package/dist/modules/account/AccountTemplate/index.js

@@ -15,7 +15,7 @@ const AccountTemplate = ({ isFullWidth = true, menuOptions = [], children }) =>
     }, [winWidth]);
     //! Menu
     const menu = useMemo(() => {
-        return menuOptions.map((menuItem, index) => (React.createElement(Link, { key: index, href: menuItem.url, className: `menu-item ${menuItem.className ? menuItem.className : ''}`, ...menuItem.options },
+        return menuOptions.map((menuItem, index) => (React.createElement(Link, { key: index, href: menuItem.url, className: `menu-item ${menuItem.className || ''}`, ...menuItem.options },
             React.createElement(Text, { tag: `span`, className: `account-p account-p1 account-font-bold sidebar-item`, text: menuItem.name }))));
     }, [menuOptions]);
     const loadingComponent = useMemo(() => {
@@ -26,10 +26,10 @@ const AccountTemplate = ({ isFullWidth = true, menuOptions = [], children }) =>
             React.createElement("aside", { className: 'sidebar' },
                 React.createElement("div", { className: `sidebar-inner-wrap` },
                     React.createElement("div", { className: `my-acc-wrap` },
-                        React.createElement(Text, { className: 'account-p account-p1 account-font-bold account-primary-color1', text: 'myAccount' }),
+                        React.createElement(Text, { className: 'account-p account-p1 account-font-bold account-primary-color1', text: 'account.account_info.myAccount' }),
                         React.createElement("div", { className: `account-line` })),
                     React.createElement("div", { className: 'tabs-wrap' }, menu),
-                    React.createElement(Text, { text: 'signOut', onClick: signOut, className: 'account-p account-p1 account-error-color account-font-bold sign-out' }))),
+                    React.createElement(Text, { onClick: signOut, text: 'account.auth_account_management.signOut', className: 'account-p account-p1 account-error-color account-font-bold sign-out' }))),
             lineStore,
             React.createElement("div", { className: `right-bar` },
                 loadingComponent,

package/dist/modules/address/AddressForm/index.js

@@ -40,9 +40,9 @@ const AddressForm = Memo(({ title, data, type }) => {
                 isChecked ? (React.createElement("div", { className: 'checkbox-wrap', role: 'button' },
                     React.createElement(CheckboxCheckedIcon, null))) : (React.createElement("div", { className: 'checkbox-wrap', role: 'button' },
                     React.createElement(CheckboxIcon, null))),
-                React.createElement(Text, { className: `account-p account-p2 account-font-medium account-primary-color1 address-form-is-default-checkbox`, text: `${type === 'shipping' ? 'makeYourDefaultShippingAddress' : type == 'billing' ? 'makeYourDefaultBillingAddress' : 'makeYourDefaultAddress'}` }))) : (React.createElement(Text, { className: `account-p account-p2 account-font-medium account-primary-color1 address-form-is-default`, text: `${type === 'shipping' ? 'thisYourDefaultShippingAddress' : type == 'billing' ? 'thisYourDefaultBillingAddress' : 'thisYourDefaultAddress'}` }))),
+                React.createElement(Text, { className: `account-p account-p2 account-font-medium account-primary-color1 address-form-is-default-checkbox`, text: `${type === 'shipping' ? 'account.address_management.makeYourDefaultShippingAddress' : type == 'billing' ? 'account.address_management.makeYourDefaultBillingAddress' : 'account.address_management.makeYourDefaultAddress'}` }))) : (React.createElement(Text, { className: `account-p account-p2 account-font-medium account-primary-color1 address-form-is-default`, text: `${type === 'shipping' ? 'account.address_management.thisYourDefaultShippingAddress' : type == 'billing' ? 'account.address_management.thisYourDefaultBillingAddress' : 'account.address_management.thisYourDefaultAddress'}` }))),
             React.createElement("div", { className: `cancel-and-save-wrap` },
-                React.createElement(AccountButton, { text: `cancel`, onClick: closePopup, btnType: `green-large-text`, className: `address-form-cancel-btn` }),
-                React.createElement(AccountButton, { type: 'submit', text: `${isCheckoutPage ? 'saveAndApply' : isEdit ? 'saveChanges' : 'save'}`, btnType: `full-width`, className: `address-form-cancel-submit`, disabled: isDisabled })))));
+                React.createElement(AccountButton, { onClick: closePopup, btnType: `green-large-text`, className: `address-form-cancel-btn`, text: `account.general_actions.cancel` }),
+                React.createElement(AccountButton, { type: 'submit', disabled: isDisabled, btnType: `full-width`, className: `address-form-cancel-submit`, text: `${isCheckoutPage ? 'account.general_actions.saveAndApply' : isEdit ? 'account.general_actions.saveChanges' : 'account.general_actions.save'}` })))));
 });
 export default AddressForm;

package/dist/modules/address/AddressItem/index.js

@@ -13,40 +13,40 @@ const AddressItem = ({ type, title, data, checkout_review, select_address, onCli
     const { translate } = useTranslation();
     //! Handle Popups
     const handleDeletePopup = useCallback(() => {
-        openPopup(React.createElement(WarningMessageForPopup, { isDelete: true, title: 'deleteAddressMessage', description: 'confirmDeleteAddress', onRemove: () => deleteAddress({ addressId: data.id, type: data.type }) }), {
+        openPopup(React.createElement(WarningMessageForPopup, { isDelete: true, title: 'account.address_management.deleteAddressMessage', description: 'account.address_management.confirmDeleteAddress', onRemove: () => deleteAddress({ addressId: data.id, type: data.type }) }), {
             className: 'messagePopup',
             accountIcon: true,
         });
     }, [data]);
     const handleEditAddressPopup = useCallback(() => {
-        openPopup(React.createElement(AddressForm, { title: type === 'billing' ? `updateYourBillingAddress` : type == 'shipping' ? `updateYourShippingAddress` : 'updateYourAddress', data: data }), {
+        openPopup(React.createElement(AddressForm, { title: type === 'billing' ? `account.address_management.updateYourBillingAddress` : type == 'shipping' ? `account.address_management.updateYourShippingAddress` : 'account.address_management.updateYourAddress', data: data }), {
             accountIcon: true,
         });
     }, [data]);
     return data ? (React.createElement(AddressItemStyle, { className: `item-container ${className || ''}` },
         checkout_review && (React.createElement("div", { className: `change-address-wrap` },
             React.createElement(Text, { text: title, className: `account-p account-p2 account-font-bold account-primary-color1` }),
-            React.createElement(AccountButton, { text: `change`, onClick: onClick, btnType: `green-small-text` }))),
+            React.createElement(AccountButton, { onClick: onClick, btnType: `green-small-text`, text: `account.general_actions.change` }))),
         React.createElement("div", { className: `item-internal-wrap user-select-none` }, isNote && data.note_for_courier ? (React.createElement("div", { className: 'flex-box-block' },
             React.createElement("div", { className: `relative-wrapper box-block` },
                 React.createElement("div", { className: `personal-data-wrap` }, data.displayLines.map((line, index) => (React.createElement(Text, { key: index, text: line, className: `account-p account-p3 account-primary-color1 ${index == 0 ? 'account-font-bold' : 'account-font-regular'} ${index == 1 || index == data.displayLines.length - 1 ? 'line-distance' : ''}` })))),
-                data.is_default ? (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color3 margin-style is-default`, text: `${type === 'shipping' ? 'defaultShippingAddress' : type == 'billing' ? 'defaultBillingAddress' : 'defaultAddress'}` })) : (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 margin-style opacity-zero`, text: `empty` }))),
+                data.is_default ? (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color3 margin-style is-default`, text: `${type === 'shipping' ? 'account.address_management.defaultShippingAddress' : type == 'billing' ? 'account.address_management.defaultBillingAddress' : 'account.address_management.defaultAddress'}` })) : (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 margin-style opacity-zero`, text: `empty` }))),
             React.createElement(Text, { className: `account-p account-p3 account-primary-color1 box-block` },
                 React.createElement("span", { className: `account-font-bold` },
-                    translate('note'),
+                    translate('account.order_balance.note'),
                     ":"),
                 " ",
                 React.createElement("span", { className: `account-font-regular` }, data.note_for_courier)))) : (React.createElement(React.Fragment, null,
             React.createElement("div", { className: `relative-wrapper` },
                 React.createElement("div", { className: `personal-data-wrap` }, data.displayLines.map((line, index) => (React.createElement(Text, { key: index, className: `account-p account-p3 account-primary-color1 ${index == 0 ? 'account-font-bold' : 'account-font-regular'} ${index == 1 || index == data.displayLines.length - 1 ? 'line-distance' : ''}`, text: line })))),
-                data.is_default ? (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color3 margin-style is-default`, text: `${type === 'shipping' ? 'defaultShippingAddress' : type == 'billing' ? 'defaultBillingAddress' : 'defaultAddress'}` })) : (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 margin-style opacity-zero`, text: `empty` })),
+                data.is_default ? (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color3 margin-style is-default`, text: `${type === 'shipping' ? 'account.address_management.defaultShippingAddress' : type == 'billing' ? 'account.address_management.defaultBillingAddress' : 'account.address_management.defaultAddress'}` })) : (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 margin-style opacity-zero`, text: `empty` })),
                 select_address && (React.createElement("div", { className: `circle-selected-wrap cursor-pointer ${checkedId == data.id ? 'active' : ''}`, onClick: () => setCheckedId(data.id) },
                     React.createElement("svg", { version: '1.1', viewBox: '0 0 32 32', xmlns: 'http://www.w3.org/2000/svg', className: `checkbox-icon ${selectedAddresses?.id === data.id ? 'selected' : 'note-selected'}` },
                         React.createElement("path", { d: 'M13.345 30.462c-1.062 0-1.859-0.531-2.39-1.328l-9.56-16.996c-0.797-1.328-0.266-2.921 1.062-3.718 1.328-0.531 2.921 0 3.718 1.328l7.436 13.012 12.481-20.183c0.797-1.328 2.39-1.593 3.718-0.797s1.593 2.39 0.797 3.718l-14.871 23.635c-0.531 0.797-1.328 1.328-2.39 1.328z' }))))),
             !checkout_review ? (React.createElement("div", { className: `edit-remove-wrapper` },
-                React.createElement(AccountButton, { text: `edit`, btnType: `green-small-text`, onClick: handleEditAddressPopup, className: `btn-one-address-version ${!select_address || (select_address && checkedId == data.id) ? 'show' : ''}` }),
+                React.createElement(AccountButton, { text: `account.general_actions.edit`, btnType: `green-small-text`, onClick: handleEditAddressPopup, className: `btn-one-address-version ${!select_address || (select_address && checkedId == data.id) ? 'show' : ''}` }),
                 !select_address && !data.is_default && (React.createElement(React.Fragment, null,
                     React.createElement("div", { className: `vertical-line` }),
-                    React.createElement(AccountButton, { text: `remove`, onClick: handleDeletePopup, btnType: `green-small-text`, className: `btn-more-address-version` }))))) : null))))) : null;
+                    React.createElement(AccountButton, { text: `account.general_actions.remove`, onClick: handleDeletePopup, btnType: `green-small-text`, className: `btn-more-address-version` }))))) : null))))) : null;
 };
 export default AddressItem;

package/dist/modules/address/AddressWrap/index.js

@@ -1,26 +1,27 @@
 import React from 'react';
 import classNames from 'classnames';
 import { useAddressContext } from '../AddressProvider';
-import { Text, useUi } from '@weareconceptstudio/core';
+import { Text, useTranslation, useUi } from '@weareconceptstudio/core';
 import AccountButton from '../../../components/AccountButton';
 import EmptyAddress from '../EmptyAddress';
 import AddressItem from '../AddressItem';
 import AddressForm from '../AddressForm';
-const AddressWrap = ({ title = 'addresses', addNewText = 'addNewAdd', type, className }) => {
+const AddressWrap = ({ title = 'account.address_management.addresses', addNewText = 'account.order_balance.addNewAdd', type, className }) => {
     const { openPopup } = useUi();
     const { addresses } = useAddressContext();
+    const { translate } = useTranslation();
     const classString = classNames('address-wrap', {
         [className]: className,
     });
     const handleAddNewAddressPopup = () => {
-        openPopup(React.createElement(AddressForm, { title: 'addNewAddress', type: type }), {
+        openPopup(React.createElement(AddressForm, { title: 'account.address_management.addNewAddress', type: type }), {
             accountIcon: true,
         });
     };
     return (React.createElement("div", { className: classString },
         React.createElement("div", { className: `address-title-container` },
             React.createElement(Text, { className: `account-p account-p1 account-font-bold account-primary-color1`, text: title }),
-            React.createElement(AccountButton, { text: addNewText, btnType: `purple-text`, onClick: handleAddNewAddressPopup })),
+            React.createElement(AccountButton, { btnType: `purple-text`, onClick: handleAddNewAddressPopup, text: `+ ${translate(addNewText)}` })),
         addresses.length > 0 ? (React.createElement("div", { className: `flex-wrapper` }, addresses.map((item, index) => (React.createElement(AddressItem, { key: index, type: type, data: item }))))) : (React.createElement(EmptyAddress, null))));
 };
 export default AddressWrap;

package/dist/modules/address/AddressesTemplate/index.js

@@ -5,7 +5,7 @@ import AddressesTemplateStyle from './style';
 const AddressesTemplate = () => {
     const { hasAddressType } = useAddressContext();
     return (React.createElement(AddressesTemplateStyle, null, hasAddressType ? (React.createElement(React.Fragment, null,
-        React.createElement(AddressWrap, { type: 'shipping', title: 'shippingAddress', addNewText: 'addNewShippingAddress' }),
-        React.createElement(AddressWrap, { type: 'billing', title: 'billingAddress', addNewText: 'addNewBillingAddress' }))) : (React.createElement(AddressWrap, null))));
+        React.createElement(AddressWrap, { type: 'account.address_management.shipping', title: 'account.address_management.shippingAddress', addNewText: 'account.address_management.addNewShippingAddress' }),
+        React.createElement(AddressWrap, { type: 'account.address_management.billing', title: 'account.address_management.billingAddress', addNewText: 'account.address_management.addNewBillingAddress' }))) : (React.createElement(AddressWrap, null))));
 };
 export default AddressesTemplate;

package/dist/modules/address/EmptyAddress/index.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Text } from '@weareconceptstudio/core';
 const EmptyAddress = () => {
-    return (React.createElement(Text, { className: `account-p account-p2 account-font-regular account-primary-color1 empty-address-text`, text: `emptyAddress` }));
+    return (React.createElement(Text, { className: `account-p account-p2 account-font-regular account-primary-color1 empty-address-text`, text: `account.address_management.emptyAddress` }));
 };
 export default EmptyAddress;

package/dist/modules/address/SelectAddress/index.js

@@ -10,15 +10,15 @@ const SelectAddress = () => {
         openPopup(React.createElement(SelectAddressPopup, { title: title, type: type }), { accountIcon: true });
     }, []);
     return (React.createElement("div", { className: `shipping-billing-change-wrapper` }, hasAddressType ? (React.createElement(React.Fragment, null,
-        React.createElement(AddressItem, { checkout_review: true, type: 'shipping', select_address: false, title: 'shippingAddress', data: selectedAddresses.shipping, onClick: () => handleSelectPopup({
-                title: 'selectShippingAddress',
+        React.createElement(AddressItem, { checkout_review: true, type: 'shipping', select_address: false, title: 'account.address_management.shippingAddress', data: selectedAddresses.shipping, onClick: () => handleSelectPopup({
+                title: 'account.order_balance.selectShippingAddress',
                 type: 'shipping',
             }) }),
-        React.createElement(AddressItem, { checkout_review: true, type: 'billing', select_address: false, title: 'billingAddress', data: selectedAddresses.billing, onClick: () => handleSelectPopup({
-                title: 'selectBillingAddress',
+        React.createElement(AddressItem, { checkout_review: true, type: 'billing', select_address: false, title: 'account.address_management.billingAddress', data: selectedAddresses.billing, onClick: () => handleSelectPopup({
+                title: 'account.order_balance.selectBillingAddress',
                 type: 'billing',
-            }) }))) : (React.createElement(AddressItem, { isNote: true, checkout_review: true, type: 'shipping', title: 'address', className: 'full', select_address: false, data: selectedAddresses, onClick: () => handleSelectPopup({
-            title: 'address',
+            }) }))) : (React.createElement(AddressItem, { isNote: true, checkout_review: true, type: 'shipping', title: 'account.address_management.address', className: 'full', select_address: false, data: selectedAddresses, onClick: () => handleSelectPopup({
+            title: 'account.address_management.address',
             type: null,
         }) }))));
 };

package/dist/modules/address/SelectAddressPopup/index.js

@@ -18,7 +18,7 @@ const SelectAddressPopup = Memo(({ title, type }) => {
     const [refElement, setRefElement] = useState();
     const resize = useResizeObserver(flexWrapperRef.current ? [...[...flexWrapperRef.current.children].map((item) => item)] : null);
     const handleNewAddressPopup = () => {
-        openPopup(React.createElement(AddressForm, { title: type == 'shipping' ? `addNewShippingAddress` : type == 'billing' ? 'addNewBillingAddress' : 'addNewAddress', type: type }), {
+        openPopup(React.createElement(AddressForm, { title: type == 'shipping' ? `account.address_management.addNewShippingAddress` : type == 'billing' ? 'account.address_management.addNewBillingAddress' : 'account.address_management.addNewAddress', type: type }), {
             accountIcon: true,
         });
     };
@@ -40,12 +40,12 @@ const SelectAddressPopup = Memo(({ title, type }) => {
     return (React.createElement(SelectAddressPopupStyle, { ref: styleRef },
         React.createElement("div", { className: `select-address-wrap` },
             React.createElement(Text, { tag: `h6`, className: hasAddressType ? `account-h6 account-font-bold account-primary-color1` : 'account-p account-p2 account-font-bold account-primary-color1', text: title }),
-            React.createElement(AccountButton, { onClick: handleNewAddressPopup, text: `addNewAdd`, btnType: hasAddressType ? `purple-text` : 'green-small-text' })),
+            React.createElement(AccountButton, { onClick: handleNewAddressPopup, text: `account.order_balance.addNewAdd`, btnType: hasAddressType ? `purple-text` : 'green-small-text' })),
         addresses?.length > 0 ? (React.createElement("div", { ref: flexWrapperRef, className: `flex-wrapper` }, addresses.map((item, index) => {
             return (React.createElement(AddressItem, { type: type, data: item, key: index, id: item.id, select_address: true, checkedId: checkedId, checkout_review: false, setCheckedId: setCheckedId }));
         }))) : null,
         React.createElement("div", { className: `cancel-and-save-wrap` },
-            React.createElement(AccountButton, { text: `cancel`, onClick: closePopup, btnType: `green-large-text` }),
-            React.createElement(AccountButton, { text: `saveAndApply`, btnType: `full-width`, onClick: handleAddressChangeSubmit }))));
+            React.createElement(AccountButton, { onClick: closePopup, btnType: `green-large-text`, text: `account.general_actions.cancel` }),
+            React.createElement(AccountButton, { btnType: `full-width`, onClick: handleAddressChangeSubmit, text: `account.general_actions.saveAndApply` }))));
 });
 export default SelectAddressPopup;

package/dist/modules/address/ShippingBillingInfo/index.js

@@ -1,16 +1,19 @@
 import React, { memo } from 'react';
-import { Text } from '@weareconceptstudio/core';
+import { Text, useTranslation } from '@weareconceptstudio/core';
 import { useAddressContext } from '../AddressProvider';
 //* Style
 import ShippingBillingInfoStyle from './style';
 // TODO: Address info to component
 const ShippingBillingInfo = memo(({ className, shipping_address, billing_address }) => {
     const { addressType } = useAddressContext();
+    const { translate } = useTranslation();
     return (React.createElement(ShippingBillingInfoStyle, { className: `${className || ''}` },
-        React.createElement(Text, { className: `account-p account-p1 account-font-bold account-primary-color1`, text: addressType ? 'shippingAndBillingInfo' : 'shippingInfo' }),
+        React.createElement(Text, { className: `account-p account-p1 account-font-bold account-primary-color1`, text: addressType ? 'account.order_balance.shippingAndBillingInfo' : 'account.order_balance.shippingInfo' }),
         React.createElement("div", { className: `info-space-line` }),
         React.createElement("div", { className: `info-wrap shipped` },
-            React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 m-bot`, text: `shippedTo` }),
+            React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 m-bot` },
+                translate('account.order_balance.shippedTo'),
+                ":"),
             shipping_address.map((item, index) => (React.createElement(Text, { key: index, className: `account-p account-p3 account-font-regular account-primary-color1 nowrap ${index == shipping_address.length - 1 ? 'm-top' : ''}`, text: item }))))));
 });
 export default ShippingBillingInfo;