@designcrowd/library.brand-page 6.1.16 → 6.1.17

package/lib/src/lib.js

@@ -48,6 +48,7 @@ export { tiptapJsonToHtml } from './metadata-builder/helpers/rte.helpers';
 // stores
 export { useBrandPageMakerStore, useBrandPageMakerUserStore, useUiStore, useBrandPageContainerStore, useEventManagerStore, useLocalisedRouteStore, useVideoStore, useRouteStore, } from './brand-page-maker/stores';
 export { useShopConfigStore } from './shared/ecommerce-settings/store/shop-settings-store';
+export { refreshDuplicatedMetadata } from './shared/ecommerce-settings/util/refreshDuplicatedMetadata';
 // for jest, need to set active pinia in library.brand-page as well
 import { createPinia, setActivePinia } from 'pinia';
 import { useCartStore } from './shared/ecommerce-settings/store/cart-settings-store';

package/lib/src/shared/ecommerce-settings/util/refreshDuplicatedMetadata.d.ts

@@ -0,0 +1,11 @@
+import type { BrandPageModel } from '@brand-page/models';
+/**
+ * Refresh a (migrated, current-version) BrandPageModel so it is safe to persist as a *duplicate*.
+ * Two things travel with a verbatim copy that must not: client-minted identifiers that the
+ * brand-page-api keys a global row on, and the source owner's embedded payment connection. This
+ * rotates the former to fresh values and removes the latter, in place — the new owner reconnects
+ * a payment provider explicitly. Runs after migration, so it only ever sees the current shape.
+ *
+ * See docs/architecture/capabilities/shop-duplication.md.
+ */
+export declare function refreshDuplicatedMetadata(model: BrandPageModel): BrandPageModel;

package/lib/src/shared/ecommerce-settings/util/refreshDuplicatedMetadata.js

@@ -0,0 +1,80 @@
+import { v4 as uuid } from 'uuid';
+import { isPayment, isShopContent, isSupportMe } from '@brand-page/utils';
+import { generateSku } from './skuUtils';
+/**
+ * Refresh a (migrated, current-version) BrandPageModel so it is safe to persist as a *duplicate*.
+ * Two things travel with a verbatim copy that must not: client-minted identifiers that the
+ * brand-page-api keys a global row on, and the source owner's embedded payment connection. This
+ * rotates the former to fresh values and removes the latter, in place — the new owner reconnects
+ * a payment provider explicitly. Runs after migration, so it only ever sees the current shape.
+ *
+ * See docs/architecture/capabilities/shop-duplication.md.
+ */
+export function refreshDuplicatedMetadata(model) {
+    // Site-level payment connection: the authoritative one at checkout — `initialiseShopStore` prefers
+    // it over any content-level config — so it leaks the source owner's account even after the
+    // content-level connections below are cleared. Disconnect it too; the new owner reconnects.
+    model.paymentConfig = undefined;
+    model.pages.forEach((page) => page.contents.forEach((content) => {
+        if (isShopContent(content)) {
+            // Shop products collide on the global product / sku_key tables. The shop's payment-config
+            // link is written with throwaway ids (not the content id), so only the product ids rotate.
+            content.products.forEach(rotateProductIds);
+            disconnectPayment(content.shopPaymentConfig);
+        }
+        else if (isPayment(content)) {
+            resetPaymentBlock(content, content.requestPaymentConfig);
+        }
+        else if (isSupportMe(content)) {
+            resetPaymentBlock(content, content.supportMeConfig);
+        }
+    }));
+    return model;
+}
+function rotateProductIds(product) {
+    product.id = uuid();
+    // The option id is the only value cross-referenced inside a product — SKUs point at product
+    // options by id and each skuKey embeds it — so it is remapped through one old→new map and
+    // reused everywhere it reappears. Every other id is standalone and just gets a fresh uuid.
+    const optionIdMap = new Map();
+    product.variant.forEach((variant) => {
+        variant.id = uuid();
+        variant.options.forEach((option) => {
+            const newId = uuid();
+            optionIdMap.set(option.id, newId);
+            option.id = newId;
+        });
+    });
+    product.skus.forEach((sku) => {
+        sku.id = uuid();
+        sku.variant.forEach((skuVariant) => {
+            skuVariant.id = uuid();
+            skuVariant.option.id = optionIdMap.get(skuVariant.option.id) ?? uuid();
+        });
+        // Regenerate from the now-remapped option so the key embeds the new option id and a fresh
+        // random suffix — this is what keeps sku_key globally unique on the copy's first upsert.
+        sku.skuKey = generateSku(product.name, sku.variant[0]?.option);
+    });
+}
+/**
+ * request-payment / support-me content. The api keys `content_block_payment_config` on the content
+ * id (PK) and `brand_page_product` on the payment-option id (PK), both global. A verbatim copy
+ * would, on its next payment upsert, repoint the source's config link and adopt its product rows —
+ * so rotate both to make the copy independent, then drop the connection.
+ */
+function resetPaymentBlock(content, config) {
+    content.id = uuid();
+    config.paymentOptions.forEach((option) => {
+        option.id = uuid();
+    });
+    disconnectPayment(config);
+}
+/**
+ * Drop the embedded payment connection (the source owner's payment/Stripe account). The section
+ * keeps its options and amounts but reverts to "not connected"; the new owner reconnects.
+ */
+function disconnectPayment(config) {
+    if (config) {
+        config.paymentConfig = undefined;
+    }
+}

