@designcrowd/library.brand-page 5.15.21 → 5.15.23

package/lib/src/shared/content-settings/components/content-settings/ContentSettings.mixin.d.ts

@@ -659,6 +659,7 @@ declare const _default: import("vue").DefineComponent<{}, {
             logoImageHeight: string | undefined;
             logoImageWidth: string | undefined;
         }): void;
+        updatePaymentConfigCurrency(updatedPaymentConfig: import("../../../../brand-page").BrandPagePaymentConfig, newCurrency: import("../../../../brand-page").BrandPagePaymentConfigCurrency): void;
         setPageTitle({ pageTitle, pageIndex, }: {
             pageTitle: string;
             pageIndex: number;

package/lib/src/shared/content-settings/components/content-settings/ReplaceImageSettingsForContent.mixin.d.ts

@@ -535,6 +535,7 @@ declare const _default: import("vue").DefineComponent<{}, {
             logoImageHeight: string | undefined;
             logoImageWidth: string | undefined;
         }): void;
+        updatePaymentConfigCurrency(updatedPaymentConfig: import("../../../../brand-page").BrandPagePaymentConfig, newCurrency: import("../../../../brand-page").BrandPagePaymentConfigCurrency): void;
         setPageTitle({ pageTitle, pageIndex, }: {
             pageTitle: string;
             pageIndex: number;

package/lib/src/shared/content-settings/components/content-settings-item/ContentSettingsItemField.mixin.d.ts

@@ -733,6 +733,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             logoImageHeight: string | undefined;
             logoImageWidth: string | undefined;
         }): void;
+        updatePaymentConfigCurrency(updatedPaymentConfig: import("../../../../brand-page").BrandPagePaymentConfig, newCurrency: import("../../../../brand-page").BrandPagePaymentConfigCurrency): void;
         setPageTitle({ pageTitle, pageIndex, }: {
             pageTitle: string;
             pageIndex: number;

package/lib/src/shared/content-settings/components/page-dropdown-field/PageDropdownField.mixin.d.ts

@@ -76,6 +76,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             logoImageHeight: string | undefined;
             logoImageWidth: string | undefined;
         }): void;
+        updatePaymentConfigCurrency(updatedPaymentConfig: import("../../../../brand-page").BrandPagePaymentConfig, newCurrency: import("../../../../brand-page").BrandPagePaymentConfigCurrency): void;
         setPageTitle({ pageTitle, pageIndex, }: {
             pageTitle: string;
             pageIndex: number;

package/lib/src/shared/content-settings/components/payment-config-field/PaymentConfigField.mixin.d.ts

@@ -1,5 +1,5 @@
 import type { PropType } from 'vue';
-import type { BrandPagePaymentConfig, PaymentConfig } from '../../../../brand-page';
+import type { BrandPagePaymentConfig, BrandPagePaymentConfigCurrency, PaymentConfig } from '../../../../brand-page';
 declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     id: {
         type: StringConstructor;
@@ -368,8 +368,85 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         deleteProduct(id: any): void;
         getVariantCombinations(variants: import("../../../../brand-page/models/shop.model").VariantModel[]): import("../../../../brand-page/models/shop.model").VariantOptionModel[][];
     }>;
+    uiPageSettingsStore: import("pinia").Store<"uiPageSettings", import("../../../page-settings/store/page-settings-store").PageSettingsState, {
+        pageIndex(): number;
+    }, {
+        setCurrentPageIndex({ pageIndex }: {
+            pageIndex: number;
+        }): void;
+        setState({ newState, }: {
+            newState: Omit<import("../../../page-settings/store/page-settings-store").PageSettingsState, "sectionCollapsedStates">;
+        }): void;
+        setPageContents({ pageIndex, contents, }: {
+            pageIndex: number;
+            contents: import("../../models").ContentItem<import("../../../../brand-page").Content>[];
+        }): void;
+        setPages({ pages }: {
+            pages: import("../../../page-settings/models").ContentPage[];
+        }): void;
+        setNewPageModalVisibilityAsync({ isNewPageModalVisible, }: {
+            isNewPageModalVisible: boolean;
+        }): Promise<void>;
+        addPage({ page }: {
+            page: import("../../../page-settings/models").ContentPage;
+        }): void;
+        setPageTitleAndSlug({ title, slug, index, }: {
+            title: string;
+            slug: string;
+            index: number;
+        }): void;
+        setPageVisibility({ isHidden, index, }: {
+            isHidden: boolean;
+            index: number;
+        }): void;
+        setPageSettingsSectionValue({ sectionName, propName, index, value, merge, viewport, }: {
+            sectionName: "footer" | "header" | "pages";
+            propName: "copyrightStyle" | "style" | "iconStyle" | "displayStyle" | "backgroundStyle" | "logoImage" | "logoImageStyle" | "isLogoOptional" | "viewport" | "isLogoVisible" | "logoTemplateImage" | "logoImageHeight" | "logoImageWidth" | "navigationStyles" | "navigation" | "logoImageUrl" | "logoDraftToken" | "logoVariation" | "logoImageBase64Url" | "backgroundColorEnabled" | "copyrightText" | "socialLinks" | "textFontFamily";
+            index?: number | undefined;
+            value: string | number | boolean | BrandPageCssStyle | import("../../../../brand-page").LinksItem[] | Partial<import("../../../../brand-page").ImageItem> | null | undefined;
+            merge?: boolean | undefined;
+            viewport: import("../../../../brand-page").ViewportsType;
+        }): void;
+        setPageSettingsSectionLogoImage({ sectionName, logoImage, logoTemplateImage, logoImageBase64Url, viewport, keepLogoVariation, logoImageHeight, logoImageWidth, }: {
+            logoImage: import("../../../../brand-page").LogoImageModel;
+            logoTemplateImage?: import("../../../../brand-page").LogoTemplateImageModel | undefined;
+            logoImageBase64Url: string | undefined;
+            sectionName: "footer" | "header" | "pages";
+            viewport: import("../../../../brand-page").ViewportsType;
+            keepLogoVariation?: boolean | undefined;
+            logoImageHeight?: string | undefined;
+            logoImageWidth?: string | undefined;
+        }): void;
+        updatePageSettingsSectionLogoImageStyle({ sectionName, viewport, logoImageHeight, logoImageWidth, }: {
+            sectionName: string;
+            viewport: string;
+            logoImageHeight: string | undefined;
+            logoImageWidth: string | undefined;
+        }): void;
+        updatePaymentConfigCurrency(updatedPaymentConfig: BrandPagePaymentConfig, newCurrency: BrandPagePaymentConfigCurrency): void;
+        setPageTitle({ pageTitle, pageIndex, }: {
+            pageTitle: string;
+            pageIndex: number;
+        }): void;
+        setCurrentPageIndexAndGoToPage({ pageIndex }: {
+            pageIndex: number;
+        }): void;
+        addNewPage(payload: {
+            title: string;
+        }): void;
+        setSelectedSectionName({ sectionName, }: {
+            sectionName?: "footer" | "header" | "pages" | undefined;
+        }): void;
+        setSectionCollapsedState({ sectionName, isCollapsed, }: {
+            sectionName: "footer" | "header" | "pages";
+            isCollapsed: boolean;
+        }): void;
+        collapseAllSections(): void;
+        setPreviousSelectedDisplayStyle(viewport: string, displayStyle: string): void;
+    }>;
 }, {
     selectedPaymentConfig: BrandPagePaymentConfig | undefined;
+    isCurrencyUpdating: boolean;
 }, {
     currencySymbol(): string;
     isPaymentConfigActive(): boolean;
@@ -382,6 +459,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     onAddPaymentProviderClick(): Promise<void>;
     onPaymentConfigSelected(paymentConfig: BrandPagePaymentConfig): void;
     updatePaymentConfig(paymentConfig: BrandPagePaymentConfig): void;
+    onCurrencySelected(selectedCurrency: BrandPagePaymentConfigCurrency): Promise<void>;
 }, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     id: {
         type: StringConstructor;

package/lib/src/shared/content-settings/components/payment-config-field/PaymentConfigField.mixin.js

@@ -2,6 +2,8 @@ import { computed, defineComponent } from 'vue';
 import { useBrandPageContainerStore, useEventManagerStore, } from '../../../../brand-page-maker/stores';
 import { useShopConfigStore } from '../../../../shared/ecommerce-settings/store/shop-settings-store';
 import { paymentConfigTr } from '../../../../composables/useTranslate';
+import brandPageClient from '../../../../clients/brand-page-client';
+import { useUiPageSettingsStore } from '../../../../shared/page-settings/store';
 export default defineComponent({
     props: {
         id: {
@@ -24,6 +26,7 @@ export default defineComponent({
     },
     setup() {
         const brandPageContainerStore = useBrandPageContainerStore();
+        const uiPageSettingsStore = useUiPageSettingsStore();
         const eventManagerStore = useEventManagerStore();
         const shopConfigStore = useShopConfigStore();
         return {
@@ -32,11 +35,13 @@ export default defineComponent({
             brandPageContainerStore,
             eventManagerStore,
             shopConfigStore,
+            uiPageSettingsStore,
         };
     },
     emits: ['update:modelValue'],
     data: () => ({
         selectedPaymentConfig: undefined,
+        isCurrencyUpdating: false,
     }),
     computed: {
         currencySymbol() {
@@ -131,5 +136,16 @@ export default defineComponent({
             };
             this.$emit('update:modelValue', payload);
         },
+        async onCurrencySelected(selectedCurrency) {
+            if (this.selectedPaymentConfig.defaultCurrency ===
+                selectedCurrency.iso4127Code) {
+                return;
+            }
+            this.isCurrencyUpdating = true;
+            const updatedPaymentConfig = await brandPageClient.updatePaymentConfigCurrencyAsync(this.brandPageToken, this.selectedPaymentConfig.id, selectedCurrency.id);
+            this.uiPageSettingsStore.updatePaymentConfigCurrency(updatedPaymentConfig, selectedCurrency);
+            await this.brandPageContainerStore.saveBrandPage();
+            this.isCurrencyUpdating = false;
+        },
     },
 });

package/lib/src/shared/logo-settings/components/LogoSettings.mixin.d.ts

@@ -556,6 +556,7 @@ declare const _default: import("vue").DefineComponent<{}, {
             logoImageHeight: string | undefined;
             logoImageWidth: string | undefined;
         }): void;
+        updatePaymentConfigCurrency(updatedPaymentConfig: import("../../../brand-page").BrandPagePaymentConfig, newCurrency: import("../../../brand-page").BrandPagePaymentConfigCurrency): void;
         setPageTitle({ pageTitle, pageIndex, }: {
             pageTitle: string;
             pageIndex: number;

package/lib/src/shared/page-settings/components/new-page-modal/NewPageModal.mixin.d.ts

@@ -55,6 +55,7 @@ declare const _default: import("vue").DefineComponent<{}, {
             logoImageHeight: string | undefined;
             logoImageWidth: string | undefined;
         }): void;
+        updatePaymentConfigCurrency(updatedPaymentConfig: import("../../../../brand-page").BrandPagePaymentConfig, newCurrency: import("../../../../brand-page").BrandPagePaymentConfigCurrency): void;
         setPageTitle({ pageTitle, pageIndex, }: {
             pageTitle: string;
             pageIndex: number;

package/lib/src/shared/page-settings/components/page-settings/PageSettings.mixin.d.ts

@@ -3948,6 +3948,7 @@ declare const _default: import("vue").DefineComponent<{}, {
             logoImageHeight: string | undefined;
             logoImageWidth: string | undefined;
         }): void;
+        updatePaymentConfigCurrency(updatedPaymentConfig: import("../../../../brand-page").BrandPagePaymentConfig, newCurrency: import("../../../../brand-page").BrandPagePaymentConfigCurrency): void;
         setPageTitle({ pageTitle, pageIndex, }: {
             pageTitle: string;
             pageIndex: number;

package/lib/src/shared/page-settings/components/page-settings-section-styles/PageSettingsSectionStyles.mixin.d.ts

@@ -3267,6 +3267,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             logoImageHeight: string | undefined;
             logoImageWidth: string | undefined;
         }): void;
+        updatePaymentConfigCurrency(updatedPaymentConfig: import("../../../../brand-page").BrandPagePaymentConfig, newCurrency: import("../../../../brand-page").BrandPagePaymentConfigCurrency): void;
         setPageTitle({ pageTitle, pageIndex, }: {
             pageTitle: string;
             pageIndex: number;

package/lib/src/shared/page-settings/store/page-settings-store.d.ts

@@ -1,6 +1,6 @@
 import type { ContentItem } from '../../content-settings/models';
 import { PageHeaderDesktop, PageHeaderMobile, PageFooterDesktop, PageFooterMobile, VIEWPORTS } from '../../../brand-page';
-import type { Content, ImageGalleryItem, LinksItem, LogoImageModel, ViewportsType, LogoTemplateImageModel } from '../../../brand-page';
+import type { Content, ImageGalleryItem, LinksItem, LogoImageModel, ViewportsType, LogoTemplateImageModel, BrandPagePaymentConfig, BrandPagePaymentConfigCurrency } from '../../../brand-page';
 import type { ContentPage } from '../models';
 import { PAGE_SECTIONS } from '../models';
 export type PageSettingsStateSectionStyles = Partial<PageHeaderDesktop & PageHeaderMobile & PageFooterDesktop & PageFooterMobile>;
@@ -88,6 +88,7 @@ export declare const useUiPageSettingsStore: import("pinia").StoreDefinition<"ui
         logoImageHeight: string | undefined;
         logoImageWidth: string | undefined;
     }): void;
+    updatePaymentConfigCurrency(updatedPaymentConfig: BrandPagePaymentConfig, newCurrency: BrandPagePaymentConfigCurrency): void;
     setPageTitle({ pageTitle, pageIndex, }: {
         pageTitle: string;
         pageIndex: number;

package/lib/src/shared/page-settings/store/page-settings-store.js

@@ -7,6 +7,7 @@ import { useUiContentSettingsStore } from '../../content-settings/store';
 import { useBrandPageMakerStore, useBrandPageMakerUserStore, useBrandPageContainerStore, useUiStore, } from '../../../brand-page-maker/stores';
 import { useUiLogoSettingsStore } from '../../logo-settings/store';
 import { TRIGGER_TYPE, UPGRADE_CTA_LOCATIONS, useEventTracker, } from '../../../brand-page-maker/composables/useEventTracker';
+import { useShopConfigStore } from '../../ecommerce-settings/store/shop-settings-store';
 export const PAGE_SECTIONS_PAGES = 'pages';
 export const PAGE_SETTINGS_SECTIONS = {
     ...PAGE_SECTIONS,
@@ -162,6 +163,40 @@ export const useUiPageSettingsStore = defineStore('uiPageSettings', {
             this.sections[sectionName][viewport].logoImageHeight = logoImageHeight;
             this.sections[sectionName][viewport].logoImageWidth = logoImageWidth;
         },
+        updatePaymentConfigCurrency(updatedPaymentConfig, newCurrency) {
+            const currencyUpdate = {
+                name: updatedPaymentConfig.name,
+                defaultCurrency: newCurrency.iso4127Code,
+                defaultCurrencySymbol: newCurrency.symbol,
+            };
+            this.pages.forEach((page) => {
+                page.contents.forEach((contentItem) => {
+                    if (contentItem.type === 'support-me') {
+                        if (contentItem.settings.content.supportMeConfig.paymentConfig?.id ===
+                            updatedPaymentConfig.id) {
+                            Object.assign(contentItem.settings.content.supportMeConfig.paymentConfig, currencyUpdate);
+                        }
+                    }
+                    else if (contentItem.type === 'request-payment') {
+                        if (contentItem.settings.content.requestPaymentConfig.paymentConfig
+                            ?.id === updatedPaymentConfig.id) {
+                            Object.assign(contentItem.settings.content.requestPaymentConfig.paymentConfig, currencyUpdate);
+                        }
+                    }
+                    else if (contentItem.type === 'shop-section') {
+                        if (contentItem.settings.content.shopPaymentConfig.paymentConfig
+                            ?.id === updatedPaymentConfig.id) {
+                            Object.assign(contentItem.settings.content.shopPaymentConfig.paymentConfig, currencyUpdate);
+                        }
+                    }
+                });
+            });
+            const shopConfigStore = useShopConfigStore();
+            if (shopConfigStore.paymentConfig &&
+                shopConfigStore.paymentConfig.id === updatedPaymentConfig.id) {
+                Object.assign(shopConfigStore.paymentConfig, currencyUpdate);
+            }
+        },
         setPageTitle({ pageTitle, pageIndex, }) {
             const slug = getPageSlugFromPageTitle(pageTitle, this.pages.filter((_p, i) => i !== pageIndex).map((p) => p.slug));
             this.setPageTitleAndSlug({

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@designcrowd/library.brand-page",
   "description": "A collection of Maker/Designer applications",
-  "version": "5.15.21",
+  "version": "5.15.23",
   "author": "Design.com Eng",
   "license": "UNLICENSED",
   "type": "module",
@@ -55,7 +55,7 @@
   },
   "dependencies": {
     "@ckpack/vue-color": "1.4.1",
-    "@designcrowd/fe-shared-lib": "1.4.1",
+    "@designcrowd/fe-shared-lib": "1.4.3",
     "@pinia/nuxt": "0.11.0",
     "@storybook/react": "9.0.4",
     "@tiptap/extension-bubble-menu": "^2.14.0",

package/src/brand-page/models/payment.model.ts

@@ -52,6 +52,14 @@ export interface PaymentConfig {
   paymentOptions: PaymentOption[];
 }
 
+export interface BrandPagePaymentConfigCurrency {
+  id: string;
+  iso31662Code: string;
+  iso4127Code: string;
+  name: string;
+  symbol: string;
+}
+
 export const PAYMENT_OPTION_DISPLAY_TYPES = {
   text: 'text',
   thumbnail: 'thumbnail',

package/src/clients/brand-page-client.ts

@@ -376,6 +376,23 @@ const sendLogoSearchImpressionClickData = async (
   }
 };
 
+const updatePaymentConfigCurrencyAsync = async (
+  brandPageToken: string,
+  paymentConfigId: string,
+  newCurrencyId: string,
+) => {
+  const url = `${getApiUrlPrefix(
+    BRAND_PAGE_TYPES.default,
+  )}/${brandPageToken}/payment-configs/update-currency`;
+
+  const response = await getAxiosInstance().put(url, {
+    paymentConfigId,
+    newCurrencyId,
+  });
+
+  return response.data;
+};
+
 export default {
   saveBrandPageAsync,
   setBrandPageSlugAsync,
@@ -394,4 +411,5 @@ export default {
   checkWebsiteSlugAsync,
   searchLogoTemplatesAsync,
   sendLogoSearchImpressionClickData,
+  updatePaymentConfigCurrencyAsync,
 };

package/src/shared/content-settings/components/payment-config-field/PaymentConfigField.mixin.ts

@@ -2,6 +2,7 @@ import type { PropType } from 'vue';
 import { computed, defineComponent } from 'vue';
 import type {
   BrandPagePaymentConfig,
+  BrandPagePaymentConfigCurrency,
   PaymentConfig,
   RequestPaymentConfig,
 } from '../../../../brand-page';
@@ -12,6 +13,8 @@ import {
 } from '../../../../brand-page-maker/stores';
 import { useShopConfigStore } from '../../../../shared/ecommerce-settings/store/shop-settings-store';
 import { paymentConfigTr } from '../../../../composables/useTranslate';
+import brandPageClient from '../../../../clients/brand-page-client';
+import { useUiPageSettingsStore } from '../../../../shared/page-settings/store';
 
 export default defineComponent({
   props: {
@@ -35,6 +38,7 @@ export default defineComponent({
   },
   setup() {
     const brandPageContainerStore = useBrandPageContainerStore();
+    const uiPageSettingsStore = useUiPageSettingsStore();
     const eventManagerStore = useEventManagerStore();
     const shopConfigStore = useShopConfigStore();
 
@@ -46,11 +50,13 @@ export default defineComponent({
       brandPageContainerStore,
       eventManagerStore,
       shopConfigStore,
+      uiPageSettingsStore,
     };
   },
   emits: ['update:modelValue'],
   data: () => ({
     selectedPaymentConfig: undefined as BrandPagePaymentConfig | undefined,
+    isCurrencyUpdating: false,
   }),
   computed: {
     currencySymbol(): string {
@@ -153,5 +159,33 @@ export default defineComponent({
 
       this.$emit('update:modelValue', payload);
     },
+    async onCurrencySelected(
+      selectedCurrency: BrandPagePaymentConfigCurrency,
+    ): Promise<void> {
+      if (
+        this.selectedPaymentConfig.defaultCurrency ===
+        selectedCurrency.iso4127Code
+      ) {
+        return;
+      }
+
+      this.isCurrencyUpdating = true;
+
+      const updatedPaymentConfig =
+        await brandPageClient.updatePaymentConfigCurrencyAsync(
+          this.brandPageToken,
+          this.selectedPaymentConfig.id,
+          selectedCurrency.id,
+        );
+
+      this.uiPageSettingsStore.updatePaymentConfigCurrency(
+        updatedPaymentConfig,
+        selectedCurrency,
+      );
+
+      await this.brandPageContainerStore.saveBrandPage();
+
+      this.isCurrencyUpdating = false;
+    },
   },
 });

package/src/shared/content-settings/components/payment-config-field/PaymentConfigField.vue

@@ -10,12 +10,22 @@
       </p>
 
       <!-- Start Payment Config Dropdown -->
-      <PaymentConfigDropdown
-        :brand-page-token="brandPageToken"
-        :payment-config-id="selectedPaymentConfigId"
-        @on-add-payment-provider-click="onAddPaymentProviderClick"
-        @on-payment-config-selected="onPaymentConfigSelected"
-      />
+      <div class="tw-relative">
+        <PaymentConfigDropdown
+          :brand-page-token="brandPageToken"
+          :payment-config-id="selectedPaymentConfigId"
+          @on-add-payment-provider-click="onAddPaymentProviderClick"
+          @on-payment-config-selected="onPaymentConfigSelected"
+          @on-currency-selected="onCurrencySelected"
+        />
+        <div
+          v-if="isCurrencyUpdating"
+          class="tw-absolute tw-top-0 tw-w-full tw-h-full tw-flex tw-justify-center tw-items-center tw-opacity-50 tw-bg-grayscale-100"
+        >
+          <Loader />
+        </div>
+      </div>
+
       <!-- End Payment Config Dropdown -->
     </template>
 
@@ -49,8 +59,12 @@
   </div>
 </template>
 <script>
-import { Button, HelloBar } from '@designcrowd/fe-shared-lib';
-import { PaymentConfigDropdown } from '@designcrowd/fe-shared-lib';
+import {
+  Button,
+  HelloBar,
+  PaymentConfigDropdown,
+  Loader,
+} from '@designcrowd/fe-shared-lib';
 import PaymentConfigFieldMixin from './PaymentConfigField.mixin.ts';
 import { paymentConfigTr } from '../../../../composables/useTranslate';
 
@@ -59,6 +73,7 @@ export default {
     Button,
     PaymentConfigDropdown,
     HelloBar,
+    Loader,
   },
   mixins: [PaymentConfigFieldMixin],
   setup(props, context) {

package/src/shared/page-settings/store/page-settings-store.ts

@@ -15,6 +15,8 @@ import type {
   LogoImageModel,
   ViewportsType,
   LogoTemplateImageModel,
+  BrandPagePaymentConfig,
+  BrandPagePaymentConfigCurrency,
 } from '../../../brand-page';
 import type { ContentPage } from '../models';
 import { PAGE_SECTIONS } from '../models';
@@ -33,6 +35,7 @@ import {
   UPGRADE_CTA_LOCATIONS,
   useEventTracker,
 } from '../../../brand-page-maker/composables/useEventTracker';
+import { useShopConfigStore } from '../../ecommerce-settings/store/shop-settings-store';
 
 // TODO - double check this is logically correct
 export type PageSettingsStateSectionStyles = Partial<
@@ -344,6 +347,61 @@ export const useUiPageSettingsStore = defineStore('uiPageSettings', {
       this.sections[sectionName][viewport].logoImageHeight = logoImageHeight;
       this.sections[sectionName][viewport].logoImageWidth = logoImageWidth;
     },
+    updatePaymentConfigCurrency(
+      updatedPaymentConfig: BrandPagePaymentConfig,
+      newCurrency: BrandPagePaymentConfigCurrency,
+    ) {
+      const currencyUpdate = {
+        name: updatedPaymentConfig.name,
+        defaultCurrency: newCurrency.iso4127Code,
+        defaultCurrencySymbol: newCurrency.symbol,
+      };
+
+      this.pages.forEach((page) => {
+        page.contents.forEach((contentItem) => {
+          if (contentItem.type === 'support-me') {
+            if (
+              contentItem.settings.content.supportMeConfig.paymentConfig?.id ===
+              updatedPaymentConfig.id
+            ) {
+              Object.assign(
+                contentItem.settings.content.supportMeConfig.paymentConfig,
+                currencyUpdate,
+              );
+            }
+          } else if (contentItem.type === 'request-payment') {
+            if (
+              contentItem.settings.content.requestPaymentConfig.paymentConfig
+                ?.id === updatedPaymentConfig.id
+            ) {
+              Object.assign(
+                contentItem.settings.content.requestPaymentConfig.paymentConfig,
+                currencyUpdate,
+              );
+            }
+          } else if (contentItem.type === 'shop-section') {
+            if (
+              contentItem.settings.content.shopPaymentConfig.paymentConfig
+                ?.id === updatedPaymentConfig.id
+            ) {
+              Object.assign(
+                contentItem.settings.content.shopPaymentConfig.paymentConfig,
+                currencyUpdate,
+              );
+            }
+          }
+        });
+      });
+
+      const shopConfigStore = useShopConfigStore();
+
+      if (
+        shopConfigStore.paymentConfig &&
+        shopConfigStore.paymentConfig.id === updatedPaymentConfig.id
+      ) {
+        Object.assign(shopConfigStore.paymentConfig, currencyUpdate);
+      }
+    },
     setPageTitle({
       pageTitle,
       pageIndex,

package/lib/src/bundled-translations-BMr0LtzI.js

@@ -1,27 +0,0 @@
-const e = { domainCreditUsed: "Domain credit used", free: "Free" }, o = { onboardingIncomplete: "Onboarding Incomplete", pendingVerification: "Pending Verification", connected: "Connected", inactive: "Inactive", addPaymentProvider: "Add Payment Provider", deletePaymentMethod: "Delete payment method" }, a = { firstTimePublishHeaderLabel: "Set the URL for {{brandPageDisplayName}}", sitePublishedLabel: "Site published!", publishSuccessLabel: "Your {{brandPageDisplayName}} is live! Start using your link:", freePublishCardTitleLabel: "Free Address", freePublishCardDescriptionLabel: "Choose a free address to publish now. You can always edit the URL later", slugInputPlaceholderYourNameLabel: "your-name", slugInputPlaceholderYourBusinessNameLabel: "your-business-name", freeDomainLabel: "Free domain", purchasedDomainLabel: "Purchased domain", setUrlLabel: "Set URL", publishLabel: "Publish", viewMoreDomainLabel: "VIEW MORE DOMAINS", viewMyWebsiteLabel: "View {{brandPageDisplayName}}", copyLabel: "Copy", copySuccessLabel: "Copied!", publishedSuccessDescriptionLabel: "Buy matching domain name for your brand", hasAlreadyPurchasedDomainCloseButtonLabel: "No thanks, maybe later", selectDomainDropdownPlaceholder: "Select domain name", websiteFriendlyName: "Website", digitalBusinessCardFriendlyName: "Digital Business Card" }, r = { freeDomainButtonLabel: "Free Domain", buyNowButtonLabel: "Buy Now", pricePerYearLabel: "/yr", costPriceLabel: "Cost Price:" }, i = { domainSearchHeaderTitle: "Search a domain name", domainSearchHeaderSubtitle: "Buy matching domain name for your brand" }, n = { domainSearchHeaderTitle: "Search a domain name", domainSearchHeaderSubtitle: "Buy matching domain name for your brand" }, l = { searchButtonLabel: "Search", searchBarLabel: "Search", searchBarPlaceholder: "Search domain names", searchBarPreText: "Domain name" }, t = { domainSearchEmptyMessage: `Sorry, we couldn't find any domain for "{{domainNameSearchTerm}}".`, searchAnotherDomainMessage: "Try searching with another domain name." }, s = { searchButtonLabel: "Search", searchBarLabel: "Search", searchBarPlaceholder: "Search domain names", domainSearchOrConnectHeaderSubtitle: "Buy matching domain name for your brand or connect your existing domain" }, c = { uploadYourLogoText: "Upload your logo", disclaimerText: "Please ensure you have the right to use any image you upload.", generatingDesigns: "Generating Designs...", uploadingAndConverting: "Uploading and converting your logo...", stepOf: "Step {{CURRENT}} of {{TOTAL}}", uploadError: "Upload Error", cancel: "Cancel", continue: "Continue", back: "Back", no: "No", yes: "Yes", businessName: "Business Name", businessNameDescription: "Enter your logo text or business name", cropYourLogo: "Crop your logo", cropDescription: "Crop your logo design to fit our logo maker canvas", logoPreview: "Logo preview", logoPreviewDescription: "Your logo looks great! Help us setup your logo by completing the next steps.", primaryTextColor: "Primary text color", primaryTextColorDescription: "Help us setup your logo by confirming the primary text color. Choose from the available colors or click the plus icon to add another.", backgroundColor: "Background color", backgroundColorDescription: "Help us setup your logo by confirming the background color. Choose from the available colors or click the plus icon to add another.", colorsWarning: "Your text and background colors are too similar. Please choose a more distinct pairing to ensure they create quality designs.", exitConfirmationTitle: "Are you sure you want to exit?", exitConfirmationDescription: "Your logo upload progress in this session will be lost", maxByoFileErrorMessage: "Your file exceeds the maximum size of 25MB. Please choose a smaller file.", genericByoErrorMessage: "An unexpected error occured. Please try again.", dropYourFileHere: "Drop your file here or", clickToUpload: "click to upload", acceptedFiles: "We accept PNG, JPG, SVG or EPS files up to 25MB", wrongUploadType: "You can't upload files of this type." }, d = { replace: "Replace", replaceLogo: "Replace Logo", delete: "Delete", deleteLogo: "Delete Logo" }, u = {
-  price: e,
-  sharedPaymentConfig: o,
-  publishBrandPageModal: a,
-  sellDomainNameList: r,
-  sellDomainNameListModal: i,
-  sellDomainNameModalApplication: n,
-  sellDomainNameSearch: l,
-  sellDomainNameListSearchResult: t,
-  sellDomainNameWidget: s,
-  uploadYourLogo: c,
-  uploadLogoSearchResultCard: d
-};
-export {
-  u as default,
-  e as price,
-  a as publishBrandPageModal,
-  r as sellDomainNameList,
-  i as sellDomainNameListModal,
-  t as sellDomainNameListSearchResult,
-  n as sellDomainNameModalApplication,
-  l as sellDomainNameSearch,
-  s as sellDomainNameWidget,
-  o as sharedPaymentConfig,
-  d as uploadLogoSearchResultCard,
-  c as uploadYourLogo
-};

package/lib/src/bundled-translations.de-DE-BDSwnN6z.js

@@ -1,27 +0,0 @@
-const e = { domainCreditUsed: "Verwendetes Domain-Guthaben", free: "Kostenlos" }, n = { onboardingIncomplete: "Das Onboarding wurde noch nicht abgeschlossen.", pendingVerification: "Ausstehende Verifizierung", connected: "Verbunden", inactive: "Inaktiv", addPaymentProvider: "Zahlungsanbieter hinzufügen", deletePaymentMethod: "Zahlungsmethode löschen" }, i = { firstTimePublishHeaderLabel: "Legen Sie die URL für {{brandPageDisplayName}} fest", sitePublishedLabel: "Seite veröffentlicht!", publishSuccessLabel: "Ihr {{brandPageDisplayName}} ist live! Beginnen Sie mit der Nutzung Ihres Links:", freePublishCardTitleLabel: "Freie Adresse", freePublishCardDescriptionLabel: "Wählen Sie jetzt eine kostenlose Adresse zur Veröffentlichung aus. Sie können die URL später jederzeit bearbeiten", slugInputPlaceholderYourNameLabel: "ihr-name", slugInputPlaceholderYourBusinessNameLabel: "ihr-firmen-name", freeDomainLabel: "Kostenlose Domain", purchasedDomainLabel: "Erworbene Domain", setUrlLabel: "URL festlegen", publishLabel: "Veröffentlichen", viewMoreDomainLabel: "WEITERE DOMAINS ANZEIGEN", viewMyWebsiteLabel: "{{brandPageDisplayName}} anzeigen", copyLabel: "Kopieren", copySuccessLabel: "Kopiert!", publishedSuccessDescriptionLabel: "Kaufen Sie eine passende Domain für Ihre Marke", hasAlreadyPurchasedDomainCloseButtonLabel: "Nein, danke, vielleicht später", selectDomainDropdownPlaceholder: "Domain auswählen", websiteFriendlyName: "Website", digitalBusinessCardFriendlyName: "Digitale Visitenkarte" }, r = { freeDomainButtonLabel: "Kostenlose Domain", buyNowButtonLabel: "Jetzt kaufen", pricePerYearLabel: "/yr", costPriceLabel: "Kostenpreis:" }, a = { domainSearchHeaderTitle: "Domainname suchen", domainSearchHeaderSubtitle: "Kaufen Sie eine passende Domain für Ihre Marke" }, s = { domainSearchHeaderTitle: "Domainname suchen", domainSearchHeaderSubtitle: "Kaufen Sie eine passende Domain für Ihre Marke" }, o = { searchButtonLabel: "Suche", searchBarLabel: "Suche", searchBarPlaceholder: "Domainnamen suchen", searchBarPreText: "Domainname" }, t = { domainSearchEmptyMessage: "Leider konnten wir keine Domain für „{{domainNameSearchTerm}}“ finden.", searchAnotherDomainMessage: "Versuchen Sie, mit einer anderen Domain zu suchen." }, l = { searchButtonLabel: "Suche", searchBarLabel: "Suche", searchBarPlaceholder: "Domainnamen suchen", domainSearchOrConnectHeaderSubtitle: "Kaufen Sie passende Domains für Ihre Marke oder verknüpfen Sie Ihre bestehende Domain" }, d = { uploadYourLogoText: "Laden Sie Ihr Logo hoch", disclaimerText: "Bitte stellen Sie sicher, dass Sie über die Nutzungsrechte für alle hochgeladenen Bilder verfügen.", generatingDesigns: "Designs werden erstellt ...", uploadingAndConverting: "Ihr Logo wird hochgeladen und konvertiert ...", stepOf: "Schritt {{CURRENT}} von {{TOTAL}}", uploadError: "Fehler beim Hochladen", cancel: "Abbrechen", continue: "Weiter", back: "Zurück", no: "Nein", yes: "Ja", businessName: "Name des Unternehmens", businessNameDescription: "Geben Sie Ihren Logotext oder Unternehmensnamen ein", cropYourLogo: "Schneiden Sie Ihr Logo zu", cropDescription: "Schneiden Sie Ihr Logo-Design so zu, dass es auf die Arbeitsfläche unseres Logo-Erstellers passt", logoPreview: "Logo-Vorschau", logoPreviewDescription: "Ihr Logo sieht großartig aus! Helfen Sie uns bei der Einrichtung Ihres Logos, indem Sie die nächsten Schritte ausführen.", primaryTextColor: "Primäre Textfarbe", primaryTextColorDescription: "Helfen Sie uns bei der Einrichtung Ihres Logos, indem Sie die primäre Textfarbe bestätigen. Wählen Sie aus den verfügbaren Farben oder klicken Sie auf das Plus-Symbol, um eine weitere Farbe hinzuzufügen.", backgroundColor: "Hintergrundfarbe", backgroundColorDescription: "Helfen Sie uns bei der Einrichtung Ihres Logos, indem Sie die Hintergrundfarbe bestätigen. Wählen Sie aus den verfügbaren Farben oder klicken Sie auf das Plus-Symbol, um eine weitere Farbe hinzuzufügen.", colorsWarning: "Ihre Text- und Hintergrundfarben sind zu ähnlich. Bitte wählen Sie eine deutlichere Paarung, um sicherzustellen, dass sie hochwertige Designs erstellen.", exitConfirmationTitle: "Möchten Sie die Anwendung wirklich verlassen?", exitConfirmationDescription: "Der Fortschritt Ihres Logo-Uploads in dieser Sitzung geht verloren", maxByoFileErrorMessage: "Ihre Datei überschreitet die maximale Größe von 25 MB. Bitte wählen Sie eine kleinere Datei.", genericByoErrorMessage: "Es ist ein unerwarteter Fehler aufgetreten. Bitte versuchen Sie es erneut.", dropYourFileHere: "Legen Sie Ihre Datei hier ab oder", clickToUpload: "Klicken zum Hochladen", acceptedFiles: "Wir akzeptieren PNG-, JPG-, SVG- und EPS-Dateien bis zu 25 MB.", wrongUploadType: "Sie können Dateien dieses Typs nicht hochladen." }, h = { replace: "Ersetzen", replaceLogo: "Logo ersetzen", delete: "Löschen", deleteLogo: "Logo löschen" }, c = {
-  price: e,
-  sharedPaymentConfig: n,
-  publishBrandPageModal: i,
-  sellDomainNameList: r,
-  sellDomainNameListModal: a,
-  sellDomainNameModalApplication: s,
-  sellDomainNameSearch: o,
-  sellDomainNameListSearchResult: t,
-  sellDomainNameWidget: l,
-  uploadYourLogo: d,
-  uploadLogoSearchResultCard: h
-};
-export {
-  c as default,
-  e as price,
-  i as publishBrandPageModal,
-  r as sellDomainNameList,
-  a as sellDomainNameListModal,
-  t as sellDomainNameListSearchResult,
-  s as sellDomainNameModalApplication,
-  o as sellDomainNameSearch,
-  l as sellDomainNameWidget,
-  n as sharedPaymentConfig,
-  h as uploadLogoSearchResultCard,
-  d as uploadYourLogo
-};