@vendure-platform/create 0.1.0

package/dist/assets/storefront/next-env.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="next" />
+/// <reference types="next/image-types/global" />
+import "./.next/dev/types/routes.d.ts";
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

package/dist/assets/storefront/next.config.ts

@@ -0,0 +1,73 @@
+import {NextConfig} from 'next';
+import {config} from 'dotenv';
+import * as path from 'path';
+import createNextIntlPlugin from 'next-intl/plugin';
+
+// Load env vars from monorepo root
+config({ path: path.resolve(__dirname, '../.env') });
+
+// Derive URLs from port variables if not explicitly set
+const vendurePort = process.env.VENDURE_PORT ?? '3500';
+const storefrontPort = process.env.STOREFRONT_PORT ?? '3001';
+
+const withNextIntl = createNextIntlPlugin('./src/i18n/request.ts');
+
+const nextConfig: NextConfig = {
+    // cacheComponents enables PPR + useCache + dynamicIO.
+    //
+    // Combining this with next-intl requires rootParams so that 'use cache'
+    // scopes can read the locale via next/root-params (which becomes an
+    // automatic cache key) instead of headers() — which is forbidden in
+    // cache boundaries.
+    //
+    // Key constraints (as of Next.js 16.2 / next-intl 4.9):
+    //   1. No root layout above [locale] — the rootParams SWC loader walks
+    //      from the app root and stops at the first layout.tsx it finds.
+    //      If that layout isn't inside a dynamic segment, no root params
+    //      are generated and the next/root-params module exports nothing.
+    //   2. next/root-params can only be imported in route files (layout,
+    //      page). Utility modules must use getLocale() or accept locale
+    //      as a parameter.
+    //   3. Turbopack dev has a pre-existing compilation hang on this project
+    //      (not i18n-related), so we use --webpack for dev and build.
+    //
+    // Reference implementation:
+    //   https://github.com/aurorascharff/next-intl-cache-components
+    //   https://aurorascharff.no/posts/implementing-nextjs-16-use-cache-with-next-intl-internationalization/
+    cacheComponents: true,
+    experimental: {
+        rootParams: true,
+        optimizePackageImports: ['lucide-react'],
+    },
+    env: {
+        // Derive API URL from PORT if not explicitly set
+        VENDURE_SHOP_API_URL: process.env.VENDURE_SHOP_API_URL ?? `http://localhost:${vendurePort}/shop-api`,
+        NEXT_PUBLIC_SITE_URL: process.env.NEXT_PUBLIC_SITE_URL ?? `http://localhost:${storefrontPort}`,
+        ...(process.env.VENDURE_CHANNEL_TOKEN ? { VENDURE_CHANNEL_TOKEN: process.env.VENDURE_CHANNEL_TOKEN } : {}),
+        REVALIDATION_SECRET: process.env.REVALIDATION_SECRET ?? 'dev-secret-change-in-production',
+        NEXT_PUBLIC_SCENARIO: process.env.NEXT_PUBLIC_SCENARIO ?? 'default',
+    },
+    images: {
+        // This is necessary to display images from your local Vendure instance
+        dangerouslyAllowLocalIP: true,
+        remotePatterns: [
+            {
+                hostname: 'readonlydemo.vendure.io',
+            },
+            {
+                hostname: '**.platform.vendure.io'
+            },
+            {
+                hostname: 'demo.enterprise.vendure.io'
+            },
+            {
+                hostname: 'localhost'
+            },
+            {
+                hostname: '**.code.run'
+            }
+        ],
+    },
+};
+
+export default withNextIntl(nextConfig);

package/dist/assets/storefront/package.json

