@decocms/apps 0.23.3 → 0.24.0

package/shopify/loaders/ProductListingPage.ts

@@ -1,180 +1,172 @@
 import type { ProductListingPage } from "../../commerce/types/commerce";
 import { getShopifyClient } from "../client";
 import { ProductsByCollection, SearchProducts } from "../utils/storefront/queries";
-import { toFilter, toProduct, type ProductShopify } from "../utils/transform";
+import { type ProductShopify, toFilter, toProduct } from "../utils/transform";
 import type { Metafield } from "../utils/types";
 import {
-  getFiltersByUrl,
-  searchSortOptions,
-  searchSortShopify,
-  sortOptions,
-  sortShopify,
+	getFiltersByUrl,
+	searchSortOptions,
+	searchSortShopify,
+	sortOptions,
+	sortShopify,
 } from "../utils/utils";
 
 interface PageInfo {
-  hasNextPage: boolean;
-  hasPreviousPage: boolean;
-  endCursor?: string;
-  startCursor?: string;
+	hasNextPage: boolean;
+	hasPreviousPage: boolean;
+	endCursor?: string;
+	startCursor?: string;
 }
 
 interface FilterNode {
-  id: string;
-  label: string;
-  type: string;
-  values: Array<{ id: string; label: string; count: number; input: string }>;
+	id: string;
+	label: string;
+	type: string;
+	values: Array<{ id: string; label: string; count: number; input: string }>;
 }
 
 interface ProductConnection {
-  nodes: ProductShopify[];
-  pageInfo: PageInfo;
-  filters?: FilterNode[];
+	nodes: ProductShopify[];
+	pageInfo: PageInfo;
+	filters?: FilterNode[];
 }
 
 export interface Props {
-  query?: string;
-  collectionName?: string;
-  count: number;
-  metafields?: Metafield[];
-  pageOffset?: number;
-  page?: number;
-  startCursor?: string;
-  endCursor?: string;
-  pageHref?: string;
+	query?: string;
+	collectionName?: string;
+	count: number;
+	metafields?: Metafield[];
+	pageOffset?: number;
+	page?: number;
+	startCursor?: string;
+	endCursor?: string;
+	pageHref?: string;
 }
 
 export default async function productListingPageLoader(
-  props: Props,
-  url?: URL,
+	props: Props,
+	url?: URL,
 ): Promise<ProductListingPage | null> {
-  const pageUrl = url ?? new URL(props.pageHref || "https://localhost");
-  const client = getShopifyClient();
-
-  const count = props.count ?? 12;
-  const query = props.query || pageUrl.searchParams.get("q") || "";
-  const currentPageoffset = props.pageOffset ?? 1;
-  const pageParam = pageUrl.searchParams.get("page")
-    ? Number(pageUrl.searchParams.get("page")) - currentPageoffset
-    : 0;
-  const page = props.page || pageParam;
-  const endCursor = props.endCursor || pageUrl.searchParams.get("endCursor") || "";
-  const startCursor = props.startCursor || pageUrl.searchParams.get("startCursor") || "";
-  const metafields = props.metafields || [];
-
-  const isSearch = Boolean(query);
-  let hasNextPage = false;
-  let hasPreviousPage = false;
-  let shopifyProducts: ProductConnection | undefined;
-  let shopifyFilters: FilterNode[] | undefined;
-  let records: number | undefined;
-  let collectionTitle: string | undefined;
-  let collectionDescription: string | undefined;
-
-  const sort = pageUrl.searchParams.get("sort") ?? "";
-
-  if (isSearch) {
-    const data = await client.query<{
-      search: ProductConnection & { totalCount?: number; productFilters?: FilterNode[] };
-    }>(
-      SearchProducts,
-      {
-        ...(!endCursor && { first: count }),
-        ...(endCursor && { last: count }),
-        ...(startCursor && { after: startCursor }),
-        ...(endCursor && { before: endCursor }),
-        query,
-        productFilters: getFiltersByUrl(pageUrl),
-        identifiers: metafields,
-        ...searchSortShopify[sort],
-      },
-    );
-
-    shopifyProducts = data.search;
-    shopifyFilters = data.search?.productFilters;
-    records = data.search?.totalCount;
-    hasNextPage = Boolean(data.search?.pageInfo.hasNextPage);
-    hasPreviousPage = Boolean(data.search?.pageInfo.hasPreviousPage);
-  } else {
-    const pathname = props.collectionName || pageUrl.pathname.split("/")[1];
-
-    const data = await client.query<{
-      collection?: {
-        title?: string;
-        description?: string;
-        products: ProductConnection;
-      };
-    }>(
-      ProductsByCollection,
-      {
-        ...(!endCursor && { first: count }),
-        ...(endCursor && { last: count }),
-        ...(startCursor && { after: startCursor }),
-        ...(endCursor && { before: endCursor }),
-        identifiers: metafields,
-        handle: pathname,
-        filters: getFiltersByUrl(pageUrl),
-        ...sortShopify[sort],
-      },
-    );
-
-    shopifyProducts = data.collection?.products;
-    shopifyFilters = data.collection?.products?.filters;
-    hasNextPage = Boolean(data.collection?.products.pageInfo.hasNextPage);
-    hasPreviousPage = Boolean(data.collection?.products.pageInfo.hasPreviousPage);
-    collectionTitle = data.collection?.title;
-    collectionDescription = data.collection?.description;
-  }
-
-  const products = shopifyProducts?.nodes?.map((p) =>
-    toProduct(p, p.variants.nodes[0], pageUrl)
-  );
-
-  const nextPage = new URLSearchParams(pageUrl.searchParams);
-  const previousPage = new URLSearchParams(pageUrl.searchParams);
-
-  if (hasNextPage) {
-    nextPage.set("page", (page + currentPageoffset + 1).toString());
-    nextPage.set("startCursor", shopifyProducts?.pageInfo.endCursor ?? "");
-    nextPage.delete("endCursor");
-  }
-
-  if (hasPreviousPage) {
-    previousPage.set("page", (page + currentPageoffset - 1).toString());
-    previousPage.set("endCursor", shopifyProducts?.pageInfo.startCursor ?? "");
-    previousPage.delete("startCursor");
-  }
-
-  const filters = shopifyFilters?.map((filter) => toFilter(filter, pageUrl));
-  const currentPage = page + currentPageoffset;
-
-  return {
-    "@type": "ProductListingPage",
-    breadcrumb: {
-      "@type": "BreadcrumbList",
-      itemListElement: [{
-        "@type": "ListItem" as const,
-        name: isSearch ? query : pageUrl.pathname.split("/")[1],
-        item: isSearch ? pageUrl.href : pageUrl.pathname,
-        position: 2,
-      }],
-      numberOfItems: 1,
-    },
-    filters: filters ?? [],
-    products: products ?? [],
-    pageInfo: {
-      nextPage: hasNextPage ? `?${nextPage}` : undefined,
-      previousPage: hasPreviousPage ? `?${previousPage}` : undefined,
-      currentPage,
-      records,
-      recordPerPage: count,
-    },
-    sortOptions: isSearch ? searchSortOptions : sortOptions,
-    seo: {
-      title: collectionTitle || "",
-      description: collectionDescription || "",
-      canonical: `${pageUrl.origin}${pageUrl.pathname}${
-        page >= 1 ? `?page=${page}` : ""
-      }`,
-    },
-  };
+	const pageUrl = url ?? new URL(props.pageHref || "https://localhost");
+	const client = getShopifyClient();
+
+	const count = props.count ?? 12;
+	const query = props.query || pageUrl.searchParams.get("q") || "";
+	const currentPageoffset = props.pageOffset ?? 1;
+	const pageParam = pageUrl.searchParams.get("page")
+		? Number(pageUrl.searchParams.get("page")) - currentPageoffset
+		: 0;
+	const page = props.page || pageParam;
+	const endCursor = props.endCursor || pageUrl.searchParams.get("endCursor") || "";
+	const startCursor = props.startCursor || pageUrl.searchParams.get("startCursor") || "";
+	const metafields = props.metafields || [];
+
+	const isSearch = Boolean(query);
+	let hasNextPage = false;
+	let hasPreviousPage = false;
+	let shopifyProducts: ProductConnection | undefined;
+	let shopifyFilters: FilterNode[] | undefined;
+	let records: number | undefined;
+	let collectionTitle: string | undefined;
+	let collectionDescription: string | undefined;
+
+	const sort = pageUrl.searchParams.get("sort") ?? "";
+
+	if (isSearch) {
+		const data = await client.query<{
+			search: ProductConnection & { totalCount?: number; productFilters?: FilterNode[] };
+		}>(SearchProducts, {
+			...(!endCursor && { first: count }),
+			...(endCursor && { last: count }),
+			...(startCursor && { after: startCursor }),
+			...(endCursor && { before: endCursor }),
+			query,
+			productFilters: getFiltersByUrl(pageUrl),
+			identifiers: metafields,
+			...searchSortShopify[sort],
+		});
+
+		shopifyProducts = data.search;
+		shopifyFilters = data.search?.productFilters;
+		records = data.search?.totalCount;
+		hasNextPage = Boolean(data.search?.pageInfo.hasNextPage);
+		hasPreviousPage = Boolean(data.search?.pageInfo.hasPreviousPage);
+	} else {
+		const pathname = props.collectionName || pageUrl.pathname.split("/")[1];
+
+		const data = await client.query<{
+			collection?: {
+				title?: string;
+				description?: string;
+				products: ProductConnection;
+			};
+		}>(ProductsByCollection, {
+			...(!endCursor && { first: count }),
+			...(endCursor && { last: count }),
+			...(startCursor && { after: startCursor }),
+			...(endCursor && { before: endCursor }),
+			identifiers: metafields,
+			handle: pathname,
+			filters: getFiltersByUrl(pageUrl),
+			...sortShopify[sort],
+		});
+
+		shopifyProducts = data.collection?.products;
+		shopifyFilters = data.collection?.products?.filters;
+		hasNextPage = Boolean(data.collection?.products.pageInfo.hasNextPage);
+		hasPreviousPage = Boolean(data.collection?.products.pageInfo.hasPreviousPage);
+		collectionTitle = data.collection?.title;
+		collectionDescription = data.collection?.description;
+	}
+
+	const products = shopifyProducts?.nodes?.map((p) => toProduct(p, p.variants.nodes[0], pageUrl));
+
+	const nextPage = new URLSearchParams(pageUrl.searchParams);
+	const previousPage = new URLSearchParams(pageUrl.searchParams);
+
+	if (hasNextPage) {
+		nextPage.set("page", (page + currentPageoffset + 1).toString());
+		nextPage.set("startCursor", shopifyProducts?.pageInfo.endCursor ?? "");
+		nextPage.delete("endCursor");
+	}
+
+	if (hasPreviousPage) {
+		previousPage.set("page", (page + currentPageoffset - 1).toString());
+		previousPage.set("endCursor", shopifyProducts?.pageInfo.startCursor ?? "");
+		previousPage.delete("startCursor");
+	}
+
+	const filters = shopifyFilters?.map((filter) => toFilter(filter, pageUrl));
+	const currentPage = page + currentPageoffset;
+
+	return {
+		"@type": "ProductListingPage",
+		breadcrumb: {
+			"@type": "BreadcrumbList",
+			itemListElement: [
+				{
+					"@type": "ListItem" as const,
+					name: isSearch ? query : pageUrl.pathname.split("/")[1],
+					item: isSearch ? pageUrl.href : pageUrl.pathname,
+					position: 2,
+				},
+			],
+			numberOfItems: 1,
+		},
+		filters: filters ?? [],
+		products: products ?? [],
+		pageInfo: {
+			nextPage: hasNextPage ? `?${nextPage}` : undefined,
+			previousPage: hasPreviousPage ? `?${previousPage}` : undefined,
+			currentPage,
+			records,
+			recordPerPage: count,
+		},
+		sortOptions: isSearch ? searchSortOptions : sortOptions,
+		seo: {
+			title: collectionTitle || "",
+			description: collectionDescription || "",
+			canonical: `${pageUrl.origin}${pageUrl.pathname}${page >= 1 ? `?page=${page}` : ""}`,
+		},
+	};
 }

