@designcrowd/library.brand-page 6.0.6-json-prereq-7 → 6.0.6-undo-2

package/src/brand-page-maker/stores/brandpage-maker/brandpage-maker-store.test.ts

@@ -727,6 +727,59 @@ describe('brand page maker store module', () => {
     expect(pageNavigationStore.activePageId).toBe(expectedFirstId);
   });
 
+  // BP-5813: the templates sidebar highlight binds to `selectedTemplateId`,
+  // which isn't part of `brandPageData`. It rides along as a history-entry
+  // sidecar; applyHistorySnapshot restores it so the highlight reverts in
+  // lock-step with the canvas.
+  test('applyHistorySnapshot restores selectedTemplateId from the sidecar', async () => {
+    const makerStore = useBrandPageMakerStore();
+
+    await makerStore.initialise(INITIALISE_PAYLOAD);
+
+    makerStore.setSelectedTemplateId({ templateId: 'template-current' });
+
+    // Undo lands on an entry captured while 'template-previous' was selected.
+    await makerStore.applyHistorySnapshot(
+      makerStore.brandPageData,
+      undefined,
+      undefined,
+      'template-previous',
+    );
+
+    expect(makerStore.selectedTemplateId).toBe('template-previous');
+  });
+
+  test('applyHistorySnapshot restores a cleared (false) selectedTemplateId', async () => {
+    const makerStore = useBrandPageMakerStore();
+
+    await makerStore.initialise(INITIALISE_PAYLOAD);
+
+    makerStore.setSelectedTemplateId({ templateId: 'template-current' });
+
+    await makerStore.applyHistorySnapshot(
+      makerStore.brandPageData,
+      undefined,
+      undefined,
+      false,
+    );
+
+    expect(makerStore.selectedTemplateId).toBe(false);
+  });
+
+  test('applyHistorySnapshot leaves selectedTemplateId untouched when the sidecar is undefined', async () => {
+    const makerStore = useBrandPageMakerStore();
+
+    await makerStore.initialise(INITIALISE_PAYLOAD);
+
+    makerStore.setSelectedTemplateId({ templateId: 'template-current' });
+
+    // An entry with no sidecar (e.g. captured before the field existed) must
+    // not clobber the current selection.
+    await makerStore.applyHistorySnapshot(makerStore.brandPageData);
+
+    expect(makerStore.selectedTemplateId).toBe('template-current');
+  });
+
   // BP-5506 follow-up: undoing a non-page-structural edit (e.g. a title
   // change) must NOT push a new route. The router push fires
   // `router.afterEach`, and BrandPageMaker.mixin's afterEach hook resets

package/src/brand-page-maker/stores/brandpage-maker/brandpage-maker-store.ts

