@decocms/apps 0.23.2 → 0.24.0

package/vtex/actions/session.ts

@@ -2,8 +2,9 @@
  * VTEX Sessions API actions.
  * All session-mutating actions return Set-Cookie headers for propagation.
  */
-import { vtexFetchWithCookies, vtexIOGraphQL, getVtexConfig } from "../client";
+
 import type { VtexFetchResult } from "../client";
+import { getVtexConfig, vtexFetchWithCookies, vtexIOGraphQL } from "../client";
 import { buildAuthCookieHeader } from "../utils/vtexId";
 
 // ---------------------------------------------------------------------------
@@ -11,21 +12,21 @@ import { buildAuthCookieHeader } from "../utils/vtexId";
 // ---------------------------------------------------------------------------
 
 export interface SessionData {
-  id: string;
-  namespaces: Record<string, Record<string, { value: string }>>;
+	id: string;
+	namespaces: Record<string, Record<string, { value: string }>>;
 }
 
 export async function createSession(
-  data: Record<string, any>,
-  cookieHeader?: string,
+	data: Record<string, any>,
+	cookieHeader?: string,
 ): Promise<VtexFetchResult<SessionData>> {
-  const headers: Record<string, string> = {};
-  if (cookieHeader) headers["cookie"] = cookieHeader;
-  return vtexFetchWithCookies<SessionData>("/api/sessions", {
-    method: "POST",
-    body: JSON.stringify(data),
-    headers,
-  });
+	const headers: Record<string, string> = {};
+	if (cookieHeader) headers.cookie = cookieHeader;
+	return vtexFetchWithCookies<SessionData>("/api/sessions", {
+		method: "POST",
+		body: JSON.stringify(data),
+		headers,
+	});
 }
 
 // ---------------------------------------------------------------------------