package/shopify/loaders/RelatedProducts.ts

@@ -1,45 +1,42 @@
 import type { Product } from "../../commerce/types/commerce";
 import { getShopifyClient } from "../client";
 import { GetProduct, ProductRecommendations } from "../utils/storefront/queries";
-import { toProduct, type ProductShopify } from "../utils/transform";
+import { type ProductShopify, toProduct } from "../utils/transform";
 import type { Metafield } from "../utils/types";
 
 export interface Props {
-  slug: string;
-  count?: number;
-  metafields?: Metafield[];
+	slug: string;
+	count?: number;
+	metafields?: Metafield[];
 }
 
 export default async function relatedProductsLoader(
-  props: Props,
-  url?: URL,
+	props: Props,
+	url?: URL,
 ): Promise<Product[] | null> {
-  const client = getShopifyClient();
-  const { slug, count = 10, metafields = [] } = props;
+	const client = getShopifyClient();
+	const { slug, count = 10, metafields = [] } = props;
 
-  const splitted = slug?.split("-") ?? [];
-  const maybeSkuId = Number(splitted[splitted.length - 1]);
-  const handle = splitted.slice(0, maybeSkuId ? -1 : undefined).join("-");
+	const splitted = slug?.split("-") ?? [];
+	const maybeSkuId = Number(splitted[splitted.length - 1]);
+	const handle = splitted.slice(0, maybeSkuId ? -1 : undefined).join("-");
 
-  const productData = await client.query<{ product?: ProductShopify }>(
-    GetProduct,
-    { handle, identifiers: metafields },
-  );
+	const productData = await client.query<{ product?: ProductShopify }>(GetProduct, {
+		handle,
+		identifiers: metafields,
+	});
 
-  if (!productData?.product) return [];
+	if (!productData?.product) return [];
 
-  const data = await client.query<{
-    productRecommendations?: ProductShopify[];
-  }>(
-    ProductRecommendations,
-    { productId: productData.product.id, identifiers: metafields },
-  );
+	const data = await client.query<{
+		productRecommendations?: ProductShopify[];
+	}>(ProductRecommendations, { productId: productData.product.id, identifiers: metafields });
 
-  if (!data?.productRecommendations) return [];
+	if (!data?.productRecommendations) return [];
 
-  const baseUrl = url ?? new URL("https://localhost");
+	const baseUrl = url ?? new URL("https://localhost");
 
-  return data.productRecommendations
-    .map((p) => toProduct(p, p.variants.nodes[0], baseUrl))
-    .slice(0, count);
+	return data.productRecommendations
+		.map((p) => toProduct(p, p.variants.nodes[0], baseUrl))
+		.slice(0, count);
 }

