error order update

src/features/cart/ui/OrderPage.tsx

@@ -25,6 +25,7 @@ import {
   ZoomControl,
 } from '@pbe/react-yandex-maps';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
+import { AxiosError } from 'axios';
 import {
   CheckCircle2,
   Clock,
@@ -84,11 +85,14 @@ const OrderPage = () => {
       setCart(cart_id);
       queryClinet.refetchQueries({ queryKey: ['cart_items'] });
     },
-    onError: () => {
+    onError: (error: AxiosError) => {
-      toast.error('Xatolik yuz berdi', {
+      (
-        richColors: true,
+        error.response?.data as { items: { non_field_errors: string[] }[] }
-        position: 'top-center',
+      ).items
-      });
+        ?.flatMap((i) => i.non_field_errors || [])
+        .forEach((msg: string) =>
+          toast.error(msg, { richColors: true, position: 'top-center' }),
+        );
     },
   });
 
@@ -299,7 +303,7 @@ const OrderPage = () => {
                             <Input
                               {...field}
                               className="w-full border h-12 border-gray-300 rounded-lg px-4 py-3 focus:outline-none focus:border-blue-500"
-                              placeholder={t('Ism Familiyangiz')}
+                              placeholder={t('Familiyangiz')}
                             />
                           </FormControl>
                           <FormMessage />

src/widgets/categories/ui/category-carousel.tsx

@@ -125,6 +125,7 @@ export function CategoryCarousel({ category }: { category: CategoryResult }) {
             : 'bg-green-600/50 cursor-not-allowed',
         )}
         disabled={!canScrollNext}
+        aria-label="next images"
         size="icon"
       >
         <ChevronRight className="size-6" />
@@ -137,6 +138,7 @@ export function CategoryCarousel({ category }: { category: CategoryResult }) {
             ? 'bg-green-600 hover:bg-green-600/70'
             : 'bg-green-600/50 cursor-not-allowed',
         )}
+        aria-label="prev images"
         disabled={!canScrollPrev}
         size="icon"
       >

src/widgets/categories/ui/product-card.tsx

@@ -191,6 +191,7 @@ export function ProductCard({
                 e.stopPropagation();
                 favouriteMutation.mutate(product.id);
               }}
+              aria-label="liked"
               className="absolute top-2 right-2 z-10 bg-white hover:bg-gray-200 cursor-pointer rounded-full p-1.5 sm:p-2 shadow hover:scale-110"
             >
               <Heart

src/widgets/navbar/ui/ChangeLang.tsx

@@ -40,7 +40,7 @@ export function ChangeLang() {
                 alt="uz"
                 width={20}
                 height={20}
-                className="object-cover"
+                className="object-cover w-full h-full"
               />
             ) : (
               <Image
@@ -48,7 +48,7 @@ export function ChangeLang() {
                 alt="ru"
                 width={20}
                 height={20}
-                className="object-cover"
+                className="object-cover w-full h-full"
               />
             )}
           </div>

src/widgets/navbar/ui/index.tsx

