@decocms/start 2.8.0 → 2.9.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@decocms/start",
-  "version": "2.8.0",
+  "version": "2.9.0",
   "type": "module",
   "description": "Deco framework for TanStack Start - CMS bridge, admin protocol, hooks, schema generation",
   "main": "./src/index.ts",

package/scripts/migrate/templates/hooks.test.ts

@@ -0,0 +1,85 @@
+import { describe, expect, it } from "vitest";
+import { generateHooks } from "./hooks";
+import type { MigrationContext } from "../types";
+
+function makeCtx(platform: MigrationContext["platform"]): MigrationContext {
+	return {
+		sourceDir: "/tmp",
+		siteName: "test",
+		platform,
+		vtexAccount: null,
+		gtmId: null,
+		importMap: {},
+		discoveredNpmDeps: {},
+		themeColors: {},
+		fontFamily: null,
+		files: [],
+		sectionMetas: [],
+		islandClassifications: [],
+		islandWrapperTargets: new Map(),
+		loaderInventory: [],
+		scaffoldedFiles: [],
+		transformedFiles: [],
+		deletedFiles: [],
+		movedFiles: [],
+		manualReviewItems: [],
+		frameworkFindings: [],
+		dryRun: false,
+		verbose: false,
+	};
+}
+
+describe("generateHooks (vtex)", () => {
+	const files = generateHooks(makeCtx("vtex"));
+
+	it("emits all three hook files", () => {
+		expect(Object.keys(files).sort()).toEqual([
+			"src/hooks/useCart.ts",
+			"src/hooks/useUser.ts",
+			"src/hooks/useWishlist.ts",
+		]);
+	});
+
+	it("useCart is the createUseCart factory shim, not 250-line legacy boilerplate", () => {
+		const code = files["src/hooks/useCart.ts"];
+		// Imports from the framework factory.
+		expect(code).toContain(
+			'import { createUseCart } from "@decocms/apps/vtex/hooks/createUseCart"',
+		);
+		expect(code).toContain('import { invoke } from "~/server/invoke"');
+		// Re-exports types from @decocms/apps directly.
+		expect(code).toContain(
+			'export type { OrderForm, OrderFormItem } from "@decocms/apps/vtex/types"',
+		);
+		// Calls the factory with invoke and destructures the public API.
+		expect(code).toContain(
+			"export const { useCart, resetCart, itemToAnalyticsItem } = createUseCart",
+		);
+		// And does NOT contain the old singleton machinery.
+		expect(code).not.toContain("const _listeners = new Set");
+		expect(code).not.toContain("forceRender");
+		expect(code).not.toContain("function getOrderFormIdFromCookie");
+	});
+
+	it("useCart shim is dramatically smaller than the legacy template", () => {
+		const lineCount = files["src/hooks/useCart.ts"].split("\n").length;
+		// Should be well under 20 lines (factory call + re-export + imports).
+		expect(lineCount).toBeLessThan(20);
+	});
+});
+
+describe("generateHooks (non-vtex)", () => {
+	it("custom platform falls back to the generic stub", () => {
+		const files = generateHooks(makeCtx("custom"));
+		const code = files["src/hooks/useCart.ts"];
+		expect(code).toContain("Cart Hook stub");
+		expect(code).toContain("TODO: Implement");
+	});
+
+	it("shopify currently shares the generic stub", () => {
+		const files = generateHooks(makeCtx("shopify"));
+		const code = files["src/hooks/useCart.ts"];
+		// Until a shopify factory exists, non-vtex platforms get the generic stub.
+		expect(code).toContain("Cart Hook stub");
+	});
+});

package/scripts/migrate/templates/hooks.ts

