@decocms/apps-vtex 7.25.0 → 7.26.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@decocms/apps-vtex",
-  "version": "7.25.0",
+  "version": "7.26.1",
   "type": "module",
   "description": "Deco commerce app: VTEX integration",
   "repository": {
@@ -51,10 +51,10 @@
     "lint:unused": "knip"
   },
   "dependencies": {
-    "@decocms/blocks": "7.25.0",
-    "@decocms/apps-commerce": "7.25.0",
-    "@decocms/apps-website": "7.25.0",
-    "@decocms/tanstack": "7.25.0"
+    "@decocms/blocks": "7.26.1",
+    "@decocms/apps-commerce": "7.26.1",
+    "@decocms/apps-website": "7.26.1",
+    "@decocms/tanstack": "7.26.1"
   },
   "peerDependencies": {
     "@tanstack/react-query": ">=5.0.0",

package/src/loaders/intelligentSearch/productDetailsPage.ts

@@ -6,6 +6,7 @@
 
 import type { ProductDetailsPage } from "@decocms/apps-commerce/types";
 import { getVtexConfig, vtexCachedFetch } from "../../client";
+import PDPDefaultPath from "../paths/PDPDefaultPath";
 import { searchBySlug } from "../../utils/slugCache";
 import { pickSku, toProductPage } from "../../utils/transform";
 import type { LegacyProduct } from "../../utils/types";
@@ -42,10 +43,27 @@ export default async function vtexProductDetailsPage(
 		variantIncludeImage = true,
 		variantIncludeInventory = true,
 	} = props;
-	if (!slug) return null;
 
 	try {
-		const linkText = slug.replace(/\/p$/, "").replace(/^\//, "").toLowerCase();
+		// Only the admin hits the PDP at its raw route pattern (`/:slug/p`), so the
+		// `slug` route-param resolves to the literal placeholder `:slug` — there's
+		// no real product in the URL, so render the best seller as a preview.
+		//
+		// This is NOT a general fallback: a concrete slug that resolves to no
+		// product (e.g. `/dssadals/p`) must still 404 like any missing product, and
+		// a genuinely absent slug must NOT pull in an unrelated product either. So
+		// we trigger ONLY on the `:`-prefixed placeholder, never on empty/missing.
+		// Mirrors deco-cx/apps' PDPDefaultPath behavior.
+		let effectiveSlug = slug;
+
+		if (slug?.startsWith(":")) {
+			const defaultPaths = await PDPDefaultPath({ count: 1 });
+			effectiveSlug = defaultPaths?.possiblePaths[0];
+		}
+
+		if (!effectiveSlug) return null;
+
+		const linkText = effectiveSlug.replace(/\/p$/, "").replace(/^\//, "").toLowerCase();
 		const config = getVtexConfig();
 		const sc = config.salesChannel;
 

package/src/loaders/paths/PDPDefaultPath.ts

@@ -0,0 +1,51 @@
+/**
+ * PDP default-path resolver.
+ *
+ * Ported from deco-cx/apps (`vtex/loaders/paths/PDPDefaultPath.ts`). When a
+ * Product page is previewed/configured in the CMS, it is resolved at its raw
+ * route pattern (`/:slug/p`), so the `slug` route-param comes through as the
+ * literal placeholder `:slug` — there is no concrete product in the URL. Rather
+ * than render a 404, we fall back to a real product — the best seller — so the
+ * PDP has something to show in the admin.
+ *
+ * We query Intelligent Search for the top-selling, in-stock product and return
+ * its `linkText` as the slug the PDP loader should render.
+ */
+import { intelligentSearch } from "../../client";
+
+export interface PDPDefaultPathProps {
+	/** How many candidate paths to fetch. Defaults to 1. */
+	count?: number;
+}
+
+export interface DefaultPathResult {
+	possiblePaths: string[];
+}
+
+export default async function PDPDefaultPath(
+	props: PDPDefaultPathProps = {},
+): Promise<DefaultPathResult | null> {
+	const { count = 1 } = props;
+
+	try {
+		const data = await intelligentSearch<{ products?: Array<{ linkText?: string }> }>(
+			"/product_search/",
+			{
+				page: "1",
+				count: String(count),
+				query: "",
+				sort: "orders:desc",
+				hideUnavailableItems: "true",
+			},
+		);
+
+		const possiblePaths = (data.products ?? [])
+			.map((p) => p.linkText)
+			.filter((linkText): linkText is string => Boolean(linkText));
+
+		return { possiblePaths };
+	} catch (error) {
+		console.error("[VTEX] PDPDefaultPath error:", error);
+		return null;
+	}
+}