package/package.json

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

package/src/lib.ts

@@ -126,6 +126,7 @@ export {
   useRouteStore,
 } from './brand-page-maker/stores';
 export { useShopConfigStore } from './shared/ecommerce-settings/store/shop-settings-store';
+export { refreshDuplicatedMetadata } from './shared/ecommerce-settings/util/refreshDuplicatedMetadata';
 
 // for jest, need to set active pinia in library.brand-page as well
 import { createPinia, setActivePinia } from 'pinia';

package/src/shared/ecommerce-settings/util/refreshDuplicatedMetadata.test.ts

@@ -0,0 +1,399 @@
+import { describe, it, expect } from 'vitest';
+import { refreshDuplicatedMetadata } from './refreshDuplicatedMetadata';
+import type { BrandPageModel } from '@brand-page/models';
+import type { ProductModel } from '@brand-page/models/shop.model';
+
+const variantProduct = (): ProductModel => ({
+  id: 'p1',
+  name: 'Denim Jacket',
+  description: '',
+  imageUrl: '',
+  defaultPrice: 10,
+  hasVariants: true,
+  enableNotes: false,
+  variant: [
+    {
+      id: 'v1',
+      name: 'Colour',
+      options: [
+        { id: 'o1', name: 'Black', price: 10 },
+        { id: 'o2', name: 'White', price: 12 },
+      ],
+    },
+  ],
+  skus: [
+    {
+      id: 's1',
+      price: 10,
+      skuKey: 'denim-jacket-o1-Black-abc123',
+      variant: [
+        {
+          id: 'v1',
+          name: 'Colour',
+          option: { id: 'o1', name: 'Black', price: 10 },
+        },
+      ],
+    },
+    {
+      id: 's2',
+      price: 12,
+      skuKey: 'denim-jacket-o2-White-def456',
+      variant: [
+        {
+          id: 'v1',
+          name: 'Colour',
+          option: { id: 'o2', name: 'White', price: 12 },
+        },
+      ],
+    },
+  ],
+});
+
+const noVariantProduct = (): ProductModel => ({
+  id: 'p2',
+  name: 'Sticker',
+  description: '',
+  imageUrl: '',
+  defaultPrice: 5,
+  hasVariants: false,
+  enableNotes: false,
+  variant: [],
+  skus: [{ id: 's3', price: 5, skuKey: 'sticker-nv-zzz999', variant: [] }],
+});
+
+const multiVariantProduct = (): ProductModel => ({
+  id: 'mp1',
+  name: 'Tee',
+  description: '',
+  imageUrl: '',
+  defaultPrice: 20,
+  hasVariants: true,
+  enableNotes: false,
+  variant: [
+    {
+      id: 'cv',
+      name: 'Colour',
+      options: [
+        { id: 'c-black', name: 'Black', price: 20 },
+        { id: 'c-white', name: 'White', price: 20 },
+      ],
+    },
+    {
+      id: 'sv',
+      name: 'Size',
+      options: [
+        { id: 's-s', name: 'S', price: 20 },
+        { id: 's-m', name: 'M', price: 22 },
+      ],
+    },
+  ],
+  skus: [
+    {
+      id: 'k1',
+      price: 20,
+      skuKey: 'tee-c-black-Black-a',
+      variant: [
+        {
+          id: 'cv',
+          name: 'Colour',
+          option: { id: 'c-black', name: 'Black', price: 20 },
+        },
+      ],
+    },
+    {
+      id: 'k2',
+      price: 20,
+      skuKey: 'tee-c-white-White-b',
+      variant: [
+        {
+          id: 'cv',
+          name: 'Colour',
+          option: { id: 'c-white', name: 'White', price: 20 },
+        },
+      ],
+    },
+    {
+      id: 'k3',
+      price: 20,
+      skuKey: 'tee-s-s-S-c',
+      variant: [
+        { id: 'sv', name: 'Size', option: { id: 's-s', name: 'S', price: 20 } },
+      ],
+    },
+    {
+      id: 'k4',
+      price: 22,
+      skuKey: 'tee-s-m-M-d',
+      variant: [
+        { id: 'sv', name: 'Size', option: { id: 's-m', name: 'M', price: 22 } },
+      ],
+    },
+  ],
+});
+
+const paymentConfigStub = () => ({
+  id: 'cfg-1',
+  name: "Seller's Stripe",
+  status: 'active',
+  defaultCurrency: 'USD',
+  defaultCurrencySymbol: '$',
+  paymentProviderName: 'stripe',
+  paymentProviderImageUrl: '',
+  dashboardUrl: 'https://dashboard.stripe.com/x',
+});
+
+const requestPaymentContent = () => ({
+  type: 'request-payment',
+  id: 'rp1',
+  requestPaymentConfig: {
+    paymentConfig: paymentConfigStub(),
+    paymentOptions: [
+      { id: 'po1', amount: '10', name: 'Small' },
+      { id: 'po2', amount: '20', name: 'Large' },
+    ],
+  },
+});
+
+const supportMeContent = () => ({
+  type: 'support-me',
+  id: 'sm1',
+  supportMeConfig: {
+    paymentConfig: paymentConfigStub(),
+    paymentOptions: [{ id: 'so1', amount: '5', name: 'Coffee' }],
+  },
+});
+
+const shopWithConfig = (products: ProductModel[]) => ({
+  type: 'shop-section',
+  id: 'shop1',
+  products,
+  shopPaymentConfig: {
+    paymentConfig: paymentConfigStub(),
+    paymentOptions: [],
+  },
+});
+
+const modelWith = (contents: unknown[]): BrandPageModel =>
+  ({ pages: [{ contents }] }) as unknown as BrandPageModel;
+
+const shopModel = (products: ProductModel[]): BrandPageModel =>
+  modelWith([{ type: 'shop-section', products }]);
+
+const collectIds = (products: ProductModel[]): string[] =>
+  products.flatMap((p) => [
+    p.id,
+    ...p.variant.flatMap((v) => [v.id, ...v.options.map((o) => o.id)]),
+    ...p.skus.flatMap((s) => [
+      s.id,
+      ...s.variant.flatMap((sv) => [sv.id, sv.option.id]),
+    ]),
+  ]);
+
+describe('refreshDuplicatedMetadata — shop id rotation', () => {
+  it('R1 — rotates every product/sku/variant/option id (no input id survives)', () => {
+    const products = [variantProduct(), noVariantProduct()];
+    const before = new Set(collectIds(products));
+    const beforeKeys = new Set(
+      products.flatMap((p) => p.skus.map((s) => s.skuKey)),
+    );
+
+    const out = shopModel(products);
+
+    refreshDuplicatedMetadata(out);
+    const after = collectIds(products);
+
+    expect(after.every((id) => !before.has(id))).toBe(true);
+    products
+      .flatMap((p) => p.skus.map((s) => s.skuKey))
+      .forEach((key) => expect(beforeKeys.has(key)).toBe(false));
+  });
+
+  it('R2 — preserves the SKU→option linkage (each sku option id maps to a product option id)', () => {
+    const products = [variantProduct()];
+
+    refreshDuplicatedMetadata(shopModel(products));
+
+    products.forEach((p) => {
+      const productOptionIds = new Set(
+        p.variant.flatMap((v) => v.options.map((o) => o.id)),
+      );
+
+      p.skus.forEach((s) =>
+        s.variant.forEach((sv) =>
+          expect(productOptionIds.has(sv.option.id)).toBe(true),
+        ),
+      );
+    });
+  });
+
+  it('R3 — regenerates each skuKey to a fresh value that embeds the new option id', () => {
+    const product = variantProduct();
+
+    refreshDuplicatedMetadata(shopModel([product]));
+
+    product.skus.forEach((s) => {
+      const newOptionId = s.variant[0].option.id;
+
+      expect(s.skuKey).toContain(newOptionId);
+      expect(s.skuKey.startsWith('denim-jacket-')).toBe(true);
+    });
+    // The two SKUs still get distinct keys.
+    expect(product.skus[0].skuKey).not.toBe(product.skus[1].skuKey);
+  });
+
+  it('R4 — no-variant product keeps the "nv" skuKey shape with a fresh id', () => {
+    const product = noVariantProduct();
+
+    refreshDuplicatedMetadata(shopModel([product]));
+
+    const sku = product.skus[0];
+
+    expect(sku.id).not.toBe('s3');
+    expect(sku.skuKey).toBe(`sticker-nv-${sku.skuKey.split('-').pop()}`);
+    expect(sku.skuKey).not.toBe('sticker-nv-zzz999');
+  });
+
+  it('R5 — no-op when there is no shop content (and does not throw)', () => {
+    const model = modelWith([{ type: 'text', text: 'hello' }]);
+
+    expect(() => refreshDuplicatedMetadata(model)).not.toThrow();
+
+    // An empty shop section is also a clean no-op.
+    const emptyShop = shopModel([]);
+
+    expect(() => refreshDuplicatedMetadata(emptyShop)).not.toThrow();
+  });
+
+  it('R6 — multi-variant product: every SKU still links to a product option after rotation', () => {
+    const product = multiVariantProduct();
+
+    refreshDuplicatedMetadata(shopModel([product]));
+
+    const productOptionIds = new Set(
+      product.variant.flatMap((v) => v.options.map((o) => o.id)),
+    );
+
+    expect(productOptionIds.size).toBe(4);
+    product.skus.forEach((s) =>
+      s.variant.forEach((sv) =>
+        expect(productOptionIds.has(sv.option.id)).toBe(true),
+      ),
+    );
+  });
+
+  it('R7 — rotates shop content across multiple sections and pages with no id collisions', () => {
+    const p1 = variantProduct();
+    const p2 = variantProduct();
+
+    const model = {
+      pages: [
+        {
+          contents: [
+            { type: 'shop-section', products: [p1] },
+            { type: 'text', text: 'x' },
+          ],
+        },
+        { contents: [{ type: 'shop-section', products: [p2] }] },
+      ],
+    } as unknown as BrandPageModel;
+
+    refreshDuplicatedMetadata(model);
+
+    // Two products from identical fixtures must share no id across sections/pages. (Within a
+    // product, a SKU's option id equals its product option id by design — the R2 linkage — so
+    // the check is cross-product disjointness, not global uniqueness.)
+    const ids1 = new Set(collectIds([p1]));
+    const p2Ids = collectIds([p2]);
+
+    expect(p2Ids.some((id) => ids1.has(id))).toBe(false);
+  });
+});
+
+describe('refreshDuplicatedMetadata — payment connection reset', () => {
+  it('P1 — request-payment: rotates the content id and every option id, and drops the connection', () => {
+    const content = requestPaymentContent();
+
+    refreshDuplicatedMetadata(modelWith([content]));
+
+    // Content id (content_block_payment_config PK) and option ids (brand_page_product PK) are the
+    // global keys a reconnect would otherwise clash the source on — both rotated.
+    expect(content.id).not.toBe('rp1');
+    expect(
+      content.requestPaymentConfig.paymentOptions.map((o) => o.id),
+    ).not.toContain('po1');
+    expect(
+      content.requestPaymentConfig.paymentOptions.map((o) => o.id),
+    ).not.toContain('po2');
+    // Amounts/labels are kept — only the ids change and the provider is disconnected.
+    expect(
+      content.requestPaymentConfig.paymentOptions.map((o) => o.amount),
+    ).toEqual(['10', '20']);
+    expect(content.requestPaymentConfig.paymentConfig).toBeUndefined();
+  });
+
+  it('P2 — support-me: rotates the content id and option ids, and drops the connection', () => {
+    const content = supportMeContent();
+
+    refreshDuplicatedMetadata(modelWith([content]));
+
+    expect(content.id).not.toBe('sm1');
+    expect(content.supportMeConfig.paymentOptions[0].id).not.toBe('so1');
+    expect(content.supportMeConfig.paymentOptions[0].amount).toBe('5');
+    expect(content.supportMeConfig.paymentConfig).toBeUndefined();
+  });
+
+  it('P3 — shop: drops the checkout connection but keeps (rotated) products and the content id', () => {
+    const product = variantProduct();
+    const content = shopWithConfig([product]);
+
+    refreshDuplicatedMetadata(modelWith([content]));
+
+    // The seller's Stripe connection is removed…
+    expect(content.shopPaymentConfig.paymentConfig).toBeUndefined();
+    // …but products are still rotated (shop collides on product ids, not the content id)…
+    expect(product.id).not.toBe('p1');
+    // …and the shop content id is deliberately left alone (its config link uses throwaway ids).
+    expect(content.id).toBe('shop1');
+  });
+
+  it('P4 — mixed page: each payment block is reset, non-payment content is untouched', () => {
+    const rp = requestPaymentContent();
+    const sm = supportMeContent();
+    const shop = shopWithConfig([variantProduct()]);
+    const text = { type: 'text', id: 'txt1', text: 'hello' };
+
+    expect(() =>
+      refreshDuplicatedMetadata(modelWith([rp, sm, shop, text])),
+    ).not.toThrow();
+
+    expect(rp.requestPaymentConfig.paymentConfig).toBeUndefined();
+    expect(sm.supportMeConfig.paymentConfig).toBeUndefined();
+    expect(shop.shopPaymentConfig.paymentConfig).toBeUndefined();
+    expect(text).toEqual({ type: 'text', id: 'txt1', text: 'hello' });
+  });
+
+  it('P5 — already-disconnected payment block: still rotates ids and stays disconnected', () => {
+    const content = requestPaymentContent();
+
+    content.requestPaymentConfig.paymentConfig = undefined as never;
+
+    expect(() => refreshDuplicatedMetadata(modelWith([content]))).not.toThrow();
+
+    expect(content.id).not.toBe('rp1');
+    expect(content.requestPaymentConfig.paymentOptions[0].id).not.toBe('po1');
+    expect(content.requestPaymentConfig.paymentConfig).toBeUndefined();
+  });
+
+  it('P6 — clears the site-level paymentConfig (the authoritative checkout connection)', () => {
+    // initialiseShopStore prefers model.paymentConfig over any content-level config, so leaving it
+    // would still route the copy's checkout to the source owner even with the shop section cleared.
+    const model = {
+      paymentConfig: paymentConfigStub(),
+      pages: [{ contents: [shopWithConfig([variantProduct()])] }],
+    } as unknown as BrandPageModel;
+
+    refreshDuplicatedMetadata(model);
+
+    expect(model.paymentConfig).toBeUndefined();
+  });
+});