@@ -0,0 +1,77 @@
+{
+  "name": "storefront",
+  "version": "0.0.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev --port ${STOREFRONT_PORT:-3001}",
+    "build": "next build",
+    "start": "next start",
+    "lint": "eslint .",
+    "check-types": "tsc --noEmit"
+  },
+  "dependencies": {
+    "@hookform/resolvers": "^5.2.2",
+    "@radix-ui/react-accordion": "^1.2.12",
+    "@radix-ui/react-alert-dialog": "^1.1.15",
+    "@radix-ui/react-aspect-ratio": "^1.1.8",
+    "@radix-ui/react-avatar": "^1.1.11",
+    "@radix-ui/react-checkbox": "^1.3.3",
+    "@radix-ui/react-collapsible": "^1.1.12",
+    "@radix-ui/react-context-menu": "^2.2.16",
+    "@radix-ui/react-dialog": "^1.1.15",
+    "@radix-ui/react-dropdown-menu": "^2.1.16",
+    "@radix-ui/react-hover-card": "^1.1.15",
+    "@radix-ui/react-label": "^2.1.8",
+    "@radix-ui/react-menubar": "^1.1.16",
+    "@radix-ui/react-navigation-menu": "^1.2.14",
+    "@radix-ui/react-popover": "^1.1.15",
+    "@radix-ui/react-progress": "^1.1.8",
+    "@radix-ui/react-radio-group": "^1.3.8",
+    "@radix-ui/react-scroll-area": "^1.2.10",
+    "@radix-ui/react-select": "^2.2.6",
+    "@radix-ui/react-separator": "^1.1.8",
+    "@radix-ui/react-slider": "^1.3.6",
+    "@radix-ui/react-slot": "^1.2.4",
+    "@radix-ui/react-switch": "^1.2.6",
+    "@radix-ui/react-tabs": "^1.1.13",
+    "@radix-ui/react-toggle": "^1.1.10",
+    "@radix-ui/react-toggle-group": "^1.1.11",
+    "@radix-ui/react-tooltip": "^1.2.8",
+    "@vendure-platform/storefront-client": "nightly",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "cmdk": "^1.1.1",
+    "date-fns": "^4.1.0",
+    "dotenv": "^17.2.3",
+    "embla-carousel-react": "^8.6.0",
+    "gql.tada": "^1.9.0",
+    "input-otp": "^1.4.2",
+    "lucide-react": "^0.544.0",
+    "next": "^16.0.10",
+    "next-intl": "^4.8.3",
+    "next-themes": "^0.4.6",
+    "react": " ^19.2.0",
+    "react-day-picker": "^9.11.3",
+    "react-dom": "^19.2.0",
+    "react-hook-form": "^7.68.0",
+    "react-resizable-panels": "^3.0.6",
+    "recharts": "^2.15.4",
+    "sonner": "^2.0.7",
+    "tailwind-merge": "^3.4.0",
+    "vaul": "^1.1.2",
+    "zod": "^4.1.13"
+  },
+  "devDependencies": {
+    "@eslint/eslintrc": "^3.3.3",
+    "@tailwindcss/postcss": "^4.1.17",
+    "@types/node": "^20.19.25",
+    "@types/react": "^19.2.7",
+    "@types/react-dom": "^19.2.3",
+    "baseline-browser-mapping": "^2.9.14",
+    "eslint": "^9.39.1",
+    "eslint-config-next": "16.0.0",
+    "tailwindcss": "^4.1.17",
+    "tw-animate-css": "^1.4.0",
+    "typescript": "^5.9.3"
+  }
+}

package/dist/assets/storefront/postcss.config.mjs

@@ -0,0 +1,5 @@
+const config = {
+  plugins: ["@tailwindcss/postcss"],
+};
+
+export default config;

package/dist/assets/storefront/public/next.svg

@@ -0,0 +1,22 @@
+<svg xmlns="http://www.w3.org/2000/svg" stroke-linejoin="round" data-testid="geist-icon" style="color:currentColor" viewBox="0 0 16 16">
+    <g clip-path="url(#a)">
+        <circle cx="8" cy="8" r="7.375" stroke="var(--ds-gray-1000)" stroke-linecap="round"/>
+        <path stroke="url(#b)" stroke-miterlimit="1.414" d="M10.63 11V5"/>
+        <path fill="url(#c)" fill-rule="evenodd" d="M5.995 5h-1.25v6h1.25V6.968l6.366 7.74c.351-.229.682-.484.992-.763L5.995 5.001Z"/>
+    </g>
+    <defs>
+        <linearGradient id="b" x1="11.13" x2="11.13" y1="5" y2="11" gradientUnits="userSpaceOnUse">
+            <stop stop-color="#fff"/>
+            <stop offset=".609" stop-color="#fff" stop-opacity=".57"/>
+            <stop offset=".797" stop-color="#fff" stop-opacity="0"/>
+            <stop offset="1" stop-color="#fff" stop-opacity="0"/>
+        </linearGradient>
+        <linearGradient id="c" x1="9.938" x2="13.557" y1="9.063" y2="13.399" gradientUnits="userSpaceOnUse">
+            <stop stop-color="#fff"/>
+            <stop offset="1" stop-color="#fff" stop-opacity="0"/>
+        </linearGradient>
+        <clipPath id="a">
+            <path fill="red" d="M0 0h16v16H0z"/>
+        </clipPath>
+    </defs>
+</svg>

