@vendure-platform/create 0.5.0 → 1.0.0-major.202609091053.0.0

package/dist/assets/storefront/src/app/[locale]/register-company/page.tsx

@@ -1,16 +1,16 @@
-import type {Metadata} from 'next';
-import {Suspense} from 'react';
-import {redirect} from '@/i18n/navigation';
-import {getTranslations} from 'next-intl/server';
-import {locale as rootLocale} from 'next/root-params';
-import {type Locale} from '@/i18n/routing';
-import {getActiveCustomer} from '@/lib/vendure/actions';
-import {AuthPageShell} from '@/components/layout/auth-page-shell';
-import {RegistrationForm} from './registration-form';
+import { AuthPageShell } from '@/components/layout/auth-page-shell';
+import { redirect } from '@/i18n/navigation';
+import { type Locale } from '@/i18n/routing';
+import { getActiveCustomer } from '@/lib/vendure/actions';
+import type { Metadata } from 'next';
+import { getTranslations } from 'next-intl/server';
+import { locale as rootLocale } from 'next/root-params';
+import { Suspense } from 'react';
+import { RegistrationForm } from './registration-form';
 
 export async function generateMetadata(): Promise<Metadata> {
     const locale = (await rootLocale()) as Locale;
-    const t = await getTranslations({locale, namespace: 'RegisterCompany'});
+    const t = await getTranslations({ locale, namespace: 'RegisterCompany' });
     return {
         title: t('cardTitle'),
     };
@@ -32,11 +32,13 @@ async function RegisterCompanyContent() {
 
 export default function RegisterCompanyPage() {
     return (
-        <Suspense fallback={
-            <AuthPageShell>
-                <p className="text-sm text-muted-foreground">Loading...</p>
-            </AuthPageShell>
-        }>
+        <Suspense
+            fallback={
+                <AuthPageShell>
+                    <p className="text-sm text-muted-foreground">Loading...</p>
+                </AuthPageShell>
+            }
+        >
             <RegisterCompanyContent />
         </Suspense>
     );

package/dist/assets/storefront/src/app/[locale]/register-company/registration-form.tsx

@@ -1,12 +1,12 @@
 'use client';
 
-import {useActionState} from 'react';
-import {useTranslations} from 'next-intl';
-import {registerCompanyAction} from './actions';
-import {Button} from '@/components/ui/button';
-import {Input} from '@/components/ui/input';
-import {Label} from '@/components/ui/label';
-import {Card, CardContent, CardDescription, CardHeader, CardTitle} from '@/components/ui/card';
+import { Button } from '@/components/ui/button';
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
+import { Input } from '@/components/ui/input';
+import { Label } from '@/components/ui/label';
+import { useTranslations } from 'next-intl';
+import { useActionState } from 'react';
+import { registerCompanyAction } from './actions';
 
 export function RegistrationForm() {
     const t = useTranslations('RegisterCompany');
@@ -16,9 +16,7 @@ export function RegistrationForm() {
         <Card className="w-full max-w-md">
             <CardHeader>
                 <CardTitle>{t('cardTitle')}</CardTitle>
-                <CardDescription>
-                    {t('cardDescription')}
-                </CardDescription>
+                <CardDescription>{t('cardDescription')}</CardDescription>
             </CardHeader>
             <form action={formAction}>
                 <CardContent className="space-y-4">
@@ -33,11 +31,7 @@ export function RegistrationForm() {
                             disabled={isPending}
                         />
                     </div>
-                    {state?.error && (
-                        <div className="text-sm text-destructive">
-                            {state.error}
-                        </div>
-                    )}
+                    {state?.error && <div className="text-sm text-destructive">{state.error}</div>}
                     <Button type="submit" disabled={isPending} className="w-full">
                         {isPending ? t('registeringButton') : t('registerButton')}
                     </Button>

package/dist/assets/storefront/src/app/[locale]/reset-password/actions.ts

@@ -1,9 +1,9 @@
 'use server';
 
-import {client} from '@/lib/vendure/api';
-import {ResetPasswordMutation} from '@/lib/vendure/mutations';
-import {setAuthToken} from '@/lib/auth';
-import {redirect} from '@/i18n/navigation';
+import { redirect } from '@/i18n/navigation';
+import { setAuthToken } from '@/lib/auth';
+import { client } from '@/lib/vendure/api';
+import { ResetPasswordMutation } from '@/lib/vendure/mutations';
 
 export async function resetPasswordAction(prevState: { error?: string } | undefined, formData: FormData) {
     const token = formData.get('token') as string;
@@ -11,14 +11,13 @@ export async function resetPasswordAction(prevState: { error?: string } | undefi
     const confirmPassword = formData.get('confirmPassword') as string;
 
     if (!token || !password || !confirmPassword) {
-        return {error: 'All fields are required'};
+        return { error: 'All fields are required' };
     }
 
     if (password !== confirmPassword) {
-        return {error: 'Passwords do not match'};
+        return { error: 'Passwords do not match' };
     }
 
-
     const [result, error] = await client.mutate(ResetPasswordMutation, {
         token,
         password,
@@ -28,7 +27,7 @@ export async function resetPasswordAction(prevState: { error?: string } | undefi
     const resetResult = result.data.resetPassword;
 
     if (resetResult.__typename !== 'CurrentUser') {
-        return {error: resetResult.message};
+        return { error: resetResult.message };
     }
 
     // Store the token in a cookie if returned

package/dist/assets/storefront/src/app/[locale]/reset-password/page.tsx

@@ -1,29 +1,35 @@
-import type {Metadata} from 'next';
-import { Suspense } from 'react';
+import { type Locale } from '@/i18n/routing';
 import { Loader2 } from 'lucide-react';
-import {getTranslations} from 'next-intl/server';
-import {locale as rootLocale} from 'next/root-params';
-import {type Locale} from '@/i18n/routing';
+import type { Metadata } from 'next';
+import { getTranslations } from 'next-intl/server';
+import { locale as rootLocale } from 'next/root-params';
+import { Suspense } from 'react';
 import { ResetPasswordForm } from './reset-password-form';
 
 export async function generateMetadata(): Promise<Metadata> {
     const locale = (await rootLocale()) as Locale;
-    const t = await getTranslations({locale, namespace: 'Auth'});
+    const t = await getTranslations({ locale, namespace: 'Auth' });
     return {
         title: t('resetYourPassword'),
         description: t('resetYourPasswordDescription'),
     };
 }
 
-export default function ResetPasswordPage({searchParams}: {searchParams: Promise<Record<string, string | string[] | undefined>>}) {
+export default function ResetPasswordPage({
+    searchParams,
+}: {
+    searchParams: Promise<Record<string, string | string[] | undefined>>;
+}) {
     return (
         <div className="container mx-auto px-4 py-16">
             <div className="max-w-md mx-auto">
-                <Suspense fallback={
-                    <div className="flex justify-center">
-                        <Loader2 className="h-8 w-8 animate-spin text-muted-foreground" />
-                    </div>
-                }>
+                <Suspense
+                    fallback={
+                        <div className="flex justify-center">
+                            <Loader2 className="h-8 w-8 animate-spin text-muted-foreground" />
+                        </div>
+                    }
+                >
                     <ResetPasswordForm searchParams={searchParams} />
                 </Suspense>
             </div>

package/dist/assets/storefront/src/app/[locale]/reset-password/reset-password-form.tsx

@@ -1,13 +1,13 @@
 'use client';
 
-import { use, useActionState } from 'react';
-import { useTranslations } from 'next-intl';
-import { resetPasswordAction } from './actions';
 import { Button } from '@/components/ui/button';
+import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '@/components/ui/card';
 import { Input } from '@/components/ui/input';
 import { Label } from '@/components/ui/label';
-import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '@/components/ui/card';
-import {Link} from '@/i18n/navigation';
+import { Link } from '@/i18n/navigation';
+import { useTranslations } from 'next-intl';
+import { use, useActionState } from 'react';
+import { resetPasswordAction } from './actions';
 
 interface ResetPasswordFormProps {
     searchParams: Promise<{ token?: string }>;
@@ -25,9 +25,7 @@ export function ResetPasswordForm({ searchParams }: ResetPasswordFormProps) {
             <Card>
                 <CardHeader>
                     <CardTitle>{t('invalidResetLink')}</CardTitle>
-                    <CardDescription>
-                        {t('invalidResetLinkDescription')}
-                    </CardDescription>
+                    <CardDescription>{t('invalidResetLinkDescription')}</CardDescription>
                 </CardHeader>
                 <CardFooter>
                     <Link href="/forgot-password">
@@ -44,9 +42,7 @@ export function ResetPasswordForm({ searchParams }: ResetPasswordFormProps) {
         <Card>
             <CardHeader>
                 <CardTitle>{t('resetYourPassword')}</CardTitle>
-                <CardDescription>
-                    {t('resetYourPasswordDescription')}
-                </CardDescription>
+                <CardDescription>{t('resetYourPasswordDescription')}</CardDescription>
             </CardHeader>
             <form action={formAction}>
                 <input type="hidden" name="token" value={token} />
@@ -73,11 +69,7 @@ export function ResetPasswordForm({ searchParams }: ResetPasswordFormProps) {
                             disabled={isPending}
                         />
                     </div>
-                    {state?.error && (
-                        <div className="text-sm text-destructive">
-                            {state.error}
-                        </div>
-                    )}
+                    {state?.error && <div className="text-sm text-destructive">{state.error}</div>}
                 </CardContent>
                 <CardFooter className="flex flex-col space-y-4">
                     <Button type="submit" className="w-full" disabled={isPending}>

package/dist/assets/storefront/src/app/[locale]/shopping-list/[code]/add-to-cart-button.tsx

@@ -1,13 +1,19 @@
 'use client';
 
-import { useTransition } from 'react';
-import { useTranslations } from 'next-intl';
+import { addToCart } from '@/app/[locale]/(catalog)/product/[slug]/actions';
 import { Button } from '@/components/ui/button';
 import { ShoppingCart } from 'lucide-react';
-import { addToCart } from '@/app/[locale]/(catalog)/product/[slug]/actions';
+import { useTranslations } from 'next-intl';
+import { useTransition } from 'react';
 import { toast } from 'sonner';
 
-export function PublicShoppingListAddToCart({ variantId, outOfStock }: { variantId: string; outOfStock?: boolean }) {
+export function PublicShoppingListAddToCart({
+    variantId,
+    outOfStock,
+}: {
+    variantId: string;
+    outOfStock?: boolean;
+}) {
     const t = useTranslations('SharedShoppingList');
     const [isPending, startTransition] = useTransition();
 

package/dist/assets/storefront/src/app/[locale]/shopping-list/[code]/page.tsx

@@ -1,24 +1,26 @@
-import type { Metadata } from 'next';
-import { Suspense } from 'react';
-import { getTranslations } from 'next-intl/server';
-import { locale as rootLocale } from 'next/root-params';
-import type { Locale } from '@/i18n/routing';
 import { getPublicShoppingList } from '@/app/[locale]/account/shopping-lists/actions';
-import Image from 'next/image';
-import {Link} from '@/i18n/navigation';
 import { Price } from '@/components/commerce/price';
 import { Badge } from '@/components/ui/badge';
 import { Button } from '@/components/ui/button';
-import { SITE_NAME, buildCanonicalUrl, buildAlternates } from '@/lib/metadata';
-import { getActiveChannelCached } from '@/lib/vendure/cached';
+import { Link } from '@/i18n/navigation';
+import type { Locale } from '@/i18n/routing';
 import { getActiveChannelToken } from '@/lib/channel-server';
+import { SITE_NAME, buildAlternates, buildCanonicalUrl } from '@/lib/metadata';
+import { getActiveChannelCached } from '@/lib/vendure/cached';
+import type { Metadata } from 'next';
+import { getTranslations } from 'next-intl/server';
+import Image from 'next/image';
+import { locale as rootLocale } from 'next/root-params';
+import { Suspense } from 'react';
 import { PublicShoppingListAddToCart } from './add-to-cart-button';
 
 export async function generateMetadata({
     params,
-}: { params: Promise<{ locale: string; code: string }> }): Promise<Metadata> {
+}: {
+    params: Promise<{ locale: string; code: string }>;
+}): Promise<Metadata> {
     const locale = (await rootLocale()) as Locale;
-    const t = await getTranslations({locale, namespace: 'SharedShoppingList'});
+    const t = await getTranslations({ locale, namespace: 'SharedShoppingList' });
     const { code } = await params;
     const shoppingList = await getPublicShoppingList(code);
 
@@ -27,7 +29,9 @@ export async function generateMetadata({
     }
 
     const title = `${shoppingList.name} - ${t('sharedSuffix')}`;
-    const description = shoppingList.description || t('itemsSharedOn', {count: shoppingList.totalItems, siteName: SITE_NAME});
+    const description =
+        shoppingList.description ||
+        t('itemsSharedOn', { count: shoppingList.totalItems, siteName: SITE_NAME });
     const listPath = `/shopping-list/${code}`;
 
     return {
@@ -43,9 +47,19 @@ export async function generateMetadata({
     };
 }
 
-export default async function PublicShoppingListPage({ params }: { params: Promise<{ locale: string; code: string }> }) {
+export default async function PublicShoppingListPage({
+    params,
+}: {
+    params: Promise<{ locale: string; code: string }>;
+}) {
     return (
-        <Suspense fallback={<div className="container mx-auto px-4 py-30"><p className="text-sm text-muted-foreground">Loading...</p></div>}>
+        <Suspense
+            fallback={
+                <div className="container mx-auto px-4 py-30">
+                    <p className="text-sm text-muted-foreground">Loading...</p>
+                </div>
+            }
+        >
             <PublicShoppingListContent params={params} />
         </Suspense>
     );
@@ -66,9 +80,7 @@ async function PublicShoppingListContent({ params }: { params: Promise<{ locale:
             <div className="container mx-auto px-4 py-30">
                 <div className="max-w-3xl mx-auto text-center space-y-4">
                     <h1 className="text-3xl font-bold">{t('notFoundTitle')}</h1>
-                    <p className="text-muted-foreground">
-                        {t('notFoundMessage')}
-                    </p>
+                    <p className="text-muted-foreground">{t('notFoundMessage')}</p>
                     <Button asChild variant="outline">
                         <Link href="/">{t('browseProducts')}</Link>
                     </Button>
@@ -88,7 +100,7 @@ async function PublicShoppingListContent({ params }: { params: Promise<{ locale:
                         <p className="text-muted-foreground mt-2">{shoppingList.description}</p>
                     )}
                     <p className="text-sm text-muted-foreground mt-1">
-                        {t('itemCount', {count: shoppingList.totalItems})}
+                        {t('itemCount', { count: shoppingList.totalItems })}
                     </p>
                 </div>
 
@@ -99,14 +111,17 @@ async function PublicShoppingListContent({ params }: { params: Promise<{ locale:
                 ) : (
                     <div className="space-y-4">
                         {items.map((item) => (
-                            <div
-                                key={item.id}
-                                className="flex items-center gap-4 border rounded-lg p-4"
-                            >
-                                <Link href={`/product/${item.productVariant.product.slug}`} className="shrink-0">
+                            <div key={item.id} className="flex items-center gap-4 border rounded-lg p-4">
+                                <Link
+                                    href={`/product/${item.productVariant.product.slug}`}
+                                    className="shrink-0"
+                                >
                                     {item.productVariant.product.featuredAsset ? (
                                         <Image
-                                            src={item.productVariant.product.featuredAsset.preview + '?preset=thumb'}
+                                            src={
+                                                item.productVariant.product.featuredAsset.preview +
+                                                '?preset=thumb'
+                                            }
                                             alt={item.productVariant.product.name}
                                             width={80}
                                             height={80}
@@ -124,11 +139,18 @@ async function PublicShoppingListContent({ params }: { params: Promise<{ locale:
                                     >
                                         {item.productVariant.product.name}
                                     </Link>
-                                    <p className="text-sm text-muted-foreground">{item.productVariant.name}</p>
+                                    <p className="text-sm text-muted-foreground">
+                                        {item.productVariant.name}
+                                    </p>
                                     <div className="flex items-center gap-2 mt-1">
-                                        <Price value={item.productVariant.priceWithTax} currencyCode={currencyCode} />
+                                        <Price
+                                            value={item.productVariant.priceWithTax}
+                                            currencyCode={currencyCode}
+                                        />
                                         {item.quantity > 1 && (
-                                            <span className="text-sm text-muted-foreground">x{item.quantity}</span>
+                                            <span className="text-sm text-muted-foreground">
+                                                x{item.quantity}
+                                            </span>
                                         )}
                                         {item.purchased && (
                                             <Badge variant="secondary">{t('purchasedBadge')}</Badge>
@@ -136,16 +158,26 @@ async function PublicShoppingListContent({ params }: { params: Promise<{ locale:
                                         {item.productVariant.stockLevel === 'OUT_OF_STOCK' ? (
                                             <Badge variant="destructive">{t('outOfStockBadge')}</Badge>
                                         ) : (
-                                            <Badge variant="outline" className="text-green-600 border-green-600">{t('inStockBadge')}</Badge>
+                                            <Badge
+                                                variant="outline"
+                                                className="text-green-600 border-green-600"
+                                            >
+                                                {t('inStockBadge')}
+                                            </Badge>
                                         )}
                                     </div>
                                     {item.note && (
-                                        <p className="text-sm text-muted-foreground mt-1 italic">{item.note}</p>
+                                        <p className="text-sm text-muted-foreground mt-1 italic">
+                                            {item.note}
+                                        </p>
                                     )}
                                 </div>
 
                                 <div className="shrink-0">
-                                    <PublicShoppingListAddToCart variantId={item.productVariant.id} outOfStock={item.productVariant.stockLevel === 'OUT_OF_STOCK'} />
+                                    <PublicShoppingListAddToCart
+                                        variantId={item.productVariant.id}
+                                        outOfStock={item.productVariant.stockLevel === 'OUT_OF_STOCK'}
+                                    />
                                 </div>
                             </div>
                         ))}

package/dist/assets/storefront/src/app/[locale]/sign-in/actions.ts

@@ -1,14 +1,14 @@
 'use server';
 
-import {client} from '@/lib/vendure/api';
-import {LoginMutation, LogoutMutation} from '@/lib/vendure/mutations';
-import {GetCompanyAccountQuery} from '@/lib/vendure/queries';
-import {removeAuthToken, setAuthToken} from '@/lib/auth';
-import {setCompanyId, setBusinessUnitId, clearCompanyContext} from '@/lib/company-context';
-import {readFragment} from '@/graphql';
-import {CompanyFragment, CompanyBusinessUnitFragment} from '@/lib/vendure/fragments';
-import {revalidatePath, revalidateTag} from "next/cache";
-import {redirect} from "@/i18n/navigation";
+import { readFragment } from '@/graphql';
+import { redirect } from '@/i18n/navigation';
+import { removeAuthToken, setAuthToken } from '@/lib/auth';
+import { clearCompanyContext, setBusinessUnitId, setCompanyId } from '@/lib/company-context';
+import { client } from '@/lib/vendure/api';
+import { CompanyBusinessUnitFragment, CompanyFragment } from '@/lib/vendure/fragments';
+import { LoginMutation, LogoutMutation } from '@/lib/vendure/mutations';
+import { GetCompanyAccountQuery } from '@/lib/vendure/queries';
+import { revalidatePath, revalidateTag } from 'next/cache';
 
 export async function loginAction(prevState: { error?: string } | undefined, formData: FormData) {
     const username = formData.get('username') as string;
@@ -52,13 +52,11 @@ export async function loginAction(prevState: { error?: string } | undefined, for
     }
     // Company context is optional — don't block login if it fails
 
-    revalidateTag('active-customer', {expire: 0});
+    revalidateTag('active-customer', { expire: 0 });
     revalidatePath('/', 'layout');
 
     // Validate redirectTo is a safe internal path
-    const safeRedirect = redirectTo?.startsWith('/') && !redirectTo.startsWith('//')
-        ? redirectTo
-        : '/';
+    const safeRedirect = redirectTo?.startsWith('/') && !redirectTo.startsWith('//') ? redirectTo : '/';
 
     await redirect(safeRedirect);
 }
@@ -67,9 +65,9 @@ export async function logoutAction() {
     await client.mutate(LogoutMutation);
     await removeAuthToken();
     await clearCompanyContext();
-    revalidateTag('active-customer', {expire: 0});
-    revalidateTag('cart', {expire: 0});
-    revalidateTag('active-order', {expire: 0});
+    revalidateTag('active-customer', { expire: 0 });
+    revalidateTag('cart', { expire: 0 });
+    revalidateTag('active-order', { expire: 0 });
     revalidatePath('/', 'layout');
 
     return { redirectTo: '/' };

package/dist/assets/storefront/src/app/[locale]/sign-in/login-form.tsx

@@ -1,23 +1,16 @@
 'use client';
 
-import {useState, useTransition} from 'react';
-import {useForm} from 'react-hook-form';
-import {zodResolver} from '@hookform/resolvers/zod';
+import { Button } from '@/components/ui/button';
+import { Card, CardContent, CardFooter } from '@/components/ui/card';
+import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from '@/components/ui/form';
+import { Input } from '@/components/ui/input';
+import { Link } from '@/i18n/navigation';
+import { zodResolver } from '@hookform/resolvers/zod';
+import { useTranslations } from 'next-intl';
+import { useState, useTransition } from 'react';
+import { useForm } from 'react-hook-form';
 import * as z from 'zod';
-import {useTranslations} from 'next-intl';
-import {loginAction} from './actions';
-import {Button} from '@/components/ui/button';
-import {Input} from '@/components/ui/input';
-import {Card, CardContent, CardFooter} from '@/components/ui/card';
-import {
-    Form,
-    FormControl,
-    FormField,
-    FormItem,
-    FormLabel,
-    FormMessage,
-} from '@/components/ui/form';
-import {Link} from '@/i18n/navigation';
+import { loginAction } from './actions';
 
 function useLoginSchema() {
     const t = useTranslations('Auth');
@@ -33,7 +26,7 @@ interface LoginFormProps {
     redirectTo?: string;
 }
 
-export function LoginForm({redirectTo}: LoginFormProps) {
+export function LoginForm({ redirectTo }: LoginFormProps) {
     const t = useTranslations('Auth');
     const [isPending, startTransition] = useTransition();
     const [serverError, setServerError] = useState<string | null>(null);
@@ -65,9 +58,7 @@ export function LoginForm({redirectTo}: LoginFormProps) {
         });
     };
 
-    const registerHref = redirectTo
-        ? `/register?redirectTo=${encodeURIComponent(redirectTo)}`
-        : '/register';
+    const registerHref = redirectTo ? `/register?redirectTo=${encodeURIComponent(redirectTo)}` : '/register';
 
     return (
         <Card>
@@ -77,7 +68,7 @@ export function LoginForm({redirectTo}: LoginFormProps) {
                         <FormField
                             control={form.control}
                             name="username"
-                            render={({field}) => (
+                            render={({ field }) => (
                                 <FormItem>
                                     <FormLabel>{t('email')}</FormLabel>
                                     <FormControl>
@@ -88,7 +79,7 @@ export function LoginForm({redirectTo}: LoginFormProps) {
                                             {...field}
                                         />
                                     </FormControl>
-                                    <FormMessage/>
+                                    <FormMessage />
                                 </FormItem>
                             )}
                         />
@@ -96,7 +87,7 @@ export function LoginForm({redirectTo}: LoginFormProps) {
                         <FormField
                             control={form.control}
                             name="password"
-                            render={({field}) => (
+                            render={({ field }) => (
                                 <FormItem>
                                     <div className="flex items-center justify-between">
                                         <FormLabel>{t('password')}</FormLabel>
@@ -116,16 +107,12 @@ export function LoginForm({redirectTo}: LoginFormProps) {
                                             {...field}
                                         />
                                     </FormControl>
-                                    <FormMessage/>
+                                    <FormMessage />
                                 </FormItem>
                             )}
                         />
 
-                        {serverError && (
-                            <div className="text-sm text-destructive">
-                                {serverError}
-                            </div>
-                        )}
+                        {serverError && <div className="text-sm text-destructive">{serverError}</div>}
                         <Button type="submit" className="w-full" disabled={isPending}>
                             {isPending ? t('signingIn') : t('signIn')}
                         </Button>