package/src/shared/ecommerce-settings/util/refreshDuplicatedMetadata.ts

@@ -0,0 +1,99 @@
+import { v4 as uuid } from 'uuid';
+import type { BrandPageModel, Content } from '@brand-page/models';
+import type { ProductModel } from '@brand-page/models/shop.model';
+import type { PaymentConfig } from '@brand-page/models/payment.model';
+import { isPayment, isShopContent, isSupportMe } from '@brand-page/utils';
+import { generateSku } from './skuUtils';
+
+/**
+ * Refresh a (migrated, current-version) BrandPageModel so it is safe to persist as a *duplicate*.
+ * Two things travel with a verbatim copy that must not: client-minted identifiers that the
+ * brand-page-api keys a global row on, and the source owner's embedded payment connection. This
+ * rotates the former to fresh values and removes the latter, in place — the new owner reconnects
+ * a payment provider explicitly. Runs after migration, so it only ever sees the current shape.
+ *
+ * See docs/architecture/capabilities/shop-duplication.md.
+ */
+export function refreshDuplicatedMetadata(
+  model: BrandPageModel,
+): BrandPageModel {
+  // Site-level payment connection: the authoritative one at checkout — `initialiseShopStore` prefers
+  // it over any content-level config — so it leaks the source owner's account even after the
+  // content-level connections below are cleared. Disconnect it too; the new owner reconnects.
+  model.paymentConfig = undefined;
+
+  model.pages.forEach((page) =>
+    page.contents.forEach((content) => {
+      if (isShopContent(content)) {
+        // Shop products collide on the global product / sku_key tables. The shop's payment-config
+        // link is written with throwaway ids (not the content id), so only the product ids rotate.
+        content.products.forEach(rotateProductIds);
+        disconnectPayment(content.shopPaymentConfig);
+      } else if (isPayment(content)) {
+        resetPaymentBlock(content, content.requestPaymentConfig);
+      } else if (isSupportMe(content)) {
+        resetPaymentBlock(content, content.supportMeConfig);
+      }
+    }),
+  );
+
+  return model;
+}
+
+function rotateProductIds(product: ProductModel): void {
+  product.id = uuid();
+
+  // The option id is the only value cross-referenced inside a product — SKUs point at product
+  // options by id and each skuKey embeds it — so it is remapped through one old→new map and
+  // reused everywhere it reappears. Every other id is standalone and just gets a fresh uuid.
+  const optionIdMap = new Map<string, string>();
+
+  product.variant.forEach((variant) => {
+    variant.id = uuid();
+    variant.options.forEach((option) => {
+      const newId = uuid();
+
+      optionIdMap.set(option.id, newId);
+      option.id = newId;
+    });
+  });
+
+  product.skus.forEach((sku) => {
+    sku.id = uuid();
+
+    sku.variant.forEach((skuVariant) => {
+      skuVariant.id = uuid();
+      skuVariant.option.id = optionIdMap.get(skuVariant.option.id) ?? uuid();
+    });
+
+    // Regenerate from the now-remapped option so the key embeds the new option id and a fresh
+    // random suffix — this is what keeps sku_key globally unique on the copy's first upsert.
+    sku.skuKey = generateSku(product.name, sku.variant[0]?.option);
+  });
+}
+
+/**
+ * request-payment / support-me content. The api keys `content_block_payment_config` on the content
+ * id (PK) and `brand_page_product` on the payment-option id (PK), both global. A verbatim copy
+ * would, on its next payment upsert, repoint the source's config link and adopt its product rows —
+ * so rotate both to make the copy independent, then drop the connection.
+ */
+function resetPaymentBlock(content: Content, config: PaymentConfig): void {
+  content.id = uuid();
+
+  config.paymentOptions.forEach((option) => {
+    option.id = uuid();
+  });
+
+  disconnectPayment(config);
+}
+
+/**
+ * Drop the embedded payment connection (the source owner's payment/Stripe account). The section
+ * keeps its options and amounts but reverts to "not connected"; the new owner reconnects.
+ */
+function disconnectPayment(config: PaymentConfig | undefined): void {
+  if (config) {
+    config.paymentConfig = undefined;
+  }
+}