package/shopify/loaders/cart.ts

@@ -3,71 +3,72 @@ import { getCartCookie, setCartCookie } from "../utils/cart";
 import { CreateCart, GetCart } from "../utils/storefront/queries";
 
 export interface CartLine {
-  id: string;
-  quantity: number;
-  merchandise: {
-    id: string;
-    title: string;
-    image?: { url: string; altText?: string | null } | null;
-    product: { title: string; handle: string; onlineStoreUrl?: string | null };
-    price: { amount: string; currencyCode: string };
-  };
-  discountAllocations?: Array<{
-    code?: string;
-    discountedAmount?: { amount: string; currencyCode: string };
-  }>;
-  cost?: {
-    totalAmount: { amount: string; currencyCode: string };
-    subtotalAmount: { amount: string; currencyCode: string };
-    amountPerQuantity?: { amount: string; currencyCode: string };
-    compareAtAmountPerQuantity?: { amount: string; currencyCode: string } | null;
-  };
+	id: string;
+	quantity: number;
+	merchandise: {
+		id: string;
+		title: string;
+		image?: { url: string; altText?: string | null } | null;
+		product: { title: string; handle: string; onlineStoreUrl?: string | null };
+		price: { amount: string; currencyCode: string };
+	};
+	discountAllocations?: Array<{
+		code?: string;
+		discountedAmount?: { amount: string; currencyCode: string };
+	}>;
+	cost?: {
+		totalAmount: { amount: string; currencyCode: string };
+		subtotalAmount: { amount: string; currencyCode: string };
+		amountPerQuantity?: { amount: string; currencyCode: string };
+		compareAtAmountPerQuantity?: { amount: string; currencyCode: string } | null;
+	};
 }
 
 export interface ShopifyCart {
-  id: string;
-  checkoutUrl: string;
-  totalQuantity: number;
-  lines: { nodes: CartLine[] };
-  cost: {
-    totalTaxAmount?: { amount: string; currencyCode: string };
-    subtotalAmount: { amount: string; currencyCode: string };
-    totalAmount: { amount: string; currencyCode: string };
-    checkoutChargeAmount?: { amount: string; currencyCode: string };
-  };
-  discountCodes?: Array<{ applicable: boolean; code: string }>;
-  discountAllocations?: Array<{
-    discountedAmount: { amount: string; currencyCode: string };
-  }>;
+	id: string;
+	checkoutUrl: string;
+	totalQuantity: number;
+	lines: { nodes: CartLine[] };
+	cost: {
+		totalTaxAmount?: { amount: string; currencyCode: string };
+		subtotalAmount: { amount: string; currencyCode: string };
+		totalAmount: { amount: string; currencyCode: string };
+		checkoutChargeAmount?: { amount: string; currencyCode: string };
+	};
+	discountCodes?: Array<{ applicable: boolean; code: string }>;
+	discountAllocations?: Array<{
+		discountedAmount: { amount: string; currencyCode: string };
+	}>;
 }
 
 export async function getCart(
-  requestHeaders: Headers,
-  responseHeaders?: Headers,
+	requestHeaders: Headers,
+	responseHeaders?: Headers,
 ): Promise<ShopifyCart | null> {
-  const client = getShopifyClient();
-  const maybeCartId = getCartCookie(requestHeaders);
+	const client = getShopifyClient();
+	const maybeCartId = getCartCookie(requestHeaders);
 
-  const cartId = maybeCartId ??
-    await client.query<{ payload?: { cart?: { id: string } } }>(CreateCart)
-      .then((data) => data.payload?.cart?.id);
+	const cartId =
+		maybeCartId ??
+		(await client
+			.query<{ payload?: { cart?: { id: string } } }>(CreateCart)
+			.then((data) => data.payload?.cart?.id));
 
-  if (!cartId) throw new Error("Missing cart id");
+	if (!cartId) throw new Error("Missing cart id");
 
-  const cart = await client.query<{ cart?: ShopifyCart }>(
-    GetCart,
-    { id: decodeURIComponent(cartId) },
-  ).then((data) => data.cart ?? null);
+	const cart = await client
+		.query<{ cart?: ShopifyCart }>(GetCart, { id: decodeURIComponent(cartId) })
+		.then((data) => data.cart ?? null);
 
-  if (responseHeaders) {
-    setCartCookie(responseHeaders, cartId);
-  }
+	if (responseHeaders) {
+		setCartCookie(responseHeaders, cartId);
+	}
 
-  return cart;
+	return cart;
 }
 
 export async function createCart(): Promise<string | null> {
-  const client = getShopifyClient();
-  const data = await client.query<{ payload?: { cart?: { id: string } } }>(CreateCart);
-  return data?.payload?.cart?.id ?? null;
+	const client = getShopifyClient();
+	const data = await client.query<{ payload?: { cart?: { id: string } } }>(CreateCart);
+	return data?.payload?.cart?.id ?? null;
 }

