@vendure-platform/create 0.5.0 → 0.5.1

package/dist/assets/storefront/src/app/[locale]/order-confirmation/[code]/order-confirmation.tsx

@@ -1,16 +1,16 @@
-import {client} from '@/lib/vendure/api';
-import {graphql} from '@/graphql';
-import {getLatestApprovalForOrder} from '@/lib/vendure/approval-utils';
-import {Button} from '@/components/ui/button';
-import {Card, CardContent, CardHeader, CardTitle} from '@/components/ui/card';
-import {CheckCircle2, Clock, XCircle, MessageSquare} from 'lucide-react';
-import {Link} from '@/i18n/navigation';
+import { Price } from '@/components/commerce/price';
+import { Button } from '@/components/ui/button';
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
+import { Separator } from '@/components/ui/separator';
+import { graphql } from '@/graphql';
+import { Link } from '@/i18n/navigation';
+import { maskCode } from '@/lib/format';
+import { client } from '@/lib/vendure/api';
+import { getLatestApprovalForOrder } from '@/lib/vendure/approval-utils';
+import { CheckCircle2, Clock, MessageSquare, XCircle } from 'lucide-react';
+import { getTranslations } from 'next-intl/server';
 import Image from 'next/image';
-import {Separator} from '@/components/ui/separator';
-import {Price} from '@/components/commerce/price';
-import {maskCode} from '@/lib/format';
-import {notFound} from "next/navigation";
-import {getTranslations} from 'next-intl/server';
+import { notFound } from 'next/navigation';
 
 const GetOrderByCodeQuery = graphql(`
     query GetOrderByCode($code: String!) {
@@ -70,17 +70,17 @@ const GetOrderByCodeQuery = graphql(`
     }
 `);
 
-export async function OrderConfirmation({params}: {params: Promise<{locale: string; code: string}>}) {
-    const {code} = await params;
+export async function OrderConfirmation({ params }: { params: Promise<{ locale: string; code: string }> }) {
+    const { code } = await params;
     const t = await getTranslations('OrderConfirmation');
-    const [result, queryError] = await client.query(GetOrderByCodeQuery, {code});
+    const [result, queryError] = await client.query(GetOrderByCodeQuery, { code });
     if (queryError) {
         notFound();
     }
     const order = result.data.orderByCode;
 
     if (!order) {
-       notFound();
+        notFound();
     }
 
     const taxTotal = order.totalWithTax - order.total;
@@ -99,10 +99,11 @@ export async function OrderConfirmation({params}: {params: Promise<{locale: stri
                 <div className="text-center mb-8">
                     {isRejected ? (
                         <>
-                            <XCircle className="h-16 w-16 text-red-500 mx-auto mb-4"/>
+                            <XCircle className="h-16 w-16 text-red-500 mx-auto mb-4" />
                             <h1 className="text-3xl font-bold mb-2">Order Rejected</h1>
                             <p className="text-muted-foreground">
-                                Your order <span className="font-semibold">{order.code}</span> was not approved.
+                                Your order <span className="font-semibold">{order.code}</span> was not
+                                approved.
                             </p>
                             <div className="mt-4 flex gap-3 justify-center">
                                 <Button variant="outline" asChild>
@@ -115,7 +116,7 @@ export async function OrderConfirmation({params}: {params: Promise<{locale: stri
                         </>
                     ) : isChangesRequested ? (
                         <>
-                            <MessageSquare className="h-16 w-16 text-orange-500 mx-auto mb-4"/>
+                            <MessageSquare className="h-16 w-16 text-orange-500 mx-auto mb-4" />
                             <h1 className="text-3xl font-bold mb-2">Changes Requested</h1>
                             <p className="text-muted-foreground">
                                 A reviewer has requested changes to your order{' '}
@@ -134,11 +135,12 @@ export async function OrderConfirmation({params}: {params: Promise<{locale: stri
                         </>
                     ) : isAwaitingApproval ? (
                         <>
-                            <Clock className="h-16 w-16 text-amber-500 mx-auto mb-4"/>
+                            <Clock className="h-16 w-16 text-amber-500 mx-auto mb-4" />
                             <h1 className="text-3xl font-bold mb-2">Order Submitted for Approval</h1>
                             <p className="text-muted-foreground">
                                 Your order <span className="font-semibold">{order.code}</span> has been
-                                submitted and is awaiting approval. You&apos;ll be notified once a decision is made.
+                                submitted and is awaiting approval. You&apos;ll be notified once a decision is
+                                made.
                             </p>
                             <div className="mt-4">
                                 <Button variant="outline" asChild>
@@ -148,11 +150,10 @@ export async function OrderConfirmation({params}: {params: Promise<{locale: stri
                         </>
                     ) : (
                         <>
-                            <CheckCircle2 className="h-16 w-16 text-green-500 mx-auto mb-4"/>
+                            <CheckCircle2 className="h-16 w-16 text-green-500 mx-auto mb-4" />
                             <h1 className="text-3xl font-bold mb-2">{t('orderConfirmed')}</h1>
                             <p className="text-muted-foreground">
-                                {t('thankYou')}{' '}
-                                <span className="font-semibold">{order.code}</span>
+                                {t('thankYou')} <span className="font-semibold">{order.code}</span>
                             </p>
                         </>
                     )}
@@ -190,44 +191,58 @@ export async function OrderConfirmation({params}: {params: Promise<{locale: stri
                                 </div>
                                 <div className="text-right w-24">
                                     <p className="font-semibold">
-                                        <Price value={line.linePrice} currencyCode={order.currencyCode}/>
+                                        <Price value={line.linePrice} currencyCode={order.currencyCode} />
                                     </p>
                                 </div>
                             </div>
                         ))}
 
-                        <Separator/>
+                        <Separator />
 
                         <div className="space-y-2">
                             <div className="flex justify-between text-sm">
-                                <span className="text-muted-foreground">Subtotal <span className="text-[10px]">(excl. tax)</span></span>
+                                <span className="text-muted-foreground">
+                                    Subtotal <span className="text-[10px]">(excl. tax)</span>
+                                </span>
                                 <span>
-                                    <Price value={order.subTotal} currencyCode={order.currencyCode}/>
+                                    <Price value={order.subTotal} currencyCode={order.currencyCode} />
                                 </span>
                             </div>
                             <div className="flex justify-between text-sm">
                                 <span className="text-muted-foreground">Shipping</span>
                                 <span>
-                                    {order.shipping > 0
-                                        ? <Price value={order.shipping} currencyCode={order.currencyCode}/>
-                                        : 'FREE'}
+                                    {order.shipping > 0 ? (
+                                        <Price value={order.shipping} currencyCode={order.currencyCode} />
+                                    ) : (
+                                        'FREE'
+                                    )}
                                 </span>
                             </div>
                             <div className="flex justify-between text-sm">
                                 <span className="text-muted-foreground">Tax</span>
                                 <span>
-                                    <Price value={taxTotal} currencyCode={order.currencyCode}/>
+                                    <Price value={taxTotal} currencyCode={order.currencyCode} />
                                 </span>
                             </div>
-                            {hasCreditsApplied && order.storeCreditsApplied.map((credit) => (
-                                <div key={credit.code} className="flex justify-between text-sm text-green-600">
-                                    <span>Store Credit ({maskCode(credit.code)})</span>
-                                    <span>-<Price value={credit.amountDeducted} currencyCode={order.currencyCode}/></span>
-                                </div>
-                            ))}
+                            {hasCreditsApplied &&
+                                order.storeCreditsApplied.map((credit) => (
+                                    <div
+                                        key={credit.code}
+                                        className="flex justify-between text-sm text-green-600"
+                                    >
+                                        <span>Store Credit ({maskCode(credit.code)})</span>
+                                        <span>
+                                            -
+                                            <Price
+                                                value={credit.amountDeducted}
+                                                currencyCode={order.currencyCode}
+                                            />
+                                        </span>
+                                    </div>
+                                ))}
                         </div>
 
-                        <Separator/>
+                        <Separator />
 
                         <div>
                             <div className="flex justify-between font-bold text-lg">
@@ -236,12 +251,23 @@ export async function OrderConfirmation({params}: {params: Promise<{locale: stri
                                     {hasCreditsApplied ? (
                                         <span className="flex items-center gap-2">
                                             <span className="text-sm font-normal text-muted-foreground line-through">
-                                                <Price value={order.totalWithTax} currencyCode={order.currencyCode}/>
+                                                <Price
+                                                    value={order.totalWithTax}
+                                                    currencyCode={order.currencyCode}
+                                                />
                                             </span>
-                                            <Price value={order.totalWithTaxAfterStoreCredit} currencyCode={order.currencyCode} taxLabel="incl" />
+                                            <Price
+                                                value={order.totalWithTaxAfterStoreCredit}
+                                                currencyCode={order.currencyCode}
+                                                taxLabel="incl"
+                                            />
                                         </span>
                                     ) : (
-                                        <Price value={order.totalWithTax} currencyCode={order.currencyCode} taxLabel="incl" />
+                                        <Price
+                                            value={order.totalWithTax}
+                                            currencyCode={order.currencyCode}
+                                            taxLabel="incl"
+                                        />
                                     )}
                                 </span>
                             </div>
@@ -258,7 +284,7 @@ export async function OrderConfirmation({params}: {params: Promise<{locale: stri
                             {order.payments.map((payment) => (
                                 <div key={payment.id} className="flex justify-between text-sm">
                                     <span className="text-muted-foreground capitalize">{payment.method}</span>
-                                    <Price value={payment.amount} currencyCode={order.currencyCode}/>
+                                    <Price value={payment.amount} currencyCode={order.currencyCode} />
                                 </div>
                             ))}
                         </CardContent>
@@ -274,7 +300,8 @@ export async function OrderConfirmation({params}: {params: Promise<{locale: stri
                             <p className="font-medium">{order.shippingAddress.fullName}</p>
                             <p className="text-sm text-muted-foreground mt-1">
                                 {order.shippingAddress.streetLine1}
-                                {order.shippingAddress.streetLine2 && `, ${order.shippingAddress.streetLine2}`}
+                                {order.shippingAddress.streetLine2 &&
+                                    `, ${order.shippingAddress.streetLine2}`}
                             </p>
                             <p className="text-sm text-muted-foreground">
                                 {order.shippingAddress.city}, {order.shippingAddress.province}{' '}

package/dist/assets/storefront/src/app/[locale]/order-confirmation/[code]/page.tsx

@@ -1,7 +1,7 @@
-import type {Metadata} from 'next';
-import {Suspense} from 'react';
-import {OrderConfirmation} from './order-confirmation';
-import {noIndexRobots} from '@/lib/metadata';
+import { noIndexRobots } from '@/lib/metadata';
+import type { Metadata } from 'next';
+import { Suspense } from 'react';
+import { OrderConfirmation } from './order-confirmation';
 
 export const metadata: Metadata = {
     title: 'Order Confirmation',
@@ -9,7 +9,9 @@ export const metadata: Metadata = {
     robots: noIndexRobots(),
 };
 
-export default async function OrderConfirmationPage(props: {params: Promise<{locale: string; code: string}>}) {
+export default async function OrderConfirmationPage(props: {
+    params: Promise<{ locale: string; code: string }>;
+}) {
     return (
         <Suspense fallback={<div className="container mx-auto px-4 py-16 text-center">Loading...</div>}>
             <OrderConfirmation {...props} />

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

@@ -1,17 +1,17 @@
-import type { Metadata } from 'next';
-import { Suspense } from 'react';
-import { SITE_NAME, SITE_URL, buildCanonicalUrl } from '@/lib/metadata';
-import { getTopCollections } from '@/lib/vendure/cached';
-import { getActiveChannelToken } from '@/lib/channel-server';
-import { setRequestLocale } from 'next-intl/server';
 import { CatalogSearchBar } from '@/components/commerce/catalog-search-bar';
-import { CategorySidebar } from '@/components/commerce/category-sidebar';
 import { CategoryProductSection } from '@/components/commerce/category-product-section';
+import { CategorySidebar } from '@/components/commerce/category-sidebar';
 import { ShopByCategory } from '@/components/commerce/shop-by-category';
 import { CatalogSidebarSkeleton } from '@/components/shared/catalog-sidebar-skeleton';
 import { getBranding } from '@/config/branding';
+import type { HomeSlotOverrides, ServerComponent } from '@/config/scenario';
 import { getScenarioConfig, isFullPageOverride } from '@/config/scenario';
-import type { ServerComponent, HomeSlotOverrides } from '@/config/scenario';
+import { getActiveChannelToken } from '@/lib/channel-server';
+import { SITE_NAME, SITE_URL, buildCanonicalUrl } from '@/lib/metadata';
+import { getTopCollections } from '@/lib/vendure/cached';
+import type { Metadata } from 'next';
+import { setRequestLocale } from 'next-intl/server';
+import { Suspense } from 'react';
 
 const _branding = getBranding();
 
@@ -55,8 +55,8 @@ function CategorySectionSkeleton() {
     );
 }
 
-export default async function Home({params}: {params: Promise<{locale: string}>}) {
-    const {locale} = await params;
+export default async function Home({ params }: { params: Promise<{ locale: string }> }) {
+    const { locale } = await params;
     setRequestLocale(locale);
     const channelToken = await getActiveChannelToken();
     const collections = await getTopCollections(locale, channelToken);
@@ -76,9 +76,7 @@ export default async function Home({params}: {params: Promise<{locale: string}>}
     // collection carries a featuredAsset — avoids mixed rows of real imagery
     // and fallback icons during partial populate (see EE-73 plan concern #11).
     const showBaseShopByCategory =
-        !ShopByCategoryComponent &&
-        collections.length > 0 &&
-        collections.every((c) => !!c.featuredAsset);
+        !ShopByCategoryComponent && collections.length > 0 && collections.every((c) => !!c.featuredAsset);
 
     return (
         // No wrapper padding-top here — the hero is full-bleed and absorbs
@@ -95,31 +93,31 @@ export default async function Home({params}: {params: Promise<{locale: string}>}
                 </section>
             ) : null}
             <div className="container mx-auto px-4 pt-8">
-            <div className="grid grid-cols-1 lg:grid-cols-4 gap-8 pb-8">
-                <aside className="lg:col-span-1">
-                    <Suspense fallback={<CatalogSidebarSkeleton />}>
-                        <CategorySidebar collections={collections} />
-                    </Suspense>
-                </aside>
-                <div className="lg:col-span-3">
-                    <Suspense>
-                        <CatalogSearchBar />
-                    </Suspense>
-                    <div className="mt-6 space-y-12">
-                        {collections.map((collection) => (
-                            <Suspense key={collection.id} fallback={<CategorySectionSkeleton />}>
-                                <CategoryProductSection
-                                    name={collection.name}
-                                    slug={collection.slug}
-                                    locale={locale}
-                                    channelToken={channelToken}
-                                />
-                            </Suspense>
-                        ))}
+                <div className="grid grid-cols-1 lg:grid-cols-4 gap-8 pb-8">
+                    <aside className="lg:col-span-1">
+                        <Suspense fallback={<CatalogSidebarSkeleton />}>
+                            <CategorySidebar collections={collections} />
+                        </Suspense>
+                    </aside>
+                    <div className="lg:col-span-3">
+                        <Suspense>
+                            <CatalogSearchBar />
+                        </Suspense>
+                        <div className="mt-6 space-y-12">
+                            {collections.map((collection) => (
+                                <Suspense key={collection.id} fallback={<CategorySectionSkeleton />}>
+                                    <CategoryProductSection
+                                        name={collection.name}
+                                        slug={collection.slug}
+                                        locale={locale}
+                                        channelToken={channelToken}
+                                    />
+                                </Suspense>
+                            ))}
+                        </div>
                     </div>
                 </div>
             </div>
-            </div>
         </div>
     );
 }

package/dist/assets/storefront/src/app/[locale]/register/actions.ts

@@ -1,9 +1,9 @@
 'use server';
 
-import {client} from '@/lib/vendure/api';
-import {RegisterCustomerAccountMutation} from '@/lib/vendure/mutations';
-import {cookies} from 'next/headers';
-import {redirect} from '@/i18n/navigation';
+import { redirect } from '@/i18n/navigation';
+import { client } from '@/lib/vendure/api';
+import { RegisterCustomerAccountMutation } from '@/lib/vendure/mutations';
+import { cookies } from 'next/headers';
 
 export async function registerAction(prevState: { error?: string } | undefined, formData: FormData) {
     const emailAddress = formData.get('emailAddress') as string;
@@ -14,7 +14,7 @@ export async function registerAction(prevState: { error?: string } | undefined,
     const redirectTo = formData.get('redirectTo') as string | null;
 
     if (!emailAddress || !password) {
-        return {error: 'Email address and password are required'};
+        return { error: 'Email address and password are required' };
     }
 
     const [result, error] = await client.mutate(RegisterCustomerAccountMutation, {
@@ -24,14 +24,14 @@ export async function registerAction(prevState: { error?: string } | undefined,
             lastName: lastName || undefined,
             phoneNumber: phoneNumber || undefined,
             password,
-        }
+        },
     });
     if (error) throw error;
 
     const registerResult = result.data.registerCustomerAccount;
 
     if (registerResult.__typename !== 'Success') {
-        return {error: registerResult.message};
+        return { error: registerResult.message };
     }
 
     // Two mechanisms preserve redirectTo through the email verification round-trip:

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

@@ -1,16 +1,16 @@
-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 { RegistrationForm } from "./registration-form";
-import { Card, CardContent, CardFooter } from "@/components/ui/card";
-import { Skeleton } from "@/components/ui/skeleton";
-import { AuthPageShell } from "@/components/layout/auth-page-shell";
+import { AuthPageShell } from '@/components/layout/auth-page-shell';
+import { Card, CardContent, CardFooter } from '@/components/ui/card';
+import { Skeleton } from '@/components/ui/skeleton';
+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 { RegistrationForm } from './registration-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('createAccount'),
         description: t('joinUs'),
@@ -56,23 +56,29 @@ function RegistrationFormSkeleton() {
     );
 }
 
-async function RegisterContent({searchParams}: {searchParams: Promise<Record<string, string | string[] | undefined>>}) {
+async function RegisterContent({
+    searchParams,
+}: {
+    searchParams: Promise<Record<string, string | string[] | undefined>>;
+}) {
     const resolvedParams = await searchParams;
     const redirectTo = resolvedParams?.redirectTo as string | undefined;
 
     return <RegistrationForm redirectTo={redirectTo} />;
 }
 
-export default async function RegisterPage({searchParams}: {searchParams: Promise<Record<string, string | string[] | undefined>>}) {
+export default async function RegisterPage({
+    searchParams,
+}: {
+    searchParams: Promise<Record<string, string | string[] | undefined>>;
+}) {
     const locale = (await rootLocale()) as Locale;
-    const t = await getTranslations({locale, namespace: 'Auth'});
+    const t = await getTranslations({ locale, namespace: 'Auth' });
     return (
         <AuthPageShell>
             <div className="space-y-2 text-center">
                 <h1 className="text-3xl font-bold">{t('createAccount')}</h1>
-                <p className="text-muted-foreground">
-                    {t('signUpMessage')}
-                </p>
+                <p className="text-muted-foreground">{t('signUpMessage')}</p>
             </div>
             <Suspense fallback={<RegistrationFormSkeleton />}>
                 <RegisterContent searchParams={searchParams} />

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

@@ -1,37 +1,32 @@
 'use client';
 
+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 { zodResolver } from '@hookform/resolvers/zod';
 import * as z from 'zod';
-import { useTranslations } from 'next-intl';
 import { registerAction } 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';
 
 function useRegistrationSchema() {
     const t = useTranslations('Auth');
-    return z.object({
-        emailAddress: z.string().email('Please enter a valid email address'),
-        firstName: z.string().optional(),
-        lastName: z.string().optional(),
-        phoneNumber: z.string().optional(),
-        password: z.string().min(8, t('passwordMinLength')),
-        confirmPassword: z.string(),
-    }).refine((data) => data.password === data.confirmPassword, {
-        message: t('passwordsMismatch'),
-        path: ["confirmPassword"],
-    });
+    return z
+        .object({
+            emailAddress: z.string().email('Please enter a valid email address'),
+            firstName: z.string().optional(),
+            lastName: z.string().optional(),
+            phoneNumber: z.string().optional(),
+            password: z.string().min(8, t('passwordMinLength')),
+            confirmPassword: z.string(),
+        })
+        .refine((data) => data.password === data.confirmPassword, {
+            message: t('passwordsMismatch'),
+            path: ['confirmPassword'],
+        });
 }
 
 type RegistrationFormData = {
@@ -86,9 +81,7 @@ export function RegistrationForm({ redirectTo }: RegistrationFormProps) {
         });
     };
 
-    const signInHref = redirectTo
-        ? `/sign-in?redirectTo=${encodeURIComponent(redirectTo)}`
-        : '/sign-in';
+    const signInHref = redirectTo ? `/sign-in?redirectTo=${encodeURIComponent(redirectTo)}` : '/sign-in';
 
     return (
         <Card>
@@ -211,18 +204,13 @@ export function RegistrationForm({ redirectTo }: RegistrationFormProps) {
                             )}
                         />
 
-                        {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('creatingAccount') : t('createAccount')}
                         </Button>
                     </CardContent>
                     <CardFooter className="flex flex-col space-y-4 mt-4">
-
                         <div className="text-sm text-center text-muted-foreground">
                             {t('alreadyHaveAccount')}{' '}
                             <Link href={signInHref} className="hover:text-primary underline">

package/dist/assets/storefront/src/app/[locale]/register-company/actions.ts

@@ -1,35 +1,31 @@
 'use server';
 
-import {readFragment} from '@/graphql';
-import {client} from '@/lib/vendure/api';
-import {RegisterCompanyMutation} from '@/lib/vendure/mutations';
-import {CompanyFragment} from '@/lib/vendure/fragments';
-import {setCompanyId} from '@/lib/company-context';
-import {redirect} from '@/i18n/navigation';
-import {revalidatePath} from 'next/cache';
-
-export async function registerCompanyAction(
-    prevState: { error?: string } | undefined,
-    formData: FormData,
-) {
+import { readFragment } from '@/graphql';
+import { redirect } from '@/i18n/navigation';
+import { setCompanyId } from '@/lib/company-context';
+import { client } from '@/lib/vendure/api';
+import { CompanyFragment } from '@/lib/vendure/fragments';
+import { RegisterCompanyMutation } from '@/lib/vendure/mutations';
+import { revalidatePath } from 'next/cache';
+
+export async function registerCompanyAction(prevState: { error?: string } | undefined, formData: FormData) {
     const companyName = formData.get('companyName') as string;
 
     if (!companyName?.trim()) {
-        return {error: 'Company name is required'};
+        return { error: 'Company name is required' };
     }
 
-    const [result, error] = await client.mutate(
-        RegisterCompanyMutation,
-        {input: {companyName: companyName.trim()}},
-    );
+    const [result, error] = await client.mutate(RegisterCompanyMutation, {
+        input: { companyName: companyName.trim() },
+    });
 
     if (error) {
-        return {error: 'An unexpected error occurred. Please try again.'};
+        return { error: 'An unexpected error occurred. Please try again.' };
     }
 
     const companyAccount = result.data.registerCompany;
     if (!companyAccount?.company) {
-        return {error: 'Failed to register company'};
+        return { error: 'Failed to register company' };
     }
 
     const company = readFragment(CompanyFragment, companyAccount.company);

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>
     );