@@ -793,6 +793,7 @@ export const useBrandPageMakerStore = defineStore('brandPageMaker', {
       snapshot: BrandPageModel,
       activePageId?: string,
       logoEditsStr?: string,
+      selectedTemplateId?: string | false,
     ): Promise<void> {
       const styleSettingsStore = useUiStyleSettingsStore();
       const navigationStyleSettingsStore = useUiNavigationStyleSettingsStore();
@@ -883,6 +884,16 @@ export const useBrandPageMakerStore = defineStore('brandPageMaker', {
       this.cookieOptions = snapshot.cookieOptions;
       this.saveContactSettings = snapshot.saveContactSettings;
 
+      // 7b. Restore the selected-template pointer that drives the templates
+      //     sidebar highlight. It's a UI pointer, not part of the persisted
+      //     model, so it rides along as a history-entry sidecar (like
+      //     `activePageId`). Its watchers only reset scroll position (no
+      //     template re-application), so setting it here is safe during apply.
+      //     (BP-5813)
+      if (selectedTemplateId !== undefined) {
+        this.setSelectedTemplateId({ templateId: selectedTemplateId });
+      }
+
       // 8. Re-sync the logo-settings sidebar's `selectedLogoImage` from the
       //    restored header logo. The preview rehydrates via the page contents,
       //    but `uiLogoSettings` holds its own copy that drives the sidebar
@@ -945,14 +956,7 @@ export const useBrandPageMakerStore = defineStore('brandPageMaker', {
         }
       }
 
-      const logoImage =
-        snapshot.brandPageType === BRAND_PAGE_TYPES.default
-          ? (
-              snapshot.pages?.[0]?.contents?.find(
-                (c) => c.type === 'logo',
-              ) as any
-            )?.logoImage
-          : snapshot.pageHeaderDesktop?.logoImage;
+      const logoImage = logoUtil.getLogoImageFromModel(snapshot);
 
       if (!logoImage) return;
 
@@ -1273,14 +1277,7 @@ export const useBrandPageMakerStore = defineStore('brandPageMaker', {
           brandPageType: _brandPageType,
         });
 
-        let logoImage =
-          brandPageModel.brandPageType === BRAND_PAGE_TYPES.default
-            ? (
-                brandPageModel.pages?.[0].contents.find(
-                  (c) => c.type === 'logo',
-                ) as any
-              )?.logoImage
-            : brandPageModel.pageHeaderDesktop?.logoImage;
+        let logoImage = logoUtil.getLogoImageFromModel(brandPageModel);
 
         if (!logoImage?.logoDraftToken) {
           logoImage = logoUtil.safeGetLogoImageFromLogoImageUrl(

package/src/brand-page-maker/stores/history/history-store.test.ts

@@ -16,6 +16,8 @@ const mockMakerStore = {
   isBrandPageLoaded: false,
   applyHistorySnapshot: vi.fn(async () => undefined),
   setIsBrandPageLoaded: vi.fn(),
+  selectedTemplateId: false as string | false,
+  setSelectedTemplateId: vi.fn(),
 };
 
 const mockPageNavigationStore = {
@@ -64,6 +66,8 @@ describe('history-store (single stack + JSON-string snapshots)', () => {
   beforeEach(() => {
     setActivePinia(createPinia());
     mockMakerStore.applyHistorySnapshot.mockClear();
+    mockMakerStore.setSelectedTemplateId.mockClear();
+    mockMakerStore.selectedTemplateId = false;
     mutationCounter = 0;
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     (mockMakerStore.brandPageData as any).v = 1;
@@ -443,6 +447,46 @@ describe('history-store (single stack + JSON-string snapshots)', () => {
     });
   });
 
+  // BP-5813: the templates sidebar highlight binds to
+  // `brandPageMakerStore.selectedTemplateId`, which is NOT part of
+  // `brandPageData`. It rides along as a per-entry sidecar so undo/redo can
+  // restore the highlight in lock-step with the canvas.
+  describe('selectedTemplateId sidecar (BP-5813 — template sidebar highlight)', () => {
+    it('captures the current selectedTemplateId on each entry', async () => {
+      const store = useHistoryStore();
+
+      mockMakerStore.selectedTemplateId = 'template-a';
+      await store.captureBaseline();
+
+      expect(store.entries[0].selectedTemplateId).toBe('template-a');
+
+      mockMakerStore.selectedTemplateId = 'template-b';
+      captureMutated(store);
+
+      expect(store.entries[1].selectedTemplateId).toBe('template-b');
+    });
+
+    it('passes the target entry selectedTemplateId to applyHistorySnapshot on undo', async () => {
+      const store = useHistoryStore();
+
+      mockMakerStore.selectedTemplateId = 'template-a';
+      await store.captureBaseline();
+
+      mockMakerStore.selectedTemplateId = 'template-b';
+      captureMutated(store);
+
+      await store.undo();
+
+      // 4th arg is the baseline entry's template id — the sidebar reverts
+      // with the canvas instead of lagging on the undone template.
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      const callArgs = mockMakerStore.applyHistorySnapshot.mock
+        .calls[0] as any[];
+
+      expect(callArgs[3]).toBe('template-a');
+    });
+  });
+
   it('reentrancy guard: capture no-ops when isApplyingSnapshot is true', async () => {
     const store = useHistoryStore();
 
@@ -505,6 +549,7 @@ describe('history-store (single stack + JSON-string snapshots)', () => {
       expect.objectContaining(baselineBrandPageData),
       undefined,
       expect.any(String),
+      false,
     );
   });
 
@@ -767,6 +812,7 @@ describe('history-store (single stack + JSON-string snapshots)', () => {
         expect.anything(),
         'page-home',
         expect.any(String),
+        false,
       );
     });
 
@@ -801,6 +847,7 @@ describe('history-store (single stack + JSON-string snapshots)', () => {
         expect.anything(),
         'page-home',
         expect.any(String),
+        false,
       );
     });
 
@@ -842,6 +889,7 @@ describe('history-store (single stack + JSON-string snapshots)', () => {
         expect.anything(),
         'page-about',
         expect.any(String),
+        false,
       );
     });
 
@@ -879,6 +927,7 @@ describe('history-store (single stack + JSON-string snapshots)', () => {
         expect.anything(),
         'page-new',
         expect.any(String),
+        false,
       );
     });
 
@@ -912,6 +961,7 @@ describe('history-store (single stack + JSON-string snapshots)', () => {
         expect.anything(),
         'page-home',
         expect.any(String),
+        false,
       );
 
       // Now redo. Pointer moves forward to entry 1 (page-x captured),
@@ -922,6 +972,7 @@ describe('history-store (single stack + JSON-string snapshots)', () => {
         expect.anything(),
         'page-x',
         expect.any(String),
+        false,
       );
     });
   });

package/src/brand-page-maker/stores/history/history-store.ts

@@ -26,6 +26,12 @@ export interface HistoryEntry {
   activePageId: string;
   /** JSON-stringified `editableLogoStore.logoEdits`. Undefined if logo tab never opened. */
   logoEdits?: string;
+  /**
+   * Selected template id at capture time — drives the templates sidebar
+   * highlight. `false` when no template is selected. Sidecar to
+   * `brandPageData` (not part of the persisted model), like `activePageId`.
+   */
+  selectedTemplateId?: string | false;
 }
 
 // Monotonic burst — first mutation starts the timer, subsequent mutations
@@ -150,6 +156,10 @@ export const useHistoryStore = defineStore('history', () => {
     return usePageNavigationStore().activePageId ?? '';
   }
 
+  function getCurrentSelectedTemplateId(): string | false {
+    return useBrandPageMakerStore().selectedTemplateId;
+  }
+
   function serializeCurrentLogoEdits(): string | undefined {
     try {
       const editableLogoStore = useUiEditableLogoStore();
@@ -187,6 +197,7 @@ export const useHistoryStore = defineStore('history', () => {
     label?: string;
     activePageId: string;
     logoEdits?: string;
+    selectedTemplateId?: string | false;
   }): 'committed' | 'oversized' | 'noop' {
     const current = entries.value[currentIndex.value];
 
@@ -219,6 +230,7 @@ export const useHistoryStore = defineStore('history', () => {
       sizeBytes: args.snapshot.length,
       activePageId: args.activePageId,
       logoEdits: args.logoEdits,
+      selectedTemplateId: args.selectedTemplateId,
     };
 
     // FR-11: truncate redo tail, then append.
@@ -293,6 +305,7 @@ export const useHistoryStore = defineStore('history', () => {
 
       const activePageId = getCurrentActivePageId();
       const logoEdits = serializeCurrentLogoEdits();
+      const selectedTemplateId = getCurrentSelectedTemplateId();
 
       // Settle window: fold post-init reactive cascades back into the
       // baseline so undo doesn't light up before the user has done
@@ -317,6 +330,7 @@ export const useHistoryStore = defineStore('history', () => {
             sizeBytes: snapshot.length,
             activePageId,
             logoEdits,
+            selectedTemplateId,
           },
         ];
 
@@ -333,6 +347,7 @@ export const useHistoryStore = defineStore('history', () => {
           sizeBytes: snapshot.length,
           activePageId,
           logoEdits,
+          selectedTemplateId,
         };
         entries.value = next;
 
@@ -345,6 +360,7 @@ export const useHistoryStore = defineStore('history', () => {
         actor: 'user',
         activePageId,
         logoEdits,
+        selectedTemplateId,
       });
     };
 
@@ -402,6 +418,7 @@ export const useHistoryStore = defineStore('history', () => {
         sizeBytes: snapshot.length,
         activePageId: getCurrentActivePageId(),
         logoEdits: serializeCurrentLogoEdits(),
+        selectedTemplateId: getCurrentSelectedTemplateId(),
       },
     ];
     currentIndex.value = 0;
@@ -427,6 +444,7 @@ export const useHistoryStore = defineStore('history', () => {
       snapshot,
       activePageId: getCurrentActivePageId(),
       logoEdits: serializeCurrentLogoEdits(),
+      selectedTemplateId: getCurrentSelectedTemplateId(),
       ...args,
     });
   }
@@ -531,6 +549,7 @@ export const useHistoryStore = defineStore('history', () => {
         snapshot,
         resolvedActivePageId,
         targetEntry?.logoEdits,
+        targetEntry?.selectedTemplateId,
       );
     } finally {
       isApplyingSnapshot.value = false;

package/src/brand-page-maker/utils/index.ts

@@ -7,8 +7,6 @@ export * from './url.util';
 export * from './slug.util';
 export * from './text.util';
 export * from './rich-text-editor.util';
-export * from './rte-render.util';
-export * from './rte-sanitize.util';
 
 export const isColorMatched = (color: string | null | undefined): boolean => {
   if (!color) return false;

package/src/brand-page-maker/utils/rich-text-editor.util.test.ts

@@ -76,7 +76,7 @@ describe('hasHTML', () => {
 });
 
 describe('getUpdatedHTMLFromEditor', () => {
-  it('applies style commands and returns updated JSON', () => {
+  it('applies style commands and returns updated HTML', () => {
     // Mock editor
     const runMock = vi.fn();
     const chain = {
@@ -119,7 +119,7 @@ describe('getUpdatedHTMLFromEditor', () => {
         },
       },
       chain: () => chain as any,
-      getJSON: () => ({ type: 'doc', content: [{ type: 'paragraph' }] }),
+      getHTML: () => '<div>styled</div>',
     } as unknown as Editor;
 
     const newStyle = {
@@ -137,8 +137,7 @@ describe('getUpdatedHTMLFromEditor', () => {
 
     expect(externalEditor.commands.setContent).toHaveBeenCalledWith('foo');
     expect(runMock).toHaveBeenCalled();
-    // BP-5787: returns the JSON form (consistent with JSON storage).
-    expect(result).toEqual({ type: 'doc', content: [{ type: 'paragraph' }] });
+    expect(result).toBe('<div>styled</div>');
   });
 });
 

package/src/brand-page-maker/utils/rich-text-editor.util.ts

@@ -1,4 +1,4 @@
-import type { ChainedCommands, Editor, JSONContent } from '@tiptap/vue-3';
+import type { ChainedCommands, Editor } from '@tiptap/vue-3';
 import type { EditorState, Transaction, Selection } from 'prosemirror-state';
 import {
   STYLE_THEME_KEYS,
@@ -19,7 +19,6 @@ import {
   type RequestPaymentContent,
   type SupportMeContent,
   type ShopContent,
-  type RichTextValue,
 } from '@brand-page';
 import type { PageSettingsState } from '@shared/page-settings/store';
 import type { StyleSettingsState } from '@shared/style-settings/store';
@@ -244,38 +243,8 @@ export const skipStyleDetection = (chain: ChainedCommands, marks?: Mark[]) =>
     return true;
   });
 
-/**
- * BP-5787 — canonical discriminator for the JSON RTE model: a ProseMirror
- * document is an object with `type: 'doc'`.
- */
-export const isTiptapDocument = (value: unknown): value is JSONContent =>
-  typeof value === 'object' &&
-  value !== null &&
-  (value as JSONContent).type === 'doc';
-
-/**
- * Extract visible plain text from a Tiptap JSON document (concatenated text
- * nodes). Dependency-free — no editor instantiation.
- */
-export const getRteJsonPlainText = (doc: JSONContent): string => {
-  const parts: string[] = [];
-
-  const walk = (node: JSONContent): void => {
-    if (typeof node.text === 'string') parts.push(node.text);
-
-    node.content?.forEach(walk);
-  };
-
-  walk(doc);
-
-  return parts.join(' ').replace(/\s+/g, ' ').trim();
-};
-
-// Accepts a legacy inline-HTML string or a Tiptap JSON document (BP-5787).
-export const hasRTEContent = (content: unknown): boolean => {
-  if (isTiptapDocument(content)) return true;
-
-  if (typeof content !== 'string' || content.length === 0) return false;
+export const hasRTEContent = (content: string): boolean => {
+  if (!content || content.length === 0) return false;
 
   const trimmed = content.trim();
   const tagWrapRegex = /^<([A-Za-z][A-Za-z0-9-]*)\b[^>]*>[\s\S]*<\/\1>$/;
@@ -283,11 +252,7 @@ export const hasRTEContent = (content: unknown): boolean => {
   return tagWrapRegex.test(trimmed);
 };
 
-export const getPlainTextFromRTE = (content: unknown): string => {
-  if (isTiptapDocument(content)) {
-    return getRteJsonPlainText(content);
-  }
-
+export const getPlainTextFromRTE = (content: string): string => {
   if (typeof content !== 'string') {
     return '';
   }
@@ -756,20 +721,16 @@ export const switchAllContentToRTE = (
 
 export const getUpdatedHTMLFromEditor = (
   externalEditor: Editor,
-  contentText: RichTextValue,
+  contentText: string,
   newContentStyle: TextStyleDeclaration,
 ) => {
   if (!contentText) {
     return contentText;
   }
 
-  // BP-5787: accept a string (legacy HTML) or a Tiptap JSON doc. setContent
-  // handles both; only the newline-escaping shim applies to strings.
-  const content =
-    typeof contentText === 'string' &&
-    contentText.includes(ESCAPED_NEWLINE_CHARACTER)
-      ? getRenderText(contentText)
-      : contentText;
+  const content = contentText.includes(ESCAPED_NEWLINE_CHARACTER)
+    ? getRenderText(contentText)
+    : contentText;
 
   externalEditor.commands.setContent(content);
 
@@ -827,9 +788,9 @@ export const getUpdatedHTMLFromEditor = (
   chain = newContentStyle?.fontStyle ? chain.setItalic() : chain.unsetItalic();
 
   chain.run();
+  const html = externalEditor.getHTML();
 
-  // BP-5787: return the JSON form, consistent with how RTE is now stored.
-  return externalEditor.getJSON();
+  return html;
 };
 
 // Helper to build stored marks from a style declaration
@@ -953,7 +914,7 @@ export const sanitiseClientSideRTE = (html: string): SanitizationResult => {
 /**
  * Validates if an href value is safe and returns a sanitized version
  */
-export const validateAndSanitizeHref = (href: string): string | null => {
+const validateAndSanitizeHref = (href: string): string | null => {
   if (!href || typeof href !== 'string') return null;
 
   // Trim whitespace and decode entities

package/src/brand-page-maker/validators/field.validator.ts

@@ -1,6 +1,6 @@
 import { isURL, isEmail, isTel } from '@utils/validator.util';
 import type { ItemFieldType, Validator } from '@brand-page-maker/models';
-import { YOUTUBE_URL_RE, isTiptapDocument } from '@brand-page-maker/utils';
+import { YOUTUBE_URL_RE } from '@brand-page-maker/utils';
 import { validatorTr } from '@src/composables/useTranslate';
 
 const addressValueValidator: Validator = {
@@ -76,15 +76,7 @@ export const dummyValidator: Validator = {
 
 const nonEmptyStringValidator: Validator = {
   validate: (name, value: any) => {
-    // BP-5787/BP-5857: match legacy (pre-JSON) validation semantics.
-    // An RTE field's stored value used to be inline HTML — an empty editor was
-    // "<p></p>", a NON-empty string, so the required check always passed for RTE
-    // fields (it only ever failed for genuinely empty PLAIN inputs). Now RTE
-    // fields are Tiptap JSON docs; treat any doc as "present" so behaviour
-    // stays identical. A plain string is still required to be non-empty.
-    const isValid = isTiptapDocument(value)
-      ? true
-      : typeof value === 'string' && value.length > 0;
+    const isValid = typeof value === 'string' && value.length > 0;
 
     return {
       isValid,

package/src/lib.ts

@@ -85,15 +85,6 @@ export {
   recalculateHeaderLogoSizes,
 } from './brand-page/utils/logo.util';
 export { sanitizeRTEHtml } from './brand-page-maker/utils';
-// BP-5787: RTE JSON storage boundary helpers (render/normalise/sanitise/extract).
-export {
-  renderRteToHtml,
-  toRteJson,
-  isTiptapDocument,
-  sanitizeRteJson,
-  getRteJsonPlainText,
-  type RichTextValue,
-} from './brand-page-maker/utils';
 export { getPageSlugFromPageTitle } from './brand-page-maker/utils/slug.util';
 
 // AI-pipeline preview (longclaw per-turn snapshots): web-renderer's

package/src/metadata-builder/builders/reorder-pages-builder.ts

@@ -0,0 +1,80 @@
+import type { BrandPageModel, NavOrder } from '../../brand-page/models';
+import {
+  BaseMetadataBuilder,
+  type BuilderResult,
+  type MetadataBuilderRequest,
+} from '../models';
+import type { Logger } from '../logger';
+
+export interface ReorderPagesPayload {
+  pageOrder: string[];
+}
+
+export class ReorderPagesBuilder extends BaseMetadataBuilder<ReorderPagesPayload> {
+  constructor(
+    request: MetadataBuilderRequest<ReorderPagesPayload>,
+    logger?: Logger,
+  ) {
+    super(request, logger);
+  }
+
+  async validateAsync(): Promise<{ errors: string[] }> {
+    const errors: string[] = [];
+    const payload = this.request.payload;
+
+    if (!payload?.pageOrder?.length) {
+      errors.push('page_order is required for reorder_pages');
+    }
+
+    return { errors };
+  }
+
+  async buildAsync(model: BrandPageModel): Promise<BuilderResult> {
+    this.log('Build called');
+
+    const validation = await this.validateAsync();
+
+    if (validation.errors.length) {
+      return { request: this.request, model, errors: validation.errors };
+    }
+
+    const { pageOrder } = this.request.payload!;
+
+    // Build pageId → routeId lookup from nav.routes
+    const pageIdToRouteId = new Map<string, string>();
+
+    for (const route of model.nav.routes) {
+      pageIdToRouteId.set(route.pageId, route.id);
+    }
+
+    // Build new nav.orders from the flat page_order (array of pageIds)
+    const newOrders: NavOrder[] = [];
+    const seenRouteIds = new Set<string>();
+
+    for (const pageId of pageOrder) {
+      const routeId = pageIdToRouteId.get(pageId);
+
+      if (!routeId) continue;
+
+      newOrders.push({ routeId, subRoutes: [] });
+      seenRouteIds.add(routeId);
+    }
+
+    // Safety: append any routes not mentioned (don't lose pages)
+    for (const route of model.nav.routes) {
+      const routeId = pageIdToRouteId.get(route.pageId);
+
+      if (routeId && !seenRouteIds.has(routeId)) {
+        newOrders.push({ routeId, subRoutes: [] });
+      }
+    }
+
+    model.nav.orders = newOrders;
+
+    this.log({
+      message: `Reordered pages: ${pageOrder.join(', ')}`,
+    });
+
+    return { request: this.request, model };
+  }
+}

package/src/metadata-builder/builders/update-content-text-builder.ts

@@ -6,36 +6,7 @@ import {
   type BuilderResult,
   type MetadataBuilderRequest,
 } from '../models';
-import {
-  hasRTEContent,
-  replaceTextInRTE,
-  isTiptapDocument,
-  renderRteToHtml,
-  toRteJson,
-} from '../../brand-page-maker/utils';
-
-/**
- * BP-5787 — replace the text of an RTE field while preserving formatting, for
- * either storage form. JSON is rendered to HTML, edited via the existing
- * HTML-preserving replace, then converted back to JSON; plain/legacy strings
- * keep the original behaviour.
- */
-const updateRteFieldValue = (existing: unknown, newText: string): unknown => {
-  const wasJson = isTiptapDocument(existing);
-  const existingHtml = wasJson ? renderRteToHtml(existing) : existing;
-
-  if (
-    existingHtml &&
-    typeof existingHtml === 'string' &&
-    hasRTEContent(existingHtml)
-  ) {
-    const updatedHtml = replaceTextInRTE(existingHtml, newText);
-
-    return wasJson ? toRteJson(updatedHtml) : updatedHtml;
-  }
-
-  return newText;
-};
+import { hasRTEContent, replaceTextInRTE } from '../../brand-page-maker/utils';
 
 export interface UpdateTextPayload {
   contentId: string;
@@ -65,7 +36,12 @@ const updateTextField = (target: any, fieldName: string, newText: string) => {
 
     if (Array.isArray(array) && array[+index]) {
       const existingText = array[+index][property];
-      const updatedValue = updateRteFieldValue(existingText, newText);
+      const updatedValue =
+        existingText &&
+        typeof existingText === 'string' &&
+        hasRTEContent(existingText)
+          ? replaceTextInRTE(existingText, newText)
+          : newText;
 
       // Create a new array with the updated item to trigger reactivity
       const newArray = [...array];
@@ -78,7 +54,17 @@ const updateTextField = (target: any, fieldName: string, newText: string) => {
     }
   } else {
     // Simple field
-    target[fieldName] = updateRteFieldValue(target[fieldName], newText);
+    const existingText = target[fieldName];
+
+    if (
+      existingText &&
+      typeof existingText === 'string' &&
+      hasRTEContent(existingText)
+    ) {
+      target[fieldName] = replaceTextInRTE(existingText, newText);
+    } else {
+      target[fieldName] = newText;
+    }
   }
 };