package/shopify/loaders/shop.ts

@@ -3,38 +3,33 @@ import { GetShopInfo } from "../utils/storefront/queries";
 import type { Metafield } from "../utils/types";
 
 export interface Shop {
-  name: string;
-  description?: string;
-  privacyPolicy?: { title: string; body: string };
-  refundPolicy?: { title: string; body: string };
-  shippingPolicy?: { title: string; body: string };
-  subscriptionPolicy?: { title: string; body: string };
-  termsOfService?: { title: string; body: string };
-  metafields?: Array<{
-    description?: string | null;
-    key: string;
-    namespace: string;
-    type: string;
-    value: string;
-    reference?: { image?: { url: string } } | null;
-    references?: { edges: Array<{ node: { image?: { url: string } } }> } | null;
-  } | null>;
+	name: string;
+	description?: string;
+	privacyPolicy?: { title: string; body: string };
+	refundPolicy?: { title: string; body: string };
+	shippingPolicy?: { title: string; body: string };
+	subscriptionPolicy?: { title: string; body: string };
+	termsOfService?: { title: string; body: string };
+	metafields?: Array<{
+		description?: string | null;
+		key: string;
+		namespace: string;
+		type: string;
+		value: string;
+		reference?: { image?: { url: string } } | null;
+		references?: { edges: Array<{ node: { image?: { url: string } } }> } | null;
+	} | null>;
 }
 
 export interface Props {
-  metafields?: Metafield[];
+	metafields?: Metafield[];
 }
 