package/dist/assets/storefront/public/scenarios/b2b-wholesale/logo.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="none">
+  <rect x="2" y="2" width="28" height="28" rx="5" fill="#e07a00"/>
+  <text x="16" y="22.5" font-family="Arial Black, Impact, sans-serif" font-size="14" font-weight="900" fill="white" text-anchor="middle" letter-spacing="-0.5">BD</text>
+</svg>

package/dist/assets/storefront/public/scenarios/default/logo.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 40 27">
+    <path fill="#17C1FF" d="M10.746 12.008v9.263c0 .166.093.323.237.404l8.407 4.763c.302.17.671.17.973 0l8.407-4.762a.466.466 0 0 0 .237-.405v-9.263a.476.476 0 0 0-.714-.405l-7.93 4.491a.996.996 0 0 1-.973 0l-7.93-4.49a.476.476 0 0 0-.714.404Z"/>
+    <path fill="#17C1FF" d="M8.893.072.486 4.832A.948.948 0 0 0 0 5.657v9.522c0 .166.092.323.237.405l8.176 4.633a.476.476 0 0 0 .714-.405V10.83c0-.341.185-.655.487-.824l7.93-4.491a.463.463 0 0 0 0-.81L9.366.072a.48.48 0 0 0-.477 0h.003ZM30.86.063l8.407 4.76c.301.17.486.486.486.825v9.522a.469.469 0 0 1-.237.405l-8.176 4.633a.476.476 0 0 1-.714-.405v-8.982a.945.945 0 0 0-.486-.824l-7.93-4.491a.463.463 0 0 1 0-.81L30.386.063a.48.48 0 0 1 .477 0h-.003Z"/>
+</svg>

package/dist/assets/storefront/public/scenarios/kaminpro/logo.svg

@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="none">
+  <rect x="2" y="2" width="28" height="28" rx="5" fill="#1c1917"/>
+  <path d="M16 6c-.5 2.8-3.2 4.3-3.2 7.8 0 2 1.4 3.6 3.2 3.6s3.2-1.6 3.2-3.6c0-1.2-.4-2-1.1-3 .3 1.4-.4 2.4-1.1 2.4-.7 0-1.1-.6-1.1-1.5C15.9 10 16.9 8.6 16 6z" fill="#dc2626"/>
+  <rect x="12" y="18" width="8" height="1.6" fill="#a8a29e"/>
+  <rect x="12" y="20.8" width="8" height="1.6" fill="#a8a29e"/>
+  <rect x="12" y="23.6" width="8" height="1.6" fill="#a8a29e"/>
+</svg>

package/dist/assets/storefront/public/vendure.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 40 27">
+    <path fill="#17C1FF" d="M10.746 12.008v9.263c0 .166.093.323.237.404l8.407 4.763c.302.17.671.17.973 0l8.407-4.762a.466.466 0 0 0 .237-.405v-9.263a.476.476 0 0 0-.714-.405l-7.93 4.491a.996.996 0 0 1-.973 0l-7.93-4.49a.476.476 0 0 0-.714.404Z"/>
+    <path fill="#17C1FF" d="M8.893.072.486 4.832A.948.948 0 0 0 0 5.657v9.522c0 .166.092.323.237.405l8.176 4.633a.476.476 0 0 0 .714-.405V10.83c0-.341.185-.655.487-.824l7.93-4.491a.463.463 0 0 0 0-.81L9.366.072a.48.48 0 0 0-.477 0h.003ZM30.86.063l8.407 4.76c.301.17.486.486.486.825v9.522a.469.469 0 0 1-.237.405l-8.176 4.633a.476.476 0 0 1-.714-.405v-8.982a.945.945 0 0 0-.486-.824l-7.93-4.491a.463.463 0 0 1 0-.81L30.386.063a.48.48 0 0 1 .477 0h-.003Z"/>
+</svg>