@@ -144,32 +144,56 @@ const Navbar = () => {
 
             {/* Ijtimoiy tarmoqlar */}
             <li className="text-white hover:text-white/80 transition-colors cursor-pointer">
-              <a href={'#'} className="flex items-center gap-2">
+              <a
+                href={'#'}
+                className="flex items-center gap-2"
+                aria-label="telegram"
+              >
                 <Send className="size-4" />
               </a>
             </li>
             <li className="text-white hover:text-white/80 transition-colors cursor-pointer">
-              <a href={'#'} className="flex items-center gap-2">
+              <a
+                href={'#'}
+                className="flex items-center gap-2"
+                aria-label="Instagram"
+              >
                 <Instagram className="size-4" />
               </a>
             </li>
             <li className="text-white hover:text-white/80 transition-colors cursor-pointer">
-              <a href={'#'} className="flex items-center gap-2">
+              <a
+                href={'#'}
+                className="flex items-center gap-2"
+                aria-label="Facebook"
+              >
                 <Facebook className="size-4" />
               </a>
             </li>
             <li className="text-white hover:text-white/80 transition-colors cursor-pointer">
-              <a href={'#'} className="flex items-center gap-2">
+              <a
+                href={'#'}
+                className="flex items-center gap-2"
+                aria-label="Twitter"
+              >
                 <Twitter className="size-4" />
               </a>
             </li>
             <li className="text-white hover:text-white/80 transition-colors cursor-pointer">
-              <a href={'#'} className="flex items-center gap-2">
+              <a
+                href={'#'}
+                className="flex items-center gap-2"
+                aria-label="Mail"
+              >
                 <Mail className="size-4" />
               </a>
             </li>
             <li className="text-white hover:text-white/80 transition-colors cursor-pointer">
-              <a href={'tel:+998901234567'} className="flex items-center gap-2">
+              <a
+                href={'tel:+998901234567'}
+                className="flex items-center gap-2"
+                aria-label="Phone"
+              >
                 <Phone className="size-4" />
                 <p>{formatPhone('+998901234567')}</p>
               </a>
@@ -404,6 +428,7 @@ const Navbar = () => {
               variant={'ghost'}
               className="h-10 max-lg:hidden cursor-pointer border border-slate-200"
               onClick={() => router.push('/favourite')}
+              aria-label="my favouurite product"
             >
               <Heart className="size-4 text-foreground" />
             </Button>
@@ -427,6 +452,7 @@ const Navbar = () => {
                   router.push('/auth');
                 }
               }}
+              aria-label="my account"
               className="h-10 max-lg:hidden cursor-pointer border border-slate-200"
             >
               <User className="size-4 text-foreground" />

src/widgets/welcome/ui/index.tsx

@@ -71,7 +71,7 @@ const Welcome = () => {
           <CarouselContent>
             {isLoading && (
               <CarouselItem className="relative">
-                <Skeleton className="w-full h-full" />
+                <Skeleton className="w-full h-[200px]" />
               </CarouselItem>
             )}
             {isError && (
@@ -88,11 +88,11 @@ const Welcome = () => {
                     className="relative overflow-hidden rounded-2xl"
                   >
                     <Image
-                      src={BASE_URL + banner.banner || '/placeholder.svg'}
+                      src={BASE_URL + banner.banner}
                       alt={banner.id}
-                      fill
+                      width={900}
-                      className="object-cover"
+                      height={900}
-                      priority={index === 0}
+                      className="object-cover w-full h-full"
                     />
                   </AspectRatio>
                   <Button
@@ -100,6 +100,7 @@ const Welcome = () => {
                     className="absolute max-lg:w-6 max-lg:h-6 top-1/2 -translate-y-1/2 right-2 cursor-pointer"
                     variant={'secondary'}
                     size={'icon'}
+                    aria-label="next images"
                   >
                     <ChevronRight className="size-6 max-lg:size-5" />
                   </Button>
@@ -108,6 +109,7 @@ const Welcome = () => {
                     className="absolute max-lg:w-6 max-lg:h-6 top-1/2 -translate-y-1/2 left-5 cursor-pointer"
                     variant={'secondary'}
                     size={'icon'}
+                    aria-label="prev images"
                   >
                     <ChevronLeft className="size-6 max-lg:size-5" />
                   </Button>
@@ -146,6 +148,7 @@ const Welcome = () => {
             className="absolute max-lg:w-8 max-lg:h-8 top-1/2 -translate-y-1/2 -right-2 cursor-pointer"
             variant={'secondary'}
             size={'icon'}
+            aria-label="next images"
           >
             <ChevronRight className="size-6 max-lg:size-6" />
           </Button>
@@ -154,6 +157,7 @@ const Welcome = () => {
             className="absolute max-lg:w-8 max-lg:h-8 top-1/2 -translate-y-1/2 -left-2 cursor-pointer"
             variant={'secondary'}
             size={'icon'}
+            aria-label="prev images"
           >
             <ChevronLeft className="size-6 max-lg:size-6" />
           </Button>