@designcrowd/library.brand-page 6.1.6-use-isadminmaker-1 → 6.1.6-use-isadminmaker-2

package/src/brand-page-maker/components/brandpage-settings/BrandPageSettings.vue

@@ -248,7 +248,7 @@ const brandPageViewModel = computed(
   () => brandPageMakerStore.brandPageViewModel,
 );
 const features = computed(() => userStore.features);
-const isAdmin = computed(() => userStore.isAdminMaker);
+const isAdmin = computed(() => containerStore.isAdminMaker);
 const isDesignCom = computed(() => containerStore.isDesignCom);
 const ogImageUrl = computed(() => brandPageMakerStore.ogImageUrl);
 const isPublished = computed(() => containerStore.isPublished);

package/src/brand-page-maker/components/brandpage-settings/ReplaceImageSettingsForBrandPageSettings.mixin.ts

@@ -3,6 +3,7 @@ import {
   useBrandPageMakerStore,
   BRANDPAGE_SETTINGS_MODES,
   useBrandPageMakerUserStore,
+  useBrandPageContainerStore,
 } from '@brand-page-maker/stores';
 import type {
   ReplaceImageSettingsBase,
@@ -25,10 +26,11 @@ export default defineComponent({
   setup() {
     const brandPageMakerStore = useBrandPageMakerStore();
     const userStore = useBrandPageMakerUserStore();
+    const containerStore = useBrandPageContainerStore();
 
     return {
       mode: computed(() => brandPageMakerStore.mode),
-      isAdmin: computed(() => userStore.isAdminMaker),
+      isAdmin: computed(() => containerStore.isAdminMaker),
       brandPageMakerStore,
       userStore,
     };

package/src/brand-page-maker/components/rich-text-editor/RichTextEditor.vue

@@ -482,7 +482,7 @@ import {
   FONT_FAMILY_CONFIGS,
 } from '@brand-page';
 import {
-  useBrandPageMakerUserStore,
+  useBrandPageContainerStore,
   useUiStore,
 } from '@brand-page-maker/stores';
 import type { ButtonGroupOption } from '@brand-page-maker/models/button-group.model';
@@ -566,10 +566,10 @@ const emit = defineEmits([
 
 const isSpacingDropdownOpen = ref(false);
 
-const userStore = useBrandPageMakerUserStore();
+const containerStore = useBrandPageContainerStore();
 const uiStore = useUiStore();
 
-const isAdmin = computed(() => userStore.isAdminMaker);
+const isAdmin = computed(() => containerStore.isAdminMaker);
 const logoTheme = computed(() => uiStore.logoTheme);
 
 const fontSettings = reactive({

package/src/brand-page-maker/components/template-preview/TemplatePreview.mixin.ts

@@ -81,7 +81,7 @@ export default defineComponent({
       runtimeEnvironment: computed(
         () => brandPageContainerStore.runtimeEnvironment,
       ),
-      isAdmin: computed(() => brandPageMakerUserStore.isAdminMaker),
+      isAdmin: computed(() => brandPageContainerStore.isAdminMaker),
       userToken: computed(() => brandPageMakerUserStore.userToken),
       isBrandSite: computed(
         () => brandPageMakerStore.brandPageType === BRAND_PAGE_TYPES.brandSite,

package/src/brand-page-maker/composables/useQuickLinkBarVisibility.test.ts

@@ -13,7 +13,7 @@ import { useQuickLinkBarVisibility } from './useQuickLinkBarVisibility';
 // The real useUndoRedoFlag is exercised (only its underlying stores are
 // mocked) so admin gating is covered end-to-end.
 
-const containerStoreMock = { isPublished: false };
+const containerStoreMock = { isPublished: false, isAdminMaker: false };
 
 vi.mock('@brand-page-maker/stores', () => ({
   useBrandPageContainerStore: vi.fn(() => containerStoreMock),
@@ -21,7 +21,6 @@ vi.mock('@brand-page-maker/stores', () => ({
 
 const userStoreMock = {
   features: { canUseUndoRedo: false },
-  isAdminMaker: false,
 };
 
 vi.mock('@brand-page-maker/stores/user', () => ({
@@ -31,7 +30,7 @@ vi.mock('@brand-page-maker/stores/user', () => ({
 beforeEach(() => {
   containerStoreMock.isPublished = false;
   userStoreMock.features.canUseUndoRedo = false;
-  userStoreMock.isAdminMaker = false;
+  containerStoreMock.isAdminMaker = false;
 });
 
 describe('useQuickLinkBarVisibility', () => {
@@ -66,7 +65,7 @@ describe('useQuickLinkBarVisibility', () => {
   it('gates the undo/redo reason for admins: unpublished admin stays hidden despite the flag', () => {
     containerStoreMock.isPublished = false;
     userStoreMock.features.canUseUndoRedo = true;
-    userStoreMock.isAdminMaker = true;
+    containerStoreMock.isAdminMaker = true;
 
     expect(useQuickLinkBarVisibility().value).toBe(false);
   });
@@ -74,7 +73,7 @@ describe('useQuickLinkBarVisibility', () => {
   it('stays visible for a published admin (published cluster is not admin-gated)', () => {
     containerStoreMock.isPublished = true;
     userStoreMock.features.canUseUndoRedo = true;
-    userStoreMock.isAdminMaker = true;
+    containerStoreMock.isAdminMaker = true;
 
     expect(useQuickLinkBarVisibility().value).toBe(true);
   });

package/src/brand-page-maker/composables/useUndoRedoFlag.ts

@@ -1,5 +1,6 @@
 import { computed, type ComputedRef } from 'vue';
 import { useBrandPageMakerUserStore } from '@brand-page-maker/stores/user';
+import { useBrandPageContainerStore } from '@brand-page-maker/stores';
 
 /**
  * Returns whether undo/redo is active for the current maker session. Both
@@ -11,14 +12,15 @@ import { useBrandPageMakerUserStore } from '@brand-page-maker/stores/user';
  *      same precedent as RichTextEditor / GettyVideos / AITextGenerator. The
  *      one flag governs all three brands (brand-site, brand-page,
  *      brand-contact) — there is no per-brand gating.
- *   2. The session is NOT in admin-maker mode (`userStore.isAdminMaker`). The
+ *   2. The session is NOT in admin-maker mode (`containerStore.isAdminMaker`). The
  *      admin maker uses the same components but a different editing flow
  *      (template authoring) where undo/redo is out of scope.
  */
 export function useUndoRedoFlag(): ComputedRef<boolean> {
   const userStore = useBrandPageMakerUserStore();
+  const containerStore = useBrandPageContainerStore();
 
   return computed(
-    () => userStore.features.canUseUndoRedo && !userStore.isAdminMaker,
+    () => userStore.features.canUseUndoRedo && !containerStore.isAdminMaker,
   );
 }

package/src/brand-page-maker/stores/brandpage-container/brand-page-container-store.initialise.test.ts

@@ -67,25 +67,23 @@ describe('brand-page-container-store initialise — admin maker mapping', () =>
     setActivePinia(createPinia());
   });
 
-  test('maps isAdminMaker: true onto the user store and the container getter', () => {
+  test('maps isAdminMaker: true onto the container store', () => {
     const store = useBrandPageContainerStore();
     const userStore = useBrandPageMakerUserStore();
 
     store.initialise(createInitialisePayload({ isAdminMaker: true }));
 
-    expect(userStore.isAdminMaker).toBe(true);
     expect(store.isAdminMaker).toBe(true);
-    // initialise owns isAdminMaker only — the legacy isAdmin flag is left untouched.
+    // Admin maker mode lives on the container store, not user identity — the legacy
+    // user-store isAdmin flag is left untouched by initialise.
     expect(userStore.isAdmin).toBe(false);
   });
 
   test('defaults isAdminMaker to false when omitted', () => {
     const store = useBrandPageContainerStore();
-    const userStore = useBrandPageMakerUserStore();
 
     store.initialise(createInitialisePayload());
 
-    expect(userStore.isAdminMaker).toBe(false);
     expect(store.isAdminMaker).toBe(false);
   });
 });

package/src/brand-page-maker/stores/brandpage-container/brand-page-container-store.ts

@@ -70,6 +70,8 @@ export interface BrandPageContainerState {
   isUpgradeModalVisible: boolean;
   isPublishing: boolean;
   isProduction: boolean;
+  // Admin maker mode — a property of the editing session/container, not the user.
+  isAdminMaker: boolean;
   isSellDomainNameEnabled: boolean;
   isStripeOnboardingModalVisible: boolean;
   isReactivationModal: boolean;
@@ -117,7 +119,7 @@ export type GettyVideoEditorViewModelResponse = {
 
 export type InitialisePayload = Omit<
   BrandPageContainerState,
-  'customDomain' | 'customDomainConfig'
+  'customDomain' | 'customDomainConfig' | 'isAdminMaker'
 > & {
   logoDraftToken?: string;
   isAdminMaker?: boolean;
@@ -158,6 +160,7 @@ export const useBrandPageContainerStore = defineStore('brandPageContainer', {
       publishErrorMessage: '',
       isBrandPageSlugEditMode: false,
       isProduction: false,
+      isAdminMaker: false,
       isPublishModalVisible: false,
       isPublishing: false,
       isSaving: false,
@@ -222,10 +225,8 @@ export const useBrandPageContainerStore = defineStore('brandPageContainer', {
 
       const brandPageMakerStore = useBrandPageMakerStore();
       const templateSettingsStore = useUiTemplateSettingsStore();
-      const userStore = useBrandPageMakerUserStore();
-
-      userStore.setIsAdminMaker(payload.isAdminMaker ?? false);
 
+      this.isAdminMaker = payload.isAdminMaker ?? false;
       this.brandPageBaseUrl = payload.brandPageBaseUrl;
       this.baseFabricRenderUrl = localisedRouteStore.baseFabricRenderDomain;
       this.brandPageDescription = payload.brandPageDescription;
@@ -921,11 +922,10 @@ export const useBrandPageContainerStore = defineStore('brandPageContainer', {
         saveOnly?: boolean;
       } = {},
     ) {
-      const userStore = useBrandPageMakerUserStore();
       const brandPageMakerStore = useBrandPageMakerStore();
       const _eventTracker = useEventTracker();
 
-      if (userStore.isAdminMaker) {
+      if (this.isAdminMaker) {
         throw new Error('save brand page is not allowed in admin mode');
       }
 
@@ -1064,9 +1064,7 @@ export const useBrandPageContainerStore = defineStore('brandPageContainer', {
     },
 
     async saveAndPublishBrandPage(eventButtonLocation: string) {
-      const userStore = useBrandPageMakerUserStore();
-
-      if (userStore.isAdminMaker) {
+      if (this.isAdminMaker) {
         throw new Error('save brand page is not allowed in admin mode');
       }
 
@@ -1101,10 +1099,9 @@ export const useBrandPageContainerStore = defineStore('brandPageContainer', {
     },
 
     async saveTemplate() {
-      const userStore = useBrandPageMakerUserStore();
       const brandPageMakerStore = useBrandPageMakerStore();
 
-      if (!userStore.isAdminMaker) {
+      if (!this.isAdminMaker) {
         throw new Error('saveTemplate is not allowed in non admin mode');
       }
 
@@ -1534,12 +1531,6 @@ export const useBrandPageContainerStore = defineStore('brandPageContainer', {
       return userStore.isAdmin;
     },
 
-    isAdminMaker() {
-      const userStore = useBrandPageMakerUserStore();
-
-      return userStore.isAdminMaker;
-    },
-
     isPublished: (state) => {
       return state.brandPageStatus === 'Published';
     },

package/src/brand-page-maker/stores/brandpage-maker/brandpage-maker-store.test.ts

@@ -93,9 +93,8 @@ describe('brand page maker store module', () => {
   test('brandPageData should return button styles template when brand page maker is in admin mode', async () => {
     // Arrange
     const store = useBrandPageMakerStore();
-    const userStore = useBrandPageMakerUserStore();
 
-    userStore.setIsAdminMaker(true);
+    useBrandPageContainerStore().isAdminMaker = true;
 
     await store.initialise(INITIALISE_PAYLOAD);
 
@@ -109,9 +108,8 @@ describe('brand page maker store module', () => {
   test('brandPageData should return button styles when brand page maker is in admin mode', async () => {
     // Arrange
     const store = useBrandPageMakerStore();
-    const userStore = useBrandPageMakerUserStore();
 
-    userStore.setIsAdminMaker(true);
+    useBrandPageContainerStore().isAdminMaker = true;
 
     await store.initialise(INITIALISE_PAYLOAD);
 
@@ -188,9 +186,8 @@ describe('brand page maker store module', () => {
   test('brandPageTemplate should allow non-disallowed user content when is in admin mode', async () => {
     // Arrange
     const store = useBrandPageMakerStore();
-    const userStore = useBrandPageMakerUserStore();
 
-    userStore.setIsAdminMaker(true);
+    useBrandPageContainerStore().isAdminMaker = true;
 
     const contactFormContent: ContactFormContent = {
       id: faker.datatype.uuid(),
@@ -319,7 +316,7 @@ describe('brand page maker store module', () => {
   // colour-matched menu font colour-matches the sub nav on load. (Existing user drafts
   // are skipped — covered by migration-16.test.ts.)
   test('hamburger template in admin colour-matches the sub nav when the font is matched', async () => {
-    useBrandPageMakerUserStore().setIsAdminMaker(true);
+    useBrandPageContainerStore().isAdminMaker = true;
 
     const store = useBrandPageMakerStore();
 
@@ -554,9 +551,7 @@ describe('brand page maker store module', () => {
 
   test('applySelectedTemplate should not set design template token when applying selected template and is admin', async () => {
     // Arrange
-    const userStore = useBrandPageMakerUserStore();
-
-    userStore.setIsAdminMaker(true);
+    useBrandPageContainerStore().isAdminMaker = true;
 
     const templateId = faker.string.uuid();
 

package/src/brand-page-maker/stores/brandpage-maker/brandpage-maker-store.ts

@@ -373,12 +373,11 @@ export const useBrandPageMakerStore = defineStore('brandPageMaker', {
     },
     async recalculateLogoSizes(forceRecalculate = false) {
       const brandPageContainerStore = useBrandPageContainerStore();
-      const userStore = useBrandPageMakerUserStore();
       const pageSettingsStore = useUiPageSettingsStore();
       const logoSettingsStore = useUiLogoSettingsStore();
       const editableLogoStore = useUiEditableLogoStore();
 
-      if (!userStore.isAdminMaker && this.isBrandSite) {
+      if (!brandPageContainerStore.isAdminMaker && this.isBrandSite) {
         await recalculateHeaderLogoSizes(
           pageSettingsStore,
           logoSettingsStore,
@@ -387,7 +386,10 @@ export const useBrandPageMakerStore = defineStore('brandPageMaker', {
           brandPageContainerStore.isPrePurchase,
           forceRecalculate,
         );
-      } else if (!userStore.isAdminMaker && this.isBrandPageOrIsBrandContact) {
+      } else if (
+        !brandPageContainerStore.isAdminMaker &&
+        this.isBrandPageOrIsBrandContact
+      ) {
         await recalculateLogoContentDimensions(
           pageSettingsStore,
           editableLogoStore.editableLogoVariations,
@@ -403,7 +405,6 @@ export const useBrandPageMakerStore = defineStore('brandPageMaker', {
       const templateSettingsStore = useUiTemplateSettingsStore();
       const navigationStyleSettingsStore = useUiNavigationStyleSettingsStore();
       const backgroundSettingsStore = useUiBackgroundSettingsStore();
-      const userStore = useBrandPageMakerUserStore();
       const containerStore = useBrandPageContainerStore();
       const uiContentSettings = useUiContentSettingsStore();
       const editableLogoStore = useUiEditableLogoStore();
@@ -446,7 +447,7 @@ export const useBrandPageMakerStore = defineStore('brandPageMaker', {
       const { logoImageUrl, logoImageBase64Url } =
         logoSettingsStore.selectedLogoImageUrl;
 
-      if (userStore.isAdminMaker) {
+      if (containerStore.isAdminMaker) {
         const logoTemplateImage =
           logoUtil.safeGetLogoTemplateImageFromLogoTemplateImageUrl(
             logoImageUrl,
@@ -589,7 +590,7 @@ export const useBrandPageMakerStore = defineStore('brandPageMaker', {
 
       pageNavigationStore.setCurrentActivePage({});
 
-      if (userStore.isAdminMaker) {
+      if (containerStore.isAdminMaker) {
         styleSettingsStore.setAdminStyleOptionDefaultValues();
 
         backgroundSettingsStore.setAdminBackgroundOptionDefaultValues();
@@ -603,7 +604,7 @@ export const useBrandPageMakerStore = defineStore('brandPageMaker', {
 
       styleSettingsStore.setGalleryStyles(brandPageModel.styles.galleryStyles);
 
-      if (!userStore.isAdminMaker) {
+      if (!containerStore.isAdminMaker) {
         containerStore.setDesignTemplateToken({
           designTemplateToken: this.selectedTemplateId,
         });
@@ -1343,7 +1344,7 @@ export const useBrandPageMakerStore = defineStore('brandPageMaker', {
           brandPageModel.pages = model.pages;
         }
 
-        if (!userStore.isAdminMaker) {
+        if (!brandPageContainerStore.isAdminMaker) {
           const { model } = applyLogoThemeToBrandPageModel(
             logoTheme,
             new BrandPageModel(brandPageModel),
@@ -1649,11 +1650,10 @@ export const useBrandPageMakerStore = defineStore('brandPageMaker', {
       });
     },
     initialiseAdminMaker(payload: { models: AdminPreviewLogoTemplateModel[] }) {
-      const userStore = useBrandPageMakerUserStore();
       const adminLogoSettingsStore = useAdminLogoSettingsStore();
       const uiContentSettings = useUiContentSettingsStore();
 
-      if (!userStore.isAdminMaker) {
+      if (!useBrandPageContainerStore().isAdminMaker) {
         return;
       }
 
@@ -1989,7 +1989,7 @@ export const useBrandPageMakerStore = defineStore('brandPageMaker', {
       const videoStore = useVideoStore();
       const brandPageContainerStore = useBrandPageContainerStore();
 
-      if (userStore.isAdminMaker && uiStore.logoTheme) {
+      if (brandPageContainerStore.isAdminMaker && uiStore.logoTheme) {
         const themedBrandPage = applyLogoThemeToBrandPageModel(
           uiStore.logoTheme,
           this.brandPageData,
@@ -2070,10 +2070,12 @@ export const useBrandPageMakerStore = defineStore('brandPageMaker', {
       return !this.isSaving;
     },
     isPublished(): boolean {
-      const userStore = useBrandPageMakerUserStore();
       const brandPageContainerStore = useBrandPageContainerStore();
 
-      return !userStore.isAdminMaker && brandPageContainerStore.isPublished;
+      return (
+        !brandPageContainerStore.isAdminMaker &&
+        brandPageContainerStore.isPublished
+      );
     },
     isPublishing(): boolean {
       const brandPageContainerStore = useBrandPageContainerStore();
@@ -2098,7 +2100,10 @@ export const useBrandPageMakerStore = defineStore('brandPageMaker', {
     showBrandCrowdLogo(): boolean {
       const userStore = useBrandPageMakerUserStore();
 
-      return !userStore.isAdminMaker && userStore.features.showBrandCrowdLogo;
+      return (
+        !useBrandPageContainerStore().isAdminMaker &&
+        userStore.features.showBrandCrowdLogo
+      );
     },
   },
 });

package/src/brand-page-maker/stores/ui/ui-store.ts

@@ -15,7 +15,6 @@ import {
   useBrandPageMakerStore,
   type OnTemplateSelectedPayload,
 } from '../brandpage-maker';
-import { useBrandPageMakerUserStore } from '../user';
 import type { LogoTheme, UserPersonalisationContent } from '@brand-page';
 import {
   useBrandPageContainerStore,
@@ -123,10 +122,9 @@ export const useUiStore = defineStore('ui', {
       this.logoDraftToken = payload.logoDraftToken;
     },
     async triggerLockedContentClickedEvent(payload: { type: string }) {
-      const userStore = useBrandPageMakerUserStore();
       const brandPageContainerStore = useBrandPageContainerStore();
 
-      if (userStore.isAdminMaker) {
+      if (brandPageContainerStore.isAdminMaker) {
         return;
       }
 
@@ -161,9 +159,9 @@ export const useUiStore = defineStore('ui', {
   },
   getters: {
     endpoints: (): Endpoints => {
-      const userStore = useBrandPageMakerUserStore();
+      const brandPageContainerStore = useBrandPageContainerStore();
 
-      if (userStore.isAdminMaker) {
+      if (brandPageContainerStore.isAdminMaker) {
         return DEFAULT_ADMIN_ENDPOINTS;
       } else {
         return DEFAULT_USER_ENDPOINTS;

package/src/brand-page-maker/stores/user/user-store.test.ts

@@ -30,39 +30,4 @@ describe('brand page user store module', () => {
     // Assert
     expect(store.isAdmin).toBe(false);
   });
-
-  test('isAdminMaker should be false by default', async () => {
-    // Arrange
-    const store = useBrandPageMakerUserStore();
-
-    // Act
-
-    // Assert
-    expect(store.isAdminMaker).toBe(false);
-  });
-
-  test('setIsAdminMaker should toggle isAdminMaker', async () => {
-    // Arrange
-    const store = useBrandPageMakerUserStore();
-
-    // Act & Assert
-    store.setIsAdminMaker(true);
-    expect(store.isAdminMaker).toBe(true);
-
-    store.setIsAdminMaker(false);
-    expect(store.isAdminMaker).toBe(false);
-  });
-
-  test('setUserState should not affect isAdminMaker', async () => {
-    // Arrange
-    const store = useBrandPageMakerUserStore();
-
-    store.setIsAdminMaker(true);
-
-    // Act — setUserState still populates the legacy isAdmin flag only
-    store.setUserState({ isAdmin: false });
-
-    // Assert — isAdminMaker is owned by setIsAdminMaker, untouched here
-    expect(store.isAdminMaker).toBe(true);
-  });
 });

package/src/brand-page-maker/stores/user/user-store.ts

@@ -38,12 +38,10 @@ export const useBrandPageMakerUserStore = defineStore('brandPageMakerUser', {
     emailAddress: '',
     hasPremiumSubscription: false,
     brandPageCommissionPercentage: undefined,
-    // Retained for backward-compat, superseded by `isAdminMaker`. Still populated by
-    // `setUserState`, but no longer read by library code — use `isAdminMaker` instead.
+    // Retained for backward-compat, superseded by the container store's `isAdminMaker`.
+    // Still populated by `setUserState`, but no longer read by library code — admin maker
+    // mode is a property of the editing container, not user identity.
     isAdmin: false,
-    // Identifies admin maker mode. Populated via the container store's `initialise`
-    // (see `setIsAdminMaker`), which is what library code now branches on.
-    isAdminMaker: false,
     userToken: undefined,
   }),
   actions: {
@@ -63,8 +61,5 @@ export const useBrandPageMakerUserStore = defineStore('brandPageMakerUser', {
       this.isAdmin = payload.isAdmin || false;
       this.features = Object.assign({}, this.features, payload.features);
     },
-    setIsAdminMaker(isAdminMaker: boolean): void {
-      this.isAdminMaker = isAdminMaker;
-    },
   },
 });

package/src/brand-page-maker/stores/video/video-store.ts

@@ -81,7 +81,9 @@ export const useVideoStore = defineStore('video', {
 
       return (
         canUseGettyVideos &&
-        (userStore.isAdminMaker || isPrePurchase || hasPremiumSubscription)
+        (brandPageContainerStore.isAdminMaker ||
+          isPrePurchase ||
+          hasPremiumSubscription)
       );
     },
   },

package/src/shared/background-settings/components/BackgroundSettings.vue

@@ -121,7 +121,7 @@ import ColorField from '../../content-settings/components/color-field/ColorField
 import {
   BRANDPAGE_SETTINGS_MODES,
   useBrandPageMakerStore,
-  useBrandPageMakerUserStore,
+  useBrandPageContainerStore,
   useUiStore,
   useVideoStore,
 } from '@brand-page-maker/stores';
@@ -143,7 +143,7 @@ import ReplaceImageSettingsForBackgroundSettings from './ReplaceImageSettingsFor
 import { useEventTracker } from '@brand-page-maker/composables/useEventTracker';
 
 const backgroundSettingsStore = useUiBackgroundSettingsStore();
-const userStore = useBrandPageMakerUserStore();
+const containerStore = useBrandPageContainerStore();
 const brandPageMakerStore = useBrandPageMakerStore();
 const uiStore = useUiStore();
 const bpEventTracker = useEventTracker();
@@ -158,7 +158,7 @@ const recommendedLogoColors = computed(
 const logoColors = computed(() => backgroundSettingsStore.logoColors);
 const logoTheme = computed(() => uiStore.logoTheme);
 const backgroundMode = computed(() => backgroundSettingsStore.backgroundMode);
-const isAdmin = computed(() => userStore.isAdminMaker);
+const isAdmin = computed(() => containerStore.isAdminMaker);
 const isPersonalisationEnabled = computed(
   () => uiStore.isPersonalisationEnabled,
 );

package/src/shared/background-settings/components/MultiBackgroundShapes.vue

@@ -163,7 +163,7 @@ import ImageField from '../../content-settings/components/image-field/ImageField
 import ShapePositionSlider from '@brand-page-maker/components/admin-background-settings/ShapePositionSlider.vue';
 import { useUiBackgroundSettingsStore } from '../store';
 import { useBackgroundShapeControls } from '../composables/useBackgroundShapeControls';
-import { useBrandPageMakerUserStore } from '@brand-page-maker/stores';
+import { useBrandPageContainerStore } from '@brand-page-maker/stores';
 import { RGBAtoHex, hexToRGBA } from '@utils/helpers';
 import { isColorMatched } from '@brand-page-maker/utils';
 import {
@@ -186,8 +186,8 @@ defineProps({
 });
 
 const store = useUiBackgroundSettingsStore();
-const userStore = useBrandPageMakerUserStore();
-const isAdmin = computed(() => userStore.isAdminMaker);
+const containerStore = useBrandPageContainerStore();
+const isAdmin = computed(() => containerStore.isAdminMaker);
 
 const {
   backgroundShapes,

package/src/shared/background-settings/components/ReplaceImageSettingsForBackgroundSettings.vue

@@ -22,7 +22,7 @@ import ReplaceImageBaseSettings from '@shared/content-settings/components/replac
 import {
   GETTY_VIDEO_LIMIT_FOR_SITE,
   useBrandPageMakerStore,
-  useBrandPageMakerUserStore,
+  useBrandPageContainerStore,
   useVideoStore,
 } from '@brand-page-maker/stores';
 import { useUiBackgroundSettingsStore } from '../store';
@@ -51,14 +51,14 @@ const props = withDefaults(defineProps<Props>(), {
 const imageExtension = ['.png', '.ico'];
 
 const brandPageMakerStore = useBrandPageMakerStore();
-const userStore = useBrandPageMakerUserStore();
+const containerStore = useBrandPageContainerStore();
 const backgroundSettingsStore = useUiBackgroundSettingsStore();
 const videoStore = useVideoStore();
 const contentSettingsStore = useUiContentSettingsStore();
 const bpEventTracker = useEventTracker();
 
 const backgroundMode = computed(() => backgroundSettingsStore.backgroundMode);
-const isAdmin = computed(() => userStore.isAdminMaker);
+const isAdmin = computed(() => containerStore.isAdminMaker);
 
 const mediaSettings = computed((): ReplaceImageSettingsBase | undefined => {
   return brandPageMakerStore.fieldSettings?.replaceImageSettings;

package/src/shared/background-settings/components/SingleBackgroundShape.vue

@@ -47,7 +47,7 @@ import ColorField from '../../content-settings/components/color-field/ColorField
 import ImageField from '../../content-settings/components/image-field/ImageField.vue';
 import { useUiBackgroundSettingsStore } from '../store';
 import { useSingleBackgroundShape } from '../composables/useSingleBackgroundShape';
-import { useBrandPageMakerUserStore } from '@brand-page-maker/stores';
+import { useBrandPageContainerStore } from '@brand-page-maker/stores';
 import { backgroundSettingsTr } from '@src/composables/useTranslate';
 import type { LogoTheme } from '@brand-page';
 
@@ -65,8 +65,8 @@ defineProps({
 });
 
 const store = useUiBackgroundSettingsStore();
-const userStore = useBrandPageMakerUserStore();
-const isAdmin = computed(() => userStore.isAdminMaker);
+const containerStore = useBrandPageContainerStore();
+const isAdmin = computed(() => containerStore.isAdminMaker);
 
 const {
   shapeUrl,

package/src/shared/background-settings/components/background-color/BackgroundColorSettings.vue

@@ -28,7 +28,7 @@ import { useUiBackgroundSettingsStore } from '../../store';
 import ColorField from '../../../content-settings/components/color-field/ColorField.vue';
 import { isColorMatched } from '@brand-page-maker/utils';
 import { arrayToLinearGradient, hexToRGBA, RGBAtoHex } from '@utils/helpers';
-import { useBrandPageMakerUserStore } from '@brand-page-maker/stores';
+import { useBrandPageContainerStore } from '@brand-page-maker/stores';
 import { backgroundSettingsTr } from '@src/composables/useTranslate';
 
 // Props
@@ -43,11 +43,11 @@ const props = withDefaults(defineProps<Props>(), {
 });
 
 // Stores
-const userStore = useBrandPageMakerUserStore();
+const containerStore = useBrandPageContainerStore();
 const backgroundSettingsStore = useUiBackgroundSettingsStore();
 
 // Computed
-const isAdmin = computed(() => userStore.isAdminMaker);
+const isAdmin = computed(() => containerStore.isAdminMaker);
 const backgroundStyles = computed(
   () => backgroundSettingsStore.backgroundStyles,
 );