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

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

@@ -47,9 +47,9 @@
             id="background-overlay-color"
             name="overlayColor"
             :value="overlayColorValue"
-            :is-admin="isAdmin"
+            :is-admin-maker="isAdminMaker"
             :logo-theme="logoTheme"
-            :enable-color-match="isAdmin"
+            :enable-color-match="isAdminMaker"
             disable-transparent
             :label="backgroundSettingsTr('overlayColor')"
             @update:model-value="onOverlayColorChange"
@@ -80,7 +80,7 @@
       <!-- Shape section — admin always sees it; customers only when the
            template has at least one shape (main or array). -->
       <CollapsiblePanel
-        v-if="isAdmin || hasSingleShape || hasMultipleShapes"
+        v-if="isAdminMaker || hasSingleShape || hasMultipleShapes"
         data-component="collapsible-panel"
         :title="backgroundSettingsTr('shape')"
       >
@@ -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 isAdminMaker = computed(() => containerStore.isAdminMaker);
 const isPersonalisationEnabled = computed(
   () => uiStore.isPersonalisationEnabled,
 );
@@ -166,7 +166,7 @@ const isPersonalisationEnabled = computed(
 defineEmits(['on-intent-image-replace']);
 
 const showPersonalisationField = computed(() => {
-  return isAdmin.value && isPersonalisationEnabled.value;
+  return isAdminMaker.value && isPersonalisationEnabled.value;
 });
 
 const personalisationRole = computed(() => {
@@ -251,10 +251,10 @@ const hasMultipleShapes = computed(
 
 const shapeTabs = computed(() => {
   const tabs: string[] = [];
-  if (isAdmin.value || hasSingleShape.value) {
+  if (isAdminMaker.value || hasSingleShape.value) {
     tabs.push(backgroundSettingsTr('singleShape'));
   }
-  if (isAdmin.value || hasMultipleShapes.value) {
+  if (isAdminMaker.value || hasMultipleShapes.value) {
     tabs.push(backgroundSettingsTr('multipleShapes'));
   }
   return tabs;

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

@@ -5,9 +5,9 @@
       id="background-shapes"
       name="shapeColor"
       :value="shapeColorValue"
-      :is-admin="isAdmin"
+      :is-admin-maker="isAdminMaker"
       :logo-theme="logoTheme"
-      :enable-color-match="isAdmin"
+      :enable-color-match="isAdminMaker"
       :disable-transparent="true"
       :custom-groups="customGroups"
       :label="backgroundSettingsTr('shapeColor')"
@@ -72,7 +72,7 @@
 
         <template v-if="backgroundShapes[option.index]">
           <!-- Screen placement comes first (admin-only, template building) -->
-          <template v-if="isAdmin">
+          <template v-if="isAdminMaker">
             <p
               class="tw-mt-3 tw-font-sans tw-font-bold tw-text-secondary-800 tw-text-sm tw-mb-1"
             >
@@ -143,7 +143,7 @@
 
     <!-- Adding items is admin-only -->
     <Button
-      v-if="isAdmin"
+      v-if="isAdminMaker"
       variant="outline"
       :label="shapeFieldTr('addItemLabel')"
       size="small"
@@ -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 isAdminMaker = computed(() => containerStore.isAdminMaker);
 
 const {
   backgroundShapes,

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

@@ -4,7 +4,7 @@
       :section-title="sectionTitle"
       :media-settings="mediaSettings"
       :image-extension="mediaExtension"
-      :is-admin="isAdmin"
+      :is-admin-maker="isAdminMaker"
       :mode="backgroundMode"
       :active-tabs="activeTabs"
       :media-type="mediaType"
@@ -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 isAdminMaker = computed(() => containerStore.isAdminMaker);
 
 const mediaSettings = computed((): ReplaceImageSettingsBase | undefined => {
   return brandPageMakerStore.fieldSettings?.replaceImageSettings;

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

@@ -14,9 +14,9 @@
         id="background-shape"
         name="shapeColor"
         :value="shapeColorValue"
-        :is-admin="isAdmin"
+        :is-admin-maker="isAdminMaker"
         :logo-theme="logoTheme"
-        :enable-color-match="isAdmin"
+        :enable-color-match="isAdminMaker"
         :disable-transparent="true"
         :custom-groups="customGroups"
         :label="backgroundSettingsTr('shapeColor')"
@@ -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 isAdminMaker = computed(() => containerStore.isAdminMaker);
 
 const {
   shapeUrl,

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

@@ -4,16 +4,16 @@
       id="background-color"
       name="background"
       :value="backgroundStyles.style.background || ''"
-      :is-admin="isAdmin"
+      :is-admin-maker="isAdminMaker"
       :logo-theme="logoTheme"
-      :enable-color-match="isAdmin"
+      :enable-color-match="isAdminMaker"
       show-gradients
       disable-transparent
       :label="backgroundSettingsTr(`backgroundColor`)"
       @update:model-value="onBackgroundColorChange"
     />
     <HelloBar
-      v-if="colorMatched && isAdmin"
+      v-if="colorMatched && isAdminMaker"
       label="Color Matched Logo"
       description="The color of the background is matched to the customers logo. If you change the color of the background, it will not longer be matched to the customer's logo."
       class="tw-mb-4 tw-mt-4"
@@ -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 isAdminMaker = computed(() => containerStore.isAdminMaker);
 const backgroundStyles = computed(
   () => backgroundSettingsStore.backgroundStyles,
 );

package/src/shared/background-settings/components/background-shapes/BackgroundShapeSettings.mixin.ts

@@ -5,7 +5,10 @@ import StyleSettingsSection from '../../../style-settings/components/StyleSettin
 import ColorPicker from '@brand-page-maker/components/color-palette/BpColorPicker.vue';
 import { hexToRGBA } from '@utils/helpers';
 import { isColorMatched } from '@brand-page-maker/utils';
-import { useBrandPageMakerUserStore } from '@brand-page-maker/stores';
+import {
+  useBrandPageMakerUserStore,
+  useBrandPageContainerStore,
+} from '@brand-page-maker/stores';
 
 export default defineComponent({
   components: {
@@ -27,10 +30,11 @@ export default defineComponent({
   },
   setup() {
     const userStore = useBrandPageMakerUserStore();
+    const containerStore = useBrandPageContainerStore();
     const backgroundSettingsStore = useUiBackgroundSettingsStore();
 
     return {
-      isAdmin: computed(() => userStore.isAdminMaker),
+      isAdminMaker: computed(() => containerStore.isAdminMaker),
       backgroundStyles: computed(
         () => backgroundSettingsStore.backgroundStyles,
       ),

package/src/shared/background-settings/components/background-shapes/BackgroundShapeSettings.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <HelloBar
-      v-if="colorMatched && isAdmin"
+      v-if="colorMatched && isAdminMaker"
       label="Color Matched Logo"
       description="The color of the shapes is matched to the customers logo. If you change the color of the shapes, it will not longer be matched to the customer's logo."
       class="tw-mb-4"

package/src/shared/content-settings/components/button-configuration-field/ButtonConfigurationField.vue

@@ -130,13 +130,13 @@ interface Props {
   pages?: Array<{ slug: string; title: string }>;
   titleLength?: number;
   descriptionLength?: number;
-  isAdmin?: boolean;
+  isAdminMaker?: boolean;
 }
 
 const props = withDefaults(defineProps<Props>(), {
   titleLength: MAX_TITLE_LENGTH,
   descriptionLength: MAX_DESCRIPTION_LENGTH,
-  isAdmin: false,
+  isAdminMaker: false,
   pages: undefined,
 });
 

package/src/shared/content-settings/components/color-field/ColorField.vue

@@ -4,8 +4,8 @@
     class="tw-flex"
     :class="{
       'tw-mt-4': !!label,
-      'tw-flex-col tw-gap-y-2 tw-w-full': isAdmin,
-      'tw-gap-2 tw-justify-between tw-items-center': !isAdmin,
+      'tw-flex-col tw-gap-y-2 tw-w-full': isAdminMaker,
+      'tw-gap-2 tw-justify-between tw-items-center': !isAdminMaker,
     }"
   >
     <span
@@ -18,7 +18,7 @@
       class="tw-flex tw-flex-row tw-gap-2 tw-items-center tw-justify-between"
     >
       <Toggle
-        v-if="isAdmin && enableColorMatch"
+        v-if="isAdminMaker && enableColorMatch"
         :id="`${id}-${name}-color-matched${toggleIdSuffix}`"
         :model-value="isOptionColorMatched"
         color="info"
@@ -43,7 +43,7 @@
       </div>
 
       <!-- Start Admin Style Theme Key Select -->
-      <div v-if="isAdmin && !isRichTextEditor && isOptionColorMatched">
+      <div v-if="isAdminMaker && !isRichTextEditor && isOptionColorMatched">
         <select
           class="c-select c-button-style tw-border tw-appearance-none tw-border-none tw-h-10 tw-pl-2 tw-rounded tw-cursor-pointer tw-transition-all tw-duration-300 tw-bg-white"
           @change.stop="
@@ -100,7 +100,7 @@ interface Props {
     string | undefined
   >;
   label?: string;
-  isAdmin: boolean;
+  isAdminMaker: boolean;
   logoTheme: LogoTheme;
   toggleUniqueId?: string;
   enableColorMatch?: boolean;
@@ -333,7 +333,7 @@ watch(
       return;
     }
 
-    if (props.isAdmin && !newVal) {
+    if (props.isAdminMaker && !newVal) {
       newColor.value = '';
       changeColor();
       return;

package/src/shared/content-settings/components/color-replacements-field/ColorReplacementsField.vue

@@ -3,8 +3,8 @@
     data-component="color-replacements-field"
     class="tw-flex"
     :class="{
-      'tw-flex-col tw-gap-y-2 tw-w-full': isAdmin,
-      'tw-gap-2 tw-justify-between tw-items-center': !isAdmin,
+      'tw-flex-col tw-gap-y-2 tw-w-full': isAdminMaker,
+      'tw-gap-2 tw-justify-between tw-items-center': !isAdminMaker,
     }"
   >
     <span
@@ -14,7 +14,9 @@
     </span>
     <Toggle
       v-if="
-        isAdmin && data.colorReplacements && data.colorReplacements.length > 0
+        isAdminMaker &&
+        data.colorReplacements &&
+        data.colorReplacements.length > 0
       "
       :id="`${id}-${name}-color-matched${toggleIdSuffix}`"
       :model-value="isOptionColorMatched"
@@ -35,18 +37,18 @@
         :key="`${colorReplacement.attribute}-${colorReplacement.originalColor}`"
       >
         <ColorField
-          v-if="!isAdmin || !isOptionColorMatched"
+          v-if="!isAdminMaker || !isOptionColorMatched"
           name="fill"
           :disable-transparent="true"
           :value="colorReplacement.replacementColor"
-          :is-admin="isAdmin"
+          :is-admin-maker="isAdminMaker"
           :logo-theme="logoTheme"
           @update:model-value="onColorPickerInput($event, index)"
         />
       </div>
       <div
         v-if="
-          isAdmin &&
+          isAdminMaker &&
           data.colorReplacements &&
           data.colorReplacements.length > 0 &&
           isOptionColorMatched
@@ -90,7 +92,7 @@ const props = defineProps<{
   id: string;
   name: string;
   value: ColorReplacement[];
-  isAdmin: boolean;
+  isAdminMaker: boolean;
   label?: string;
   toggleUniqueId?: string;
   logoTheme: LogoTheme;

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

@@ -13,6 +13,7 @@ import { CONTENT_SETTINGS_MODES } from '../../store';
 import {
   useBrandPageMakerStore,
   useBrandPageMakerUserStore,
+  useBrandPageContainerStore,
 } from '@brand-page-maker/stores';
 import { SIDE_BAR_CONTENT_ID } from '../../constants';
 import type { ComponentPublicInstance } from '@vue/runtime-core';
@@ -44,6 +45,7 @@ export default defineComponent({
     const pageNavigationStore = usePageNavigationStore();
     const styleSettingsStore = useUiStyleSettingsStore();
     const userStore = useBrandPageMakerUserStore();
+    const containerStore = useBrandPageContainerStore();
     const eventTracker = useEventTracker();
     const historyStore = useHistoryStore();
     const { externalEditor } = useExternalRichTextEditor();
@@ -57,7 +59,7 @@ export default defineComponent({
       contentSettingsSelectedItemId: computed(
         () => contentSettingsStore.selectedItemId,
       ),
-      isAdmin: computed(() => userStore.isAdminMaker),
+      isAdminMaker: computed(() => containerStore.isAdminMaker),
       canUseRichTextEditor: computed(
         () => userStore.features.canUseRichTextEditor,
       ),

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

@@ -13,6 +13,7 @@ import type {
 import { useUiContentSettingsStore } from '../../store';
 import {
   useBrandPageMakerUserStore,
+  useBrandPageContainerStore,
   useBrandPageMakerStore,
   useVideoStore,
   GETTY_VIDEO_LIMIT_FOR_SITE,
@@ -33,6 +34,7 @@ export default defineComponent({
     const brandPageMakerStore = useBrandPageMakerStore();
     const contentSettingsStore = useUiContentSettingsStore();
     const userStore = useBrandPageMakerUserStore();
+    const containerStore = useBrandPageContainerStore();
     const pageSettingsStore = useUiPageSettingsStore();
     const videoStore = useVideoStore();
     const bpEventTracker = useEventTracker();
@@ -52,7 +54,7 @@ export default defineComponent({
         () => contentSettingsStore.selectedItemTemplate?.type,
       ),
       mode: computed(() => contentSettingsStore.mode),
-      isAdmin: computed(() => userStore.isAdminMaker),
+      isAdminMaker: computed(() => containerStore.isAdminMaker),
       contentSettingsStore,
       userStore,
       pageSettingsStore,
@@ -64,7 +66,7 @@ export default defineComponent({
   },
   computed: {
     isDeleteEnabled(): boolean {
-      return this.isAdmin;
+      return this.isAdminMaker;
     },
     selectedField(): ContentItemFieldSettings | undefined {
       if (!this.selectedItemFieldName) {

package/src/shared/content-settings/components/content-settings/ReplaceImageSettingsForContent.vue

@@ -2,7 +2,7 @@
   <div data-component="replace-image-settings-for-content">
     <ReplaceImageBaseSettings
       :section-title="sectionTitle"
-      :is-admin="isAdmin"
+      :is-admin-maker="isAdminMaker"
       :mode="mode"
       :media-settings="imageSettings"
       :active-tabs="activeTabs"

package/src/shared/content-settings/components/content-settings-item/ContentSettingsItem.mixin.ts

@@ -14,7 +14,7 @@ import { useUiContentSettingsStore, CONTENT_SETTINGS_MODES } from '../../store';
 import { SIDE_BAR_CONTENT_ID } from '../../constants';
 import {
   useBrandPageMakerStore,
-  useBrandPageMakerUserStore,
+  useBrandPageContainerStore,
   useRouteStore,
   useUiStore,
 } from '@brand-page-maker/stores';
@@ -59,7 +59,7 @@ export default defineComponent({
     const sideBarStore = useUiSideBarStore();
     const brandPageMakerStore = useBrandPageMakerStore();
     const uiStore = useUiStore();
-    const userStore = useBrandPageMakerUserStore();
+    const containerStore = useBrandPageContainerStore();
     const routeStore = useRouteStore();
     const eventTracker = useEventTracker();
 
@@ -72,7 +72,7 @@ export default defineComponent({
       isPersonalisationEnabled: computed(
         () => uiStore.isPersonalisationEnabled,
       ),
-      isAdmin: computed(() => userStore.isAdminMaker),
+      isAdminMaker: computed(() => containerStore.isAdminMaker),
       contentSettingsStore,
       sideBarStore,
       eventTracker,
@@ -190,7 +190,7 @@ export default defineComponent({
     },
 
     showPersonalisationField(): boolean {
-      return this.isAdmin && this.isPersonalisationEnabled;
+      return this.isAdminMaker && this.isPersonalisationEnabled;
     },
 
     personalisationRole(): PersonalisationRole | undefined {

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

@@ -68,7 +68,7 @@ export default defineComponent({
       getContent: computed(() => contentSettingsStore.getContent),
       getValue: computed(() => contentSettingsStore.getValue),
       brandPageData: computed(() => brandPageMakerStore.brandPageData),
-      isAdmin: computed(() => userStore.isAdminMaker),
+      isAdminMaker: computed(() => brandPageContainerStore.isAdminMaker),
       isDesignCom: computed(() => brandPageContainerStore.isDesignCom),
       canUseRichTextEditor: computed(
         () => userStore.features.canUseRichTextEditor,
@@ -208,7 +208,7 @@ export default defineComponent({
     },
     showToggle(): boolean | undefined {
       //TODO: convert showToggle to both boolean and a function
-      if (this.field.name === 'backgroundStyle' && this.isAdmin) {
+      if (this.field.name === 'backgroundStyle' && this.isAdminMaker) {
         return true;
       }
 
@@ -294,7 +294,7 @@ export default defineComponent({
       }
     },
     onFieldChangeLogo(): void {
-      if (this.isAdmin) {
+      if (this.isAdminMaker) {
         this.sideBarStore.setSelectedTabName({
           tabName: SIDE_BAR_TAB_NAMES.ADMIN_LOGO_SETTINGS,
         });

package/src/shared/content-settings/components/content-settings-item/ContentSettingsItemField.vue

@@ -41,7 +41,7 @@
         }"
         :name="fieldName"
         :content="content"
-        :is-admin="isAdmin"
+        :is-admin-maker="isAdminMaker"
         :logo-theme="logoTheme"
         :is-toggled="isToggled"
         :multiple="field.multiple"

package/src/shared/content-settings/components/draggable-item-list/DraggableItemList.mixin.ts

@@ -59,7 +59,7 @@ export default defineComponent({
       type: Object as PropType<LogoTheme>,
       required: true,
     },
-    isAdmin: {
+    isAdminMaker: {
       type: Boolean,
       required: true,
     },

package/src/shared/content-settings/components/draggable-item-list/DraggableItemList.vue

@@ -131,7 +131,7 @@
                   : ''
               "
               :value="element.colorReplacements"
-              :is-admin="isAdmin"
+              :is-admin-maker="isAdminMaker"
               :logo-theme="logoTheme"
               :toggle-unique-id="index.toString()"
               @update:model-value="onColorReplacementsChange($event, index)"

package/src/shared/content-settings/components/focused-content-item-settings/FocusedContentItemSettings.mixin.ts

@@ -15,6 +15,7 @@ import { useUiContentSettingsStore } from '../../store';
 import {
   useBrandPageMakerStore,
   useBrandPageMakerUserStore,
+  useBrandPageContainerStore,
   useRouteStore,
   useUiStore,
 } from '@brand-page-maker/stores';
@@ -39,6 +40,8 @@ export default defineComponent({
     const _styleSettingsStore = useUiStyleSettingsStore();
 
     const userStore = useBrandPageMakerUserStore();
+
+    const containerStore = useBrandPageContainerStore();
     const uiStore = useUiStore();
     const routeStore = useRouteStore();
     const { externalEditor } = useExternalRichTextEditor();
@@ -54,7 +57,7 @@ export default defineComponent({
       isPersonalisationEnabled: computed(
         () => uiStore.isPersonalisationEnabled,
       ),
-      isAdmin: computed(() => userStore.isAdminMaker),
+      isAdminMaker: computed(() => containerStore.isAdminMaker),
       canUseRichTextEditor: computed(
         () => userStore.features.canUseRichTextEditor,
       ),
@@ -220,7 +223,7 @@ export default defineComponent({
     },
 
     showPersonalisationField(): boolean {
-      return this.isAdmin && this.isPersonalisationEnabled;
+      return this.isAdminMaker && this.isPersonalisationEnabled;
     },
 
     personalisationRole(): PersonalisationRole | undefined {

package/src/shared/content-settings/components/images-field/ImagesField.mixin.ts

@@ -38,7 +38,7 @@ export default defineComponent({
       type: Object as PropType<LogoTheme>,
       required: true,
     },
-    isAdmin: {
+    isAdminMaker: {
       type: Boolean,
       required: true,
     },

package/src/shared/content-settings/components/images-field/ImagesField.vue

@@ -14,7 +14,7 @@
       value-prop-name="imageTitle"
       :media-type="mediaType"
       :logo-theme="logoTheme"
-      :is-admin="isAdmin"
+      :is-admin-maker="isAdminMaker"
       @on-intent-image-replace="onReplace"
     />
     <div

package/src/shared/content-settings/components/links-field/LinksField.mixin.ts

@@ -44,7 +44,7 @@ export default defineComponent({
       type: Array as PropType<LinksItem[]>,
       required: true,
     },
-    isAdmin: {
+    isAdminMaker: {
       type: Boolean,
       required: true,
     },

package/src/shared/content-settings/components/links-field/LinksField.vue

@@ -10,7 +10,7 @@
       value-prop-name="url"
       field-type="url"
       :settings="itemListSettings"
-      :is-admin="isAdmin"
+      :is-admin-maker="isAdminMaker"
       :logo-theme="logoTheme"
       @on-intent-image-replace="onItemListIntentImageReplace"
       @on-color-replacements-change="onColorReplacementsChange"

package/src/shared/content-settings/components/logo-selection-field/LogoSelection.vue

@@ -18,7 +18,7 @@
       @on-click.stop="onEditLogoButtonClicked"
     />
   </div>
-  <div v-if="userStore.isAdminMaker">
+  <div v-if="containerStore.isAdminMaker">
     <LogoField
       :value="selectedLogo"
       button-label="Change Logo"
@@ -119,7 +119,6 @@ import LogoVersions from '@shared/logo-versions/LogoVersions.vue';
 import LogoVariations from '@shared/logo-settings/components/LogoVariations.vue';
 import {
   useBrandPageContainerStore,
-  useBrandPageMakerUserStore,
   useLogoStore,
 } from '@brand-page-maker/stores/index';
 import { computed, onMounted, reactive, watch } from 'vue';
@@ -200,7 +199,6 @@ const containerStore = useBrandPageContainerStore();
 const logoStore = useLogoStore();
 const editableLogoStore = useUiEditableLogoStore();
 const sideBarStore = useUiSideBarStore();
-const userStore = useBrandPageMakerUserStore();
 
 const currentLogoIsByo = computed(() => {
   const logoDraftAsset = logoStore.getLogoDraftAssetByToken(