package/dist/assets/storefront/src/app/[locale]/(catalog)/catalog/page.tsx

@@ -0,0 +1,65 @@
+import type {Metadata} from 'next';
+import {getTranslations, setRequestLocale} from 'next-intl/server';
+import {ArrowRight} from 'lucide-react';
+import {Link} from '@/i18n/navigation';
+import {SITE_NAME, buildAlternates, buildCanonicalUrl} from '@/lib/metadata';
+import {getTopCollections} from '@/lib/vendure/cached';
+import {getActiveChannelToken} from '@/lib/channel-server';
+import {ShopByCategory} from '@/components/commerce/shop-by-category';
+
+export async function generateMetadata({
+    params,
+}: {params: Promise<{locale: string}>}): Promise<Metadata> {
+    const {locale} = await params;
+    const t = await getTranslations({locale, namespace: 'Catalog'});
+    const title = t('pageTitle');
+    const description = t('pageDescription');
+    return {
+        title,
+        description,
+        alternates: buildAlternates('/catalog', locale),
+        openGraph: {
+            title: `${title} — ${SITE_NAME}`,
+            description,
+            type: 'website',
+            url: buildCanonicalUrl('/catalog', locale),
+        },
+    };
+}
+
+export default async function CatalogPage({
+    params,
+}: {params: Promise<{locale: string}>}) {
+    const {locale} = await params;
+    setRequestLocale(locale);
+    const channelToken = await getActiveChannelToken();
+    const [collections, t] = await Promise.all([
+        getTopCollections(locale, channelToken),
+        getTranslations('Catalog'),
+    ]);
+
+    return (
+        <div className="py-8">
+            <header className="mb-8">
+                <h1 className="text-3xl md:text-4xl font-bold tracking-tight">
+                    {t('pageTitle')}
+                </h1>
+                <p className="mt-2 text-muted-foreground">
+                    {t('pageDescription')}
+                </p>
+            </header>
+
+            <ShopByCategory collections={collections} />
+
+            <div className="mt-8">
+                <Link
+                    href="/search"
+                    className="inline-flex items-center gap-1 text-sm text-primary hover:underline"
+                >
+                    {t('searchAllProducts')}
+                    <ArrowRight className="h-3.5 w-3.5" />
+                </Link>
+            </div>
+        </div>
+    );
+}

package/dist/assets/storefront/src/app/[locale]/(catalog)/collection/[slug]/loading.tsx

@@ -0,0 +1,24 @@
+import { CatalogSidebarSkeleton } from '@/components/shared/catalog-sidebar-skeleton';
+import { ProductGridSkeleton } from '@/components/shared/product-grid-skeleton';
+
+export default function CollectionLoading() {
+    return (
+        <div className="animate-pulse">
+            <div className="py-4 flex items-center">
+                <div className="flex items-center gap-1.5">
+                    <div className="h-5 w-12 bg-muted rounded" />
+                    <div className="h-4 w-4 bg-muted rounded" />
+                    <div className="h-5 w-28 bg-muted rounded" />
+                </div>
+            </div>
+            <div className="grid grid-cols-1 lg:grid-cols-4 gap-8 pb-8">
+                <aside className="lg:col-span-1">
+                    <CatalogSidebarSkeleton />
+                </aside>
+                <div className="lg:col-span-3">
+                    <ProductGridSkeleton />
+                </div>
+            </div>
+        </div>
+    );
+}

package/dist/assets/storefront/src/app/[locale]/(catalog)/collection/[slug]/page.tsx