@@ -33,8 +34,8 @@ export async function createSession(
 // ---------------------------------------------------------------------------
 
 export interface EditSessionResponse {
-  id: string;
-  namespaces: Record<string, Record<string, { value: string }>>;
+	id: string;
+	namespaces: Record<string, Record<string, { value: string }>>;
 }
 
 /**
@@ -42,17 +43,17 @@ export interface EditSessionResponse {
  * Returns data + Set-Cookie headers.
  */
 export async function editSession(
-  publicProperties: Record<string, { value: string }>,
-  cookieHeader?: string,
+	publicProperties: Record<string, { value: string }>,
+	cookieHeader?: string,
 ): Promise<VtexFetchResult<EditSessionResponse>> {
-  const headers: Record<string, string> = {};
-  if (cookieHeader) headers["cookie"] = cookieHeader;
+	const headers: Record<string, string> = {};
+	if (cookieHeader) headers.cookie = cookieHeader;
 
-  return vtexFetchWithCookies<EditSessionResponse>("/api/sessions", {
-    method: "PATCH",
-    body: JSON.stringify({ public: { ...publicProperties } }),
-    headers,
-  });
+	return vtexFetchWithCookies<EditSessionResponse>("/api/sessions", {
+		method: "PATCH",
+		body: JSON.stringify({ public: { ...publicProperties } }),
+		headers,
+	});
 }
 
 // ---------------------------------------------------------------------------
@@ -60,7 +61,7 @@ export async function editSession(
 // ---------------------------------------------------------------------------
 
 export interface DeleteSessionResponse {
-  logOutFromSession: string;
+	logOutFromSession: string;
 }
 
 const DELETE_SESSION_MUTATION = `mutation LogOutFromSession($sessionId: ID) {
@@ -72,16 +73,16 @@ const DELETE_SESSION_MUTATION = `mutation LogOutFromSession($sessionId: ID) {
  * Requires a valid auth cookie.
  */
 export async function deleteSession(
-  sessionId: string,
-  authCookie: string,
+	sessionId: string,
+	authCookie: string,
 ): Promise<DeleteSessionResponse> {
-  if (!authCookie) throw new Error("Auth cookie is required to delete session");
-  const { account } = getVtexConfig();
-  return vtexIOGraphQL<DeleteSessionResponse>(
-    {
-      query: DELETE_SESSION_MUTATION,
-      variables: { sessionId },
-    },
-    { cookie: buildAuthCookieHeader(authCookie, account) },
-  );
+	if (!authCookie) throw new Error("Auth cookie is required to delete session");
+	const { account } = getVtexConfig();
+	return vtexIOGraphQL<DeleteSessionResponse>(
+		{
+			query: DELETE_SESSION_MUTATION,
+			variables: { sessionId },
+		},
+		{ cookie: buildAuthCookieHeader(authCookie, account) },
+	);
 }

package/vtex/actions/trigger.ts

@@ -9,29 +9,29 @@
 
 /** Payload sent by VTEX when a SKU changes in the catalog. */
 export interface VTEXNotificationPayload {
-  /** SKU ID in VTEX. */
-  IdSku: string;
-  /** Seller's account name in VTEX (visible in the store's Admin URL). */
-  An: string;
-  /** Affiliate ID generated automatically in the configuration. */
-  IdAffiliate: string;
-  /** Product ID in VTEX. */
-  ProductId: number;
-  /** Date when the item was updated. */
-  DateModified: string;
-  /**
-   * Whether the product is active. `false` means the product was
-   * deactivated and should be blocked / zeroed in the marketplace.
-   */
-  IsActive: boolean;
-  /** Inventory level has changed -- run a Fulfillment Simulation to refresh. */
-  StockModified: boolean;
-  /** Price has changed -- run a Fulfillment Simulation to refresh. */
-  PriceModified: boolean;
-  /** Product/SKU registration data changed (name, description, weight, etc.). */
-  HasStockKeepingUnitModified: boolean;
-  /** Product is no longer associated with the trade policy. */
-  HasStockKeepingUnitRemovedFromAffiliate: boolean;
+	/** SKU ID in VTEX. */
+	IdSku: string;
+	/** Seller's account name in VTEX (visible in the store's Admin URL). */
+	An: string;
+	/** Affiliate ID generated automatically in the configuration. */
+	IdAffiliate: string;
+	/** Product ID in VTEX. */
+	ProductId: number;
+	/** Date when the item was updated. */
+	DateModified: string;
+	/**
+	 * Whether the product is active. `false` means the product was
+	 * deactivated and should be blocked / zeroed in the marketplace.
+	 */
+	IsActive: boolean;
+	/** Inventory level has changed -- run a Fulfillment Simulation to refresh. */
+	StockModified: boolean;
+	/** Price has changed -- run a Fulfillment Simulation to refresh. */
+	PriceModified: boolean;
+	/** Product/SKU registration data changed (name, description, weight, etc.). */
+	HasStockKeepingUnitModified: boolean;
+	/** Product is no longer associated with the trade policy. */
+	HasStockKeepingUnitRemovedFromAffiliate: boolean;
 }
 
 /**
@@ -39,5 +39,5 @@ export interface VTEXNotificationPayload {
  * Implement this in your framework layer (e.g. TanStack Start API route).
  */
 export type VTEXTriggerHandler = (
-  payload: VTEXNotificationPayload,
-) => Promise<{ id: string } | void>;
+	payload: VTEXNotificationPayload,
+) => Promise<{ id: string } | undefined>;

package/vtex/actions/wishlist.ts

@@ -5,31 +5,29 @@
  *   - vtex/actions/wishlist/removeItem.ts
  * @see https://developers.vtex.com/docs/apps/vtex.wish-list
  */
-import { vtexFetch, getVtexConfig, vtexIOGraphQL } from "../client";
+import { getVtexConfig, vtexIOGraphQL } from "../client";
 import { buildAuthCookieHeader } from "../utils/vtexId";
 
+/** Maximum wishlist items to fetch in a single query. */
+const WISHLIST_MAX_ITEMS = 500;
+
 // ---------------------------------------------------------------------------
 // Types
 // ---------------------------------------------------------------------------
 
 export interface WishlistItem {
-  id?: string;
-  productId: string;
-  sku: string;
-  title?: string;
+	id?: string;
+	productId: string;
+	sku: string;
+	title?: string;
 }
 
 // ---------------------------------------------------------------------------
 // GraphQL helper (myvtex.com private graphql)
 // ---------------------------------------------------------------------------
 
-interface GqlResponse<T> {
-  data: T;
-  errors?: Array<{ message: string }>;
-}
-
 function buildCookieHeader(authCookie: string): string {
-  return buildAuthCookieHeader(authCookie, getVtexConfig().account);
+	return buildAuthCookieHeader(authCookie, getVtexConfig().account);
 }
 
 // ---------------------------------------------------------------------------
@@ -55,16 +53,16 @@ const VIEW_WISHLIST = `query ViewList($shopperId: String!, $name: String!, $from
 // ---------------------------------------------------------------------------
 
 async function fetchWishlist(shopperId: string, authCookie: string): Promise<WishlistItem[]> {
-  const data = await vtexIOGraphQL<{
-    viewList: { data: WishlistItem[] | null };
-  }>(
-    {
-      query: VIEW_WISHLIST,
-      variables: { shopperId, name: "Wishlist", from: 0, to: 500 },
-    },
-    { Cookie: buildCookieHeader(authCookie) },
-  );
-  return data.viewList?.data ?? [];
+	const data = await vtexIOGraphQL<{
+		viewList: { data: WishlistItem[] | null };
+	}>(
+		{
+			query: VIEW_WISHLIST,
+			variables: { shopperId, name: "Wishlist", from: 0, to: WISHLIST_MAX_ITEMS },
+		},
+		{ Cookie: buildCookieHeader(authCookie) },
+	);
+	return data.viewList?.data ?? [];
 }
 
 /**
@@ -72,23 +70,23 @@ async function fetchWishlist(shopperId: string, authCookie: string): Promise<Wis
  * Returns the updated full wishlist.
  */
 export async function addItem(
-  item: { productId: string; sku: string; title?: string },
-  shopperId: string,
-  authCookie: string,
+	item: { productId: string; sku: string; title?: string },
+	shopperId: string,
+	authCookie: string,
 ): Promise<WishlistItem[]> {
-  if (!authCookie) throw new Error("User must be logged in to add to wishlist");
-  await vtexIOGraphQL<unknown>(
-    {
-      query: ADD_TO_WISHLIST,
-      variables: {
-        name: "Wishlist",
-        shopperId,
-        listItem: item,
-      },
-    },
-    { Cookie: buildCookieHeader(authCookie) },
-  );
-  return fetchWishlist(shopperId, authCookie);
+	if (!authCookie) throw new Error("User must be logged in to add to wishlist");
+	await vtexIOGraphQL<unknown>(
+		{
+			query: ADD_TO_WISHLIST,
+			variables: {
+				name: "Wishlist",
+				shopperId,
+				listItem: item,
+			},
+		},
+		{ Cookie: buildCookieHeader(authCookie) },
+	);
+	return fetchWishlist(shopperId, authCookie);
 }
 
 /**
@@ -96,21 +94,21 @@ export async function addItem(
  * Returns the updated full wishlist.
  */
 export async function removeItem(
-  id: string,
-  shopperId: string,
-  authCookie: string,
+	id: string,
+	shopperId: string,
+	authCookie: string,
 ): Promise<WishlistItem[]> {
-  if (!authCookie) throw new Error("User must be logged in to remove from wishlist");
-  await vtexIOGraphQL<unknown>(
-    {
-      query: REMOVE_FROM_WISHLIST,
-      variables: {
-        id,
-        name: "Wishlist",
-        shopperId,
-      },
-    },
-    { Cookie: buildCookieHeader(authCookie) },
-  );
-  return fetchWishlist(shopperId, authCookie);
+	if (!authCookie) throw new Error("User must be logged in to remove from wishlist");
+	await vtexIOGraphQL<unknown>(
+		{
+			query: REMOVE_FROM_WISHLIST,
+			variables: {
+				id,
+				name: "Wishlist",
+				shopperId,
+			},
+		},
+		{ Cookie: buildCookieHeader(authCookie) },
+	);
+	return fetchWishlist(shopperId, authCookie);
 }

package/vtex/client.ts

@@ -4,14 +4,13 @@
  */
 
 import { type FetchCacheOptions, fetchWithCache } from "./utils/fetchCache";
-import { SEGMENT_COOKIE_NAME, parseSegment } from "./utils/segment";
+import { parseSegment, SEGMENT_COOKIE_NAME } from "./utils/segment";
 
 // ---------------------------------------------------------------------------
 // URL sanitization (ported from deco-cx/apps vtex/utils/fetchVTEX.ts)
 // ---------------------------------------------------------------------------
 
-const removeNonLatin1Chars = (str: string): string =>
-	str.replace(/[^\x00-\x7F]|["']/g, "");
+const removeNonLatin1Chars = (str: string): string => str.replace(/[^\x00-\x7F]|["']/g, "");
 
 const removeScriptChars = (str: string): string => {
 	return str
@@ -138,8 +137,7 @@ export function setResponseCookieForwarder(fn: (cookies: string[]) => void) {
 }
 
 export function getVtexConfig(): VtexConfig {
-	if (!_config)
-		throw new Error("VTEX not configured. Call configureVtex() first.");
+	if (!_config) throw new Error("VTEX not configured. Call configureVtex() first.");
 	return _config;
 }
 
@@ -147,10 +145,7 @@ export function getVtexConfig(): VtexConfig {
  * Build the VTEX hostname for a given environment.
  * Centralizes `{account}.{env}.{domain}` so nothing is hardcoded.
  */
-export function vtexHost(
-	environment: string = "vtexcommercestable",
-	config?: VtexConfig,
-): string {
+export function vtexHost(environment: string = "vtexcommercestable", config?: VtexConfig): string {
 	const c = config ?? getVtexConfig();
 	const domain = c.domain ?? "com.br";
 	return `${c.account}.${environment}.${domain}`;
@@ -185,18 +180,13 @@ function extractRegionIdFromCookies(): string | null {
 	if (!_getCookieHeader) return null;
 	const cookies = _getCookieHeader();
 	if (!cookies) return null;
-	const match = cookies.match(
-		new RegExp(`(?:^|;\\s*)${SEGMENT_COOKIE_NAME}=([^;]+)`),
-	);
+	const match = cookies.match(new RegExp(`(?:^|;\\s*)${SEGMENT_COOKIE_NAME}=([^;]+)`));
 	if (!match?.[1]) return null;
 	const segment = parseSegment(match[1]);
 	return segment?.regionId ?? null;
 }
 
-export async function vtexFetchResponse(
-	path: string,
-	init?: RequestInit,
-): Promise<Response> {
+export async function vtexFetchResponse(path: string, init?: RequestInit): Promise<Response> {
 	const raw = path.startsWith("http") ? path : `${baseUrl()}${path}`;
 	const url = sanitizeUrl(raw);
 	const response = await _fetch(url, {
@@ -204,17 +194,12 @@ export async function vtexFetchResponse(
 		headers: { ...authHeaders(), ...init?.headers },
 	});
 	if (!response.ok) {
-		throw new Error(
-			`VTEX API error: ${response.status} ${response.statusText} - ${url}`,
-		);
+		throw new Error(`VTEX API error: ${response.status} ${response.statusText} - ${url}`);
 	}
 	return response;
 }
 
-export async function vtexFetch<T>(
-	path: string,
-	init?: RequestInit,
-): Promise<T> {
+export async function vtexFetch<T>(path: string, init?: RequestInit): Promise<T> {
 	const response = await vtexFetchResponse(path, init);
 	return response.json();
 }
@@ -370,9 +355,7 @@ export async function vtexIOGraphQL<T>(
 		},
 	);
 	if (res.errors?.length) {
-		throw new Error(
-			`VTEX IO GraphQL error: ${res.errors.map((e) => e.message).join(", ")}`,
-		);
+		throw new Error(`VTEX IO GraphQL error: ${res.errors.map((e) => e.message).join(", ")}`);
 	}
 	return res.data;
 }
@@ -408,10 +391,7 @@ const PAGE_TYPE_TO_MAP_PARAM: Record<string, string | null> = {
 	FullText: null,
 };
 
-function pageTypeToMapParam(
-	type: PageType["pageType"],
-	index: number,
-): string | null {
+function pageTypeToMapParam(type: PageType["pageType"], index: number): string | null {
 	if (type === "Category" || type === "Department" || type === "SubCategory") {
 		return `category-${index + 1}`;
 	}
@@ -419,9 +399,7 @@ function pageTypeToMapParam(
 }
 
 function cachedPageType(term: string): Promise<PageType | null> {
-	return vtexCachedFetch<PageType>(
-		`/api/catalog_system/pub/portal/pagetype/${term}`,
-	);
+	return vtexCachedFetch<PageType>(`/api/catalog_system/pub/portal/pagetype/${term}`);
 }
 
 /**
@@ -453,9 +431,7 @@ const slugify = (str: string) =>
  * Convert page types to selectedFacets with correct IS facet keys.
  * Mirrors deco-cx/apps `filtersFromPathname`.
  */
-export function filtersFromPageTypes(
-	pageTypes: PageType[],
-): Array<{ key: string; value: string }> {
+export function filtersFromPageTypes(pageTypes: PageType[]): Array<{ key: string; value: string }> {
 	return pageTypes
 		.map((page, index) => {
 			const key = pageTypeToMapParam(page.pageType, index);
@@ -469,12 +445,8 @@ export function filtersFromPageTypes(
  * Build the IS facet path string from selectedFacets.
  * Mirrors deco-cx/apps `toPath`.
  */
-export function toFacetPath(
-	facets: Array<{ key: string; value: string }>,
-): string {
-	return facets
-		.map(({ key, value }) => (key ? `${key}/${value}` : value))
-		.join("/");
+export function toFacetPath(facets: Array<{ key: string; value: string }>): string {
+	return facets.map(({ key, value }) => (key ? `${key}/${value}` : value)).join("/");
 }
 
 export function initVtexFromBlocks(blocks: Record<string, any>) {

package/vtex/hooks/index.ts

@@ -1,4 +1,4 @@
-export { useCart, type UseCartOptions, type OrderForm, type CartItem } from "./useCart";
-export { useUser, type UseUserOptions, type VtexUser } from "./useUser";
-export { useWishlist, type UseWishlistOptions, type WishlistItem } from "./useWishlist";
-export { useAutocomplete, type UseAutocompleteOptions } from "./useAutocomplete";
+export { type UseAutocompleteOptions, useAutocomplete } from "./useAutocomplete";
+export { type CartItem, type OrderForm, type UseCartOptions, useCart } from "./useCart";
+export { type UseUserOptions, useUser, type VtexUser } from "./useUser";
+export { type UseWishlistOptions, useWishlist, type WishlistItem } from "./useWishlist";

package/vtex/hooks/useAutocomplete.ts

@@ -20,70 +20,64 @@
  * ```
  */
 
-import { useState, useCallback, useRef, useEffect } from "react";
 import { useQuery } from "@tanstack/react-query";
+import { useCallback, useEffect, useState } from "react";
 import type { Suggestion } from "../../commerce/types/commerce";
 
 export interface UseAutocompleteOptions {
-  /** Debounce delay in ms @default 250 */
-  debounceMs?: number;
-  /** Max products to return @default 4 */
-  count?: number;
-  /** Custom fetch function — defaults to calling the inline-loader on the server */
-  fetchSuggestions?: (query: string, count: number) => Promise<Suggestion | null>;
+	/** Debounce delay in ms @default 250 */
+	debounceMs?: number;
+	/** Max products to return @default 4 */
+	count?: number;
+	/** Custom fetch function — defaults to calling the inline-loader on the server */
+	fetchSuggestions?: (query: string, count: number) => Promise<Suggestion | null>;
 }
 
 const AUTOCOMPLETE_QUERY_KEY = "vtex-autocomplete";
 
 function useDebounce<T>(value: T, delay: number): T {
-  const [debounced, setDebounced] = useState(value);
-  useEffect(() => {
-    const timer = setTimeout(() => setDebounced(value), delay);
-    return () => clearTimeout(timer);
-  }, [value, delay]);
-  return debounced;
+	const [debounced, setDebounced] = useState(value);
+	useEffect(() => {
+		const timer = setTimeout(() => setDebounced(value), delay);
+		return () => clearTimeout(timer);
+	}, [value, delay]);
+	return debounced;
 }
 
-async function defaultFetchSuggestions(
-  query: string,
-  _count: number,
-): Promise<Suggestion | null> {
-  const params = new URLSearchParams({ query });
-  const res = await fetch(`/api/vtex/suggestions?${params}`);
-  if (!res.ok) return null;
-  return res.json();
+async function defaultFetchSuggestions(query: string, _count: number): Promise<Suggestion | null> {
+	const params = new URLSearchParams({ query });
+	const res = await fetch(`/api/vtex/suggestions?${params}`);
+	if (!res.ok) return null;
+	return res.json();
 }
 
 export function useAutocomplete(opts?: UseAutocompleteOptions) {
-  const debounceMs = opts?.debounceMs ?? 250;
-  const count = opts?.count ?? 4;
-  const fetchFn = opts?.fetchSuggestions ?? defaultFetchSuggestions;
+	const debounceMs = opts?.debounceMs ?? 250;
+	const count = opts?.count ?? 4;
+	const fetchFn = opts?.fetchSuggestions ?? defaultFetchSuggestions;
 
-  const [rawQuery, setRawQuery] = useState("");
-  const debouncedQuery = useDebounce(rawQuery.trim(), debounceMs);
+	const [rawQuery, setRawQuery] = useState("");
+	const debouncedQuery = useDebounce(rawQuery.trim(), debounceMs);
 
-  const { data, isLoading, isFetching } = useQuery({
-    queryKey: [AUTOCOMPLETE_QUERY_KEY, debouncedQuery, count],
-    queryFn: () => fetchFn(debouncedQuery, count),
-    enabled: debouncedQuery.length > 0,
-    staleTime: 60_000,
-  });
+	const { data, isLoading, isFetching } = useQuery({
+		queryKey: [AUTOCOMPLETE_QUERY_KEY, debouncedQuery, count],
+		queryFn: () => fetchFn(debouncedQuery, count),
+		enabled: debouncedQuery.length > 0,
+		staleTime: 60_000,
+	});
 
-  const setSearch = useCallback(
-    (query: string) => {
-      setRawQuery(query);
-    },
-    [],
-  );
+	const setSearch = useCallback((query: string) => {
+		setRawQuery(query);
+	}, []);
 
-  return {
-    /** Set the search query (will be debounced automatically) */
-    setSearch,
-    /** Current raw (un-debounced) query */
-    query: rawQuery,
-    /** Suggestion result (searches + products) */
-    suggestions: data ?? null,
-    /** True while initial fetch is in progress */
-    loading: isLoading || isFetching,
-  };
+	return {
+		/** Set the search query (will be debounced automatically) */
+		setSearch,
+		/** Current raw (un-debounced) query */
+		query: rawQuery,
+		/** Suggestion result (searches + products) */
+		suggestions: data ?? null,
+		/** True while initial fetch is in progress */
+		loading: isLoading || isFetching,
+	};
 }