@designcrowd/library.brand-page 5.19.1-id-based-items-2 → 5.19.2

package/src/clients/models.ts

@@ -4,6 +4,7 @@ export interface Paginated<T> {
   pageSize: number;
   pageCount: number;
   totalResultCount: number;
+  abTestValuesToBePushed?: Record<string, string>;
 }
 
 export interface DesignTemplate {
@@ -14,6 +15,7 @@ export interface DesignTemplate {
 
 export interface PaginatedDesignTemplateItem {
   designTemplateToken: string;
+  isPersonalisable?: boolean;
   previewImageUrl?: string;
 }
 

package/src/metadata-builder/builders/footer-builder.test.ts

@@ -14,10 +14,6 @@ import { FooterBuilder } from './footer-builder';
  * The fix routes copyright style writes through `applyDetachedStyleOverride`,
  * which resolves the preset in and clears `textStyleType` so the per-element
  * override sticks.
- *
- * BP-5603: social link mutations converted from index-based to id-based
- * (item_id / move_before_item_id / _remove_social_link_ids), mirroring the
- * section-level move_before_content_id contract one level deeper.
  */
 
 const textStyleOptions = {
@@ -46,37 +42,6 @@ const makeModel = (copyrightStyle: Record<string, unknown>): BrandPageModel =>
     pageFooterMobile: { copyrightStyle: { ...copyrightStyle } },
   }) as unknown as BrandPageModel;
 
-const makeModelWithLinks = (
-  links: { id?: string; imageUrl: string; url: string }[],
-): BrandPageModel =>
-  ({
-    styles: { textStyles: { textStyleOptions } },
-    pageFooterDesktop: {
-      copyrightStyle: {},
-      socialLinks: links.map((l) => ({
-        id: l.id,
-        imageUrl: l.imageUrl,
-        url: l.url,
-        imageTitle: '',
-        width: 0,
-        height: 0,
-        imageLink: '',
-      })),
-    },
-    pageFooterMobile: {
-      copyrightStyle: {},
-      socialLinks: links.map((l) => ({
-        id: l.id,
-        imageUrl: l.imageUrl,
-        url: l.url,
-        imageTitle: '',
-        width: 0,
-        height: 0,
-        imageLink: '',
-      })),
-    },
-  }) as unknown as BrandPageModel;
-
 const run = (args: UpdateFooterArguments, model: BrandPageModel) =>
   new FooterBuilder({
     id: 'f1',
@@ -84,10 +49,6 @@ const run = (args: UpdateFooterArguments, model: BrandPageModel) =>
     payload: args,
   }).buildAsync(model);
 
-// ---------------------------------------------------------------------------
-// Copyright font (BP-5420)
-// ---------------------------------------------------------------------------
-
 describe('FooterBuilder — copyright font vs global style', () => {
   it('detaches from the global preset: applies the font, clears textStyleType, retains preset values', async () => {
     const model = makeModel({
@@ -113,262 +74,3 @@ describe('FooterBuilder — copyright font vs global style', () => {
     expect(style.textAlign).toBe('center');
   });
 });
-
-// ---------------------------------------------------------------------------
-// Social links — id-based mutations (BP-5603)
-// ---------------------------------------------------------------------------
-
-describe('FooterBuilder — social links id-based mutations', () => {
-  it('backfills ids on legacy links that have none', async () => {
-    // Links without ids (legacy persisted data)
-    const model = makeModelWithLinks([
-      { imageUrl: 'facebook', url: 'https://fb.com' },
-      { imageUrl: 'instagram', url: 'https://ig.com' },
-    ]);
-
-    const { model: out } = await run({}, model);
-
-    const links = out.pageFooterDesktop!.socialLinks;
-
-    expect(links[0].id).toBeTruthy();
-    expect(links[1].id).toBeTruthy();
-    expect(links[0].id).not.toBe(links[1].id);
-  });
-
-  it('updates an existing link in place by item_id', async () => {
-    const model = makeModelWithLinks([
-      { id: 'link-1', imageUrl: 'facebook', url: 'https://fb.com' },
-      { id: 'link-2', imageUrl: 'instagram', url: 'https://ig.com' },
-    ]);
-
-    const { model: out } = await run(
-      {
-        social_links: [
-          { item_id: 'link-1', url: 'https://facebook.com/mybrand' },
-        ],
-      },
-      model,
-    );
-
-    const links = out.pageFooterDesktop!.socialLinks;
-
-    expect(links).toHaveLength(2);
-    expect(links[0].url).toBe('https://facebook.com/mybrand');
-    expect(links[0].id).toBe('link-1');
-    // untouched link unchanged
-    expect(links[1].id).toBe('link-2');
-    expect(links[1].url).toBe('https://ig.com');
-  });
-
-  it('updates social_link_icon on an existing link', async () => {
-    const model = makeModelWithLinks([
-      { id: 'link-1', imageUrl: 'facebook', url: 'https://fb.com' },
-    ]);
-
-    const { model: out } = await run(
-      {
-        social_links: [{ item_id: 'link-1', social_link_icon: 'facebook-v2' }],
-      },
-      model,
-    );
-
-    expect(out.pageFooterDesktop!.socialLinks[0].imageUrl).toBe('facebook-v2');
-  });
-
-  it('skips unknown item_id silently', async () => {
-    const model = makeModelWithLinks([
-      { id: 'link-1', imageUrl: 'facebook', url: 'https://fb.com' },
-    ]);
-
-    const { model: out } = await run(
-      {
-        social_links: [{ item_id: 'no-such-id', url: 'https://nowhere.com' }],
-      },
-      model,
-    );
-
-    const links = out.pageFooterDesktop!.socialLinks;
-
-    expect(links).toHaveLength(1);
-    expect(links[0].url).toBe('https://fb.com');
-  });
-
-  it('inserts a new link (no item_id) appended by default', async () => {
-    const model = makeModelWithLinks([
-      { id: 'link-1', imageUrl: 'facebook', url: 'https://fb.com' },
-    ]);
-
-    const { model: out } = await run(
-      {
-        social_links: [
-          { social_link_icon: 'instagram', url: 'https://ig.com' },
-        ],
-      },
-      model,
-    );
-
-    const links = out.pageFooterDesktop!.socialLinks;
-
-    expect(links).toHaveLength(2);
-    expect(links[1].imageUrl).toBe('instagram');
-    expect(links[1].id).toBeTruthy();
-  });
-
-  it('inserts a new link before an anchor via move_before_item_id', async () => {
-    const model = makeModelWithLinks([
-      { id: 'link-1', imageUrl: 'facebook', url: 'https://fb.com' },
-      { id: 'link-2', imageUrl: 'instagram', url: 'https://ig.com' },
-    ]);
-
-    const { model: out } = await run(
-      {
-        social_links: [
-          {
-            social_link_icon: 'x',
-            url: 'https://x.com',
-            move_before_item_id: 'link-2',
-          },
-        ],
-      },
-      model,
-    );
-
-    const links = out.pageFooterDesktop!.socialLinks;
-
-    expect(links).toHaveLength(3);
-    expect(links[0].id).toBe('link-1');
-    expect(links[1].imageUrl).toBe('x');
-    expect(links[2].id).toBe('link-2');
-  });
-
-  it('inserts a new link at end via move_before_item_id "__end__"', async () => {
-    const model = makeModelWithLinks([
-      { id: 'link-1', imageUrl: 'facebook', url: 'https://fb.com' },
-      { id: 'link-2', imageUrl: 'instagram', url: 'https://ig.com' },
-    ]);
-
-    const { model: out } = await run(
-      {
-        social_links: [
-          {
-            social_link_icon: 'x',
-            url: 'https://x.com',
-            move_before_item_id: '__end__',
-          },
-        ],
-      },
-      model,
-    );
-
-    const links = out.pageFooterDesktop!.socialLinks;
-
-    expect(links).toHaveLength(3);
-    expect(links[2].imageUrl).toBe('x');
-  });
-
-  it('moves an existing link before an anchor via move_before_item_id', async () => {
-    const model = makeModelWithLinks([
-      { id: 'link-1', imageUrl: 'facebook', url: 'https://fb.com' },
-      { id: 'link-2', imageUrl: 'instagram', url: 'https://ig.com' },
-      { id: 'link-3', imageUrl: 'x', url: 'https://x.com' },
-    ]);
-
-    const { model: out } = await run(
-      {
-        social_links: [{ item_id: 'link-3', move_before_item_id: 'link-1' }],
-      },
-      model,
-    );
-
-    const links = out.pageFooterDesktop!.socialLinks;
-
-    expect(links.map((l) => l.id)).toEqual(['link-3', 'link-1', 'link-2']);
-  });
-
-  it('removes links by id', async () => {
-    const model = makeModelWithLinks([
-      { id: 'link-1', imageUrl: 'facebook', url: 'https://fb.com' },
-      { id: 'link-2', imageUrl: 'instagram', url: 'https://ig.com' },
-      { id: 'link-3', imageUrl: 'x', url: 'https://x.com' },
-    ]);
-
-    const { model: out } = await run(
-      { _remove_social_link_ids: ['link-1', 'link-3'] },
-      model,
-    );
-
-    const links = out.pageFooterDesktop!.socialLinks;
-
-    expect(links).toHaveLength(1);
-    expect(links[0].id).toBe('link-2');
-  });
-
-  it('_replace_social_links rebuilds the entire list and assigns fresh ids', async () => {
-    const model = makeModelWithLinks([
-      { id: 'old-1', imageUrl: 'facebook', url: 'https://fb.com' },
-    ]);
-
-    const { model: out } = await run(
-      {
-        _replace_social_links: true,
-        social_links: [
-          { social_link_icon: 'instagram', url: 'https://ig.com' },
-          { social_link_icon: 'x', url: 'https://x.com' },
-        ],
-      },
-      model,
-    );
-
-    const links = out.pageFooterDesktop!.socialLinks;
-
-    expect(links).toHaveLength(2);
-    expect(links[0].imageUrl).toBe('instagram');
-    expect(links[1].imageUrl).toBe('x');
-    // fresh ids assigned, not the old one
-    expect(links[0].id).toBeTruthy();
-    expect(links[0].id).not.toBe('old-1');
-  });
-
-  it('_replace_social_links with empty social_links clears all', async () => {
-    const model = makeModelWithLinks([
-      { id: 'link-1', imageUrl: 'facebook', url: 'https://fb.com' },
-    ]);
-
-    const { model: out } = await run({ _replace_social_links: true }, model);
-
-    expect(out.pageFooterDesktop!.socialLinks).toHaveLength(0);
-  });
-
-  it('normalises mailto: and tel: prefixes on new links', async () => {
-    const model = makeModelWithLinks([]);
-
-    const { model: out } = await run(
-      {
-        social_links: [
-          { social_link_icon: 'email', url: 'mailto:me@example.com' },
-          { social_link_icon: 'phone', url: 'tel:+1234567890' },
-        ],
-      },
-      model,
-    );
-
-    const links = out.pageFooterDesktop!.socialLinks;
-
-    expect(links[0].url).toBe('me@example.com');
-    expect(links[1].url).toBe('+1234567890');
-  });
-
-  it('applies mutations to both desktop and mobile footers', async () => {
-    const model = makeModelWithLinks([
-      { id: 'link-1', imageUrl: 'facebook', url: 'https://fb.com' },
-    ]);
-
-    const { model: out } = await run(
-      { _remove_social_link_ids: ['link-1'] },
-      model,
-    );
-
-    expect(out.pageFooterDesktop!.socialLinks).toHaveLength(0);
-    expect(out.pageFooterMobile!.socialLinks).toHaveLength(0);
-  });
-});

package/src/metadata-builder/builders/footer-builder.ts

@@ -10,17 +10,12 @@ import {
 import type {
   UpdateFooterArguments,
   ViewportFooterOverrides,
+  FooterSocialLinkItem,
 } from '../parsers/ai-toolcall-parser';
 import type { Logger } from '../logger';
 import type { TextStyleOptions } from '../../brand-page/models/styles.model';
 import { FOOTER_CHECKS } from './section-rules/footer.rules';
 import { applyDetachedStyleOverride } from './section-field-utils';
-import {
-  ensureItemIds,
-  generateItemId,
-  removeItemsByIds,
-  repositionItemByAnchor,
-} from './item-id-utils';
 
 const normaliseSocialUrl = (url: string): string => {
   for (const prefix of ['mailto:', 'tel:']) {
@@ -52,7 +47,6 @@ const applyGlobalFooterChanges = (
   // they are superseded by the replacement and running them would cause duplicates.
   if (args._replace_social_links) {
     footer.socialLinks = (links ?? []).map((l) => ({
-      id: generateItemId(),
       imageUrl: l.social_link_icon || '',
       url: normaliseSocialUrl(l.url || ''),
       imageTitle: '',
@@ -62,59 +56,74 @@ const applyGlobalFooterChanges = (
     }));
   } else {
     // Targeted mutations — only run when NOT replacing the entire list.
-    // BP-5603: id-based contract (item_id / move_before_item_id / _remove_social_link_ids).
-    // Backfill ids on legacy links so they become referenceable after this call.
-    ensureItemIds(footer.socialLinks);
-
-    // Remove by id (order-independent — no index shifting needed).
-    footer.socialLinks = removeItemsByIds(
-      footer.socialLinks,
-      args._remove_social_link_ids,
-    );
 
-    // Update existing links (item_id present) or insert new links (no item_id).
+    // item_index-based updates for existing links
     if (links?.length) {
+      for (const link of links) {
+        if (link.item_index === undefined) continue;
+
+        const existing = footer.socialLinks?.[link.item_index];
+
+        if (!existing) continue;
+
+        if (link.social_link_icon !== undefined)
+          existing.imageUrl = link.social_link_icon;
+
+        if (link.url !== undefined) existing.url = normaliseSocialUrl(link.url);
+      }
+    }
+
+    // Remove by index (descending order to preserve indices during splice)
+    if (args._remove_social_link_indices?.length && footer.socialLinks) {
+      const sorted = [...args._remove_social_link_indices].sort(
+        (a, b) => b - a,
+      );
+
+      for (const idx of sorted) {
+        if (idx >= 0 && idx < footer.socialLinks.length)
+          footer.socialLinks.splice(idx, 1);
+      }
+    }
+
+    // Insert new links (descending insert_at order to preserve positions during splice)
+    const insertLinks = (links ?? []).filter(
+      (l): l is FooterSocialLinkItem & { insert_at: number } =>
+        l.insert_at !== undefined && l.item_index === undefined,
+    );
+    const sortedInserts = [...insertLinks].sort(
+      (a, b) => b.insert_at - a.insert_at,
+    );
+
+    for (const link of sortedInserts) {
+      const pos = Math.max(
+        0,
+        Math.min(link.insert_at, footer.socialLinks?.length ?? 0),
+      );
+
       footer.socialLinks = footer.socialLinks ?? [];
+      footer.socialLinks.splice(pos, 0, {
+        imageUrl: link.social_link_icon || '',
+        url: normaliseSocialUrl(link.url || ''),
+        imageTitle: '',
+        width: 0,
+        height: 0,
+        imageLink: '',
+      });
+    }
 
-      for (const link of links) {
-        if (link.item_id) {
-          // Update existing link in place; reposition if move_before_item_id set.
-          const existing = footer.socialLinks.find(
-            (l) => l.id === link.item_id,
-          );
-
-          // Unknown id — skip rather than guess at a position.
-          if (!existing) continue;
-
-          if (link.social_link_icon !== undefined)
-            existing.imageUrl = link.social_link_icon;
-
-          if (link.url !== undefined)
-            existing.url = normaliseSocialUrl(link.url);
-
-          repositionItemByAnchor(
-            footer.socialLinks,
-            existing,
-            link.move_before_item_id,
-          );
-        } else {
-          // New link — assign a stable id and position via move_before_item_id.
-          const newLink = {
-            id: generateItemId(),
-            imageUrl: link.social_link_icon || '',
-            url: normaliseSocialUrl(link.url || ''),
-            imageTitle: '',
-            width: 0,
-            height: 0,
-            imageLink: '' as string | false,
-          };
-
-          repositionItemByAnchor(
-            footer.socialLinks,
-            newLink,
-            link.move_before_item_id,
-          );
-        }
+    // Reorder (requires ALL indices — partial reorder is not supported)
+    if (args._reorder_social_links?.length && footer.socialLinks) {
+      const newOrder = args._reorder_social_links;
+      const unique = new Set(newOrder);
+
+      if (
+        unique.size === newOrder.length &&
+        newOrder.every((idx) => idx >= 0 && idx < footer.socialLinks!.length)
+      ) {
+        const reordered = newOrder.map((idx) => footer.socialLinks![idx]);
+
+        if (reordered.length === footer.socialLinks.length)
+          footer.socialLinks = reordered;
       }
     }
   }

package/src/metadata-builder/builders/section-builders/image-gallery-builder.ts

@@ -10,12 +10,6 @@ import type { BuilderResult } from '../../models';
 import { applyScalarFields, isValidUrl } from '../section-field-utils';
 import { BaseSectionBuilder } from './base-section-builder';
 import { validateImageGallery } from '../section-rules/image-gallery.rules';
-import {
-  ensureItemIds,
-  generateItemId,
-  removeItemsByIds,
-  repositionItemByAnchor,
-} from '../item-id-utils';
 
 const applyGalleryType = (
   content: ImageGalleryContent,
@@ -27,17 +21,11 @@ const applyGalleryType = (
   };
 };
 
-/**
- * Full rebuild: discard existing images and map the payload directly.
- * Used on create and when `_replace_items` is set. Each item gets a fresh id
- * (or keeps the caller-supplied `item_id` when provided).
- */
 const applyGalleryImages = (
   content: ImageGalleryContent,
   images: ImageGalleryItem[],
 ): void => {
   content.images = images.map((img) => ({
-    id: img.item_id || generateItemId(),
     imageUrl: isValidUrl(img.image_url) ? img.image_url! : '',
     imageTitle: img.caption || '',
     width: 0,
@@ -47,53 +35,84 @@ const applyGalleryImages = (
   }));
 };
 
-/**
- * Id-based merge (BP-5603), mirroring testimonial-section-builder one level
- * deeper into `content.images`:
- *   - `item_id` matches existing item  → update in place; reposition if
- *     `move_before_item_id` is set.
- *   - no `item_id`                     → add new item, positioned by
- *     `move_before_item_id`.
- *   - `removeIds`                      → delete by id (order-independent).
- *
- * Existing items are id-backfilled first so legacy galleries become
- * referenceable as soon as the metadata builder touches them.
- */
 const mergeGalleryImages = (
   content: ImageGalleryContent,
   images: ImageGalleryItem[],
-  removeIds: string[] | undefined,
+  replaceAll: boolean,
 ): void => {
-  ensureItemIds(content.images);
-  content.images = removeItemsByIds(content.images, removeIds);
+  const itemsToMerge = images.filter((img) => img.insert_at === undefined);
+
+  const updatedImages = itemsToMerge.map((img, index) => {
+    const existing = content.images?.[index];
+    const imageUrl = isValidUrl(img.image_url)
+      ? img.image_url!
+      : existing?.imageUrl ?? '';
+
+    return {
+      ...(existing || {}),
+      imageUrl,
+      imageTitle: img.caption ?? existing?.imageTitle ?? '',
+      width: existing?.width ?? 0,
+      height: existing?.height ?? 0,
+      mediaType: existing?.mediaType ?? 'image',
+      imageLink: existing?.imageLink ?? '',
+    };
+  });
+
+  if (
+    !replaceAll &&
+    content.images &&
+    content.images.length > itemsToMerge.length
+  ) {
+    const extras = content.images.slice(itemsToMerge.length).map((img) => ({
+      imageUrl: img.imageUrl ?? '',
+      imageTitle: img.imageTitle ?? '',
+      width: img.width ?? 0,
+      height: img.height ?? 0,
+      mediaType: img.mediaType ?? ('image' as const),
+      imageLink: img.imageLink ?? '',
+    }));
+
+    updatedImages.push(...extras);
+  }
 
-  for (const img of images) {
-    if (img.item_id) {
-      const existing = content.images.find((i) => i.id === img.item_id);
+  content.images = updatedImages;
+};
 
-      // Unknown id — skip rather than guess at a position.
-      if (!existing) continue;
+const insertGalleryImages = (
+  content: ImageGalleryContent,
+  images: ImageGalleryItem[],
+): void => {
+  const inserts = images.filter((img) => img.insert_at !== undefined);
 
-      if (img.image_url !== undefined) {
-        existing.imageUrl = isValidUrl(img.image_url) ? img.image_url! : '';
-      }
+  if (!inserts.length) return;
 
-      if (img.caption !== undefined) existing.imageTitle = img.caption;
-
-      repositionItemByAnchor(content.images, existing, img.move_before_item_id);
-    } else {
-      const newItem = {
-        id: generateItemId(),
-        imageUrl: isValidUrl(img.image_url) ? img.image_url! : '',
-        imageTitle: img.caption ?? '',
-        width: 0,
-        height: 0,
-        mediaType: 'image' as const,
-        imageLink: '',
-      };
-
-      repositionItemByAnchor(content.images, newItem, img.move_before_item_id);
-    }
+  const sorted = [...inserts].sort(
+    (a, b) => (b.insert_at ?? 0) - (a.insert_at ?? 0),
+  );
+
+  for (const img of sorted) {
+    if (!isValidUrl(img.image_url)) continue;
+
+    if (content.images?.some((existing) => existing.imageUrl === img.image_url))
+      continue;
+
+    content.images = content.images ?? [];
+
+    const pos = Math.max(
+      0,
+      Math.min(img.insert_at ?? 0, content.images.length),
+    );
+
+    content.images.splice(pos, 0, {
+      imageUrl: img.image_url!,
+      imageTitle: img.caption ?? '',
+      width: 0,
+      height: 0,
+      mediaType: 'image',
+      imageLink: '',
+      colorReplacements: [],
+    });
   }
 };
 
@@ -125,19 +144,26 @@ export class ImageGalleryBuilder extends BaseSectionBuilder<ImageGalleryContent>
       applyGalleryType(content, args.gallery_type);
     }
 
-    if (args._replace_items && args.images && Array.isArray(args.images)) {
-      // Full replacement: discard existing images and rebuild from the payload.
-      applyGalleryImages(content, args.images);
-    } else if (this.mode === 'create') {
-      if (args.images && Array.isArray(args.images)) {
+    if (args.images && Array.isArray(args.images)) {
+      if (this.mode === 'create') {
         applyGalleryImages(content, args.images);
+      } else {
+        mergeGalleryImages(content, args.images, !!args._replace_items);
       }
-    } else if (
-      (args.images && Array.isArray(args.images)) ||
-      args._remove_item_ids?.length
-    ) {
-      // Update: id-based add / edit / move / remove in a single pass.
-      mergeGalleryImages(content, args.images ?? [], args._remove_item_ids);
+    }
+
+    if (args._remove_item_indices?.length && content.images) {
+      const sorted = [...args._remove_item_indices].sort((a, b) => b - a);
+
+      for (const idx of sorted) {
+        if (idx >= 0 && idx < content.images.length) {
+          content.images.splice(idx, 1);
+        }
+      }
+    }
+
+    if (args.images && Array.isArray(args.images) && this.mode === 'update') {
+      insertGalleryImages(content, args.images);
     }
 
     return { request: this.request, model };