-export default async function shopLoader(
-  props?: Props,
-): Promise<Shop> {
-  const client = getShopifyClient();
-  const metafields = props?.metafields || [];
+export default async function shopLoader(props?: Props): Promise<Shop> {
+	const client = getShopifyClient();
+	const metafields = props?.metafields || [];
 
-  const data = await client.query<{ shop: Shop }>(
-    GetShopInfo,
-    { identifiers: metafields },
-  );
+	const data = await client.query<{ shop: Shop }>(GetShopInfo, { identifiers: metafields });
 
-  return data.shop;
+	return data.shop;
 }

package/shopify/loaders/user.ts

@@ -3,42 +3,37 @@ import { FetchCustomerInfo } from "../utils/storefront/queries";
 import { getUserCookie } from "../utils/user";
 
 export interface ShopifyUser {
-  "@id": string;
-  email: string;
-  givenName: string;
-  familyName: string;
+	"@id": string;
+	email: string;
+	givenName: string;
+	familyName: string;
 }
 
-export default async function userLoader(
-  requestHeaders: Headers,
-): Promise<ShopifyUser | null> {
-  const client = getShopifyClient();
-  const customerAccessToken = getUserCookie(requestHeaders);
+export default async function userLoader(requestHeaders: Headers): Promise<ShopifyUser | null> {
+	const client = getShopifyClient();
+	const customerAccessToken = getUserCookie(requestHeaders);
 
-  if (!customerAccessToken) return null;
+	if (!customerAccessToken) return null;
 
-  try {
-    const data = await client.query<{
-      customer?: {
-        id: string;
-        email?: string | null;
-        firstName?: string | null;
-        lastName?: string | null;
-      };
-    }>(
-      FetchCustomerInfo,
-      { customerAccessToken },
-    );
+	try {
+		const data = await client.query<{
+			customer?: {
+				id: string;
+				email?: string | null;
+				firstName?: string | null;
+				lastName?: string | null;
+			};
+		}>(FetchCustomerInfo, { customerAccessToken });
 
-    if (!data.customer) return null;
+		if (!data.customer) return null;
 
-    return {
-      "@id": data.customer.id,
-      email: data.customer.email ?? "",
-      givenName: data.customer.firstName ?? "",
-      familyName: data.customer.lastName ?? "",
-    };
-  } catch {
-    return null;
-  }
+		return {
+			"@id": data.customer.id,
+			email: data.customer.email ?? "",
+			givenName: data.customer.firstName ?? "",
+			familyName: data.customer.lastName ?? "",
+		};
+	} catch {
+		return null;
+	}
 }