@@ -16,254 +16,17 @@ export function generateHooks(ctx: MigrationContext): Record<string, string> {
 }
 
 function generateVtexUseCart(): string {
-  return `import { useState, useEffect } from "react";
+  // The legacy invoke-based useCart hook is now a 5-line factory call —
+  // the heavy lifting (singleton state, listener pattern, async actions,
+  // analytics helpers) lives in @decocms/apps/vtex/hooks/createUseCart.
+  return `import { createUseCart } from "@decocms/apps/vtex/hooks/createUseCart";
 import { invoke } from "~/server/invoke";
-import type { OrderForm, OrderFormItem } from "@decocms/apps/vtex/types";
 
-export type { OrderForm, OrderFormItem };
+export type { OrderForm, OrderFormItem } from "@decocms/apps/vtex/types";
 
-let _orderForm: OrderForm | null = null;
-let _loading = false;
-let _initStarted = false;
-let _initFailed = false;
-const _listeners = new Set<() => void>();
-
-function notify() {
-  _listeners.forEach((fn) => fn());
-}
-function setOrderForm(of: OrderForm | null) {
-  _orderForm = of;
-  notify();
-}
-function setLoading(v: boolean) {
-  _loading = v;
-  notify();
-}
-
-function getOrderFormIdFromCookie(): string | null {
-  if (typeof document === "undefined") return null;
-  const match = document.cookie.match(/checkout\\.vtex\\.com__orderFormId=([^;]*)/);
-  return match ? decodeURIComponent(match[1]) : null;
-}
-
-function setOrderFormIdCookie(id: string) {
-  if (typeof document === "undefined") return;
-  document.cookie = \`checkout.vtex.com__orderFormId=\${encodeURIComponent(id)}; path=/; max-age=\${7 * 24 * 3600}; SameSite=Lax\`;
-}
-
-async function ensureOrderForm(): Promise<string> {
-  if (_orderForm?.orderFormId) return _orderForm.orderFormId;
-
-  const existing = getOrderFormIdFromCookie();
-  const of = await invoke.vtex.actions.getOrCreateCart({
-    data: { orderFormId: existing || undefined },
-  });
-  setOrderForm(of);
-  if (of?.orderFormId) setOrderFormIdCookie(of.orderFormId);
-  return of.orderFormId;
-}
-
-export function itemToAnalyticsItem(item: OrderFormItem & { coupon?: string }, index: number) {
-  return {
-    item_id: item.productId,
-    item_group_id: item.productId,
-    item_name: item.name ?? item.skuName ?? "",
-    item_variant: item.skuName,
-    item_brand: item.additionalInfo?.brandName ?? "",
-    price: (item.sellingPrice ?? item.price ?? 0) / 100,
-    discount: Number(((item.listPrice - item.sellingPrice) / 100).toFixed(2)),
-    quantity: item.quantity,
-    coupon: item.coupon,
-    affiliation: item.seller,
-    index,
-  };
-}
-
-export function resetCart() {
-  _orderForm = null;
-  _loading = false;
-  _initStarted = false;
-  _initFailed = false;
-  notify();
-}
-
-export function useCart() {
-  const [, forceRender] = useState(0);
-
-  useEffect(() => {
-    const listener = () => forceRender((n) => n + 1);
-    _listeners.add(listener);
-
-    if (!_orderForm && !_initStarted) {
-      _initStarted = true;
-      const ofId = getOrderFormIdFromCookie();
-      setLoading(true);
-      invoke.vtex.actions
-        .getOrCreateCart({ data: { orderFormId: ofId || undefined } })
-        .then((of: OrderForm) => {
-          setOrderForm(of);
-          if (of?.orderFormId) setOrderFormIdCookie(of.orderFormId);
-        })
-        .catch((err: unknown) => {
-          console.error("[useCart] init failed:", err);
-          if (!_orderForm) {
-            _initFailed = true;
-            notify();
-          }
-        })
-        .finally(() => setLoading(false));
-    }
-
-    return () => {
-      _listeners.delete(listener);
-    };
-  }, []);
-
-  return {
-    cart: {
-      get value() { return _orderForm; },
-      set value(v: OrderForm | null) { setOrderForm(v); },
-    },
-
-    loading: {
-      get value() { return _loading; },
-      set value(v: boolean) { setLoading(v); },
-    },
-
-    initFailed: {
-      get value() { return _initFailed; },
-    },
-
-    addItem: async (params: { id: string; seller: string; quantity?: number }) => {
-      setLoading(true);
-      try {
-        const ofId = await ensureOrderForm();
-        const updated = await invoke.vtex.actions.addItemsToCart({
-          data: {
-            orderFormId: ofId,
-            orderItems: [{ id: params.id, seller: params.seller, quantity: params.quantity ?? 1 }],
-          },
-        });
-        setOrderForm(updated);
-        if (updated?.orderFormId) setOrderFormIdCookie(updated.orderFormId);
-      } catch (err) {
-        console.error("[useCart] addItem failed:", err);
-        throw err;
-      } finally {
-        setLoading(false);
-      }
-    },
-
-    addItems: async (params: {
-      orderItems: Array<{ id: string; seller: string; quantity: number }>;
-    }) => {
-      setLoading(true);
-      try {
-        const ofId = await ensureOrderForm();
-        const updated = await invoke.vtex.actions.addItemsToCart({
-          data: { orderFormId: ofId, orderItems: params.orderItems },
-        });
-        setOrderForm(updated);
-        if (updated?.orderFormId) setOrderFormIdCookie(updated.orderFormId);
-      } catch (err) {
-        console.error("[useCart] addItems failed:", err);
-        throw err;
-      } finally {
-        setLoading(false);
-      }
-    },
-
-    updateItems: async (params: { orderItems: Array<{ index: number; quantity: number }> }) => {
-      const ofId = _orderForm?.orderFormId || getOrderFormIdFromCookie();
-      if (!ofId) return;
-      setLoading(true);
-      try {
-        const updated = await invoke.vtex.actions.updateCartItems({
-          data: { orderFormId: ofId, orderItems: params.orderItems },
-        });
-        setOrderForm(updated);
-      } catch (err) {
-        console.error("[useCart] updateItems failed:", err);
-      } finally {
-        setLoading(false);
-      }
-    },
-
-    removeItem: async (index: number) => {
-      const ofId = _orderForm?.orderFormId || getOrderFormIdFromCookie();
-      if (!ofId) return;
-      setLoading(true);
-      try {
-        const updated = await invoke.vtex.actions.updateCartItems({
-          data: { orderFormId: ofId, orderItems: [{ index, quantity: 0 }] },
-        });
-        setOrderForm(updated);
-      } catch (err) {
-        console.error("[useCart] removeItem failed:", err);
-      } finally {
-        setLoading(false);
-      }
-    },
-
-    addCouponsToCart: async ({ text }: { text: string }) => {
-      const ofId = _orderForm?.orderFormId || getOrderFormIdFromCookie();
-      if (!ofId) return;
-      setLoading(true);
-      try {
-        const updated = await invoke.vtex.actions.addCouponToCart({
-          data: { orderFormId: ofId, text },
-        });
-        setOrderForm(updated);
-      } catch (err) {
-        console.error("[useCart] addCoupon failed:", err);
-      } finally {
-        setLoading(false);
-      }
-    },
-
-    sendAttachment: async (params: { attachment: string; body: Record<string, unknown> }) => {
-      const ofId = _orderForm?.orderFormId || getOrderFormIdFromCookie();
-      if (!ofId) return;
-      setLoading(true);
-      try {
-        const updated = await invoke.vtex.actions.updateOrderFormAttachment({
-          data: {
-            orderFormId: ofId,
-            attachment: params.attachment,
-            body: params.body,
-          },
-        });
-        setOrderForm(updated);
-      } catch (err) {
-        console.error("[useCart] sendAttachment failed:", err);
-      } finally {
-        setLoading(false);
-      }
-    },
-
-    simulate: async (data: {
-      items: Array<{ id: string; quantity: number; seller: string }>;
-      postalCode: string;
-      country: string;
-    }) => {
-      return await invoke.vtex.actions.simulateCart({
-        data: {
-          items: data.items.map((i) => ({
-            id: i.id,
-            quantity: i.quantity,
-            seller: i.seller,
-          })),
-          postalCode: data.postalCode,
-          country: data.country,
-        },
-      });
-    },
-
-    mapItemsToAnalyticsItems: (orderForm: OrderForm | null) => {
-      return (orderForm?.items || []).map((item, index) => itemToAnalyticsItem(item, index));
-    },
-  };
-}
+export const { useCart, resetCart, itemToAnalyticsItem } = createUseCart({
+  invoke,
+});
 `;
 }