@@ -0,0 +1,194 @@
+import type { Metadata } from 'next';
+import { Suspense } from 'react';
+import { publicClient } from '@/lib/vendure/api';
+import { getActiveChannelToken } from '@/lib/channel-server';
+import { SearchProductsQuery, GetCollectionProductsQuery } from '@/lib/vendure/queries';
+import { CatalogSearchBar } from '@/components/commerce/catalog-search-bar';
+import { CollectionHeroBanner } from '@/components/commerce/collection-hero-banner';
+import { SubcollectionTiles } from '@/components/commerce/subcollection-tiles';
+import { ProductGrid } from '@/components/commerce/product-grid';
+import { FacetFilters } from '@/components/commerce/facet-filters';
+import { ProductGridSkeleton } from '@/components/shared/product-grid-skeleton';
+import { Breadcrumbs } from '@/components/shared/breadcrumbs';
+import { CatalogSidebarSkeleton } from '@/components/shared/catalog-sidebar-skeleton';
+import { buildSearchInput, getCurrentPage } from '@/lib/search-helpers';
+import { cacheLife, cacheTag } from 'next/cache';
+import { getTranslations, setRequestLocale } from 'next-intl/server';
+import {
+    SITE_NAME,
+    truncateDescription,
+    buildCanonicalUrl,
+    buildAlternates,
+    buildOgImages,
+} from '@/lib/metadata';
+
+async function getCollectionProducts(slug: string, locale: string, searchParams: { [key: string]: string | string[] | undefined }, channelToken?: string) {
+    'use cache';
+    cacheLife('hours');
+    cacheTag(`collection-${slug}-${locale}${channelToken ? `-${channelToken}` : ''}`);
+
+    const [result, error] = await publicClient.query(SearchProductsQuery, {
+        input: buildSearchInput({
+            searchParams,
+            collectionSlug: slug
+        })
+    }, {languageCode: locale, ...(channelToken ? {channelToken} : {})});
+    if (error) return undefined;
+    return result;
+}
+
+async function getCollectionMetadata(slug: string, locale: string, channelToken?: string) {
+    'use cache';
+    cacheLife('hours');
+    cacheTag(`collection-meta-${slug}-${locale}${channelToken ? `-${channelToken}` : ''}`);
+
+    const [result, error] = await publicClient.query(GetCollectionProductsQuery, {
+        slug,
+        input: { take: 0, collectionSlug: slug, groupByProduct: true },
+    }, {languageCode: locale, ...(channelToken ? {channelToken} : {})});
+    if (error) return undefined;
+    return result;
+}
+
+export async function generateMetadata({
+    params,
+}: { params: Promise<{ locale: string; slug: string }> }): Promise<Metadata> {
+    const { locale, slug } = await params;
+    const channelToken = await getActiveChannelToken();
+    const [result, t] = await Promise.all([
+        getCollectionMetadata(slug, locale, channelToken),
+        getTranslations({locale, namespace: 'Product'}),
+    ]);
+    if (!result) {
+        return { title: t('home') };
+    }
+    const collection = result.data.collection;
+
+    if (!collection) {
+        return { title: t('collectionNotFound') };
+    }
+
+    const description =
+        truncateDescription(collection.description) ||
+        t('browseCollectionAt', { name: collection.name, siteName: SITE_NAME });
+
+    const collectionPath = `/collection/${collection.slug}`;
+    return {
+        title: collection.name,
+        description,
+        alternates: buildAlternates(collectionPath, locale),
+        openGraph: {
+            title: collection.name,
+            description,
+            type: 'website',
+            url: buildCanonicalUrl(collectionPath, locale),
+            images: buildOgImages(collection.featuredAsset?.preview, collection.name),
+        },
+        twitter: {
+            card: 'summary_large_image',
+            title: collection.name,
+            description,
+            images: collection.featuredAsset?.preview
+                ? [collection.featuredAsset.preview]
+                : undefined,
+        },
+    };
+}
+
+export default async function CollectionPage({
+    params,
+    searchParams,
+}: {
+    params: Promise<{ locale: string; slug: string }>;
+    searchParams: Promise<{ [key: string]: string | string[] | undefined }>;
+}) {
+    return (
+        <Suspense fallback={<CollectionPageSkeleton />}>
+            <CollectionContent paramsPromise={params} searchParamsPromise={searchParams} />
+        </Suspense>
+    );
+}
+
+async function CollectionContent({ paramsPromise, searchParamsPromise }: { paramsPromise: Promise<{ locale: string; slug: string }>; searchParamsPromise: Promise<{ [key: string]: string | string[] | undefined }> }) {
+    const { locale, slug } = await paramsPromise;
+    setRequestLocale(locale);
+    const searchParams = await searchParamsPromise;
+    const channelToken = await getActiveChannelToken();
+    const page = getCurrentPage(searchParams);
+    const [productData, metaResult, t] = await Promise.all([
+        getCollectionProducts(slug, locale, searchParams, channelToken),
+        getCollectionMetadata(slug, locale, channelToken),
+        getTranslations('Catalog'),
+    ]);
+
+    const collection = metaResult?.data?.collection;
+    const breadcrumbs = collection?.breadcrumbs
+        ?.filter((b) => b.slug !== '__root_collection__')
+        .map((b, i, arr) =>
+            i === arr.length - 1
+                ? { name: b.name }
+                : { name: b.name, href: `/collection/${b.slug}` },
+        ) ?? [];
+
+    if (!productData) {
+        return (
+            <>
+                <Breadcrumbs items={breadcrumbs} />
+                <div className="text-center py-12">
+                    <p className="text-muted-foreground">{t('unableToLoadProducts')}</p>
+                </div>
+            </>
+        );
+    }
+
+    const productDataPromise = Promise.resolve(productData);
+
+    const children = collection?.children ?? [];
+
+    return (
+        <>
+            <Breadcrumbs items={breadcrumbs} />
+            {collection?.featuredAsset?.preview && (
+                <CollectionHeroBanner
+                    name={collection.name}
+                    description={collection.description}
+                    imageUrl={collection.featuredAsset.preview}
+                />
+            )}
+            <div className="grid grid-cols-1 lg:grid-cols-4 gap-8 pb-8">
+                <aside className="lg:col-span-1">
+                    <Suspense fallback={<CatalogSidebarSkeleton />}>
+                        <FacetFilters productDataPromise={productDataPromise} />
+                    </Suspense>
+                </aside>
+                <div className="lg:col-span-3">
+                    <Suspense>
+                        <CatalogSearchBar />
+                    </Suspense>
+                    {children.length > 0 && (
+                        <SubcollectionTiles collections={children} />
+                    )}
+                    <Suspense fallback={<ProductGridSkeleton />}>
+                        <ProductGrid productDataPromise={productDataPromise} currentPage={page} take={12} view={searchParams.view as string} emptyMessage={t('noCategoryProducts')} />
+                    </Suspense>
+                </div>
+            </div>
+        </>
+    );
+}
+
+function CollectionPageSkeleton() {
+    return (
+        <>
+            <div className="pt-4 pb-10 h-[52px]" />
+            <div className="grid grid-cols-1 lg:grid-cols-4 gap-8 pb-8">
+                <aside className="lg:col-span-1">
+                    <CatalogSidebarSkeleton />
+                </aside>
+                <div className="lg:col-span-3">
+                    <ProductGridSkeleton />
+                </div>
+            </div>
+        </>
+    );
+}

