@vendure-platform/create 0.5.0 → 0.5.1

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

@@ -1,13 +1,13 @@
 'use server';
 
-import {client} from '@/lib/vendure/api';
-import {VerifyCustomerAccountMutation} from '@/lib/vendure/mutations';
-import {setAuthToken} from '@/lib/auth';
-import {cookies} from 'next/headers';
+import { setAuthToken } from '@/lib/auth';
+import { client } from '@/lib/vendure/api';
+import { VerifyCustomerAccountMutation } from '@/lib/vendure/mutations';
+import { cookies } from 'next/headers';
 
 export async function verifyAccountAction(token: string, password?: string) {
     if (!token) {
-        return {error: 'Verification token is required'};
+        return { error: 'Verification token is required' };
     }
 
     const [result, error] = await client.mutate(VerifyCustomerAccountMutation, {
@@ -16,13 +16,13 @@ export async function verifyAccountAction(token: string, password?: string) {
     });
 
     if (error) {
-        return {error: 'An unexpected error occurred. Please try again.'};
+        return { error: 'An unexpected error occurred. Please try again.' };
     }
 
     const verifyResult = result.data.verifyCustomerAccount;
 
     if (verifyResult.__typename !== 'CurrentUser') {
-        return {error: verifyResult.message};
+        return { error: verifyResult.message };
     }
 
     // Store the token in a cookie if returned
@@ -37,5 +37,5 @@ export async function verifyAccountAction(token: string, password?: string) {
         cookieStore.delete('post-verify-redirect');
     }
 
-    return {success: true, redirectTo: redirectTo || null};
+    return { success: true, redirectTo: redirectTo || null };
 }

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

@@ -1,16 +1,16 @@
-import type {Metadata} from 'next';
-import {Suspense} from 'react';
-import {Card, CardContent} from '@/components/ui/card';
-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 {AuthPageShell} from '@/components/layout/auth-page-shell';
-import {VerifyContent} from './verify-content';
+import { AuthPageShell } from '@/components/layout/auth-page-shell';
+import { Card, CardContent } from '@/components/ui/card';
+import { type Locale } from '@/i18n/routing';
+import { Loader2 } from 'lucide-react';
+import type { Metadata } from 'next';
+import { getTranslations } from 'next-intl/server';
+import { locale as rootLocale } from 'next/root-params';
+import { Suspense } from 'react';
+import { VerifyContent } from './verify-content';
 
 export async function generateMetadata(): Promise<Metadata> {
     const locale = (await rootLocale()) as Locale;
-    const t = await getTranslations({locale, namespace: 'Verify'});
+    const t = await getTranslations({ locale, namespace: 'Verify' });
     return {
         title: t('accountVerified'),
         description: t('accountVerifiedMessage'),
@@ -22,18 +22,22 @@ function VerifyLoading() {
         <Card>
             <CardContent className="pt-6 space-y-4">
                 <div className="flex justify-center">
-                    <Loader2 className="h-16 w-16 text-primary animate-spin"/>
+                    <Loader2 className="h-16 w-16 text-primary animate-spin" />
                 </div>
             </CardContent>
         </Card>
     );
 }
 
-export default function VerifyPage({searchParams}: {searchParams: Promise<Record<string, string | string[] | undefined>>}) {
+export default function VerifyPage({
+    searchParams,
+}: {
+    searchParams: Promise<Record<string, string | string[] | undefined>>;
+}) {
     return (
         <AuthPageShell>
-            <Suspense fallback={<VerifyLoading/>}>
-                <VerifyContent searchParams={searchParams}/>
+            <Suspense fallback={<VerifyLoading />}>
+                <VerifyContent searchParams={searchParams} />
             </Suspense>
         </AuthPageShell>
     );

package/dist/assets/storefront/src/app/[locale]/verify/verify-content.tsx

@@ -1,30 +1,36 @@
 'use client';
 
-import {use, useEffect, useState} from 'react';
-import {useTranslations} from 'next-intl';
-import {verifyAccountAction} from './actions';
-import {Card, CardContent} from '@/components/ui/card';
-import {Button} from '@/components/ui/button';
-import {Link} from '@/i18n/navigation';
-import {CheckCircle, XCircle, Loader2} from 'lucide-react';
+import { Button } from '@/components/ui/button';
+import { Card, CardContent } from '@/components/ui/card';
+import { Link } from '@/i18n/navigation';
+import { CheckCircle, Loader2, XCircle } from 'lucide-react';
+import { useTranslations } from 'next-intl';
+import { use, useEffect, useState } from 'react';
+import { verifyAccountAction } from './actions';
 
 interface VerifyContentProps {
     searchParams: Promise<{ token?: string }>;
 }
 
-export function VerifyContent({searchParams}: VerifyContentProps) {
+export function VerifyContent({ searchParams }: VerifyContentProps) {
     const t = useTranslations('Verify');
     const params = use(searchParams);
     const token = params.token;
-    const [result, setResult] = useState<{success?: boolean; error?: string; redirectTo?: string | null} | null>(null);
+    const [result, setResult] = useState<{
+        success?: boolean;
+        error?: string;
+        redirectTo?: string | null;
+    } | null>(null);
 
     useEffect(() => {
         if (!token) return;
         let cancelled = false;
-        verifyAccountAction(token).then(r => {
+        verifyAccountAction(token).then((r) => {
             if (!cancelled) setResult(r);
         });
-        return () => { cancelled = true; };
+        return () => {
+            cancelled = true;
+        };
     }, [token]);
 
     if (!token) {
@@ -32,13 +38,11 @@ export function VerifyContent({searchParams}: VerifyContentProps) {
             <Card>
                 <CardContent className="pt-6 space-y-4">
                     <div className="flex justify-center">
-                        <XCircle className="h-16 w-16 text-destructive"/>
+                        <XCircle className="h-16 w-16 text-destructive" />
                     </div>
                     <div className="space-y-2 text-center">
                         <h1 className="text-2xl font-bold">{t('invalidLink')}</h1>
-                        <p className="text-muted-foreground">
-                            {t('invalidLinkMessage')}
-                        </p>
+                        <p className="text-muted-foreground">{t('invalidLinkMessage')}</p>
                     </div>
                     <div className="flex flex-col gap-2">
                         <Link href="/register" className="block">
@@ -62,7 +66,7 @@ export function VerifyContent({searchParams}: VerifyContentProps) {
             <Card>
                 <CardContent className="pt-6 space-y-4">
                     <div className="flex justify-center">
-                        <Loader2 className="h-16 w-16 text-muted-foreground animate-spin"/>
+                        <Loader2 className="h-16 w-16 text-muted-foreground animate-spin" />
                     </div>
                     <div className="space-y-2 text-center">
                         <h1 className="text-2xl font-bold">{t('loading')}</h1>
@@ -79,18 +83,14 @@ export function VerifyContent({searchParams}: VerifyContentProps) {
             <Card>
                 <CardContent className="pt-6 space-y-4">
                     <div className="flex justify-center">
-                        <CheckCircle className="h-16 w-16 text-green-600"/>
+                        <CheckCircle className="h-16 w-16 text-green-600" />
                     </div>
                     <div className="space-y-2 text-center">
                         <h1 className="text-2xl font-bold">{t('accountVerified')}</h1>
-                        <p className="text-muted-foreground">
-                            {t('accountVerifiedMessage')}
-                        </p>
+                        <p className="text-muted-foreground">{t('accountVerifiedMessage')}</p>
                     </div>
                     <Link href={continueHref} className="block">
-                        <Button className="w-full">
-                            {continueLabel}
-                        </Button>
+                        <Button className="w-full">{continueLabel}</Button>
                     </Link>
                 </CardContent>
             </Card>
@@ -101,13 +101,11 @@ export function VerifyContent({searchParams}: VerifyContentProps) {
         <Card>
             <CardContent className="pt-6 space-y-4">
                 <div className="flex justify-center">
-                    <XCircle className="h-16 w-16 text-destructive"/>
+                    <XCircle className="h-16 w-16 text-destructive" />
                 </div>
                 <div className="space-y-2 text-center">
                     <h1 className="text-2xl font-bold">{t('verificationFailed')}</h1>
-                    <p className="text-muted-foreground">
-                        {result.error || t('verificationFailedMessage')}
-                    </p>
+                    <p className="text-muted-foreground">{result.error || t('verificationFailedMessage')}</p>
                 </div>
                 <div className="flex flex-col gap-2">
                     <Link href="/register" className="block">

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

@@ -1,31 +1,33 @@
-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 { Card, CardContent, CardFooter } from '@/components/ui/card';
+import { AuthPageShell } from '@/components/layout/auth-page-shell';
 import { Button } from '@/components/ui/button';
-import {Link} from '@/i18n/navigation';
+import { Card, CardContent, CardFooter } from '@/components/ui/card';
+import { Link } from '@/i18n/navigation';
+import { type Locale } from '@/i18n/routing';
 import { CheckCircle } from 'lucide-react';
-import {AuthPageShell} from '@/components/layout/auth-page-shell';
+import type { Metadata } from 'next';
+import { getTranslations } from 'next-intl/server';
+import { locale as rootLocale } from 'next/root-params';
+import { Suspense } from 'react';
 
 export async function generateMetadata(): Promise<Metadata> {
     const locale = (await rootLocale()) as Locale;
-    const t = await getTranslations({locale, namespace: 'Verify.pending'});
+    const t = await getTranslations({ locale, namespace: 'Verify.pending' });
     return {
         title: t('title'),
         description: t('message'),
     };
 }
 
-async function VerifyPendingContent({searchParams}: {searchParams: Promise<Record<string, string | string[] | undefined>>}) {
+async function VerifyPendingContent({
+    searchParams,
+}: {
+    searchParams: Promise<Record<string, string | string[] | undefined>>;
+}) {
     const resolvedParams = await searchParams;
     const redirectTo = resolvedParams?.redirectTo as string | undefined;
     const t = await getTranslations('Verify.pending');
 
-    const signInHref = redirectTo
-        ? `/sign-in?redirectTo=${encodeURIComponent(redirectTo)}`
-        : '/sign-in';
+    const signInHref = redirectTo ? `/sign-in?redirectTo=${encodeURIComponent(redirectTo)}` : '/sign-in';
 
     return (
         <Card>
@@ -35,28 +37,26 @@ async function VerifyPendingContent({searchParams}: {searchParams: Promise<Recor
                 </div>
                 <div className="space-y-2 text-center">
                     <h1 className="text-2xl font-bold">{t('title')}</h1>
-                    <p className="text-muted-foreground">
-                        {t('message')}
-                    </p>
+                    <p className="text-muted-foreground">{t('message')}</p>
                 </div>
                 <div className="bg-muted p-4 rounded-md">
-                    <p className="text-sm text-muted-foreground">
-                        {t('spamNote')}
-                    </p>
+                    <p className="text-sm text-muted-foreground">{t('spamNote')}</p>
                 </div>
             </CardContent>
             <CardFooter className="flex flex-col space-y-2">
                 <Link href={signInHref} className="w-full">
-                    <Button className="w-full">
-                        {t('goToSignIn')}
-                    </Button>
+                    <Button className="w-full">{t('goToSignIn')}</Button>
                 </Link>
             </CardFooter>
         </Card>
     );
 }
 
-export default async function VerifyPendingPage({searchParams}: {searchParams: Promise<Record<string, string | string[] | undefined>>}) {
+export default async function VerifyPendingPage({
+    searchParams,
+}: {
+    searchParams: Promise<Record<string, string | string[] | undefined>>;
+}) {
     return (
         <AuthPageShell>
             <Suspense fallback={null}>

package/dist/assets/storefront/src/app/api/clear-company-context/route.ts

@@ -1,5 +1,5 @@
-import {cookies, headers} from 'next/headers';
-import {NextResponse} from 'next/server';
+import { cookies, headers } from 'next/headers';
+import { NextResponse } from 'next/server';
 
 const COMPANY_ID_COOKIE = 'vendure-company-id';
 const BUSINESS_UNIT_ID_COOKIE = 'vendure-business-unit-id';
@@ -22,5 +22,8 @@ export async function GET() {
     const referer = headerStore.get('referer');
     const redirectTo = referer ? new URL(referer).pathname : '/';
 
-    return NextResponse.redirect(new URL(redirectTo, process.env.NEXT_PUBLIC_SITE_URL || 'http://localhost:3001'), 302);
+    return NextResponse.redirect(
+        new URL(redirectTo, process.env.NEXT_PUBLIC_SITE_URL || 'http://localhost:3001'),
+        302,
+    );
 }

package/dist/assets/storefront/src/app/api/revalidate/route.ts

@@ -1,6 +1,6 @@
-import {revalidateTag} from 'next/cache';
-import {NextRequest, NextResponse} from 'next/server';
-import {routing} from '@/i18n/routing';
+import { routing } from '@/i18n/routing';
+import { revalidateTag } from 'next/cache';
+import { NextRequest, NextResponse } from 'next/server';
 
 // Supported cache tags that can be revalidated.
 // These are locale-independent base names — the endpoint expands them to all locales.
@@ -23,7 +23,7 @@ const DYNAMIC_TAG_PATTERNS = [
 
 function isValidTag(tag: string): boolean {
     if ((LOCALE_SENSITIVE_TAGS as readonly string[]).includes(tag)) return true;
-    return DYNAMIC_TAG_PATTERNS.some(pattern => pattern.test(tag));
+    return DYNAMIC_TAG_PATTERNS.some((pattern) => pattern.test(tag));
 }
 
 /**
@@ -31,7 +31,7 @@ function isValidTag(tag: string): boolean {
  * e.g. 'collections' → ['collections-en', 'collections-de']
  */
 function expandToLocales(tag: string): string[] {
-    return routing.locales.map(locale => `${tag}-${locale}`);
+    return routing.locales.map((locale) => `${tag}-${locale}`);
 }
 
 export async function POST(request: NextRequest) {
@@ -41,41 +41,35 @@ export async function POST(request: NextRequest) {
 
     if (!expectedToken) {
         console.error('REVALIDATION_SECRET environment variable not set');
-        return NextResponse.json(
-            {error: 'Server configuration error'},
-            {status: 500}
-        );
+        return NextResponse.json({ error: 'Server configuration error' }, { status: 500 });
     }
 
     if (authHeader !== `Bearer ${expectedToken}`) {
-        return NextResponse.json(
-            {error: 'Unauthorized'},
-            {status: 401}
-        );
+        return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
     }
 
     try {
         const body = await request.json();
-        const {tags} = body;
+        const { tags } = body;
 
         if (!tags || !Array.isArray(tags) || tags.length === 0) {
             return NextResponse.json(
-                {error: 'Missing or invalid "tags" array in request body'},
-                {status: 400}
+                { error: 'Missing or invalid "tags" array in request body' },
+                { status: 400 },
             );
         }
 
         // Validate and revalidate each tag, expanding to all locales
-        const results: {tag: string; success: boolean; error?: string}[] = [];
+        const results: { tag: string; success: boolean; error?: string }[] = [];
 
         for (const tag of tags) {
             if (typeof tag !== 'string') {
-                results.push({tag: String(tag), success: false, error: 'Invalid tag type'});
+                results.push({ tag: String(tag), success: false, error: 'Invalid tag type' });
                 continue;
             }
 
             if (!isValidTag(tag)) {
-                results.push({tag, success: false, error: 'Unknown tag'});
+                results.push({ tag, success: false, error: 'Unknown tag' });
                 continue;
             }
 
@@ -83,15 +77,15 @@ export async function POST(request: NextRequest) {
             const expanded = expandToLocales(tag);
             try {
                 for (const localeTag of expanded) {
-                    revalidateTag(localeTag, {expire: 0});
+                    revalidateTag(localeTag, { expire: 0 });
                 }
-                results.push({tag, success: true});
+                results.push({ tag, success: true });
             } catch {
-                results.push({tag, success: false, error: 'Revalidation failed'});
+                results.push({ tag, success: false, error: 'Revalidation failed' });
             }
         }
 
-        const allSuccessful = results.every(r => r.success);
+        const allSuccessful = results.every((r) => r.success);
 
         return NextResponse.json(
             {
@@ -99,12 +93,9 @@ export async function POST(request: NextRequest) {
                 results,
                 timestamp: Date.now(),
             },
-            {status: allSuccessful ? 200 : 207} // 207 = Multi-Status
+            { status: allSuccessful ? 200 : 207 }, // 207 = Multi-Status
         );
     } catch {
-        return NextResponse.json(
-            {error: 'Invalid JSON body'},
-            {status: 400}
-        );
+        return NextResponse.json({ error: 'Invalid JSON body' }, { status: 400 });
     }
 }

package/dist/assets/storefront/src/app/api/search-analytics/route.ts

@@ -1,6 +1,6 @@
-import { NextRequest, NextResponse } from 'next/server';
 import { client } from '@/lib/vendure/api';
 import { LogSearchResultClickedMutation } from '@/lib/vendure/mutations';
+import { NextRequest, NextResponse } from 'next/server';
 
 export async function POST(request: NextRequest) {
     const body = await request.json();

package/dist/assets/storefront/src/components/commerce/account-nav-items.ts

@@ -1,20 +1,20 @@
 import type { LucideIcon } from 'lucide-react';
 import {
-    Package,
-    User,
-    MapPin,
-    ShieldCheck,
-    FileText,
     Building2,
-    Users,
-    Network,
-    Shield,
-    MapPinHouse,
     CreditCard,
-    Receipt,
+    FileText,
     Heart,
-    Zap,
+    MapPin,
+    MapPinHouse,
+    Network,
+    Package,
+    Receipt,
+    Shield,
+    ShieldCheck,
     ShoppingCart,
+    User,
+    Users,
+    Zap,
 } from 'lucide-react';
 
 export interface NavItem {
@@ -42,17 +42,42 @@ export const personalNavItems: NavItem[] = [
 
 export const companyNavItems: CompanyNavItem[] = [
     { href: '/account/company', label: 'companyProfile', icon: Building2, exact: true },
-    { href: '/account/company/users', label: 'users', icon: Users, requiredPermissions: ['ViewUsers', 'ManageUsers'] },
-    { href: '/account/company/business-units', label: 'businessUnits', icon: Network, requiredPermissions: ['ManageBusinessUnits'] },
+    {
+        href: '/account/company/users',
+        label: 'users',
+        icon: Users,
+        requiredPermissions: ['ViewUsers', 'ManageUsers'],
+    },
+    {
+        href: '/account/company/business-units',
+        label: 'businessUnits',
+        icon: Network,
+        requiredPermissions: ['ManageBusinessUnits'],
+    },
     { href: '/account/company/roles', label: 'roles', icon: Shield, requiredPermissions: ['ManageRoles'] },
-    { href: '/account/company/addresses', label: 'companyAddresses', icon: MapPinHouse, requiredPermissions: ['ManageAddresses'] },
-    { href: '/account/company/payment-methods', label: 'paymentMethods', icon: CreditCard, requiredPermissions: ['ManagePaymentMethods'] },
-    { href: '/account/company/tax-ids', label: 'taxIds', icon: Receipt, requiredPermissions: ['ManageCompany'] },
+    {
+        href: '/account/company/addresses',
+        label: 'companyAddresses',
+        icon: MapPinHouse,
+        requiredPermissions: ['ManageAddresses'],
+    },
+    {
+        href: '/account/company/payment-methods',
+        label: 'paymentMethods',
+        icon: CreditCard,
+        requiredPermissions: ['ManagePaymentMethods'],
+    },
+    {
+        href: '/account/company/tax-ids',
+        label: 'taxIds',
+        icon: Receipt,
+        requiredPermissions: ['ManageCompany'],
+    },
 ];
 
 export function getVisibleCompanyItems(permissions: string[]): CompanyNavItem[] {
-    return companyNavItems.filter(item => {
+    return companyNavItems.filter((item) => {
         if (!item.requiredPermissions) return true;
-        return item.requiredPermissions.some(p => permissions.includes(p));
+        return item.requiredPermissions.some((p) => permissions.includes(p));
     });
 }

package/dist/assets/storefront/src/components/commerce/account-sidebar.tsx

@@ -1,20 +1,22 @@
 'use client';
 
-import {Link, usePathname} from '@/i18n/navigation';
-import { useTranslations } from 'next-intl';
-import { LayoutGrid } from 'lucide-react';
-import {
-    Sheet,
-    SheetContent,
-    SheetHeader,
-    SheetTitle,
-    SheetTrigger,
-} from '@/components/ui/sheet';
 import { Button } from '@/components/ui/button';
+import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetTrigger } from '@/components/ui/sheet';
+import { Link, usePathname } from '@/i18n/navigation';
 import { cn } from '@/lib/utils';
-import { type NavItem, personalNavItems, getVisibleCompanyItems } from './account-nav-items';
+import { LayoutGrid } from 'lucide-react';
+import { useTranslations } from 'next-intl';
+import { getVisibleCompanyItems, type NavItem, personalNavItems } from './account-nav-items';
 
-function NavLink({ item, pathname, t }: { item: NavItem; pathname: string; t: ReturnType<typeof useTranslations<'Account'>> }) {
+function NavLink({
+    item,
+    pathname,
+    t,
+}: {
+    item: NavItem;
+    pathname: string;
+    t: ReturnType<typeof useTranslations<'Account'>>;
+}) {
     const isActive = item.exact
         ? pathname === item.href
         : pathname === item.href || pathname.startsWith(item.href + '/');
@@ -24,9 +26,7 @@ function NavLink({ item, pathname, t }: { item: NavItem; pathname: string; t: Re
             prefetch={true}
             className={cn(
                 'flex items-center gap-3 px-3 py-2 text-sm rounded-md transition-colors',
-                isActive
-                    ? 'bg-primary/10 text-primary font-medium'
-                    : 'text-foreground hover:bg-muted',
+                isActive ? 'bg-primary/10 text-primary font-medium' : 'text-foreground hover:bg-muted',
             )}
         >
             <item.icon className="h-4 w-4" />
@@ -46,14 +46,12 @@ function AccountNavLinks({
     pathname: string;
     t: ReturnType<typeof useTranslations<'Account'>>;
 }) {
-    const visibleCompanyItems = hasCompany
-        ? getVisibleCompanyItems(permissions)
-        : [];
+    const visibleCompanyItems = hasCompany ? getVisibleCompanyItems(permissions) : [];
 
     return (
         <nav className="space-y-1">
             <h2 className="font-semibold text-sm pb-2">{t('sidebar.accountHeading')}</h2>
-            {personalNavItems.map(item => (
+            {personalNavItems.map((item) => (
                 <NavLink key={item.href} item={item} pathname={pathname} t={t} />
             ))}
             {visibleCompanyItems.length > 0 && (
@@ -63,7 +61,7 @@ function AccountNavLinks({
                             {t('sidebar.companySection')}
                         </span>
                     </div>
-                    {visibleCompanyItems.map(item => (
+                    {visibleCompanyItems.map((item) => (
                         <NavLink key={item.href} item={item} pathname={pathname} t={t} />
                     ))}
                 </>
@@ -85,7 +83,12 @@ export function AccountSidebar({ permissions, hasCompany }: AccountSidebarProps)
         <>
             {/* Desktop: sticky sidebar */}
             <div className="hidden lg:block sticky top-20">
-                <AccountNavLinks permissions={permissions} hasCompany={hasCompany} pathname={pathname} t={t} />
+                <AccountNavLinks
+                    permissions={permissions}
+                    hasCompany={hasCompany}
+                    pathname={pathname}
+                    t={t}
+                />
             </div>
 
             {/* Mobile: sheet trigger */}
@@ -102,7 +105,12 @@ export function AccountSidebar({ permissions, hasCompany }: AccountSidebarProps)
                             <SheetTitle>{t('sidebar.accountHeading')}</SheetTitle>
                         </SheetHeader>
                         <div className="px-4 pb-4">
-                            <AccountNavLinks permissions={permissions} hasCompany={hasCompany} pathname={pathname} t={t} />
+                            <AccountNavLinks
+                                permissions={permissions}
+                                hasCompany={hasCompany}
+                                pathname={pathname}
+                                t={t}
+                            />
                         </div>
                     </SheetContent>
                 </Sheet>

package/dist/assets/storefront/src/components/commerce/active-filters.tsx

@@ -1,11 +1,11 @@
 'use client';
 
+import { usePathname, useRouter } from '@/i18n/navigation';
 import { formatPrice } from '@/lib/format';
 import { RESERVED_PARAMS } from '@/lib/search-helpers';
 import { X } from 'lucide-react';
 import { useLocale } from 'next-intl';
 import { useSearchParams } from 'next/navigation';
-import { usePathname, useRouter } from '@/i18n/navigation';
 
 interface FacetValueInfo {
     code: string;