@designcrowd/library.brand-page 5.12.13-flacky-nav-2 → 5.12.13

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

@@ -79,7 +79,6 @@ export default defineComponent({
                     mediaSizes: MEDIA_SIZES.size1x,
                 },
                 isCapturingPreview: false,
-                modelVersion: this.brandPageData?.v,
             };
         },
         displayName() {

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

@@ -1,5 +1,5 @@
 import { defineStore } from 'pinia';
-import { PageHeaderDesktop, PageHeaderMobile, PageFooterDesktop, PageFooterMobile, VIEWPORTS, HEADER_DISPLAY, } from '../../../brand-page';
+import { PageHeaderDesktop, PageHeaderMobile, PageFooterDesktop, PageFooterMobile, VIEWPORTS, } from '../../../brand-page';
 import { PAGE_SECTIONS } from '../models';
 import { navigateToPageBySlug } from '../../../brand-page-maker/routing';
 import { getPageSlugFromPageTitle } from '../../../brand-page-maker/utils';

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

@@ -104,7 +104,7 @@ export const useUiTemplateSettingsStore = defineStore('uiTemplateSettings', {
                 }
                 const logoSettingsStore = useUiLogoSettingsStore();
                 const templateData = JSON.parse(template.data);
-                const brandPageModel = await migrateBrandPageModel(new BrandPageModel(templateData), {
+                const brandPageModel = migrateBrandPageModel(new BrandPageModel(templateData), {
                     logoImage: {
                         ...logoSettingsStore.selectedLogoImage,
                     },

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@designcrowd/library.brand-page",
   "description": "A collection of Maker/Designer applications",
-  "version": "5.12.13-flacky-nav-2",
+  "version": "5.12.13",
   "author": "Design.com Eng",
   "license": "UNLICENSED",
   "type": "module",

package/src/brand-page/components/background-shape/BackgroundShape.mixin.ts

@@ -138,6 +138,8 @@ export default defineComponent({
           /\b(width|height)\s*=\s*(?:"([^"]*)"|'([^']*)'|([^\s>]+))/gi,
         );
 
+        console.log('aaaa', widthHeightMatches);
+
         if (widthHeightMatches) {
           const widthMatch = widthHeightMatches.find((match) =>
             match.startsWith('width='),

package/src/brand-page/components/logo/Logo.vue

@@ -3,49 +3,13 @@
     v-if="viewModel.isVisible"
     class="logo tw-relative tw-justify-center tw-items-center"
   >
-    <div
-      v-if="(context.modelVersion ?? 0) >= 6"
-      class="logo_wrapper"
-      :style="{
-        height: viewModel?.logoImageHeight || DEFAULT_LOGO_HEIGHT,
-      }"
-    >
-      <div v-if="!context.isPreview && context.isBrandSite">
-        <router-link
-          v-if="routes.length >= 1"
-          :to="{
-            name: routes[0].routeName,
-            params: routes[0].routeParams,
-          }"
-        >
-          <LazyHydrationWrapper v-if="context.isServerRender">
-            <LogoRender
-              :is-preview="context.isPreview"
-              :is-brand-site="context.isBrandSite"
-              :disable-server-render="context.disableLogoRenderOnServerside"
-              :has-margin-bottom="hasMarginBottom"
-              :alt-text="altText"
-              :view-model="viewModel"
-              :context="context"
-            />
-          </LazyHydrationWrapper>
-          <LogoRender
-            v-else
-            :is-preview="context.isPreview"
-            :is-brand-site="context.isBrandSite"
-            :disable-server-render="context.disableLogoRenderOnServerside"
-            :has-margin-bottom="hasMarginBottom"
-            :alt-text="altText"
-            :view-model="viewModel"
-            :context="context"
-          />
-        </router-link>
-      </div>
-      <template
-        v-if="
-          (context.isPreview && context.isBrandSite) ||
-          context.isBrandPageOrIsBrandContact
-        "
+    <div v-if="!context.isPreview && context.isBrandSite">
+      <router-link
+        v-if="routes.length >= 1"
+        :to="{
+          name: routes[0].routeName,
+          params: routes[0].routeParams,
+        }"
       >
         <LazyHydrationWrapper v-if="context.isServerRender">
           <LogoRender
@@ -55,82 +19,44 @@
             :has-margin-bottom="hasMarginBottom"
             :alt-text="altText"
             :view-model="viewModel"
-            :context="context"
           />
         </LazyHydrationWrapper>
         <LogoRender
           v-else
           :is-preview="context.isPreview"
-          :disable-server-render="context.disableLogoRenderOnServerside"
           :is-brand-site="context.isBrandSite"
+          :disable-server-render="context.disableLogoRenderOnServerside"
           :has-margin-bottom="hasMarginBottom"
           :alt-text="altText"
           :view-model="viewModel"
-          :context="context"
         />
-      </template>
+      </router-link>
     </div>
-    <!-- Legacy rendering for model version < 6 -->
-    <template v-else>
-      <div v-if="!context.isPreview && context.isBrandSite">
-        <router-link
-          v-if="routes.length >= 1"
-          :to="{
-            name: routes[0].routeName,
-            params: routes[0].routeParams,
-          }"
-        >
-          <LazyHydrationWrapper v-if="context.isServerRender">
-            <LogoRender
-              :is-preview="context.isPreview"
-              :is-brand-site="context.isBrandSite"
-              :disable-server-render="context.disableLogoRenderOnServerside"
-              :has-margin-bottom="hasMarginBottom"
-              :alt-text="altText"
-              :view-model="viewModel"
-              :context="context"
-            />
-          </LazyHydrationWrapper>
-          <LogoRender
-            v-else
-            :is-preview="context.isPreview"
-            :is-brand-site="context.isBrandSite"
-            :disable-server-render="context.disableLogoRenderOnServerside"
-            :has-margin-bottom="hasMarginBottom"
-            :alt-text="altText"
-            :view-model="viewModel"
-            :context="context"
-          />
-        </router-link>
-      </div>
-      <template
-        v-if="
-          (context.isPreview && context.isBrandSite) ||
-          context.isBrandPageOrIsBrandContact
-        "
-      >
-        <LazyHydrationWrapper v-if="context.isServerRender">
-          <LogoRender
-            :is-preview="context.isPreview"
-            :is-brand-site="context.isBrandSite"
-            :disable-server-render="context.disableLogoRenderOnServerside"
-            :has-margin-bottom="hasMarginBottom"
-            :alt-text="altText"
-            :view-model="viewModel"
-            :context="context"
-          />
-        </LazyHydrationWrapper>
+    <template
+      v-if="
+        (context.isPreview && context.isBrandSite) ||
+        context.isBrandPageOrIsBrandContact
+      "
+    >
+      <LazyHydrationWrapper v-if="context.isServerRender">
         <LogoRender
-          v-else
           :is-preview="context.isPreview"
-          :disable-server-render="context.disableLogoRenderOnServerside"
           :is-brand-site="context.isBrandSite"
+          :disable-server-render="context.disableLogoRenderOnServerside"
           :has-margin-bottom="hasMarginBottom"
           :alt-text="altText"
           :view-model="viewModel"
-          :context="context"
         />
-      </template>
+      </LazyHydrationWrapper>
+      <LogoRender
+        v-else
+        :is-preview="context.isPreview"
+        :disable-server-render="context.disableLogoRenderOnServerside"
+        :is-brand-site="context.isBrandSite"
+        :has-margin-bottom="hasMarginBottom"
+        :alt-text="altText"
+        :view-model="viewModel"
+      />
     </template>
   </div>
 </template>
@@ -144,7 +70,6 @@ import {
   getRouteParamsByPage,
 } from '../../utils/route.util';
 import { LazyHydrationWrapper } from 'vue3-lazy-hydration';
-import { DEFAULT_LOGO_HEIGHT, DEFAULT_LOGO_WIDTH } from '../../constants';
 
 const props = defineProps({
   isPreview: {
@@ -199,8 +124,4 @@ const routes = computed(
   --logo-size: 8rem;
   --logo-spacing: 0.75rem;
 }
-.logo_wrapper {
-  margin-top: var(--logo-spacing);
-  margin-bottom: var(--logo-spacing);
-}
 </style>

package/src/brand-page/components/logo/LogoRender.vue

@@ -11,10 +11,7 @@
       <img
         v-if="logoImageUrl"
         data-test-tag="logo"
-        :class="[
-          'logo__image',
-          (context?.modelVersion ?? 0) <= 5 ? 'logo__image--legacy' : '',
-        ]"
+        class="logo__image"
         :src="logoImageUrl"
         :alt="altText"
         :style="logoStyle"
@@ -25,7 +22,6 @@
 <script setup lang="ts">
 import { computed, ref, watch, onServerPrefetch, onMounted } from 'vue';
 import type { LogoViewModel } from '../../view-models';
-import type { BrandPageContext } from '../../models';
 import { LogoCacheRepository } from '../../repositories';
 import { DEFAULT_LOGO_HEIGHT, DEFAULT_LOGO_WIDTH } from '../../constants';
 
@@ -37,7 +33,6 @@ const props = withDefaults(
     isBrandSite: boolean;
     viewModel?: LogoViewModel;
     altText: string;
-    context?: BrandPageContext;
   }>(),
   {
     isPreview: false,
@@ -76,14 +71,11 @@ const logoWidth = computed(() => {
 });
 
 const logoStyle = computed(() => {
-  const isV6OrHigher = (props.context?.modelVersion ?? 0) >= 6;
-
   return {
     width: '100%',
     height: '100%',
-    ...(isV6OrHigher
-      ? {}
-      : { 'max-height': logoHeight.value, 'max-width': logoWidth.value }),
+    'max-width': logoWidth.value,
+    'max-height': logoHeight.value,
   } as any;
 });
 
@@ -134,13 +126,10 @@ onMounted(async () => {
 .logo__image {
   display: block;
   object-fit: contain;
-}
-
-.logo__image--legacy {
   height: 6rem;
 }
 
-.brand-page .logo__image--legacy {
+.brand-page .logo__image {
   margin: var(--logo-spacing) auto;
 }
 </style>

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

@@ -91,8 +91,6 @@ export interface BrandPageContext {
   /** Is brand page rendered for preview */
   isCapturingPreview: boolean;
   disableLogoRenderOnServerside?: boolean;
-  /** Model version for conditional rendering */
-  modelVersion?: number;
 }
 
 const getValueType = (key: string, abtestValue?: string): AbTestResult => {

package/src/brand-page/utils/__snapshots__/migration.util.test.ts.snap

@@ -426,7 +426,7 @@ BrandPageModel {
       },
     },
   },
-  "v": 6,
+  "v": 5,
 }
 `;
 
@@ -839,7 +839,7 @@ BrandPageModel {
       },
     },
   },
-  "v": 6,
+  "v": 5,
 }
 `;
 
@@ -1259,6 +1259,6 @@ BrandPageModel {
       },
     },
   },
-  "v": 6,
+  "v": 5,
 }
 `;

package/src/brand-page/utils/migration/logo/migration.util.logo.test.ts

@@ -9,14 +9,14 @@ import { migrateBrandPageModel } from '../../migration.util';
 import { BrandPageModel } from '../../../models';
 
 describe('migration.util.logo', () => {
-  test('migrateBrandPageModel should migrate logo content when give a brand site data with logo image url', async () => {
+  test('migrateBrandPageModel should migrate logo content when give a brand site data with logo image url', () => {
     // Arrange
     const logoImage = logoUtil.safeGetLogoImageFromLogoImageUrl(
       brandsiteMigrationBrandPageData.headerStyles.logoImageUrl,
     )!;
 
     // Act
-    const brandPageModel = await migrateBrandPageModel(
+    const brandPageModel = migrateBrandPageModel(
       new BrandPageModel(brandsiteMigrationBrandPageData as any),
       { isUserDraft: true },
     );

package/src/brand-page/utils/migration/migration-01.ts

@@ -1156,13 +1156,13 @@ export const migrateConvertLineHeightOnFooterStyles = (
   }
 };
 
-export const migration01 = async (
+export const migration01 = (
   brandPageModel: BrandPageModel,
   options: {
     logoImage?: LogoImageModel;
     isUserDraft: boolean;
   },
-): Promise<BrandPageModel> => {
+): BrandPageModel => {
   if (!brandPageModel.brandPageType) {
     brandPageModel.brandPageType = BRAND_PAGE_TYPES.default;
   }

package/src/brand-page/utils/migration/migration-02.ts

@@ -90,13 +90,13 @@ const handleConversion = (
   );
 };
 
-export const migration02 = async (
+export const migration02 = (
   brandPageModel: BrandPageModel,
   options: {
     logoImage?: LogoImageModel;
     isUserDraft: boolean;
   },
-): Promise<BrandPageModel> => {
+): BrandPageModel => {
   handleConversion(
     brandPageModel.pageHeaderDesktop?.navigation?.defaultButtonStyle,
   );

package/src/brand-page/utils/migration/migration-03.ts

@@ -69,13 +69,13 @@ const migrateApplyAutoScaleProperty = (
     brandPageType && brandPageType === BRAND_PAGE_TYPES.brandSite;
 };
 
-export const migration03 = async (
+export const migration03 = (
   brandPageModel: BrandPageModel,
   options: {
     logoImage?: LogoImageModel;
     isUserDraft: boolean;
   },
-): Promise<BrandPageModel> => {
+): BrandPageModel => {
   handleRecursiveFontSizeMigration(brandPageModel.pageHeaderDesktop);
   handleRecursiveFontSizeMigration(brandPageModel.pageHeaderMobile);
   handleRecursiveFontSizeMigration(brandPageModel.pageFooterDesktop);

package/src/brand-page/utils/migration/migration-04.ts

@@ -121,10 +121,10 @@ const updateUserUploadedImageUrls = (content: Content): void => {
   }
 };
 
-export const migration04 = async (
+export const migration04 = (
   brandPageModel: BrandPageModel,
   options: { logoImage?: LogoImageModel; isUserDraft: boolean },
-): Promise<BrandPageModel> => {
+): BrandPageModel => {
   if (
     brandPageModel.faviconUrl &&
     isUserUploadedImage(brandPageModel.faviconUrl)

package/src/brand-page/utils/migration/migration-05.ts

@@ -1,17 +1,7 @@
-import {
-  type BrandPageModel,
-  type TextContent,
-  type LogoImageModel,
-} from '../..';
+import { type BrandPageModel, type TextContent } from '../..';
 import { isTextContent } from '../model.util';
 
-export const migration05 = async (
-  brandPageModel: BrandPageModel,
-  options: {
-    logoImage?: LogoImageModel;
-    isUserDraft: boolean;
-  },
-): Promise<BrandPageModel> => {
+export const migration05 = (brandPageModel: BrandPageModel): BrandPageModel => {
   brandPageModel.pages.forEach((page) => {
     page.contents.forEach((content) => {
       if (isTextContent(content)) {