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

package/dist/assets/storefront/src/components/layout/navbar.tsx

@@ -1,35 +1,32 @@
-import Image from "next/image";
-import {Link} from "@/i18n/navigation";
-import {NavbarCart} from '@/components/layout/navbar/navbar-cart';
-import {NavbarUser} from '@/components/layout/navbar/navbar-user';
-import {ThemeSwitcher} from '@/components/layout/navbar/theme-switcher';
-import {LanguagePicker} from '@/components/layout/navbar/language-picker';
-import {ChannelPickerWrapper} from '@/components/layout/navbar/channel-picker-wrapper';
-import {CurrencyPickerWrapper} from '@/components/layout/navbar/currency-picker-wrapper';
-import {SearchInput} from '@/components/layout/search-input';
-import {MobileNav} from '@/components/layout/navbar/mobile-nav';
-import {DraftModeBorderStyle, DraftModeIndicator} from '@/components/layout/draft-mode-indicator';
-import {AwaitingApprovalBanner} from '@/components/providers/awaiting-approval-banner';
-import {getHasCompany} from '@/lib/vendure/actions';
-import {getTranslations} from 'next-intl/server';
-import {Suspense} from "react";
-import {getBranding} from '@/config/branding';
+import { DraftModeBorderStyle, DraftModeIndicator } from '@/components/layout/draft-mode-indicator';
+import { ChannelPickerWrapper } from '@/components/layout/navbar/channel-picker-wrapper';
+import { CurrencyPickerWrapper } from '@/components/layout/navbar/currency-picker-wrapper';
+import { LanguagePicker } from '@/components/layout/navbar/language-picker';
+import { MobileNav } from '@/components/layout/navbar/mobile-nav';
+import { NavbarCart } from '@/components/layout/navbar/navbar-cart';
+import { NavbarUser } from '@/components/layout/navbar/navbar-user';
+import { ThemeSwitcher } from '@/components/layout/navbar/theme-switcher';
+import { SearchInput } from '@/components/layout/search-input';
+import { AwaitingApprovalBanner } from '@/components/providers/awaiting-approval-banner';
+import { getBranding } from '@/config/branding';
+import { Link } from '@/i18n/navigation';
+import { getHasCompany } from '@/lib/vendure/actions';
+import { getTranslations } from 'next-intl/server';
+import Image from 'next/image';
+import { Suspense } from 'react';
 
 // Groups all async navbar children so they stream as a single chunk.
 // Without this, each async component gets its own implicit Suspense
 // boundary, causing staggered rendering and CLS within the fixed header.
 async function AsyncNavbarContent() {
-    const [hasCompany, t] = await Promise.all([
-        getHasCompany(),
-        getTranslations('Navigation'),
-    ]);
+    const [hasCompany, t] = await Promise.all([getHasCompany(), getTranslations('Navigation')]);
     const defaultNavLinks = [
-        {href: '/catalog', label: t('catalog')},
-        {href: '/account/quick-order', label: t('quickOrder')},
-        {href: '/account/orders', label: t('orders')},
-        {href: '/account/quotes', label: t('quotes')},
+        { href: '/catalog', label: t('catalog') },
+        { href: '/account/quick-order', label: t('quickOrder') },
+        { href: '/account/orders', label: t('orders') },
+        { href: '/account/quotes', label: t('quotes') },
     ];
-    const companyNavLink = {href: '/account/company', label: t('company')};
+    const companyNavLink = { href: '/account/company', label: t('company') };
     const branding = getBranding();
     const navLinks = branding.navLinks ?? defaultNavLinks;
     const appendCompany = hasCompany && !branding.hideCompanyNavLink;
@@ -41,7 +38,7 @@ async function AsyncNavbarContent() {
             </div>
             <div className="flex items-center justify-between flex-1 ml-4">
                 <nav className="hidden lg:flex items-center gap-1">
-                    {allLinks.map(({href, label}) => (
+                    {allLinks.map(({ href, label }) => (
                         <Link
                             key={href}
                             href={href}
@@ -54,14 +51,14 @@ async function AsyncNavbarContent() {
                 </nav>
                 <div className="flex items-center gap-2">
                     <div className="hidden lg:flex">
-                        <SearchInput/>
+                        <SearchInput />
                     </div>
                     <ChannelPickerWrapper />
                     <CurrencyPickerWrapper />
                     {!branding.hideLanguagePicker && <LanguagePicker />}
                     <ThemeSwitcher />
-                    <NavbarCart/>
-                    <NavbarUser/>
+                    <NavbarCart />
+                    <NavbarUser />
                     <DraftModeIndicator />
                 </div>
             </div>
@@ -103,8 +100,16 @@ export function Navbar() {
                 <div className="flex items-center h-14">
                     <div className="flex items-center gap-4 flex-shrink-0">
                         <Link href="/" prefetch={false} className="flex-shrink-0 flex items-center gap-3">
-                            <Image src={logo.src} alt={logo.alt} width={logo.width} height={logo.height} className="h-5 w-auto" />
-                            <span className="hidden sm:inline text-sm font-bold text-foreground tracking-tight">{siteName}</span>
+                            <Image
+                                src={logo.src}
+                                alt={logo.alt}
+                                width={logo.width}
+                                height={logo.height}
+                                className="h-5 w-auto"
+                            />
+                            <span className="hidden sm:inline text-sm font-bold text-foreground tracking-tight">
+                                {siteName}
+                            </span>
                         </Link>
                     </div>
                     <Suspense fallback={<AsyncNavbarSkeleton />}>

package/dist/assets/storefront/src/components/layout/search-input.tsx

@@ -1,14 +1,14 @@
 'use client';
 
-import { useState, useEffect, useRef, useCallback } from 'react';
-import { useSearchParams } from 'next/navigation';
-import { useTranslations } from 'next-intl';
-import { useRouter } from '@/i18n/navigation';
-import { Search } from 'lucide-react';
+import { InstantSearchDropdown } from '@/components/commerce/instant-search-dropdown';
 import { Input } from '@/components/ui/input';
-import { useSearchBar } from '@/lib/search-bar-context';
 import { KbdShortcut } from '@/components/ui/kbd-shortcut';
-import { InstantSearchDropdown } from '@/components/commerce/instant-search-dropdown';
+import { useRouter } from '@/i18n/navigation';
+import { useSearchBar } from '@/lib/search-bar-context';
+import { Search } from 'lucide-react';
+import { useTranslations } from 'next-intl';
+import { useSearchParams } from 'next/navigation';
+import { useCallback, useEffect, useRef, useState } from 'react';
 
 export function SearchInput() {
     const t = useTranslations('Navigation');
@@ -33,10 +33,13 @@ export function SearchInput() {
         setSearchValue(searchParams.get('q') || '');
     }, [searchParams]);
 
-    const handleSubmit = useCallback((term: string) => {
-        if (!term.trim()) return;
-        router.push(`/search?q=${encodeURIComponent(term.trim())}`);
-    }, [router]);
+    const handleSubmit = useCallback(
+        (term: string) => {
+            if (!term.trim()) return;
+            router.push(`/search?q=${encodeURIComponent(term.trim())}`);
+        },
+        [router],
+    );
 
     const handleFormSubmit = (e: React.FormEvent) => {
         e.preventDefault();
@@ -45,27 +48,27 @@ export function SearchInput() {
 
     return (
         <div className={hasInlineSearch ? 'hidden' : ''}>
-        <InstantSearchDropdown
-            inputRef={inputRef}
-            searchValue={searchValue}
-            onSearchValueChange={setSearchValue}
-            onSubmit={handleSubmit}
-            dropdownClassName="w-[32rem] right-0 left-auto"
-        >
-            <form onSubmit={handleFormSubmit} className="relative">
-                <Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
-                <Input
-                    ref={setRef}
-                    type="search"
-                    placeholder={t('searchByNameSkuKeyword')}
-                    className="pl-9 pr-16 w-64"
-                    value={searchValue}
-                    onChange={(e) => setSearchValue(e.target.value)}
-                    autoComplete="off"
-                />
-                <KbdShortcut className="absolute right-3 top-1/2 -translate-y-1/2" />
-            </form>
-        </InstantSearchDropdown>
+            <InstantSearchDropdown
+                inputRef={inputRef}
+                searchValue={searchValue}
+                onSearchValueChange={setSearchValue}
+                onSubmit={handleSubmit}
+                dropdownClassName="w-[32rem] right-0 left-auto"
+            >
+                <form onSubmit={handleFormSubmit} className="relative">
+                    <Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
+                    <Input
+                        ref={setRef}
+                        type="search"
+                        placeholder={t('searchByNameSkuKeyword')}
+                        className="pl-9 pr-16 w-64"
+                        value={searchValue}
+                        onChange={(e) => setSearchValue(e.target.value)}
+                        autoComplete="off"
+                    />
+                    <KbdShortcut className="absolute right-3 top-1/2 -translate-y-1/2" />
+                </form>
+            </InstantSearchDropdown>
         </div>
     );
 }

package/dist/assets/storefront/src/components/providers/awaiting-approval-banner.tsx

@@ -1,10 +1,10 @@
-import {cacheLife, cacheTag} from 'next/cache';
-import {ClipboardCheck, ArrowRight} from 'lucide-react';
-import {getTranslations} from 'next-intl/server';
-import {Link} from '@/i18n/navigation';
-import {client, getVendureContext} from '@/lib/vendure/api';
-import type {VendureContext} from '@/lib/vendure/api';
-import {GetActiveOrderQuery} from '@/lib/vendure/queries';
+import { Link } from '@/i18n/navigation';
+import type { VendureContext } from '@/lib/vendure/api';
+import { client, getVendureContext } from '@/lib/vendure/api';
+import { GetActiveOrderQuery } from '@/lib/vendure/queries';
+import { ArrowRight, ClipboardCheck } from 'lucide-react';
+import { getTranslations } from 'next-intl/server';
+import { cacheLife, cacheTag } from 'next/cache';
 
 async function getAwaitingApprovalOrderCode(ctx: VendureContext): Promise<string | null> {
     'use cache: private';
@@ -37,18 +37,20 @@ export async function AwaitingApprovalBanner() {
                 >
                     <div className="container mx-auto px-4 py-2 flex items-center justify-between gap-4 flex-wrap">
                         <div className="flex items-center gap-3 min-w-0">
-                            <ClipboardCheck className="h-5 w-5 flex-shrink-0 text-amber-600 dark:text-amber-400"/>
+                            <ClipboardCheck className="h-5 w-5 flex-shrink-0 text-amber-600 dark:text-amber-400" />
                             <p className="text-sm">
                                 <span className="font-semibold">{t('orderPendingApproval')}:</span>{' '}
                                 <code className="font-mono font-semibold px-1.5 py-0.5 rounded bg-amber-500/20">
                                     {code}
                                 </code>{' '}
-                                <span className="text-muted-foreground">{t('awaitingApprovalBannerBody')}</span>
+                                <span className="text-muted-foreground">
+                                    {t('awaitingApprovalBannerBody')}
+                                </span>
                             </p>
                         </div>
                         <span className="text-sm font-semibold inline-flex items-center gap-1.5 flex-shrink-0 text-amber-600 dark:text-amber-400">
                             {t('viewRequest')}
-                            <ArrowRight className="h-4 w-4"/>
+                            <ArrowRight className="h-4 w-4" />
                         </span>
                     </div>
                 </Link>

package/dist/assets/storefront/src/components/providers/cart-count-server.tsx

@@ -1,31 +1,33 @@
-import {cacheLife, cacheTag} from 'next/cache';
-import {CartStatusSync} from '@/lib/cart-count-context';
-import {client, getVendureContext} from '@/lib/vendure/api';
-import type {VendureContext} from '@/lib/vendure/api';
-import {GetActiveOrderQuery} from '@/lib/vendure/queries';
+import { CartStatusSync } from '@/lib/cart-count-context';
+import type { VendureContext } from '@/lib/vendure/api';
+import { client, getVendureContext } from '@/lib/vendure/api';
+import { GetActiveOrderQuery } from '@/lib/vendure/queries';
+import { cacheLife, cacheTag } from 'next/cache';
 
-async function getCartStatus(ctx: VendureContext): Promise<{count: number; awaitingApprovalOrderCode: string | null}> {
+async function getCartStatus(
+    ctx: VendureContext,
+): Promise<{ count: number; awaitingApprovalOrderCode: string | null }> {
     'use cache: private';
     cacheLife('minutes');
     cacheTag('cart');
     cacheTag('active-order');
 
     const [result, error] = await client.query(GetActiveOrderQuery, undefined, ctx);
-    if (error) return {count: 0, awaitingApprovalOrderCode: null};
+    if (error) return { count: 0, awaitingApprovalOrderCode: null };
 
     const order = result.data.activeOrder;
-    if (!order) return {count: 0, awaitingApprovalOrderCode: null};
+    if (!order) return { count: 0, awaitingApprovalOrderCode: null };
     if (order.state === 'AwaitingApproval') {
-        return {count: 0, awaitingApprovalOrderCode: order.code};
+        return { count: 0, awaitingApprovalOrderCode: order.code };
     }
     // Only count lines when the order is in AddingItems (editable cart).
-    if (order.state !== 'AddingItems') return {count: 0, awaitingApprovalOrderCode: null};
+    if (order.state !== 'AddingItems') return { count: 0, awaitingApprovalOrderCode: null };
 
-    return {count: order.lines.length, awaitingApprovalOrderCode: null};
+    return { count: order.lines.length, awaitingApprovalOrderCode: null };
 }
 
 export async function CartCountServer() {
     const ctx = await getVendureContext();
-    const {count, awaitingApprovalOrderCode} = await getCartStatus(ctx);
+    const { count, awaitingApprovalOrderCode } = await getCartStatus(ctx);
     return <CartStatusSync count={count} awaitingApprovalOrderCode={awaitingApprovalOrderCode} />;
 }

package/dist/assets/storefront/src/components/providers/company-context-guard.tsx

@@ -1,6 +1,6 @@
-import {cookies} from 'next/headers';
-import {getMyCompanies} from '@/lib/vendure/actions';
-import {redirect} from 'next/navigation';
+import { getMyCompanies } from '@/lib/vendure/actions';
+import { cookies } from 'next/headers';
+import { redirect } from 'next/navigation';
 
 const COMPANY_ID_COOKIE = 'vendure-company-id';
 
@@ -36,7 +36,7 @@ export async function CompanyContextGuard() {
     if (!companyId) return null;
 
     const companies = await getMyCompanies();
-    const isValid = companies.some(c => c.id === companyId);
+    const isValid = companies.some((c) => c.id === companyId);
     if (!isValid) {
         // Can't modify cookies in a Server Component, so redirect to a Route Handler
         // that clears the stale cookie and sends the user back.

package/dist/assets/storefront/src/components/providers/company-permissions-server.tsx

@@ -1,14 +1,10 @@
-import { getCompanyAccount } from '@/lib/vendure/actions';
 import { CompanyPermissionsProvider } from '@/lib/company-permissions-context';
+import { getCompanyAccount } from '@/lib/vendure/actions';
 import type { ReactNode } from 'react';
 
 export async function CompanyPermissionsServer({ children }: { children: ReactNode }) {
     const account = await getCompanyAccount();
     const permissions = account?.permissions ?? null;
 
-    return (
-        <CompanyPermissionsProvider permissions={permissions}>
-            {children}
-        </CompanyPermissionsProvider>
-    );
+    return <CompanyPermissionsProvider permissions={permissions}>{children}</CompanyPermissionsProvider>;
 }

package/dist/assets/storefront/src/components/providers/theme-provider.tsx

@@ -1,8 +1,8 @@
-"use client";
+'use client';
 
-import {ThemeProvider as NextThemesProvider} from "next-themes";
+import { ThemeProvider as NextThemesProvider } from 'next-themes';
 
-export function ThemeProvider({children}: {children: React.ReactNode}) {
+export function ThemeProvider({ children }: { children: React.ReactNode }) {
     return (
         <NextThemesProvider
             attribute="class"

package/dist/assets/storefront/src/components/shared/breadcrumbs.tsx

@@ -25,7 +25,10 @@ export async function Breadcrumbs({ items = [] }: BreadcrumbsProps) {
                     <li key={i} className="flex items-center gap-1.5">
                         <ChevronRight className="h-5 w-5" />
                         {item.href ? (
-                            <PrefetchLink href={item.href} className="hover:text-foreground transition-colors">
+                            <PrefetchLink
+                                href={item.href}
+                                className="hover:text-foreground transition-colors"
+                            >
                                 {item.name}
                             </PrefetchLink>
                         ) : (

package/dist/assets/storefront/src/components/shared/country-select.tsx

@@ -1,83 +1,79 @@
 'use client';
 
-import * as React from 'react';
-import { Check, ChevronsUpDown } from 'lucide-react';
-import { useTranslations } from 'next-intl';
-import { cn } from '@/lib/utils';
 import { Button } from '@/components/ui/button';
 import {
-  Command,
-  CommandEmpty,
-  CommandGroup,
-  CommandInput,
-  CommandItem,
-  CommandList,
+    Command,
+    CommandEmpty,
+    CommandGroup,
+    CommandInput,
+    CommandItem,
+    CommandList,
 } from '@/components/ui/command';
-import {
-  Popover,
-  PopoverContent,
-  PopoverTrigger,
-} from '@/components/ui/popover';
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
+import { cn } from '@/lib/utils';
+import { Check, ChevronsUpDown } from 'lucide-react';
+import { useTranslations } from 'next-intl';
+import * as React from 'react';
 
 interface Country {
-  code: string;
-  name: string;
+    code: string;
+    name: string;
 }
 
 interface CountrySelectProps {
-  countries: Country[];
-  value?: string;
-  onValueChange: (value: string) => void;
-  disabled?: boolean;
+    countries: Country[];
+    value?: string;
+    onValueChange: (value: string) => void;
+    disabled?: boolean;
 }
 
 export function CountrySelect({ countries, value, onValueChange, disabled }: CountrySelectProps) {
-  const t = useTranslations('Common');
-  const [open, setOpen] = React.useState(false);
-  const selectedCountry = countries.find((country) => country.code === value);
+    const t = useTranslations('Common');
+    const [open, setOpen] = React.useState(false);
+    const selectedCountry = countries.find((country) => country.code === value);
 
-  return (
-    <Popover open={open} onOpenChange={setOpen}>
-      <PopoverTrigger asChild>
-        <Button
-          variant="outline"
-          role="combobox"
-          aria-expanded={open}
-          className="w-full justify-between"
-          disabled={disabled}
-        >
-          {selectedCountry ? selectedCountry.name : t('selectCountry')}
-          <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
-        </Button>
-      </PopoverTrigger>
-      <PopoverContent className="w-full p-0" align="start">
-        <Command>
-          <CommandInput placeholder={t('searchCountry')} />
-          <CommandList>
-            <CommandEmpty>{t('noCountryFound')}</CommandEmpty>
-            <CommandGroup>
-              {countries.map((country) => (
-                <CommandItem
-                  key={country.code}
-                  value={country.name}
-                  onSelect={() => {
-                    onValueChange(country.code);
-                    setOpen(false);
-                  }}
+    return (
+        <Popover open={open} onOpenChange={setOpen}>
+            <PopoverTrigger asChild>
+                <Button
+                    variant="outline"
+                    role="combobox"
+                    aria-expanded={open}
+                    className="w-full justify-between"
+                    disabled={disabled}
                 >
-                  <Check
-                    className={cn(
-                      'mr-2 h-4 w-4',
-                      value === country.code ? 'opacity-100' : 'opacity-0'
-                    )}
-                  />
-                  {country.name}
-                </CommandItem>
-              ))}
-            </CommandGroup>
-          </CommandList>
-        </Command>
-      </PopoverContent>
-    </Popover>
-  );
+                    {selectedCountry ? selectedCountry.name : t('selectCountry')}
+                    <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
+                </Button>
+            </PopoverTrigger>
+            <PopoverContent className="w-full p-0" align="start">
+                <Command>
+                    <CommandInput placeholder={t('searchCountry')} />
+                    <CommandList>
+                        <CommandEmpty>{t('noCountryFound')}</CommandEmpty>
+                        <CommandGroup>
+                            {countries.map((country) => (
+                                <CommandItem
+                                    key={country.code}
+                                    value={country.name}
+                                    onSelect={() => {
+                                        onValueChange(country.code);
+                                        setOpen(false);
+                                    }}
+                                >
+                                    <Check
+                                        className={cn(
+                                            'mr-2 h-4 w-4',
+                                            value === country.code ? 'opacity-100' : 'opacity-0',
+                                        )}
+                                    />
+                                    {country.name}
+                                </CommandItem>
+                            ))}
+                        </CommandGroup>
+                    </CommandList>
+                </Command>
+            </PopoverContent>
+        </Popover>
+    );
 }

package/dist/assets/storefront/src/components/shared/pagination.tsx

@@ -1,17 +1,16 @@
 'use client';
 
-import {useSearchParams} from 'next/navigation';
-import {usePathname} from '@/i18n/navigation';
-import {ChevronLeft, ChevronRight} from 'lucide-react';
-import {Button} from '@/components/ui/button';
-import {Link} from "@/i18n/navigation";
+import { Button } from '@/components/ui/button';
+import { Link, usePathname } from '@/i18n/navigation';
+import { ChevronLeft, ChevronRight } from 'lucide-react';
+import { useSearchParams } from 'next/navigation';
 
 interface PaginationProps {
     currentPage: number;
     totalPages: number;
 }
 
-export function Pagination({currentPage, totalPages}: PaginationProps) {
+export function Pagination({ currentPage, totalPages }: PaginationProps) {
     const pathname = usePathname();
     const searchParams = useSearchParams();
 
@@ -27,11 +26,7 @@ export function Pagination({currentPage, totalPages}: PaginationProps) {
         const rangeWithDots = [];
 
         for (let i = 1; i <= totalPages; i++) {
-            if (
-                i === 1 ||
-                i === totalPages ||
-                (i >= currentPage - delta && i <= currentPage + delta)
-            ) {
+            if (i === 1 || i === totalPages || (i >= currentPage - delta && i <= currentPage + delta)) {
                 range.push(i);
             }
         }
@@ -52,19 +47,14 @@ export function Pagination({currentPage, totalPages}: PaginationProps) {
 
     return (
         <nav className="flex items-center justify-center gap-2">
-            <Button
-                variant="outline"
-                size="icon"
-                asChild
-                disabled={currentPage === 1}
-            >
+            <Button variant="outline" size="icon" asChild disabled={currentPage === 1}>
                 {currentPage === 1 ? (
                     <span className="cursor-not-allowed">
-                        <ChevronLeft className="h-4 w-4"/>
+                        <ChevronLeft className="h-4 w-4" />
                     </span>
                 ) : (
                     <Link href={createPageUrl(currentPage - 1)} prefetch={false}>
-                        <ChevronLeft className="h-4 w-4"/>
+                        <ChevronLeft className="h-4 w-4" />
                     </Link>
                 )}
             </Button>
@@ -92,25 +82,22 @@ export function Pagination({currentPage, totalPages}: PaginationProps) {
                         {isActive ? (
                             <span>{pageNum}</span>
                         ) : (
-                            <Link href={createPageUrl(pageNum)} prefetch={false}>{pageNum}</Link>
+                            <Link href={createPageUrl(pageNum)} prefetch={false}>
+                                {pageNum}
+                            </Link>
                         )}
                     </Button>
                 );
             })}
 
-            <Button
-                variant="outline"
-                size="icon"
-                asChild
-                disabled={currentPage === totalPages}
-            >
+            <Button variant="outline" size="icon" asChild disabled={currentPage === totalPages}>
                 {currentPage === totalPages ? (
                     <span className="cursor-not-allowed">
-                        <ChevronRight className="h-4 w-4"/>
+                        <ChevronRight className="h-4 w-4" />
                     </span>
                 ) : (
                     <Link href={createPageUrl(currentPage + 1)} prefetch={false}>
-                        <ChevronRight className="h-4 w-4"/>
+                        <ChevronRight className="h-4 w-4" />
                     </Link>
                 )}
             </Button>

package/dist/assets/storefront/src/components/shared/prefetch-link.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import {Link} from '@/i18n/navigation';
+import { Link } from '@/i18n/navigation';
 import { useState, type ComponentProps } from 'react';
 
 type PrefetchLinkProps = ComponentProps<typeof Link>;

package/dist/assets/storefront/src/components/shared/skeletons/search-input-skeleton.tsx

@@ -1,7 +1,5 @@
 import { Skeleton } from '@/components/ui/skeleton';
 
 export function SearchInputSkeleton() {
-    return (
-        <Skeleton className="h-9 w-64" />
-    );
+    return <Skeleton className="h-9 w-64" />;
 }