@vendure-platform/create 0.4.0 → 0.5.1

package/dist/assets/storefront/src/app/[locale]/account/shopping-lists/page.tsx

@@ -1,22 +1,14 @@
-import type { Metadata } from 'next';
-import { getActiveCustomer } from '@/lib/vendure/actions';
-import { getActiveUserShoppingLists } from './actions';
+import { ErrorState } from '@/components/shared/error-state';
 import { Badge } from '@/components/ui/badge';
 import { Button } from '@/components/ui/button';
-import {
-    Table,
-    TableBody,
-    TableCell,
-    TableHead,
-    TableHeader,
-    TableRow,
-} from '@/components/ui/table';
-import { ErrorState } from '@/components/shared/error-state';
-import { ArrowRightIcon } from 'lucide-react';
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
+import { Link, redirect } from '@/i18n/navigation';
 import { formatDate } from '@/lib/format';
-import { setRequestLocale, getTranslations } from 'next-intl/server';
-import {Link} from '@/i18n/navigation';
-import { redirect } from '@/i18n/navigation';
+import { getActiveCustomer } from '@/lib/vendure/actions';
+import { ArrowRightIcon } from 'lucide-react';
+import type { Metadata } from 'next';
+import { getTranslations, setRequestLocale } from 'next-intl/server';
+import { getActiveUserShoppingLists } from './actions';
 import { CreateShoppingListForm } from './create-shopping-list-form';
 
 export const metadata: Metadata = {
@@ -36,7 +28,17 @@ type ShoppingListRow = {
 
 type ShoppingListsTranslations = Awaited<ReturnType<typeof getTranslations<'ShoppingLists'>>>;
 
-function ShoppingListTable({ lists, showOwner, locale, t }: { lists: ShoppingListRow[]; showOwner?: boolean; locale: string; t: ShoppingListsTranslations }) {
+function ShoppingListTable({
+    lists,
+    showOwner,
+    locale,
+    t,
+}: {
+    lists: ShoppingListRow[];
+    showOwner?: boolean;
+    locale: string;
+    t: ShoppingListsTranslations;
+}) {
     return (
         <div className="border rounded-lg">
             <Table>
@@ -55,33 +57,26 @@ function ShoppingListTable({ lists, showOwner, locale, t }: { lists: ShoppingLis
                         <TableRow key={list.id} className="hover:bg-muted/50">
                             <TableCell className="font-medium">
                                 <span className="flex items-center gap-2">
-                                    <Link href={`/account/shopping-lists/${list.id}`} className="hover:underline">
+                                    <Link
+                                        href={`/account/shopping-lists/${list.id}`}
+                                        className="hover:underline"
+                                    >
                                         {list.name}
                                     </Link>
-                                    {list.isDefault && (
-                                        <Badge variant="outline">{t('defaultBadge')}</Badge>
-                                    )}
+                                    {list.isDefault && <Badge variant="outline">{t('defaultBadge')}</Badge>}
                                 </span>
                                 {list.description && (
-                                    <p className="text-sm text-muted-foreground mt-1">
-                                        {list.description}
-                                    </p>
+                                    <p className="text-sm text-muted-foreground mt-1">{list.description}</p>
                                 )}
                             </TableCell>
-                            {showOwner && (
-                                <TableCell>{list.owner}</TableCell>
-                            )}
-                            <TableCell>
-                                {t('itemCount', {count: list.totalItems})}
-                            </TableCell>
+                            {showOwner && <TableCell>{list.owner}</TableCell>}
+                            <TableCell>{t('itemCount', { count: list.totalItems })}</TableCell>
                             <TableCell>
                                 <Badge variant={list.isPublic ? 'default' : 'secondary'}>
                                     {list.isPublic ? t('publicBadge') : t('privateBadge')}
                                 </Badge>
                             </TableCell>
-                            <TableCell>
-                                {formatDate(list.createdAt, locale)}
-                            </TableCell>
+                            <TableCell>{formatDate(list.createdAt, locale)}</TableCell>
                             <TableCell>
                                 <Button asChild variant="outline" size="sm">
                                     <Link href={`/account/shopping-lists/${list.id}`}>
@@ -97,13 +92,10 @@ function ShoppingListTable({ lists, showOwner, locale, t }: { lists: ShoppingLis
     );
 }
 
-export default async function ShoppingListsPage({params}: {params: Promise<{locale: string}>}) {
-    const {locale} = await params;
+export default async function ShoppingListsPage({ params }: { params: Promise<{ locale: string }> }) {
+    const { locale } = await params;
     setRequestLocale(locale);
-    const [t, customer] = await Promise.all([
-        getTranslations('ShoppingLists'),
-        getActiveCustomer(),
-    ]);
+    const [t, customer] = await Promise.all([getTranslations('ShoppingLists'), getActiveCustomer()]);
     if (!customer) {
         return await redirect('/sign-in');
     }
@@ -130,9 +122,7 @@ export default async function ShoppingListsPage({params}: {params: Promise<{loca
             isPublic: list.isPublic,
             totalItems: list.totalItems,
             createdAt: list.createdAt,
-            owner: list.customer
-                ? `${list.customer.firstName} ${list.customer.lastName}`
-                : undefined,
+            owner: list.customer ? `${list.customer.firstName} ${list.customer.lastName}` : undefined,
         };
         if (list.customer?.id === customer.id) {
             myLists.push(row);

package/dist/assets/storefront/src/app/[locale]/account/store-credits/actions.ts

@@ -1,8 +1,8 @@
 'use server';
 
-import {client} from '@/lib/vendure/api';
-import {ClaimStoreCreditMutation} from '@/lib/vendure/mutations';
-import {revalidatePath} from 'next/cache';
+import { client } from '@/lib/vendure/api';
+import { ClaimStoreCreditMutation } from '@/lib/vendure/mutations';
+import { revalidatePath } from 'next/cache';
 
 export async function claimStoreCreditAction(
     prevState: { error?: string; success?: string } | undefined,
@@ -10,22 +10,22 @@ export async function claimStoreCreditAction(
 ) {
     const code = formData.get('code') as string;
     if (!code?.trim()) {
-        return {error: 'Please enter a code'};
+        return { error: 'Please enter a code' };
     }
 
-    const [result, error] = await client.mutate(ClaimStoreCreditMutation, {code: code.trim()});
+    const [result, error] = await client.mutate(ClaimStoreCreditMutation, { code: code.trim() });
 
     if (error) {
-        return {error: 'An unexpected error occurred. Please try again.'};
+        return { error: 'An unexpected error occurred. Please try again.' };
     }
 
     const data = result.data.claimStoreCredit;
 
     if (data.__typename !== 'StoreCredit') {
-        return {error: data.message};
+        return { error: data.message };
     }
 
     revalidatePath('/account/store-credits');
     const label = data.type === 'GiftCard' ? 'Gift card' : 'Store credit';
-    return {success: `${label} claimed successfully!`};
+    return { success: `${label} claimed successfully!` };
 }

package/dist/assets/storefront/src/app/[locale]/account/store-credits/claim-form.tsx

@@ -1,9 +1,9 @@
 'use client';
 
-import {useActionState, useRef, useEffect} from 'react';
-import {claimStoreCreditAction} from './actions';
-import {Button} from '@/components/ui/button';
-import {Input} from '@/components/ui/input';
+import { Button } from '@/components/ui/button';
+import { Input } from '@/components/ui/input';
+import { useActionState, useEffect, useRef } from 'react';
+import { claimStoreCreditAction } from './actions';
 
 export function ClaimStoreCreditForm() {
     const [state, formAction, isPending] = useActionState(claimStoreCreditAction, undefined);
@@ -30,12 +30,8 @@ export function ClaimStoreCreditForm() {
                     {isPending ? 'Claiming...' : 'Claim'}
                 </Button>
             </form>
-            {state?.error && (
-                <p className="text-sm text-destructive">{state.error}</p>
-            )}
-            {state?.success && (
-                <p className="text-sm text-green-600">{state.success}</p>
-            )}
+            {state?.error && <p className="text-sm text-destructive">{state.error}</p>}
+            {state?.success && <p className="text-sm text-green-600">{state.success}</p>}
         </div>
     );
 }

package/dist/assets/storefront/src/app/[locale]/account/store-credits/page.tsx

@@ -1,20 +1,7 @@
-import type {Metadata} from 'next';
-import {Suspense} from 'react';
-import {client} from '@/lib/vendure/api';
-import {GetMyStoreCreditsQuery} from '@/lib/vendure/queries';
-import {getActiveCustomer} from '@/lib/vendure/actions';
-import {redirect} from '@/i18n/navigation';
-import {ErrorState} from '@/components/shared/error-state';
-import {Badge} from '@/components/ui/badge';
-import {Card, CardContent, CardHeader, CardTitle} from '@/components/ui/card';
-import {
-    Table,
-    TableBody,
-    TableCell,
-    TableHead,
-    TableHeader,
-    TableRow,
-} from '@/components/ui/table';
+import { Price } from '@/components/commerce/price';
+import { ErrorState } from '@/components/shared/error-state';
+import { Badge } from '@/components/ui/badge';
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
 import {
     Pagination,
     PaginationContent,
@@ -24,12 +11,18 @@ import {
     PaginationNext,
     PaginationPrevious,
 } from '@/components/ui/pagination';
-import {Price} from '@/components/commerce/price';
-import {formatDate} from '@/lib/format';
-import {getTranslations, setRequestLocale} from 'next-intl/server';
-import {noIndexRobots} from '@/lib/metadata';
-import {RevealCode} from './reveal-code';
-import {ClaimStoreCreditForm} from './claim-form';
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
+import { redirect } from '@/i18n/navigation';
+import { formatDate } from '@/lib/format';
+import { noIndexRobots } from '@/lib/metadata';
+import { getActiveCustomer } from '@/lib/vendure/actions';
+import { client } from '@/lib/vendure/api';
+import { GetMyStoreCreditsQuery } from '@/lib/vendure/queries';
+import type { Metadata } from 'next';
+import { getTranslations, setRequestLocale } from 'next-intl/server';
+import { Suspense } from 'react';
+import { ClaimStoreCreditForm } from './claim-form';
+import { RevealCode } from './reveal-code';
 
 export const metadata: Metadata = {
     title: 'Store Credits',
@@ -38,25 +31,34 @@ export const metadata: Metadata = {
 
 const ITEMS_PER_PAGE = 10;
 
-export default async function StoreCreditsPage(
-    props: {params: Promise<{locale: string}>; searchParams: Promise<Record<string, string | string[] | undefined>>},
-) {
+export default async function StoreCreditsPage(props: {
+    params: Promise<{ locale: string }>;
+    searchParams: Promise<Record<string, string | string[] | undefined>>;
+}) {
     return (
-        <Suspense fallback={<div><h1 className="text-3xl font-bold mb-6">Store Credits</h1><p className="text-sm text-muted-foreground">Loading...</p></div>}>
+        <Suspense
+            fallback={
+                <div>
+                    <h1 className="text-3xl font-bold mb-6">Store Credits</h1>
+                    <p className="text-sm text-muted-foreground">Loading...</p>
+                </div>
+            }
+        >
             <StoreCreditsContent params={props.params} searchParamsPromise={props.searchParams} />
         </Suspense>
     );
 }
 
-async function StoreCreditsContent(
-    {params, searchParamsPromise}: {params: Promise<{locale: string}>; searchParamsPromise: Promise<Record<string, string | string[] | undefined>>},
-) {
-    const {locale} = await params;
+async function StoreCreditsContent({
+    params,
+    searchParamsPromise,
+}: {
+    params: Promise<{ locale: string }>;
+    searchParamsPromise: Promise<Record<string, string | string[] | undefined>>;
+}) {
+    const { locale } = await params;
     setRequestLocale(locale);
-    const [t, activeCustomer] = await Promise.all([
-        getTranslations('StoreCredits'),
-        getActiveCustomer(),
-    ]);
+    const [t, activeCustomer] = await Promise.all([getTranslations('StoreCredits'), getActiveCustomer()]);
     if (!activeCustomer) {
         await redirect('/sign-in');
     }
@@ -66,20 +68,17 @@ async function StoreCreditsContent(
     const currentPage = parseInt(Array.isArray(pageParam) ? pageParam[0] : pageParam || '1', 10);
     const skip = (currentPage - 1) * ITEMS_PER_PAGE;
 
-    const [result, error] = await client.query(
-        GetMyStoreCreditsQuery,
-        {options: {take: ITEMS_PER_PAGE, skip, sort: {createdAt: 'DESC'}}},
-    );
+    const [result, error] = await client.query(GetMyStoreCreditsQuery, {
+        options: { take: ITEMS_PER_PAGE, skip, sort: { createdAt: 'DESC' } },
+    });
     if (error) {
-        return (
-            <ErrorState message="We couldn't load your store credits. Please try again later." />
-        );
+        return <ErrorState message="We couldn't load your store credits. Please try again later." />;
     }
-    const {data} = result;
+    const { data } = result;
     const credits = data.myStoreCredits?.items ?? [];
     const totalItems = data.myStoreCredits?.totalItems ?? 0;
     const totalPages = Math.ceil(totalItems / ITEMS_PER_PAGE);
-    const hasCompanyCredits = credits.some(c => c.issuedTo?.id !== activeCustomer?.id);
+    const hasCompanyCredits = credits.some((c) => c.issuedTo?.id !== activeCustomer?.id);
 
     return (
         <div>
@@ -119,7 +118,9 @@ async function StoreCreditsContent(
                                     </TableCell>
                                     <TableCell>
                                         <Badge variant={credit.type === 'GiftCard' ? 'default' : 'secondary'}>
-                                            {credit.type === 'GiftCard' ? t('typeGiftCard') : t('typeStoreCredit')}
+                                            {credit.type === 'GiftCard'
+                                                ? t('typeGiftCard')
+                                                : t('typeStoreCredit')}
                                         </Badge>
                                     </TableCell>
                                     {hasCompanyCredits && (
@@ -127,12 +128,15 @@ async function StoreCreditsContent(
                                             {credit.issuedTo?.id === activeCustomer?.id
                                                 ? t('ownerYou')
                                                 : credit.issuedTo
-                                                    ? `${credit.issuedTo.firstName} ${credit.issuedTo.lastName}`
-                                                    : '—'}
+                                                ? `${credit.issuedTo.firstName} ${credit.issuedTo.lastName}`
+                                                : '—'}
                                         </TableCell>
                                     )}
                                     <TableCell className="text-right">
-                                        <Price value={credit.initialValue} currencyCode={credit.currencyCode} />
+                                        <Price
+                                            value={credit.initialValue}
+                                            currencyCode={credit.currencyCode}
+                                        />
                                     </TableCell>
                                     <TableCell className="text-right font-medium">
                                         <Price value={credit.balance} currencyCode={credit.currencyCode} />
@@ -153,15 +157,26 @@ async function StoreCreditsContent(
                         <PaginationContent>
                             <PaginationItem>
                                 <PaginationPrevious
-                                    href={currentPage > 1 ? `/account/store-credits?page=${currentPage - 1}` : '#'}
+                                    href={
+                                        currentPage > 1
+                                            ? `/account/store-credits?page=${currentPage - 1}`
+                                            : '#'
+                                    }
                                     className={currentPage === 1 ? 'pointer-events-none opacity-50' : ''}
                                 />
                             </PaginationItem>
-                            {Array.from({length: totalPages}, (_, i) => i + 1).map((page) => {
-                                if (page === 1 || page === totalPages || (page >= currentPage - 1 && page <= currentPage + 1)) {
+                            {Array.from({ length: totalPages }, (_, i) => i + 1).map((page) => {
+                                if (
+                                    page === 1 ||
+                                    page === totalPages ||
+                                    (page >= currentPage - 1 && page <= currentPage + 1)
+                                ) {
                                     return (
                                         <PaginationItem key={page}>
-                                            <PaginationLink href={`/account/store-credits?page=${page}`} isActive={page === currentPage}>
+                                            <PaginationLink
+                                                href={`/account/store-credits?page=${page}`}
+                                                isActive={page === currentPage}
+                                            >
                                                 {page}
                                             </PaginationLink>
                                         </PaginationItem>
@@ -169,7 +184,7 @@ async function StoreCreditsContent(
                                 } else if (page === currentPage - 2 || page === currentPage + 2) {
                                     return (
                                         <PaginationItem key={page}>
-                                            <PaginationEllipsis/>
+                                            <PaginationEllipsis />
                                         </PaginationItem>
                                     );
                                 }
@@ -177,8 +192,14 @@ async function StoreCreditsContent(
                             })}
                             <PaginationItem>
                                 <PaginationNext
-                                    href={currentPage < totalPages ? `/account/store-credits?page=${currentPage + 1}` : '#'}
-                                    className={currentPage === totalPages ? 'pointer-events-none opacity-50' : ''}
+                                    href={
+                                        currentPage < totalPages
+                                            ? `/account/store-credits?page=${currentPage + 1}`
+                                            : '#'
+                                    }
+                                    className={
+                                        currentPage === totalPages ? 'pointer-events-none opacity-50' : ''
+                                    }
                                 />
                             </PaginationItem>
                         </PaginationContent>

package/dist/assets/storefront/src/app/[locale]/account/store-credits/reveal-code.tsx

@@ -1,11 +1,11 @@
 'use client';
 
-import {useState} from 'react';
-import {Eye, Copy, Check} from 'lucide-react';
-import {Button} from '@/components/ui/button';
-import {maskCode} from '@/lib/format';
+import { Button } from '@/components/ui/button';
+import { maskCode } from '@/lib/format';
+import { Check, Copy, Eye } from 'lucide-react';
+import { useState } from 'react';
 
-export function RevealCode({code}: { code: string }) {
+export function RevealCode({ code }: { code: string }) {
     const [revealed, setRevealed] = useState(false);
     const [copied, setCopied] = useState(false);
 
@@ -30,7 +30,11 @@ export function RevealCode({code}: { code: string }) {
                 </Button>
             ) : (
                 <Button variant="ghost" size="icon" className="h-6 w-6" onClick={handleCopy}>
-                    {copied ? <Check className="h-3.5 w-3.5 text-green-600" /> : <Copy className="h-3.5 w-3.5" />}
+                    {copied ? (
+                        <Check className="h-3.5 w-3.5 text-green-600" />
+                    ) : (
+                        <Copy className="h-3.5 w-3.5" />
+                    )}
                 </Button>
             )}
         </span>

package/dist/assets/storefront/src/app/[locale]/account/verify-email/page.tsx

@@ -1,13 +1,16 @@
-import { Suspense } from 'react';
-import { redirect } from '@/i18n/navigation';
+import { Button } from '@/components/ui/button';
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
+import { Link } from '@/i18n/navigation';
 import { client } from '@/lib/vendure/api';
 import { UpdateCustomerEmailAddressMutation } from '@/lib/vendure/mutations';
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
-import { Button } from '@/components/ui/button';
-import {Link} from '@/i18n/navigation';
-import {getTranslations} from 'next-intl/server';
+import { getTranslations } from 'next-intl/server';
+import { Suspense } from 'react';
 
-async function VerifyEmailContent({searchParams}: {searchParams: Promise<Record<string, string | string[] | undefined>>}) {
+async function VerifyEmailContent({
+    searchParams,
+}: {
+    searchParams: Promise<Record<string, string | string[] | undefined>>;
+}) {
     const t = await getTranslations('Account');
     const resolvedParams = await searchParams;
     const tokenParam = resolvedParams.token;
@@ -18,14 +21,10 @@ async function VerifyEmailContent({searchParams}: {searchParams: Promise<Record<
             <Card className="max-w-md mx-auto">
                 <CardHeader>
                     <CardTitle>{t('verifyEmail.invalidLink')}</CardTitle>
-                    <CardDescription>
-                        {t('verifyEmail.invalidLinkDesc')}
-                    </CardDescription>
+                    <CardDescription>{t('verifyEmail.invalidLinkDesc')}</CardDescription>
                 </CardHeader>
                 <CardContent>
-                    <p className="text-sm text-muted-foreground mb-4">
-                        {t('verifyEmail.checkEmail')}
-                    </p>
+                    <p className="text-sm text-muted-foreground mb-4">{t('verifyEmail.checkEmail')}</p>
                     <Button asChild>
                         <Link href="/account/profile">{t('verifyEmail.goToProfile')}</Link>
                     </Button>
@@ -41,14 +40,10 @@ async function VerifyEmailContent({searchParams}: {searchParams: Promise<Record<
             <Card className="max-w-md mx-auto">
                 <CardHeader>
                     <CardTitle>{t('verifyEmail.error')}</CardTitle>
-                    <CardDescription>
-                        {t('verifyEmail.errorDesc')}
-                    </CardDescription>
+                    <CardDescription>{t('verifyEmail.errorDesc')}</CardDescription>
                 </CardHeader>
                 <CardContent>
-                    <p className="text-sm text-muted-foreground mb-4">
-                        {t('verifyEmail.errorMessage')}
-                    </p>
+                    <p className="text-sm text-muted-foreground mb-4">{t('verifyEmail.errorMessage')}</p>
                     <Button asChild>
                         <Link href="/account/profile">{t('verifyEmail.goToProfile')}</Link>
                     </Button>
@@ -64,14 +59,10 @@ async function VerifyEmailContent({searchParams}: {searchParams: Promise<Record<
             <Card className="max-w-md mx-auto">
                 <CardHeader>
                     <CardTitle>{t('verifyEmail.success')}</CardTitle>
-                    <CardDescription>
-                        {t('verifyEmail.successDesc')}
-                    </CardDescription>
+                    <CardDescription>{t('verifyEmail.successDesc')}</CardDescription>
                 </CardHeader>
                 <CardContent>
-                    <p className="text-sm text-muted-foreground mb-4">
-                        {t('verifyEmail.successMessage')}
-                    </p>
+                    <p className="text-sm text-muted-foreground mb-4">{t('verifyEmail.successMessage')}</p>
                     <Button asChild>
                         <Link href="/account/profile">{t('verifyEmail.goToProfile')}</Link>
                     </Button>
@@ -84,14 +75,10 @@ async function VerifyEmailContent({searchParams}: {searchParams: Promise<Record<
         <Card className="max-w-md mx-auto">
             <CardHeader>
                 <CardTitle>{t('verifyEmail.failed')}</CardTitle>
-                <CardDescription>
-                    {updateResult.message || t('verifyEmail.failedDefault')}
-                </CardDescription>
+                <CardDescription>{updateResult.message || t('verifyEmail.failedDefault')}</CardDescription>
             </CardHeader>
             <CardContent>
-                <p className="text-sm text-muted-foreground mb-4">
-                    {t('verifyEmail.failedMessage')}
-                </p>
+                <p className="text-sm text-muted-foreground mb-4">{t('verifyEmail.failedMessage')}</p>
                 <Button asChild>
                     <Link href="/account/profile">{t('verifyEmail.goToProfile')}</Link>
                 </Button>
@@ -100,16 +87,22 @@ async function VerifyEmailContent({searchParams}: {searchParams: Promise<Record<
     );
 }
 
-export default async function VerifyEmailPage({searchParams}: {searchParams: Promise<Record<string, string | string[] | undefined>>}) {
+export default async function VerifyEmailPage({
+    searchParams,
+}: {
+    searchParams: Promise<Record<string, string | string[] | undefined>>;
+}) {
     return (
         <div className="container mx-auto px-4 py-8 mt-[var(--page-top-offset)]">
-            <Suspense fallback={
-                <Card className="max-w-md mx-auto">
-                    <CardHeader>
-                        <CardTitle>Verifying Email...</CardTitle>
-                    </CardHeader>
-                </Card>
-            }>
+            <Suspense
+                fallback={
+                    <Card className="max-w-md mx-auto">
+                        <CardHeader>
+                            <CardTitle>Verifying Email...</CardTitle>
+                        </CardHeader>
+                    </Card>
+                }
+            >
                 <VerifyEmailContent searchParams={searchParams} />
             </Suspense>
         </div>