@designcrowd/library.brand-page 6.0.6-undo-5 → 6.0.6-undo-6

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

@@ -14,6 +14,17 @@ const DEFAULT_TEXT_COLOR_DEPENDENT_TYPES = [
     'profile',
     'text',
 ];
+/**
+ * True when the incoming value is byte-identical (as JSON, matching how
+ * history snapshots the model) to what the model already holds. Such
+ * re-writes must be dropped whole: the assignment would be a reactive
+ * no-op, but onContentChanged() still flips isModifiedAfterTemplateApplied
+ * — and when that flag was false, its flip is itself a model mutation, so
+ * undo history commits an entry in which nothing user-visible changed
+ * (phantom undo state, BP-5772: re-clicking the logo panel's Upload/Logo
+ * option, re-clicking an already-active display style).
+ */
+const isSameValue = (a, b) => a === b || JSON.stringify(a) === JSON.stringify(b);
 export const CONTENT_SETTINGS_MODES = {
     edit: 'edit',
     add: 'add',
@@ -211,6 +222,9 @@ export const useUiContentSettingsStore = defineStore('uiContentSettings', {
             if (!item) {
                 return;
             }
+            if (isSameValue(item.settings.content[payload.name], payload.value)) {
+                return; // no-op write: don't validate, don't flip the modified flag
+            }
             // Hydration write-backs (RTE canonical HTML on mount, lazy config
             // hydration, stale-id clears) fold into the current undo head instead
             // of pushing an entry. Arming here — same tick as the write — is what
@@ -232,6 +246,9 @@ export const useUiContentSettingsStore = defineStore('uiContentSettings', {
             if (!item) {
                 return;
             }
+            if (Object.keys(value ?? {}).every((k) => isSameValue(item.settings.content[k], value[k]))) {
+                return; // every field a no-op — see isSameValue
+            }
             // Same hydration-write contract as updateItemValue.
             if (isHydrationWrite) {
                 useHistoryStore().mergeNextMutation();

package/package.json

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

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

@@ -206,3 +206,106 @@ describe('content settings store — hydration writes arm the history merge', ()
     expect(mergeNextMutationMock).not.toHaveBeenCalled();
   });
 });
+
+// BP-5772: a value-identical re-write must be dropped whole. The assignment
+// would be a reactive no-op, but onContentChanged() still flips
+// isModifiedAfterTemplateApplied — and when that flag was false, its flip is
+// itself a model mutation, so history commits an entry in which nothing
+// user-visible changed. Live repro: with the logo visible, clicking the logo
+// panel's "Upload" option re-emits { logoImage, logoTemplateImage,
+// logoImageBase64Url, isLogoVisible } deep-equal to the model under fresh
+// references (LogoSelectionField.onLogoVisibleChanged). Same class:
+// re-clicking the already-active display style.
+describe('content settings store — value-identical writes are dropped', () => {
+  const logoImage = () => ({
+    logoDraftToken: 'dae5cda0-602d-4c69-a26e-000000000001',
+    logoVariation: 0,
+    logoLastUpdate: '638000000000000000',
+  });
+
+  const makeItem = () => ({
+    id: 'item-1',
+    type: 'logo',
+    settings: {
+      content: {
+        title: '<p>old</p>',
+        isLogoVisible: true,
+        logoImage: logoImage(),
+      },
+    },
+  });
+
+  const setupStore = () => {
+    setActivePinia(createPinia());
+
+    const store = useUiContentSettingsStore();
+
+    store.items.push(makeItem() as never);
+
+    store.validateItem = vi.fn();
+    store.onContentChanged = vi.fn();
+
+    return store;
+  };
+
+  beforeEach(() => {
+    mergeNextMutationMock.mockClear();
+  });
+
+  test('updateMultipleItemValues drops the logo-panel Upload re-click payload', () => {
+    const store = setupStore();
+
+    // Deep-equal to the model but every reference is fresh — exactly what
+    // the Upload option click emits when visibility didn't change.
+    store.updateMultipleItemValues({
+      id: 'item-1',
+      name: 'logoImage',
+      value: { logoImage: logoImage(), isLogoVisible: true },
+    });
+
+    expect(store.onContentChanged).not.toHaveBeenCalled();
+    expect(store.validateItem).not.toHaveBeenCalled();
+  });
+
+  test('updateItemValue drops an identical primitive', () => {
+    const store = setupStore();
+
+    store.updateItemValue({
+      id: 'item-1',
+      name: 'title',
+      value: '<p>old</p>',
+    });
+
+    expect(store.onContentChanged).not.toHaveBeenCalled();
+    expect(store.validateItem).not.toHaveBeenCalled();
+  });
+
+  test('updateMultipleItemValues writes when any one field differs', () => {
+    const store = setupStore();
+
+    store.updateMultipleItemValues({
+      id: 'item-1',
+      name: 'logoImage',
+      value: { logoImage: logoImage(), isLogoVisible: false },
+    });
+
+    expect(store.onContentChanged).toHaveBeenCalledTimes(1);
+    expect(
+      (store.items[0].settings.content as { isLogoVisible?: boolean })
+        .isLogoVisible,
+    ).toBe(false);
+  });
+
+  test('a dropped write never arms the history merge, even when hydration-flagged', () => {
+    const store = setupStore();
+
+    store.updateItemValue({
+      id: 'item-1',
+      name: 'title',
+      value: '<p>old</p>',
+      isHydrationWrite: true,
+    });
+
+    expect(mergeNextMutationMock).not.toHaveBeenCalled();
+  });
+});

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

@@ -60,6 +60,19 @@ const DEFAULT_TEXT_COLOR_DEPENDENT_TYPES: readonly ContentType[] = [
   'text',
 ] as const;
 
+/**
+ * True when the incoming value is byte-identical (as JSON, matching how
+ * history snapshots the model) to what the model already holds. Such
+ * re-writes must be dropped whole: the assignment would be a reactive
+ * no-op, but onContentChanged() still flips isModifiedAfterTemplateApplied
+ * — and when that flag was false, its flip is itself a model mutation, so
+ * undo history commits an entry in which nothing user-visible changed
+ * (phantom undo state, BP-5772: re-clicking the logo panel's Upload/Logo
+ * option, re-clicking an already-active display style).
+ */
+const isSameValue = (a: unknown, b: unknown): boolean =>
+  a === b || JSON.stringify(a) === JSON.stringify(b);
+
 export const CONTENT_SETTINGS_MODES = {
   edit: 'edit',
   add: 'add',
@@ -390,6 +403,10 @@ export const useUiContentSettingsStore = defineStore('uiContentSettings', {
         return;
       }
 
+      if (isSameValue(item.settings.content[payload.name], payload.value)) {
+        return; // no-op write: don't validate, don't flip the modified flag
+      }
+
       // Hydration write-backs (RTE canonical HTML on mount, lazy config
       // hydration, stale-id clears) fold into the current undo head instead
       // of pushing an entry. Arming here — same tick as the write — is what
@@ -421,6 +438,17 @@ export const useUiContentSettingsStore = defineStore('uiContentSettings', {
         return;
       }
 
+      if (
+        Object.keys(value ?? {}).every((k) =>
+          isSameValue(
+            item.settings.content[k],
+            (value as Record<string, unknown>)[k],
+          ),
+        )
+      ) {
+        return; // every field a no-op — see isSameValue
+      }
+
       // Same hydration-write contract as updateItemValue.
       if (isHydrationWrite) {
         useHistoryStore().mergeNextMutation();