@designcrowd/library.brand-page 6.0.5 → 6.0.6-ast-bugs

package/src/shared/logo-settings/components/LogoStyleSettingsWithState.vue

@@ -69,14 +69,14 @@ const viewport = computed<ViewportsType>(() => {
   return brandPageMakerStore.viewport;
 });
 
-const logoSliderMin = computed(() => {
+const _logoSliderMin = computed(() => {
   if (viewport.value === VIEWPORTS.mobile) {
     return LOGO_SLIDER_MOBILE_MIN;
   }
   return LOGO_SLIDER_DESKTOP_MIN;
 });
 
-const logoSliderMax = computed(() => {
+const _logoSliderMax = computed(() => {
   if (viewport.value === VIEWPORTS.mobile) {
     return LOGO_SLIDER_MOBILE_MAX;
   }

package/src/shared/logo-settings/components/LogoTemplateSearch.vue

@@ -183,7 +183,7 @@ const onNewLogoSelected = async () => {
   const client = FabricRenderClient.getInstance();
 
   // To handle parallel requests
-  const [_, logoDesignAttributes] = await Promise.all([
+  const [__, logoDesignAttributes] = await Promise.all([
     updateTask(),
     client.getLogoAttributesByLogoTemplateTokenAsync(
       data.selectedTemplate.token,

package/src/shared/logo-settings/store/editable-logo-store.ts

@@ -311,7 +311,7 @@ export const useUiEditableLogoStore = defineStore('uiEditableLogo', {
 
       this.logoEdits.textObjects = [];
 
-      templateMetadata.objects.forEach((o, i) => {
+      templateMetadata.objects.forEach((o, _i) => {
         const matchingDraftObject = draftMetadata?.objects?.find(
           (d) => d.id === o.id,
         );

package/src/shared/logo-settings/store/logo-settings-store.test.ts

@@ -2,7 +2,7 @@ import type Vue from 'vue';
 import { createApp } from 'vue';
 import { createRouter, createMemoryHistory } from 'vue-router';
 import { createPinia, setActivePinia } from 'pinia';
-import type { LogoContent, NavRoute, TextContent } from '@brand-page';
+import type { LogoContent, TextContent } from '@brand-page';
 import type { ContentItem } from '../../content-settings/models';
 import { useBrandPageMakerStore } from '@brand-page-maker/stores';
 import { INITIALISE_PAYLOAD } from '@brand-page-maker/components/brand-page-maker/__fixtures__';
@@ -15,7 +15,7 @@ import { setLocaleAsync } from '@src/composables/useTranslate';
 
 const FABRIC_RENDER_BASE_URL = 'https://localhost:6006';
 
-const LOGO_VERSION_ONE_URL =
+const _LOGO_VERSION_ONE_URL =
   'https://localhost:6006/asset/logodraft/brand-page/00000000-0000-0000-0000-000000000000?v=637979483674400000&outputFormat=png&dimensionsType=preview_image_transparent_no_buffer';
 
 const LOGO_VERSION_TWO_URL =
@@ -53,7 +53,7 @@ const PAGE_TWO = createPage(2);
 const PAGE_THREE = createPage(3);
 
 describe('logo store module', () => {
-  let app: Vue.App;
+  let _app: Vue.App;
 
   beforeAll(async () => {
     FabricRenderClient.setInstance({ baseUrl: FABRIC_RENDER_BASE_URL });
@@ -64,7 +64,7 @@ describe('logo store module', () => {
 
     await setLocaleAsync('en-US');
 
-    app = createApp({
+    _app = createApp({
       pinia,
       router: createRouter({ history: createMemoryHistory(), routes: [] }),
     });

package/src/shared/logo-versions/LogoVersions.mixin.ts

@@ -16,6 +16,7 @@ export default defineComponent({
       required: true,
     },
   },
+  emits: ['on-select-logo'],
   setup() {
     const uiStore = useUiStore();
 

package/src/shared/models.ts

@@ -19,6 +19,12 @@ export interface UIRootState {
   thirdPartySettings: UIRootStateThirdPartySettings;
   personalisationData: UserPersonalisationContent[] | undefined;
   isPersonalisationEnabled: boolean;
+  // Pre-purchase AI content key used to personalise AI template previews when
+  // there is no post-purchase personalisationData (bp-5742).
+  userPromptContentKey: string | undefined;
+  // Controls visibility of the dedicated AI templates tab. Decoupled from personalisationData
+  // so the slug flow can personalise previews/apply without surfacing the AI tab (bp-5742).
+  showAiTemplatesTab: boolean;
 }
 
 export interface Endpoints {

package/src/shared/my-designs/MyDesigns.mixin.ts

@@ -16,6 +16,7 @@ export default defineComponent({
     TextInput,
     Loader,
   },
+  emits: ['on-select-image'],
   setup() {
     const uiStore = useUiStore();
     const logoSettingsStore = useUiLogoSettingsStore();

package/src/shared/my-uploads/MyMedia.mixin.ts

@@ -25,6 +25,7 @@ export default defineComponent({
       default: null,
     },
   },
+  emits: ['on-delete-image', 'on-select-image'],
   setup() {
     const uiStore = useUiStore();
 

package/src/shared/my-uploads/MyMediaSelectionItem.vue

@@ -29,7 +29,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, defineProps, defineEmits } from 'vue';
+import { ref, onMounted } from 'vue';
 import { Icon, Loader } from '@designcrowd/fe-shared-lib';
 import type { UserMediaClient } from 'src/clients/user-media-client';
 import type { UserMediaItemWithDimensions } from './models';
@@ -72,6 +72,7 @@ async function checkStatusAsync(): Promise<boolean> {
     }
 
     if (status === 'done') {
+      // eslint-disable-next-line vue/require-explicit-emits
       emit('on-media-done', data);
       previewSrc.value = data.thumbnailUrl ?? data.url ?? '';
       isDone.value = true;

package/src/shared/my-uploads/MyUploads.mixin.ts

@@ -54,6 +54,7 @@ export default defineComponent({
       default: undefined,
     },
   },
+  emits: ['on-delete-image', 'on-select-image'],
   setup() {
     const uiStore = useUiStore();
     const userStore = useBrandPageMakerUserStore();

package/src/shared/my-uploads/models.ts

@@ -27,8 +27,7 @@ export interface MediaBaseSelectedPayload {
   type: MediaTypes;
 }
 
-export interface GettyVideoMediaSelectedPayload
-  extends MediaBaseSelectedPayload {
+export interface GettyVideoMediaSelectedPayload extends MediaBaseSelectedPayload {
   assetId: string;
   token: string;
   mimeType: string;

package/src/shared/navigation-style-settings/components/navigation-style-settings/NavigationStyleSettings.mixin.ts

@@ -38,6 +38,7 @@ export default defineComponent({
       required: true,
     },
   },
+  emits: ['option-value-change'],
   data: () => ({
     navigationStyleConfigOptionTitles:
       NAVIGATION_STYLE_CONFIG_OPTION_TITLES() as Record<

package/src/shared/navigation-style-settings/components/navigation-style-settings/NavigationStyleSettings.vue

@@ -116,7 +116,7 @@ import { Toggle } from '@designcrowd/fe-shared-lib';
 import NavigationStyleSettingsMixin from './NavigationStyleSettings.mixin.ts';
 import ColorField from '../../../content-settings/components/color-field/ColorField.vue';
 import TextStyleField from '../../../content-settings/components/text-style-field/TextStyleField.vue';
-import { tr, commonTr } from '@src/composables/useTranslate';
+import { commonTr } from '@src/composables/useTranslate';
 
 export default {
   components: {

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

@@ -3,9 +3,6 @@ import { getPageTitleError } from '../../utils';
 import { useUiPageSettingsStore } from '../../store';
 import { useEventTracker } from '@brand-page-maker/composables/useEventTracker';
 import { usePageNavigationStore } from '../../../page-navigation/store/page-navigation-store';
-import type { NavRoute } from '@brand-page';
-import { v4 as uuid } from 'uuid';
-import { getPageSlugFromPageTitle } from '@src/lib';
 
 export default defineComponent({
   setup() {

package/src/shared/page-settings/components/page-settings/NestedDraggable.vue

@@ -256,7 +256,7 @@ function canMoveToPosition(
   sourceParentRouteId: string | null,
   draggedRouteId: string | undefined,
   draggedHasSubPages: boolean,
-  futureIndex: number | undefined,
+  _futureIndex: number | undefined,
 ): boolean {
   // Rule 1: Pages with sub-pages cannot become sub-pages themselves
   if (targetParentRouteId && draggedHasSubPages) {

package/src/shared/page-settings/components/page-settings/PageSettings.vue

@@ -115,7 +115,6 @@ import SideBarSettingsHeader from '../../../common/SideBarSettingsHeader.vue';
 import PageSettingsMixin from './PageSettings.mixin.ts';
 import SideBarSectionTitle from '../../../common/SideBarSectionTitle.vue';
 import DeletePageModal from '../delete-page-modal/DeletePageModal.vue';
-import PageElement from './PageElement.vue';
 import PageSettingsSectionStyles from '../page-settings-section-styles/PageSettingsSectionStyles.vue';
 import NestedDraggable from './NestedDraggable.vue';
 import { useBrandPageContainerStore } from '@brand-page-maker/stores';
@@ -133,7 +132,7 @@ export default {
     PageSettingsSectionStyles,
   },
   mixins: [PageSettingsMixin],
-  setup(props, context) {
+  setup(_props, _context) {
     const brandPageContainerStore = useBrandPageContainerStore();
 
     return {

package/src/shared/page-settings/components/page-settings-section-styles/HeaderDisplayStyle.vue

@@ -72,7 +72,7 @@ const options = computed(() => {
     }
   }
 
-  const filteredOptions = filteredConfigs.reduce((arr, config, index) => {
+  const filteredOptions = filteredConfigs.reduce((arr, config, _index) => {
     config.option.isSelected = props.displayStyle === config.option.value;
 
     arr.push(config.option);

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

@@ -575,7 +575,7 @@ export default defineComponent({
 
     async onLogoVersionSelected(selectedLogoVersion: DisplayLogoDraftAsset) {
       const uiStore = useUiStore();
-      const brandPageMakerStore = useBrandPageMakerStore();
+      const _brandPageMakerStore = useBrandPageMakerStore();
 
       this.logoDraftToken = selectedLogoVersion.token;
 

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

@@ -3,7 +3,7 @@ import type Vue from 'vue';
 import { createApp } from 'vue';
 import { createPinia, setActivePinia } from 'pinia';
 import type { ContentPage } from '../models';
-import type { PageModel, TextContent } from '@brand-page';
+import type { TextContent } from '@brand-page';
 import type { ContentItem } from '../../content-settings/models';
 import {
   UNLIMITED_MAX_NUM_OF_PAGES,
@@ -13,15 +13,11 @@ import {
 import {
   INITIALISE_PAYLOAD,
   USER_FEATURES,
-  brandPageEmpty,
 } from '@brand-page-maker/components/brand-page-maker/__fixtures__';
 import { useUiPageSettingsStore } from './index';
-import { useUiContentSettingsStore } from '../../content-settings/store';
 import { FabricRenderClient } from '../../../clients/fabric-render-client';
 import { setLocaleAsync } from '@src/composables/useTranslate';
 import { usePageNavigationStore } from '@src/shared/page-navigation/store/page-navigation-store';
-import { getPageSlugFromPageTitle } from '@src/lib';
-import { v4 as uuid } from 'uuid';
 
 vi.mock('../../../clients/brand-page-client', () => ({
   default: {
@@ -50,7 +46,7 @@ const PAGE_TWO = createPage(2);
 const PAGE_THREE = createPage(3);
 
 describe('page store module', () => {
-  let app: Vue.App;
+  let _app: Vue.App;
 
   beforeAll(async () => {
     FabricRenderClient.setInstance({ baseUrl: 'http://localhost:3000' });
@@ -63,7 +59,7 @@ describe('page store module', () => {
 
     await setLocaleAsync('en-US');
 
-    app = createApp({
+    _app = createApp({
       pinia,
       router,
     });
@@ -166,7 +162,7 @@ describe('page store module', () => {
       pages: [PAGE_ONE, PAGE_TWO],
     });
 
-    const firstPage = pageSettingsStore.addNewPage({
+    pageSettingsStore.addNewPage({
       title: 'Page 3',
     });
 

package/src/shared/publish-brand-page-with-state/PublishBrandPageModalWithState.mixin.ts

@@ -17,7 +17,6 @@ import {
   useEventTracker,
 } from '@brand-page-maker/composables/useEventTracker';
 import { publishBrandPageModalWithStateTr } from '@src/composables/useTranslate';
-import { BRAND_PAGE_TYPES } from '@brand-page/models';
 
 export default defineComponent({
   props: {

package/src/shared/shape-library/ShapeLibrary.vue

@@ -203,8 +203,8 @@ const makerMode = computed(() =>
     ? `admin_${makerStore.brandPageType.toLocaleLowerCase()}`
     : makerStore.brandPageType.toLocaleLowerCase(),
 );
-const endpoints = computed(() => uiStore.endpoints);
-const thirdPartySettings = computed(() => uiStore.thirdPartySettings);
+const _endpoints = computed(() => uiStore.endpoints);
+const _thirdPartySettings = computed(() => uiStore.thirdPartySettings);
 const isDesignCom = computed(() => containerStore.isDesignCom);
 
 const tabsWithTranslations = [

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

@@ -230,7 +230,7 @@ export const useUiStyleSettingsStore = defineStore('uiStyleSettings', {
       type: TextStyleType;
       style: TextStyleDeclaration;
     }) {
-      const { textAlign, textStyleType, ...style } = payload.style;
+      const { ...style } = payload.style;
 
       this.$patch((state) => {
         state.textStyles.textStyleOptions[payload.type].isModified = true;

package/src/shared/template-settings/components/TemplatesSettings.mixin.ts

@@ -60,7 +60,7 @@ export default defineComponent({
       templateCategories: computed(
         () => templateSettingsStore.templateCategories,
       ),
-      personalisationData: computed(() => uiStore.personalisationData),
+      showAiTemplatesTab: computed(() => uiStore.showAiTemplatesTab),
       templateSettingsStore,
       uiStore,
       isDesignCom: computed(() => containerStore.isDesignCom),
@@ -155,7 +155,7 @@ export default defineComponent({
     },
 
     visibleTabs() {
-      return this.personalisationData
+      return this.showAiTemplatesTab
         ? this.tabs
         : [...this.tabs].splice(
             0,

package/src/shared/template-settings/models.ts

@@ -7,6 +7,7 @@ export interface TemplateSettingsTemplate {
   personalisationContentIndex?: number;
   brandPageModel: BrandPageModel;
   contentKey?: string;
+  usesUserPromptContentKey?: boolean;
   previewImageUrl?: string;
 }
 

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

@@ -14,6 +14,7 @@ import * as DesignTemplateClient from '../../../clients/design-template-client';
 import { type DesignTemplate } from '../../../clients/models';
 import {
   BP_DEFAULT_TEMPLATE_TYPE_NAME,
+  BP_BRAND_SITE_TEMPLATE_TYPE_NAME,
   SIDE_BAR_TAB_NAMES,
 } from '@brand-page-maker/constants';
 import { defineStore, storeToRefs } from 'pinia';
@@ -32,6 +33,7 @@ import {
   useUiEditableLogoStore,
   useUiLogoSettingsStore,
 } from '../../logo-settings/store';
+import { useEventTracker } from '@brand-page-maker/composables/useEventTracker';
 import {
   templateSettingsTr,
   getCurrentLocale,
@@ -39,6 +41,17 @@ import {
 import { watch } from 'vue';
 
 export const DEFAULT_PAGE_SIZE = 6;
+
+const POST_PURCHASE_PAGE_SECTION_BY_TAB: Record<string, string> = {
+  [TEMPLATE_TABS.all]: 'MakerPostPurchaseSidebarTemplatesAllTab',
+  [TEMPLATE_TABS.AI]: 'MakerPostPurchaseSidebarTemplatesAiTab',
+  [TEMPLATE_TABS.categories]: 'MakerPostPurchaseSidebarTemplatesCategoryTab',
+};
+
+const PRE_PURCHASE_PAGE_SECTION_BY_TAB: Record<string, string> = {
+  [TEMPLATE_TABS.all]: 'MakerPrePurchaseSidebarTemplatesAllTab',
+  [TEMPLATE_TABS.categories]: 'MakerPrePurchaseSidebarTemplatesCategoryTab',
+};
 const LOAD_PAGE_RETRY_DELAY = 250;
 
 type SelectedTabType = {
@@ -66,6 +79,7 @@ export interface TemplatesSettingState {
   tabsWithTranslations: SelectedTabType[];
   logoChangeWatcherInitialized: boolean;
   initialSearchTerm: string | undefined;
+  aiTemplateKeywords: string | undefined;
   onSearchTermChanged: OnSearchTermChangedCallback | undefined;
 }
 
@@ -103,6 +117,7 @@ export const useUiTemplateSettingsStore = defineStore('uiTemplateSettings', {
       cachedTemplates: {},
       logoChangeWatcherInitialized: false,
       initialSearchTerm: undefined,
+      aiTemplateKeywords: undefined,
       onSearchTermChanged: undefined,
     };
   },
@@ -302,22 +317,60 @@ export const useUiTemplateSettingsStore = defineStore('uiTemplateSettings', {
         const editableLogoVariation =
           editableLogoStore.editableLogoVariations[logoVariation];
 
+        const isPrePurchase = brandPageContainerStore.isPrePurchase;
+        const isBrandSite =
+          this.templateType === BP_BRAND_SITE_TEMPLATE_TYPE_NAME;
+
+        // Pre-purchase has no logo draft for logo-based recommendation, so fall back to the seeded
+        // search term (the keyword from the URL/cookie - never the business name) so the All tab
+        // stays relevant instead of generic (bp-5454).
+        const effectiveSearchTerm =
+          !this.searchTerm &&
+          !this.selectedCategory &&
+          isPrePurchase &&
+          isBrandSite &&
+          this.selectedTab.key === TEMPLATE_TABS.all
+            ? this.initialSearchTerm
+            : this.searchTerm;
+
+        const pageSection = isBrandSite
+          ? (isPrePurchase
+              ? PRE_PURCHASE_PAGE_SECTION_BY_TAB
+              : POST_PURCHASE_PAGE_SECTION_BY_TAB)[this.selectedTab.key]
+          : undefined;
+
+        const pageName = isBrandSite
+          ? isPrePurchase
+            ? 'maker-pre-purchase'
+            : 'maker'
+          : undefined;
+
+        const baseParams = {
+          page: pageNo,
+          categoryName: this.selectedCategory,
+          searchTerm: effectiveSearchTerm,
+          keywords: this.aiTemplateKeywords,
+          logoDraftToken: logoSettingsStore.selectedLogoImage.logoDraftToken,
+          logoVariation: logoSettingsStore.selectedLogoImage.logoVariation,
+          selectedTemplateToken: designTemplateToken,
+          locale: currentLocale,
+          logoS3Token: !isByo ? editableLogoVariation.s3Token : undefined,
+          logoTemplateToken: isByo ? logoTemplateToken : undefined,
+          useLogoForRecommendedTemplates:
+            isBrandSite && this.selectedTab.key === TEMPLATE_TABS.all,
+          pageSection,
+          pageName,
+        };
+
+        // AI templates are interleaved server-side for the Brand Site All tab
+        // (bp-5306); the frontend just renders the returned order.
         const result =
           await designTemplateClient.getTemplateItemsByTemplateType(
             this.templateType,
             {
-              page: pageNo,
+              ...baseParams,
               pageSize: DEFAULT_PAGE_SIZE,
-              categoryName: this.selectedCategory,
-              searchTerm: this.searchTerm,
-              logoDraftToken:
-                logoSettingsStore.selectedLogoImage.logoDraftToken,
-              logoVariation: logoSettingsStore.selectedLogoImage.logoVariation,
               personalisable: this.selectedTab.key === TEMPLATE_TABS.AI,
-              selectedTemplateToken: designTemplateToken,
-              locale: currentLocale,
-              logoS3Token: !isByo ? editableLogoVariation.s3Token : undefined,
-              logoTemplateToken: isByo ? logoTemplateToken : undefined,
             },
           );
 
@@ -327,11 +380,27 @@ export const useUiTemplateSettingsStore = defineStore('uiTemplateSettings', {
 
         this._setPageCount({ pageCount: result.pageCount });
 
+        if (
+          pageNo === 1 &&
+          result.abTestValuesToBePushed &&
+          Object.keys(result.abTestValuesToBePushed).length > 0
+        ) {
+          const eventTracker = useEventTracker();
+
+          for (const [experimentName, experimentValue] of Object.entries(
+            result.abTestValuesToBePushed,
+          )) {
+            eventTracker.sendExperimentStartedEvent(
+              experimentName,
+              experimentValue,
+            );
+          }
+        }
+
         const templates = await Promise.all(
           result.paginatedItems.map(async (item) => {
             try {
               if (brandPageMakerUserStore.isAdmin) {
-                // Pre-purchase: full template with brandPageModel for live rendering
                 const template =
                   await designTemplateClient.getTemplateByTemplateToken(
                     item.designTemplateToken,
@@ -349,17 +418,24 @@ export const useUiTemplateSettingsStore = defineStore('uiTemplateSettings', {
                       uiStore.personalisationData.length,
                     );
 
-                  // Get the contentKey from the selected personalisation variation
-                  // This is needed for the backend preview URL to show the correct variation
-                  const selectedPersonalisation =
-                    uiStore.personalisationData[personalisationContentIndex];
-
-                  contentKey = selectedPersonalisation.contentKey;
+                  contentKey =
+                    uiStore.personalisationData[personalisationContentIndex]
+                      .contentKey;
+                } else if (item.isPersonalisable) {
+                  // Pre-purchase has no personalisationData; personalise AI
+                  // template previews with the prompt content key (bp-5742).
+                  contentKey = uiStore.userPromptContentKey;
                 }
 
                 return {
                   id: item.designTemplateToken,
+                  isPersonalisable: item.isPersonalisable,
                   contentKey,
+                  // A userPromptContentKey signals this design's real AI images live
+                  // in the userPrompt bucket (post- or pre-purchase). The preview must
+                  // then resolve via userPromptContentKey, not the regular bucket which
+                  // holds placeholders post-purchase (bp-5454).
+                  usesUserPromptContentKey: !!uiStore.userPromptContentKey,
                   previewImageUrl: item.previewImageUrl,
                 } as TemplateSettingsTemplate;
               }
@@ -374,7 +450,15 @@ export const useUiTemplateSettingsStore = defineStore('uiTemplateSettings', {
           (t): t is TemplateSettingsTemplate => t !== null,
         );
 
-        this._addTemplates({ templates: validTemplates });
+        // The Categories tab must never surface AI templates or the AI badge
+        // (bp-5454 scenario 5). The badge is driven purely by isPersonalisable,
+        // so clear it for category results regardless of the template's catalog flag.
+        const displayTemplates =
+          this.selectedTab.key === TEMPLATE_TABS.categories
+            ? validTemplates.map((t) => ({ ...t, isPersonalisable: false }))
+            : validTemplates;
+
+        this._addTemplates({ templates: displayTemplates });
         this._setPageNoLoaded({ pageNoLoaded: pageNo });
       } finally {
         this._setIsBusy({ isBusy: false });
@@ -496,6 +580,9 @@ export const useUiTemplateSettingsStore = defineStore('uiTemplateSettings', {
       this.initialSearchTerm = payload.initialSearchTerm;
       this.onSearchTermChanged = payload.onSearchTermChanged;
     },
+    setAiTemplateKeywords(payload: { aiTemplateKeywords: string }) {
+      this.aiTemplateKeywords = payload.aiTemplateKeywords;
+    },
     notifySearchTermChanged(searchTerm: string | undefined) {
       this.onSearchTermChanged?.(searchTerm);
     },

package/src/shared/unsplash-library/UnsplashLibrary.vue

@@ -103,7 +103,7 @@
     </div>
     <p class="tw-mt-4 tw-text-xs tw-text-grayscale-600">
       {{ tr('poweredBy') }}
-      <a
+        <a
 href="https://unsplash.com"
 class="maker-anchor tw-no-underline"
         >Unsplash</a
@@ -114,11 +114,7 @@ class="maker-anchor tw-no-underline"
 <script>
 import UnsplashLibraryMixin from './UnsplashLibrary.mixin.ts';
 import { Button, Loader, TextInput } from '@designcrowd/fe-shared-lib';
-import {
-  tr,
-  commonTr,
-  unsplashImageCategoriesTr,
-} from '@src/composables/useTranslate';
+import { tr, commonTr } from '@src/composables/useTranslate';
 
 export default {
   components: {

package/src/shared/video-library/VideoLibrary.vue

@@ -151,7 +151,7 @@ interface Props {
   isMobile?: boolean;
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   isMobile: false,
 });
 

package/src/utils/build-asset-manifest.ts

@@ -41,6 +41,18 @@ export function resolveLogoData(
   return logoImageBase64Url || undefined;
 }
 
+/**
+ * Look up an asset key from the manifest by matching the data content.
+ */
+export function findAssetKey(
+  assets: AssetEntry[] | undefined,
+  data: string | undefined,
+): string | undefined {
+  if (!data || !assets) return undefined;
+
+  return assets.find((a) => a.data === data)?.key;
+}
+
 /**
  * Hash a string using SHA-256 and return the first 16 hex characters.
  * Uses the Web Crypto API (available in browsers and modern runtimes).