package/dist/assets/storefront/src/app/[locale]/(catalog)/layout.tsx

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+
+export default function CatalogLayout({ children }: { children: ReactNode }) {
+    return (
+        <div className="container mx-auto px-4 pt-[var(--page-top-offset)]">
+            {children}
+        </div>
+    );
+}

package/dist/assets/storefront/src/app/[locale]/(catalog)/product/[slug]/actions.ts

@@ -0,0 +1,139 @@
+'use server';
+
+import { client } from '@/lib/vendure/api';
+import { AddToCartMutation, AddGiftCardToOrderMutation, AddConfigurationToOrderMutation } from '@/lib/vendure/mutations';
+import { GetProductDetailQuery, EvaluateConfigurationQuery } from '@/lib/vendure/queries';
+import { updateTag } from 'next/cache';
+import { setAuthToken } from '@/lib/auth';
+import { normalizeQuantity } from '@/lib/quantity';
+import { cartGuard } from '@/lib/cart-guard';
+import { getGuardError } from '@/lib/cart-guard-utils';
+
+export async function getProductBySlug(slug: string) {
+  const [result, error] = await client.query(GetProductDetailQuery, { slug });
+  if (error) throw error;
+  return result.data.product;
+}
+
+export async function addToCart(variantId: string, quantity: number = 1, packagingUnitId?: string) {
+  const guard = await cartGuard();
+  const guardError = getGuardError(guard);
+  if (guardError) {
+    return { success: false, error: guardError };
+  }
+
+  const nextQuantity = normalizeQuantity(quantity);
+
+  const customFields = packagingUnitId ? { packagingUnitId } : undefined;
+  const [result, error] = await client.mutate(
+    AddToCartMutation,
+    { variantId, quantity: nextQuantity, customFields },
+  );
+
+  if (error) {
+    return { success: false, error: 'Failed to add item to cart' };
+  }
+
+  if (result.authToken) {
+    await setAuthToken(result.authToken);
+  }
+
+  if (result.data.addItemToOrder.__typename === 'Order') {
+    updateTag('cart');
+    updateTag('active-order');
+    return {
+      success: true,
+      order: result.data.addItemToOrder,
+      requiresReapproval: guard.requiresReapproval,
+    };
+  } else {
+    const data = result.data.addItemToOrder;
+    const error = 'interceptorError' in data ? data.interceptorError : data.message;
+    return { success: false, error };
+  }
+}
+
+export interface AddGiftCardInput {
+    value: number;
+    templateId: string;
+    senderName?: string;
+    recipientEmailAddress?: string;
+    message?: string;
+    deliveryDate?: string;
+}
+
+export async function addGiftCardToCart(input: AddGiftCardInput) {
+    const guard = await cartGuard();
+    const guardError = getGuardError(guard);
+    if (guardError) {
+        return { error: guardError };
+    }
+
+    const [result, error] = await client.mutate(
+        AddGiftCardToOrderMutation,
+        {
+            input: {
+                value: input.value,
+                templateId: input.templateId,
+                senderName: input.senderName || undefined,
+                recipientEmailAddress: input.recipientEmailAddress || undefined,
+                message: input.message || undefined,
+                deliveryDate: input.deliveryDate ? new Date(input.deliveryDate).toISOString() : undefined,
+            },
+        },
+    );
+
+    if (error) {
+        console.error('[addGiftCardToCart]', error);
+        return { error: error.message || 'Failed to add gift card to cart' };
+    }
+
+    if (result.authToken) {
+        await setAuthToken(result.authToken);
+    }
+
+    if (result.data.addGiftCardToOrder.__typename !== 'Order') {
+        return { error: result.data.addGiftCardToOrder.message };
+    }
+
+    updateTag('cart');
+    updateTag('active-order');
+    return { success: true };
+}
+
+export async function evaluateConfiguration(systemId: string, values: { fieldRef: string; value: string }[]) {
+    const { getLocale } = await import('next-intl/server');
+    const locale = await getLocale();
+    const [result, error] = await client.query(EvaluateConfigurationQuery, {
+        input: { systemId, values },
+    }, { languageCode: locale });
+    if (error) {
+        return { error: error.message || 'Failed to evaluate configuration' };
+    }
+    return { data: result.data.evaluateProductConfiguration };
+}
+
+export async function addConfigurationToOrder(systemId: string, values: { fieldRef: string; value: string }[], name?: string) {
+    const guard = await cartGuard();
+    const guardError = getGuardError(guard);
+    if (guardError) {
+        return { success: false, error: guardError };
+    }
+
+    const [result, error] = await client.mutate(
+        AddConfigurationToOrderMutation,
+        { input: { systemId, values, name: name || undefined } },
+    );
+
+    if (error) {
+        return { success: false, error: error.message || 'Failed to add configuration to order' };
+    }
+
+    if (result.authToken) {
+        await setAuthToken(result.authToken);
+    }
+
+    updateTag('cart');
+    updateTag('active-order');
+    return { success: true };
+}