@designcrowd/library.brand-page 6.0.6-json-prereq-7 → 6.0.6-tracker-1

package/src/brand-page/models/index.ts

@@ -29,15 +29,6 @@ import { EMPTY_LOGO_IMAGE_MODEL, LogoStyles } from './logo.model';
 import type { LogoImageModel, LogoTemplateImageModel } from './logo.model';
 import cloneDeep from 'lodash.clonedeep';
 import type { BrandPagePaymentConfig } from './payment.model';
-import type { JSONContent } from '@tiptap/vue-3';
-
-/**
- * BP-5787 — a rich-text field is either a legacy inline-HTML string or a
- * Tiptap JSON document. Typing RTE content fields as RichTextValue (instead of
- * `string`) forces every consumer to handle both forms — surfacing at compile
- * time any code that assumes a plain string (e.g. `.replace`, `.length`).
- */
-export type RichTextValue = string | JSONContent;
 
 export * from './brand-page-context.model';
 export * from './payment.model';
@@ -281,7 +272,7 @@ export interface TextContent extends Content {
   /**
    * For BrandPage/BrandContact only
    */
-  text: RichTextValue;
+  text: string;
   /**
    * For BrandSite
    */
@@ -305,9 +296,9 @@ export interface TextContent extends Content {
 
 export interface ProfileContent extends Content {
   avatarImageUrl: string;
-  name: RichTextValue;
-  title: RichTextValue;
-  description: RichTextValue;
+  name: string;
+  title: string;
+  description: string;
   backgroundColor: BrandPageCssStyle;
   colorReplacements: ColorReplacement[];
   mediaType?: string;
@@ -328,7 +319,7 @@ export interface MapContent extends Content {
 
 export interface MailingListContent extends Content {
   acceptedFields?: 'emailOnly' | 'nameAndEmail';
-  title: RichTextValue;
+  title: string;
   buttonText: string;
   titleStyle: TextStyleDeclaration;
   buttonTextStyle: TextStyleDeclaration;
@@ -387,10 +378,10 @@ export interface FormField {
 export interface ContactFormContent extends Content {
   type: 'contact-form';
   displayStyle: string;
-  title: RichTextValue;
-  description: RichTextValue;
+  title: string;
+  description: string;
   buttonText: string;
-  successMessage: RichTextValue;
+  successMessage: string;
   fields: FormField[];
   responseEmail: string;
   imageUrl?: string;
@@ -410,8 +401,8 @@ export interface ContactFormContent extends Content {
 export interface BannerSectionContent extends Content {
   type: 'banner-section';
   imageUrl: string;
-  title: RichTextValue;
-  description: RichTextValue;
+  title: string;
+  description: string;
   buttonText: string | false;
   url: string;
   email?: string;
@@ -441,8 +432,8 @@ export const MEDIA_TYPES = {
 export type MediaType = keyof typeof MEDIA_TYPES;
 
 export interface TextMediaItem extends ImageItem {
-  title: RichTextValue;
-  paragraph: RichTextValue;
+  title: string;
+  paragraph: string;
   itemsId: number;
 
   buttonText?: string | false;
@@ -466,8 +457,8 @@ export interface TextShapeItem extends TextMediaItem {
 export interface ShapeItem extends ImageItem {
   colorReplacements: ColorReplacement[];
   mediaType: MediaType;
-  title?: RichTextValue;
-  paragraph?: RichTextValue;
+  title?: string;
+  paragraph?: string;
 
   // overrides for personalisation
   titleOverride?: string;
@@ -476,9 +467,9 @@ export interface ShapeItem extends ImageItem {
 
 export interface TestimonialItems {
   imageUrl: string;
-  name: RichTextValue;
-  position: RichTextValue;
-  testimonials: RichTextValue;
+  name: string;
+  position: string;
+  testimonials: string;
   colorReplacements: ColorReplacement[];
   mediaType: string;
   size?: string;
@@ -492,7 +483,7 @@ export interface TestimonialItems {
 }
 
 export interface TextItem {
-  text: RichTextValue;
+  text: string;
   textStyle: TextStyleDeclaration;
 
   // overrides for personalisation
@@ -514,8 +505,8 @@ export interface ImagesSectionContent extends Content, MediaSection {
 }
 
 export interface MediaSection extends Content {
-  title: RichTextValue;
-  description: RichTextValue;
+  title: string;
+  description: string;
   displayStyle: ImagesSectionContentDisplayStyle;
   items: TextShapeItem[] | TextMediaItem[];
   titleStyle: TextStyleDeclaration;
@@ -534,7 +525,7 @@ export interface ColorReplacement {
 
 export interface TestimonialSectionContent extends Content {
   type: 'testimonial-section';
-  title: RichTextValue;
+  title: string;
   displayStyle: string;
   items: TestimonialItems[];
   titleStyle: TextStyleDeclaration;
@@ -549,8 +540,8 @@ export interface TestimonialSectionContent extends Content {
 export interface AboutSectionContent extends Content {
   type: 'about-section';
   imageUrl: string;
-  title: RichTextValue;
-  paragraph: RichTextValue;
+  title: string;
+  paragraph: string;
   displayStyle: string;
   titleStyle: TextStyleDeclaration;
   paragraphStyle: TextStyleDeclaration;
@@ -577,7 +568,7 @@ export type SocialLinksIconDisplayStyle =
 
 export interface SocialLinksContent extends Content {
   type: 'social-links';
-  title: RichTextValue;
+  title: string;
   links: LinksItem[];
   iconDisplayStyle: SocialLinksIconDisplayStyle;
   iconFillStyles: BrandPageCssStyle;
@@ -604,8 +595,8 @@ export interface DividerSectionContent extends Content {
 
 export interface BookingSectionContent extends Content {
   type: 'booking-section';
-  title: RichTextValue;
-  description: RichTextValue;
+  title: string;
+  description: string;
   buttonText: string;
   url: string;
   email?: string;

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

@@ -457,7 +457,7 @@ exports[`migration.util > Banner Contents - text Align and Font Family should no
       },
     },
     "userPromptContentKey": undefined,
-    "v": 18,
+    "v": 17,
   },
   "useOldLogoRenderSize": true,
 }
@@ -903,7 +903,7 @@ exports[`migration.util > migrateBrandPageModel should return brand page model w
       },
     },
     "userPromptContentKey": undefined,
-    "v": 18,
+    "v": 17,
   },
   "useOldLogoRenderSize": true,
 }
@@ -1356,7 +1356,7 @@ exports[`migration.util > migrateBrandPageModel should return brand page model w
       },
     },
     "userPromptContentKey": undefined,
-    "v": 18,
+    "v": 17,
   },
   "useOldLogoRenderSize": true,
 }

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

@@ -20,7 +20,6 @@ import { migration14 } from './migration/migration-14';
 import { migration15 } from './migration/migration-15';
 import { migration16 } from './migration/migration-16';
 import { migration17 } from './migration/migration-17';
-import { migration18 } from './migration/migration-18';
 
 export interface MigrationData {
   brandPageModel: BrandPageModel;
@@ -161,17 +160,6 @@ const MIGRATION_TABLE = [
     description:
       'Padding Control backfill (BP-5699 Tier 2 + BP-5700 Store): backfill existing top/bottom spacing as explicit padding for text (12px), images/social links/shapes/booking (32px), store (16px), contact form (per layout), banner and about (per display style)',
   },
-  {
-    version: 18,
-    migrateFn: migration18,
-    // runAlways: normalise RTE to JSON on every load. Idempotent (only HTML
-    // strings are converted; JSON is skipped), so it also catches content the
-    // AI section builders still emit as HTML — converting it on the next read
-    // without a new migration or changes to those builders.
-    runAlways: true,
-    description:
-      'BP-5787: convert inline-HTML RTE content to Tiptap JSON on load (lazy migrate-on-read for web-renderer; persisted on next maker save; also normalises AI-built HTML)',
-  },
 ] as MigrationTableItem[];
 
 export const GetLatestModelVersion = () =>

package/src/brand-page/utils/style.util.test.ts

@@ -87,57 +87,6 @@ describe('style.util', () => {
     );
   });
 
-  test('applyLogoThemeToBrandPageModel preserves var() token refs in JSON RTE content (BP-5787)', () => {
-    // Arrange — title stored as Tiptap JSON with a theme-token colour mark.
-    const logoTheme = logoWithFlatColorsTheme;
-    const titleDoc = {
-      type: 'doc',
-      content: [
-        {
-          type: 'heading',
-          attrs: { level: 2, textAlign: 'center' },
-          content: [
-            {
-              type: 'text',
-              marks: [
-                {
-                  type: 'textStyle',
-                  attrs: { color: `var(--${STYLE_THEME_KEYS.LogoTextColor})` },
-                },
-              ],
-              text: 'Themed',
-            },
-          ],
-        },
-      ],
-    };
-    const brandPageModel = new BrandPageModel({
-      ...BRAND_SITE,
-      pages: [
-        {
-          title: '1',
-          slug: '1',
-          contents: [
-            {
-              ...createInitialBannerSectionContent(),
-              title: titleDoc,
-            } as any,
-          ],
-        },
-      ],
-    });
-
-    // Act
-    const { model } = applyLogoThemeToBrandPageModel(logoTheme, brandPageModel);
-
-    // Assert — JSON RTE content is an object, so the var() token is NOT
-    // flattened to rgb(); it survives so a new theme can still propagate.
-    const title = JSON.stringify((model.pages[0].contents[0] as any).title);
-
-    expect(title).toContain(`var(--${STYLE_THEME_KEYS.LogoTextColor})`);
-    expect(title).not.toContain(logoTheme.logoTextColor.rgb);
-  });
-
   test('applyLogoThemeToBrandPageModel should apply logo theme color to content color when content color has a color matched theme key', () => {
     // Arrange
     const logoTheme = logoWithFlatColorsTheme;

package/src/brand-page/utils/text.util.ts

@@ -1,56 +1,17 @@
 import { ESCAPED_NEWLINE_CHARACTER } from '../../constants/ui';
 
-/**
- * BP-5787 — a Tiptap JSON document is an object with `type: 'doc'`.
- * Inlined here (rather than importing from brand-page-maker) to avoid a
- * circular import: rich-text-editor.util imports getRenderText from this file.
- */
-const isTiptapDoc = (value: unknown): value is { type: 'doc' } =>
-  typeof value === 'object' &&
-  value !== null &&
-  (value as { type?: string }).type === 'doc';
-
-const jsonDocPlainText = (doc: unknown): string => {
-  const parts: string[] = [];
-
-  const walk = (node: any): void => {
-    if (typeof node?.text === 'string') parts.push(node.text);
-
-    node?.content?.forEach(walk);
-  };
-
-  walk(doc);
-
-  return parts.join(' ').replace(/\s+/g, ' ').trim();
-};
-
 export const getRenderText = (text: string): string => {
-  // BP-5787: RTE fields may now be Tiptap JSON objects. Non-strings pass
-  // through untouched so the renderer (TextWrapper) handles them via its
-  // JSON-aware path, instead of throwing on `.replace`.
-  if (typeof text !== 'string') {
-    return text as unknown as string;
-  }
-
   return text.replace(
     new RegExp(`(${ESCAPED_NEWLINE_CHARACTER}|\\n)`, 'g'),
     '<br/>',
   );
 };
 
-// Accepts a legacy inline-HTML string or a Tiptap JSON document (BP-5787):
-// for JSON it returns the concatenated visible text; for HTML it strips tags.
-export const escapeContentText = (text: unknown): string | undefined => {
+export const escapeContentText = (
+  text: string | undefined,
+): string | undefined => {
   if (!text) {
-    return text as undefined;
-  }
-
-  if (isTiptapDoc(text)) {
-    return jsonDocPlainText(text);
-  }
-
-  if (typeof text !== 'string') {
-    return undefined;
+    return text;
   }
 
   return text

package/src/brand-page/utils/vcard.util.ts

@@ -235,11 +235,9 @@ const addProfileInfo = (
   profile: ProfileViewModel,
   vcardLines: string[],
 ): void => {
-  const name = sanitizeForVCard(getPlainTextFromRTE(profile.name) || '');
-  const title = sanitizeForVCard(getPlainTextFromRTE(profile.title) || '');
-  const description = sanitizeForVCard(
-    getPlainTextFromRTE(profile.description) || '',
-  );
+  const name = sanitizeForVCard(profile.name || '');
+  const title = sanitizeForVCard(profile.title || '');
+  const description = sanitizeForVCard(profile.description || '');
 
   if (name) {
     const nameParts = name.trim().split(/\s+/);
@@ -318,7 +316,7 @@ export const saveContact = (brandPageData: {
 }): void => {
   const vcard = generateVCard(brandPageData);
   const profile = findProfileContent(brandPageData);
-  const filename = generateVCardFilename(getPlainTextFromRTE(profile?.name));
+  const filename = generateVCardFilename(profile?.name);
 
   downloadVCard(vcard, filename);
 };

package/src/brand-page/utils/view-model.util.ts

@@ -119,7 +119,7 @@ import {
   getRouteNameByPageIndex,
   getRouteParamsByPage,
 } from './route.util';
-import { hasRTEContent, isTiptapDocument } from '../../brand-page-maker/utils';
+import { hasRTEContent } from '../../brand-page-maker/utils';
 import {
   getPageIdFromHref,
   isHrefPageId,
@@ -1518,86 +1518,6 @@ const mapPageIdReferencesToRelativePaths = (
   });
 };
 
-// Resolve a `pageid:<id>` internal-link href to the published relative path.
-// Returns the resolved href, or null when `href` is not an internal pageid link
-// (external/absolute links are left untouched). Falls back to the site root when
-// the pageid can't be matched to a nav route.
-const resolvePageIdHref = (
-  href: string,
-  nav: NavViewModel,
-  options: ViewModelMappingOptions,
-): string | null => {
-  // Only process internal links (no protocol, doesn't start with /)
-  if (!href || href.match(/^(https?:\/\/|\/)/) || !isHrefPageId(href)) {
-    return null;
-  }
-
-  const pageId = getPageIdFromHref(href);
-  const route = findNavItemByPageId(nav.navItems, pageId);
-  const brandPageSlugRoute = options.brandPageSlug
-    ? `/${options.brandPageSlug}`
-    : '/';
-
-  if (route) {
-    if (route.isRoot) {
-      return brandPageSlugRoute;
-    }
-
-    return `${brandPageSlugRoute}${brandPageSlugRoute === '/' ? '' : '/'}${route.relativePath}`;
-  }
-
-  // fallback to root if pageid cannot be resolved.
-  return brandPageSlugRoute;
-};
-
-// BP-5847: walk a Tiptap JSON doc and rewrite every link mark whose href is a
-// `pageid:` reference into its published relative path. Returns a NEW doc when
-// something changed (so the shared model doc is never mutated), else the same
-// reference.
-export const resolvePageIdsInRteJson = (
-  doc: unknown,
-  nav: NavViewModel,
-  options: ViewModelMappingOptions,
-): unknown => {
-  let changed = false;
-
-  const walk = (node: any): any => {
-    if (!node || typeof node !== 'object') {
-      return node;
-    }
-
-    let next = node;
-
-    if (Array.isArray(node.marks)) {
-      const marks = node.marks.map((mark: any) => {
-        if (mark?.type === 'link' && typeof mark.attrs?.href === 'string') {
-          const resolved = resolvePageIdHref(mark.attrs.href, nav, options);
-
-          if (resolved !== null) {
-            changed = true;
-
-            return { ...mark, attrs: { ...mark.attrs, href: resolved } };
-          }
-        }
-
-        return mark;
-      });
-
-      next = { ...next, marks };
-    }
-
-    if (Array.isArray(node.content)) {
-      next = { ...next, content: node.content.map(walk) };
-    }
-
-    return next;
-  };
-
-  const result = walk(doc);
-
-  return changed ? result : doc;
-};
-
 const dynamicallyMapPageIdInHyperlinksToRelativePaths = (
   content: any,
   nav: NavViewModel,
@@ -1610,15 +1530,7 @@ const dynamicallyMapPageIdInHyperlinksToRelativePaths = (
       return;
     }
 
-    if (isTiptapDocument(value)) {
-      // BP-5847: RTE fields may now be Tiptap JSON. Resolve pageid link marks
-      // here too, or internal links render as raw `pageid:` and don't navigate.
-      (content as unknown as Record<string, unknown>)[key] =
-        resolvePageIdsInRteJson(value, nav, options);
-    } else if (
-      typeof value === 'object' &&
-      (key === 'items' || key === 'textItems')
-    ) {
+    if (typeof value === 'object' && (key === 'items' || key === 'textItems')) {
       if (Array.isArray(value)) {
         value.forEach((item) => {
           dynamicallyMapPageIdInHyperlinksToRelativePaths(item, nav, options);
@@ -1630,11 +1542,31 @@ const dynamicallyMapPageIdInHyperlinksToRelativePaths = (
       (content as unknown as Record<string, unknown>)[key] = value.replace(
         /<a\s+([^>]*?)href="([^"]*?)"([^>]*?)>/gi,
         (match, existingAttrsStart, href, existingAttrsEnd) => {
-          const resolved = resolvePageIdHref(href, nav, options);
+          // Only process internal links (no protocol, doesn't start with /)
+          if (href && !href.match(/^(https?:\/\/|\/)/) && isHrefPageId(href)) {
+            const pageId = getPageIdFromHref(href);
+
+            const route = findNavItemByPageId(nav.navItems, pageId);
+
+            const brandPageSlugRoute = options.brandPageSlug
+              ? `/${options.brandPageSlug}`
+              : '/';
+
+            if (route) {
+              let href = `${brandPageSlugRoute}`;
+
+              if (!route.isRoot) {
+                href = `${brandPageSlugRoute}${brandPageSlugRoute === '/' ? '' : '/'}${route.relativePath}`;
+              }
+
+              return `<a ${existingAttrsStart}href="${href}"${existingAttrsEnd}>`;
+            }
+
+            // fallback to root if pageid cannot be resolved.
+            return `<a ${existingAttrsStart}href="${brandPageSlugRoute}"${existingAttrsEnd}>`;
+          }
 
-          return resolved === null
-            ? match
-            : `<a ${existingAttrsStart}href="${resolved}"${existingAttrsEnd}>`;
+          return match;
         },
       );
     }

package/src/brand-page/view-models.ts

@@ -41,7 +41,6 @@ import type {
   BackgroundShape,
   PersonalisationRole,
   SaveContactOptions,
-  RichTextValue,
 } from './models';
 import type { ImagesSectionContentDisplayStyle } from './constants';
 
@@ -197,8 +196,8 @@ export interface TextImageSectionViewModel {
   id: string;
   type: 'images-section';
   role: ContentType;
-  title: RichTextValue;
-  description: RichTextValue;
+  title: string;
+  description: string;
   displayStyle: ImagesSectionContentDisplayStyle;
   aspectRatio: AspectRatio;
   areImagesFullWidth: boolean;