bug fix

src/features/about/ui/AboutPage.tsx

@@ -90,7 +90,7 @@ export function PartnershipForm() {
       form.reset();
     },
     onError: () => {
-      toast.error('Xatolik yuz berdi', {
+      toast.error(t('Xatolik yuz berdi'), {
         richColors: true,
         position: 'top-center',
       });

src/features/cart/lib/api.ts

@@ -2,7 +2,7 @@ import httpClient from '@/shared/config/api/httpClient';
 import { API_URLS } from '@/shared/config/api/URLs';
 import { AxiosResponse } from 'axios';
 
-interface CartItem {
+export interface CartItem {
   id: string;
   cart_item: {
     id: number;

src/features/cart/ui/OrderPage.tsx

@@ -25,6 +25,7 @@ import {
   SelectValue,
 } from '@/shared/ui/select';
 import { Textarea } from '@/shared/ui/textarea';
+import { userStore } from '@/widgets/welcome/lib/hook';
 import { zodResolver } from '@hookform/resolvers/zod';
 import {
   Map,
@@ -72,6 +73,7 @@ const deliveryTimeSlots = [
 
 const OrderPage = () => {
   const t = useTranslations();
+  const { user } = userStore();
   const form = useForm<z.infer<typeof orderForm>>({
     resolver: zodResolver(orderForm),
     defaultValues: {
@@ -103,7 +105,7 @@ const OrderPage = () => {
 
         queryClinet.refetchQueries({ queryKey: ['cart_items'] });
       } else {
-        toast.error('Xatolik yuz berdi', {
+        toast.error(t('Xatolik yuz berdi'), {
           richColors: true,
           position: 'top-center',
         });
@@ -235,7 +237,7 @@ const OrderPage = () => {
 
   function onSubmit(value: z.infer<typeof orderForm>) {
     if (!cartItems || cartItems.length === 0) {
-      toast.error("Savatcha bo'sh", {
+      toast.error(t("Savatcha bo'sh"), {
         richColors: true,
         position: 'top-center',
       });
@@ -244,7 +246,7 @@ const OrderPage = () => {
 
     // Yetkazib berish vaqtini tekshirish
     if (!deliveryDate) {
-      toast.error('Yetkazib berish sanasini tanlang', {
+      toast.error(t('Yetkazib berish sanasini tanlang'), {
         richColors: true,
         position: 'top-center',
       });
@@ -252,7 +254,7 @@ const OrderPage = () => {
     }
 
     if (!selectedTimeSlot) {
-      toast.error('Yetkazib berish vaqtini tanlang', {
+      toast.error(t('Yetkazib berish vaqtini tanlang'), {
         richColors: true,
         position: 'top-center',
       });
@@ -276,25 +278,31 @@ const OrderPage = () => {
         product_price: item.product.prices![0].price,
         warehouse_code: 'wh1',
       }));
-
-    mutate({
-      order: [
-        {
-          filial_code: 'dodge',
-          delivery_date: formatDate.format(deliveryDate, 'DD.MM.YYYY'),
-          room_code: '100',
-          deal_time: formatDate.format(deliveryDate, 'DD.MM.YYYY'),
-          robot_code: 'r2',
-          status: 'B#N',
-          sales_manager_code: '1',
-          person_code: '12345678',
-          currency_code: '860',
-          owner_person_code: '1234567',
-          note: value.comment,
-          order_products: order_products,
-        },
-      ],
-    });
+    if (user) {
+      mutate({
+        order: [
+          {
+            filial_code: 'dodge',
+            delivery_date: formatDate.format(deliveryDate, 'DD.MM.YYYY'),
+            room_code: '100',
+            deal_time: formatDate.format(deliveryDate, 'DD.MM.YYYY'),
+            robot_code: 'r2',
+            status: 'B#N',
+            sales_manager_code: '1',
+            person_code: user?.person_id.toString(),
+            currency_code: '860',
+            owner_person_code: user?.person_id.toString(),
+            note: value.comment,
+            order_products: order_products,
+          },
+        ],
+      });
+    } else {
+      toast.error(t('Xatolik yuz berdi'), {
+        richColors: true,
+        position: 'top-center',
+      });
+    }
   }
 
   if (orderSuccess) {

src/features/favourite/ui/Favourite.tsx

@@ -110,7 +110,7 @@ export default function Favourite() {
           {favourite &&
             !isLoading &&
             favourite?.results
-              .filter((product) => product.is_active)
+              .filter((product) => product.state === 'A')
               .map((product) => (
                 <ProductCard key={product.id} product={product} />
               ))}

src/features/product/ui/Product.tsx

@@ -5,7 +5,6 @@ import { product_api } from '@/shared/config/api/product/api';
 import { BASE_URL } from '@/shared/config/api/URLs';
 import { useCartId } from '@/shared/hooks/cartId';
 import formatPrice from '@/shared/lib/formatPrice';
-import { Card } from '@/shared/ui/card';
 import {
   Carousel,
   CarouselContent,
@@ -27,432 +26,284 @@ import { toast } from 'sonner';
 
 const ProductDetail = () => {
   const t = useTranslations();
-  const [quantity, setQuantity] = useState<number>(1);
-  const { product } = useParams();
+  const { product } = useParams<{ product: string }>();
   const queryClient = useQueryClient();
-  const [selectedImage, setSelectedImage] = useState<number>(0);
-  const debounceRef = useRef<NodeJS.Timeout | null>(null);
   const { cart_id } = useCartId();
 
+  const [quantity, setQuantity] = useState(1);
+  const [selectedImage, setSelectedImage] = useState(0);
+  const debounceRef = useRef<NodeJS.Timeout | null>(null);
+
+  /* ---------------- CART ITEMS ---------------- */
   const { data: cartItems } = useQuery({
     queryKey: ['cart_items', cart_id],
     queryFn: () => cart_api.get_cart_items(cart_id!),
     enabled: !!cart_id,
   });
 
+  /* ---------------- PRODUCT DETAIL ---------------- */
   const { data, isLoading } = useQuery({
     queryKey: ['product_detail', product],
-    queryFn: () => {
-      if (product) return product_api.detail(product.toString());
-    },
-    select(data) {
-      return data?.data;
-    },
+    queryFn: () => product_api.detail(product),
+    select: (res) => res.data,
     enabled: !!product,
   });
 
-  const { data: recomendation, isLoading: proLoad } = useQuery({
+  /* ---------------- RECOMMENDATION ---------------- */
+  const { data: recomendation, isLoading: recLoad } = useQuery({
     queryKey: ['product_list'],
     queryFn: () => product_api.list({ page: 1, page_size: 12 }),
-    select(data) {
-      return data.data.results;
-    },
+    select: (res) => res.data.results,
   });
 
+  /* ---------------- PRICE ---------------- */
+  const price = Number(data?.prices?.[0]?.price || 0);
+
+  /* ---------------- SYNC CART QUANTITY ---------------- */
   useEffect(() => {
     if (!data || !cartItems) return;
 
-    const item = cartItems?.data.cart_item.find(
-      (item) => Number(item.product.id) === data?.id,
+    const item = cartItems.data.cart_item.find(
+      (i) => Number(i.product.id) === data.id,
     );
 
-    if (item) {
-      setQuantity(item.quantity);
-    } else {
-      setQuantity(1);
-    }
+    setQuantity(item ? item.quantity : 1);
   }, [data, cartItems]);
 
+  /* ---------------- DEBOUNCE UPDATE ---------------- */
   useEffect(() => {
-    if (!cart_id || !data || !cartItems) return;
-    if (quantity <= 0) return;
+    if (!cart_id || !data || !cartItems || quantity <= 0) return;
 
-    const cartItem = cartItems?.data?.cart_item.find(
-      (item) => Number(item.product.id) === data?.id,
+    const cartItem = cartItems.data.cart_item.find(
+      (i) => Number(i.product.id) === data.id,
     );
 
-    if (!cartItem) return;
-    if (cartItem.quantity === quantity) return;
+    if (!cartItem || cartItem.quantity === quantity) return;
 
     if (debounceRef.current) clearTimeout(debounceRef.current);
 
     debounceRef.current = setTimeout(() => {
       updateCartItem({
-        body: { quantity },
         cart_item_id: cartItem.id.toString(),
+        body: { quantity },
       });
     }, 500);
 
     return () => {
       if (debounceRef.current) clearTimeout(debounceRef.current);
     };
-  }, [quantity, cart_id, data, cartItems]);
+  }, [quantity]);
 
-  const { mutate } = useMutation({
+  /* ---------------- ADD TO CART ---------------- */
+  const { mutate: addToCart } = useMutation({
     mutationFn: (body: { product: string; quantity: number; cart: string }) =>
       cart_api.cart_item(body),
     onSuccess: () => {
       queryClient.refetchQueries({ queryKey: ['cart_items'] });
-      toast.success(t("Mahsulot savatga qo'shildi"), {
-        richColors: true,
-        position: 'top-center',
-      });
+      toast.success(t("Mahsulot savatga qo'shildi"), { richColors: true });
     },
     onError: (err: AxiosError) => {
-      const detail = (err.response?.data as { detail: string }).detail;
-      toast.error(detail || err.message, {
-        richColors: true,
-        position: 'top-center',
-      });
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      const msg = (err.response?.data as any)?.detail || err.message;
+      toast.error(msg, { richColors: true });
     },
   });
 
   const { mutate: updateCartItem } = useMutation({
-    mutationFn: ({
-      body,
-      cart_item_id,
-    }: {
-      body: { quantity: number };
+    mutationFn: (payload: {
       cart_item_id: string;
-    }) => cart_api.update_cart_item({ body, cart_item_id }),
-    onSuccess: () => {
-      queryClient.refetchQueries({ queryKey: ['cart_items'] });
-    },
-    onError: (err: AxiosError) => {
-      toast.error(err.message, { richColors: true, position: 'top-center' });
-    },
+      body: { quantity: number };
+    }) => cart_api.update_cart_item(payload),
+    onSuccess: () => queryClient.refetchQueries({ queryKey: ['cart_items'] }),
   });
 
+  /* ---------------- FAVOURITE ---------------- */
   const favouriteMutation = useMutation({
-    mutationFn: (productId: string) => product_api.favourite(productId),
+    mutationFn: (id: string) => product_api.favourite(id),
     onSuccess: () => {
-      queryClient.refetchQueries({ queryKey: ['product_list'] });
-      queryClient.refetchQueries({ queryKey: ['product_detail', product] });
+      queryClient.invalidateQueries({ queryKey: ['product_detail'] });
+      queryClient.invalidateQueries({ queryKey: ['product_list'] });
     },
   });
 
-  const handleQuantityChange = (type: string) => {
-    if (type === 'increase') {
-      setQuantity(quantity + 1);
-    } else if (type === 'decrease' && quantity > 1) {
-      setQuantity(quantity - 1);
-    }
-  };
-
+  /* ---------------- HANDLERS ---------------- */
   const handleAddToCart = () => {
     if (!data || !cart_id) return;
 
     const cartItem = cartItems?.data.cart_item.find(
-      (e) => Number(e.product.id) === data.id,
+      (i) => Number(i.product.id) === data.id,
     );
 
     if (cartItem) {
       updateCartItem({
-        body: { quantity: quantity },
         cart_item_id: cartItem.id.toString(),
+        body: { quantity },
       });
     } else {
-      mutate({
+      addToCart({
         product: String(data.id),
         cart: cart_id,
-        quantity: quantity,
+        quantity,
       });
     }
   };
 
+  /* ---------------- LOADING ---------------- */
   if (isLoading) {
     return (
-      <div className="custom-container pb-5">
-        <div className="w-full max-w-4xl space-y-6">
-          <div className="h-[400px] bg-gray-100 animate-pulse rounded-lg"></div>
-          <div className="h-8 bg-gray-100 animate-pulse rounded w-3/4"></div>
-          <div className="h-6 bg-gray-100 animate-pulse rounded w-1/4"></div>
-          <div className="h-4 bg-gray-100 animate-pulse rounded w-full"></div>
-          <div className="h-4 bg-gray-100 animate-pulse rounded w-5/6"></div>
-          <div className="flex gap-4 mt-4">
-            <div className="h-10 bg-gray-100 animate-pulse rounded flex-1"></div>
-            <div className="h-10 bg-gray-100 animate-pulse rounded w-12"></div>
-          </div>
-        </div>
+      <div className="custom-container py-6">
+        <Skeleton className="h-[400px] w-full rounded-lg" />
       </div>
     );
   }
 
+  /* ===================== RENDER ===================== */
   return (
-    <div className="custom-container pb-5">
-      <div className="">
-        <div className="bg-white rounded-lg shadow-md p-6 mb-8">
-          <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
-            <div>
-              <div className="relative rounded-lg overflow-hidden mb-4">
-                {data && (
-                  <Image
-                    width={500}
-                    height={500}
-                    src={
-                      data.images.length > 0
-                        ? data.images[selectedImage].image
-                        : data.image || '/placeholder.svg'
-                    }
-                    alt={data.name}
-                    className="w-full h-[400px] object-contain"
-                  />
-                )}
-              </div>
+    <div className="custom-container pb-8">
+      <div className="grid grid-cols-1 md:grid-cols-2 gap-8 bg-white p-6 rounded-lg shadow">
+        {/* IMAGES */}
+        <div>
+          <Image
+            width={500}
+            height={500}
+            src={
+              data && data?.images?.length !== 0
+                ? BASE_URL + data.images[selectedImage]?.image
+                : data?.images[selectedImage]?.image
+                  ? BASE_URL + data.images[selectedImage]?.image
+                  : '/placeholder.svg'
+            }
+            alt={data?.name || 'logo'}
+            className="w-full h-[400px] object-contain"
+          />
 
-              <Carousel
-                opts={{
-                  align: 'start',
-                  dragFree: true,
-                }}
-                className="w-full"
-              >
-                <CarouselContent className="-ml-2 pr-[15%] sm:pr-0">
-                  {data && data.images.length > 0 ? (
-                    data.images.map((img, index) => (
-                      <CarouselItem
-                        key={img.id}
-                        className="pl-2 basis-1/3 sm:basis-1/4 md:basis-1/5 lg:basis-1/6"
-                      >
-                        <button
-                          onClick={() => setSelectedImage(index)}
-                          className={`aspect-square w-full rounded-lg border-2 overflow-hidden transition ${
-                            selectedImage === index
-                              ? 'border-blue-500'
-                              : 'border-gray-200 hover:border-blue-300'
-                          }`}
-                        >
-                          <Image
-                            src={
-                              img.image.includes(BASE_URL)
-                                ? img.image
-                                : BASE_URL + img.image || '/placeholder.svg'
-                            }
-                            alt={BASE_URL + data?.image}
-                            width={150}
-                            height={150}
-                            className="w-full h-full object-contain"
-                          />
-                        </button>
-                      </CarouselItem>
-                    ))
-                  ) : (
-                    <CarouselItem className="pl-2 basis-1/3 sm:basis-1/4 md:basis-1/5 lg:basis-1/6">
-                      <button
-                        className={`aspect-square w-full rounded-lg border-2 overflow-hidden transition ${'border-blue-500'}`}
-                      >
-                        <Image
-                          src={
-                            data?.image.includes(BASE_URL)
-                              ? data.image
-                              : BASE_URL + data?.image || '/placeholder.svg'
-                          }
-                          alt={BASE_URL + data?.image}
-                          width={150}
-                          height={150}
-                          className="w-full h-full object-contain"
-                        />
-                      </button>
-                    </CarouselItem>
-                  )}
-                </CarouselContent>
-              </Carousel>
-            </div>
-
-            {/* Product Info */}
-            <div>
-              <h1 className="text-3xl font-bold text-gray-800 mb-2">
-                {data?.name}
-              </h1>
-
-              {/* Price */}
-              <div className="mb-6">
-                <div className="flex items-center gap-3 max-lg:flex-col max-lg:items-start">
-                  <span className="text-4xl font-bold text-blue-600">
-                    {data && formatPrice(data.price, true)}
-                  </span>
-                </div>
-              </div>
-
-              {/* Description */}
-              <p className="text-gray-600 mb-6">{data?.description}</p>
-
-              {/* Quantity Selector */}
-              <div className="mb-6">
-                <label className="text-gray-700 font-medium mb-2 block">
-                  {t('Miqdor')}:
-                </label>
-                <div className="flex items-center gap-4 max-lg:flex-col max-lg:items-start">
-                  <div className="flex items-center border border-gray-300 rounded-lg">
-                    <button
-                      onClick={() => handleQuantityChange('decrease')}
-                      className="p-3 hover:bg-gray-100 transition rounded-lg"
-                      disabled={quantity <= 1}
-                    >
-                      <Minus className="w-5 h-5" />
-                    </button>
-                    <Input
-                      value={quantity}
-                      onChange={(e) => {
-                        const v = e.target.value;
-                        if (!/^\d*$/.test(v)) return;
-                        const num = Number(v);
-                        if (num > 0) {
-                          setQuantity(num);
-                        }
-                      }}
-                      inputMode="numeric"
-                      className="w-14 h-12 border-none text-center text-sm !p-0 focus-visible:ring-0"
-                    />
-                    <button
-                      onClick={() => handleQuantityChange('increase')}
-                      className="p-3 hover:bg-gray-100 transition rounded-lg"
-                    >
-                      <Plus className="w-5 h-5" />
-                    </button>
-                  </div>
-                  <span className="text-gray-600">
-                    {t('Jami')}:{' '}
-                    <span className="font-bold text-lg">
-                      {data && formatPrice(data.price * quantity, true)}
-                    </span>
-                  </span>
-                </div>
-              </div>
-
-              {/* Action Buttons */}
-              <div className="flex gap-4 mb-6">
-                <button
-                  onClick={handleAddToCart}
-                  className="flex-1 py-4 rounded-lg cursor-pointer font-semibold text-white flex items-center justify-center gap-2 transition bg-green-600 hover:bg-green-700"
-                >
-                  <ShoppingCart className="w-5 h-5" />
-                  {t('Savatga')}
-                </button>
-                <button
-                  onClick={() => {
-                    if (product) {
-                      favouriteMutation.mutate(product.toString());
-                    }
-                  }}
-                  disabled={favouriteMutation.isPending}
-                  className={`p-4 rounded-lg border-2 transition ${
-                    data?.liked
-                      ? 'border-red-500 bg-red-50'
-                      : 'border-gray-300 hover:border-red-500'
-                  }`}
-                >
-                  <Heart
-                    className={`w-6 h-6 ${
-                      data?.liked
-                        ? 'fill-red-500 text-red-500'
-                        : 'text-gray-600'
+          <Carousel className="mt-4">
+            <CarouselContent>
+              {data?.images?.map((img, i) => (
+                <CarouselItem key={img.id} className="basis-1/4">
+                  <button
+                    onClick={() => setSelectedImage(i)}
+                    className={`border rounded-lg p-1 ${
+                      i === selectedImage
+                        ? 'border-blue-500'
+                        : 'border-gray-200'
                     }`}
-                  />
-                </button>
-              </div>
-
-              {/* Features */}
-              <div className="grid grid-cols-2 gap-4 border-t pt-6">
-                <div className="flex flex-col items-center text-center">
-                  <Truck className="w-8 h-8 text-blue-600 mb-2" />
-                  <span className="text-sm text-gray-600">
-                    {t('Bepul yetkazib berish')}
-                  </span>
-                </div>
-                <div className="flex flex-col items-center text-center">
-                  <Shield className="w-8 h-8 text-blue-600 mb-2" />
-                  <span className="text-sm text-gray-600">{t('Kafolat')}</span>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-
-        {/* Specifications */}
-        <div className="bg-white rounded-lg shadow-md p-6 mb-8">
-          <h2 className="text-2xl font-bold mb-4">{t('Xususiyatlari')}</h2>
-          <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
-            <div className="flex justify-between border-b pb-2 gap-4">
-              <span className="text-gray-600">{t('Qadoq turi')}:</span>
-              <span className="font-semibold text-right">
-                {data?.unity.name}
-              </span>
-            </div>
-            {data?.brand && (
-              <div className="flex justify-between border-b pb-2 gap-4">
-                <span className="text-gray-600">{t('Brandi')}:</span>
-                <span className="font-semibold text-right">{data?.brand}</span>
-              </div>
-            )}
-            {data?.manufacturer && (
-              <div className="flex justify-between border-b pb-2 gap-4">
-                <span className="text-gray-600">
-                  {t('Ishlab chiqaruvchi')}:
-                </span>
-                <span className="font-semibold text-right">
-                  {data?.manufacturer}
-                </span>
-              </div>
-            )}
-            {data?.volume && (
-              <div className="flex justify-between border-b pb-2 gap-4">
-                <span className="text-gray-600">{t('Hajmi')}:</span>
-                <span className="font-semibold text-right">{data?.volume}</span>
-              </div>
-            )}
-          </div>
-        </div>
-
-        {/* Related Products */}
-        <div className="bg-white rounded-lg shadow-md p-6">
-          <h2 className="text-2xl font-bold mb-6">
-            {t("O'xshash mahsulotlar")}
-          </h2>
-          <Carousel className="w-full">
-            <CarouselContent className="pr-[12%] sm:pr-0">
-              {proLoad &&
-                Array.from({ length: 6 }).map((__, index) => (
-                  <CarouselItem
-                    key={index}
-                    className="basis-1/2 sm:basis-1/3 md:basis-1/4 lg:basis-1/5 xl:basis-1/6 pb-2"
                   >
-                    <Card className="p-3 space-y-3 rounded-xl">
-                      <Skeleton className="h-40 sm:h-48 md:h-56 w-full rounded-lg" />
-                      <Skeleton className="h-4 w-3/4" />
-                      <Skeleton className="h-4 w-1/2" />
-                      <Skeleton className="h-10 w-full rounded-lg" />
-                    </Card>
-                  </CarouselItem>
-                ))}
-              {recomendation &&
-                !proLoad &&
-                recomendation
-                  .filter((product) => product.state === 'A')
-                  .map((product) => (
-                    <CarouselItem
-                      key={product.id}
-                      className="basis-1/2 sm:basis-1/3 md:basis-1/3 lg:basis-1/5 xl:basis-1/6 pb-2"
-                    >
-                      <ProductCard product={product} />
-                    </CarouselItem>
-                  ))}
+                    <Image
+                      src={BASE_URL + img.image}
+                      alt=""
+                      width={120}
+                      height={120}
+                      className="object-contain"
+                    />
+                  </button>
+                </CarouselItem>
+              ))}
             </CarouselContent>
-
-            <CarouselPrevious className="hidden lg:flex -top-12 right-12 w-9 h-9 bg-blue-600 text-white border-0" />
-            <CarouselNext className="hidden lg:flex -top-12 right-0 w-9 h-9 bg-blue-600 text-white border-0" />
           </Carousel>
         </div>
+
+        {/* INFO */}
+        <div>
+          <h1 className="text-3xl font-bold mb-2">{data?.name}</h1>
+
+          <div className="text-4xl font-bold text-blue-600 mb-4">
+            {formatPrice(price, true)}
+          </div>
+
+          <p className="text-gray-600 mb-6">{data?.short_name}</p>
+
+          {/* QUANTITY */}
+          <div className="flex items-center gap-4 mb-6">
+            <button
+              onClick={() => setQuantity((q) => Math.max(1, q - 1))}
+              className="p-2 border rounded"
+            >
+              <Minus />
+            </button>
+
+            <Input
+              value={quantity}
+              onChange={(e) => {
+                const v = Number(e.target.value);
+                if (v > 0) setQuantity(v);
+              }}
+              className="w-16 text-center"
+            />
+
+            <button
+              onClick={() => setQuantity((q) => q + 1)}
+              className="p-2 border rounded"
+            >
+              <Plus />
+            </button>
+          </div>
+
+          <div className="mb-6 font-semibold">
+            {t('Jami')}: {formatPrice(price * quantity, true)}
+          </div>
+
+          {/* ACTIONS */}
+          <div className="flex gap-3">
+            <button
+              onClick={handleAddToCart}
+              className="flex-1 bg-green-600 hover:bg-green-700 text-white py-3 rounded-lg flex justify-center items-center gap-2"
+            >
+              <ShoppingCart />
+              {t('Savatga')}
+            </button>
+
+            <button
+              onClick={() => favouriteMutation.mutate(product)}
+              className={`p-3 rounded-lg border ${
+                data?.liked ? 'border-red-500 bg-red-50' : 'border-gray-300'
+              }`}
+            >
+              <Heart
+                className={data?.liked ? 'fill-red-500 text-red-500' : ''}
+              />
+            </button>
+          </div>
+
+          {/* FEATURES */}
+          <div className="grid grid-cols-2 gap-4 mt-6 border-t pt-4">
+            <div className="text-center">
+              <Truck className="mx-auto mb-1" />
+              {t('Bepul yetkazib berish')}
+            </div>
+            <div className="text-center">
+              <Shield className="mx-auto mb-1" />
+              {t('Kafolat')}
+            </div>
+          </div>
+        </div>
+      </div>
+
+      {/* RELATED */}
+      <div className="mt-10 bg-white p-6 rounded-lg shadow">
+        <h2 className="text-2xl font-bold mb-4">{t("O'xshash mahsulotlar")}</h2>
+
+        <Carousel>
+          <CarouselContent>
+            {recLoad &&
+              Array.from({ length: 6 }).map((_, i) => (
+                <CarouselItem key={i} className="basis-1/5">
+                  <Skeleton className="h-60 w-full" />
+                </CarouselItem>
+              ))}
+
+            {recomendation
+              ?.filter((p) => p.state === 'A')
+              .map((p) => (
+                <CarouselItem key={p.id} className="basis-1/5">
+                  <ProductCard product={p} />
+                </CarouselItem>
+              ))}
+          </CarouselContent>
+
+          <CarouselPrevious />
+          <CarouselNext />
+        </Carousel>
       </div>
     </div>
   );

src/features/profile/lib/order.ts

@@ -1,16 +1,16 @@
 // store/orderStore.ts
+import { CartItem } from '@/features/cart/lib/api';
 import { create } from 'zustand';
-import { OrderListRes } from './api';
 
 type State = {
-  order: OrderListRes | null;
+  order: CartItem | null;
 };
 
 type Actions = {
-  setOrder: (order: OrderListRes) => void;
+  setOrder: (order: CartItem) => void;
 };
 
-const getInitialOrder = (): OrderListRes | null => {
+const getInitialOrder = (): CartItem | null => {
   if (typeof window === 'undefined') return null; // SSR check
   const stored = localStorage.getItem('order');
   if (!stored) return null;
@@ -24,7 +24,7 @@ const getInitialOrder = (): OrderListRes | null => {
 
 const useOrderStore = create<State & Actions>((set) => ({
   order: getInitialOrder(),
-  setOrder: (order: OrderListRes) => {
+  setOrder: (order: CartItem) => {
     if (typeof window !== 'undefined') {
       localStorage.setItem('order', JSON.stringify(order));
     }

src/features/profile/ui/History.tsx

@@ -18,12 +18,10 @@ import { useTranslations } from 'next-intl';
 import { useSearchParams } from 'next/navigation';
 import { useEffect, useState } from 'react';
 import { order_api, OrderListRes } from '../lib/api';
-import useOrderStore from '../lib/order';
 
 const HistoryTabs = () => {
   const t = useTranslations();
   const searchParams = useSearchParams();
-  const { setOrder } = useOrderStore();
   const [page, setPage] = useState(1);
   const PAGE_SIZE = 36;
   const router = useRouter();
@@ -218,7 +216,7 @@ const HistoryTabs = () => {
                       size="sm"
                       onClick={() => {
                         router.push('/profile/refresh-order');
-                        setOrder(order);
+                        // setOrder(order);
                       }}
                       className="bg-transparent gap-1 md:gap-2 text-xs md:text-sm h-8 md:h-9 px-2 md:px-3"
                     >

src/features/profile/ui/RefreshOrder.tsx

@@ -73,15 +73,12 @@ const RefreshOrder = () => {
   const t = useTranslations();
   const queryClient = useQueryClient();
 
-  const initialCartItems = initialValues?.items.map((item) => ({
+  const initialCartItems = initialValues?.cart_item.map((item) => ({
     id: item.id,
     product_id: item.product.id,
     product_name: item.product.name,
-    product_price: item.price,
-    product_image:
-      item.product.image ||
-      item.product.images?.[0]?.image ||
-      '/placeholder.svg',
+    product_price: item.product.prices[0].price,
+    product_image: item.product.images[0].image || '/placeholder.svg',
     quantity: item.quantity,
   }));
 
@@ -90,7 +87,7 @@ const RefreshOrder = () => {
   const form = useForm<z.infer<typeof orderForm>>({
     resolver: zodResolver(orderForm),
     defaultValues: {
-      comment: initialValues?.comment,
+      comment: '',
       lat: '41.311081',
       long: '69.240562',
     },
@@ -100,7 +97,7 @@ const RefreshOrder = () => {
 
   const subtotal = cartItems
     ? cartItems.reduce(
-        (sum, item) => sum + item.product_price * item.quantity,
+        (sum, item) => sum + Number(item.product_price) * item.quantity,
         0,
       )
     : 0;
@@ -114,7 +111,7 @@ const RefreshOrder = () => {
       queryClient.refetchQueries({ queryKey: ['cart_items'] });
     },
     onError: () => {
-      toast.error('Xatolik yuz berdi', {
+      toast.error(t('Xatolik yuz berdi'), {
         richColors: true,
         position: 'top-center',
       });
@@ -205,7 +202,7 @@ const RefreshOrder = () => {
 
   const onSubmit = (value: z.infer<typeof orderForm>) => {
     if (!deliveryDate) {
-      toast.error('Yetkazib berish sanasini tanlang', {
+      toast.error(t('Yetkazib berish sanasini tanlang'), {
         richColors: true,
         position: 'top-center',
       });
@@ -213,7 +210,7 @@ const RefreshOrder = () => {
     }
 
     if (!selectedTimeSlot) {
-      toast.error('Yetkazib berish vaqtini tanlang', {
+      toast.error(t('Yetkazib berish vaqtini tanlang'), {
         richColors: true,
         position: 'top-center',
       });
@@ -221,25 +218,48 @@ const RefreshOrder = () => {
     }
 
     if (initialValues === null) {
-      toast.error('Savatcha bo‘sh', {
+      toast.error(t('Savatcha bo‘sh'), {
         richColors: true,
         position: 'top-center',
       });
       return;
     }
 
-    const items = initialValues.items.map((item) => ({
-      product_id: Number(item.product.id),
-      quantity: item.quantity,
-    }));
+    const order_products = initialValues.cart_item
+      .filter(
+        (item) =>
+          item.product.prices &&
+          item.product.prices.length > 0 &&
+          item.product.prices[0].price_type?.code &&
+          item.product.prices[0].price,
+      )
+      .map((item) => ({
+        inventory_kind: 'G',
+        product_code: item.product.code,
+        on_balance: 'Y',
+        order_quant: item.quantity,
+        price_type_code: item.product.prices![0].price_type.code,
+        product_price: item.product.prices![0].price,
+        warehouse_code: 'wh1',
+      }));
 
     mutate({
-      comment: value.comment,
-      items: items,
-      long: Number(value.long),
-      lat: Number(value.lat),
-      date: formatDate.format(deliveryDate, 'YYYY-MM-DD'),
-      time: selectedTimeSlot,
+      order: [
+        {
+          filial_code: 'dodge',
+          delivery_date: formatDate.format(deliveryDate, 'DD.MM.YYYY'),
+          room_code: '100',
+          deal_time: formatDate.format(deliveryDate, 'DD.MM.YYYY'),
+          robot_code: 'r2',
+          status: 'B#N',
+          sales_manager_code: '1',
+          person_code: '12345678',
+          currency_code: '860',
+          owner_person_code: '1234567',
+          note: value.comment,
+          order_products: order_products,
+        },
+      ],
     });
   };
 
@@ -513,7 +533,7 @@ const RefreshOrder = () => {
                           </p>
                           <p className="font-semibold text-sm">
                             {formatPrice(
-                              item.product_price * item.quantity,
+                              Number(item.product_price) * item.quantity,
                               true,
                             )}
                           </p>

src/features/search/ui/Search.tsx

@@ -1,10 +1,7 @@
 'use client';
 
 import { product_api } from '@/shared/config/api/product/api';
-import {
-  ProductListResult,
-  SearchDataPro,
-} from '@/shared/config/api/product/type';
+import { ProductListResult } from '@/shared/config/api/product/type';
 import { useRouter } from '@/shared/config/i18n/navigation';
 import { Input } from '@/shared/ui/input';
 import { ProductCard } from '@/widgets/categories/ui/product-card';
@@ -18,65 +15,73 @@ const SearchResult = () => {
   const router = useRouter();
   const t = useTranslations();
   const searchParams = useSearchParams();
-  const query = searchParams.get('q') || '';
-  const [searchRes, setSearchRes] = useState<
-    ProductListResult[] | SearchDataPro[] | []
-  >([]);
 
-  const { data: product } = useQuery({
+  const query = searchParams.get('q') || '';
+  const [inputValue, setInputValue] = useState(query);
+
+  /* 🔹 Input va URL sync */
+  useEffect(() => {
+    setInputValue(query);
+  }, [query]);
+
+  /* 🔹 Default product list */
+  const { data: productList, isLoading: listLoading } = useQuery({
     queryKey: ['product_list'],
     queryFn: () => product_api.list({ page: 1, page_size: 12 }),
-    select(data) {
-      return data.data.results;
-    },
+    select: (res) => res.data.results,
+    enabled: !query,
   });
 
-  const { data, isLoading } = useQuery({
+  /* 🔹 Search query */
+  const { data: searchList, isLoading: searchLoading } = useQuery({
     queryKey: ['search', query],
-    queryFn: () => product_api.search({ search: query, page: 1, page_szie: 5 }),
-    select(data) {
-      return data.data.products;
+    queryFn: () =>
+      product_api.search({
+        search: query,
+        page: 1,
+        page_size: 12,
+      }),
+    select: (res) => {
+      return res.data.products;
     },
     enabled: !!query,
   });
 
-  useEffect(() => {
-    if (data) {
-      setSearchRes(data);
-    } else if (query.length === 0 && product && product.length > 0) {
-      setSearchRes(product);
-    } else {
-      setSearchRes([]);
-    }
-  }, [product, data]);
+  const data = query ? (searchList ?? []) : (productList ?? []);
+  const isLoading = query ? searchLoading : listLoading;
 
+  /* 🔹 Handlers */
   const handleSearch = (value: string) => {
+    setInputValue(value);
+
     if (!value.trim()) {
       router.push('/search');
       return;
     }
+
     router.push(`/search?q=${encodeURIComponent(value)}`);
   };
 
   const clearSearch = () => {
+    setInputValue('');
     router.push('/search');
   };
 
   return (
     <div className="custom-container min-h-screen">
-      {/* Search input (mobile) */}
-      <div className="lg:hidden mb-6">
+      {/* 🔍 Search input */}
+      <div className="mb-6">
         <div className="relative">
           <Search className="absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-slate-400" />
 
           <Input
-            value={query}
+            value={inputValue}
             placeholder={t('Mahsulot nomi')}
             onChange={(e) => handleSearch(e.target.value)}
             className="w-full pl-10 pr-10 h-12"
           />
 
-          {query && (
+          {inputValue && (
             <button
               onClick={clearSearch}
               className="absolute right-3 top-1/2 -translate-y-1/2"
@@ -87,15 +92,17 @@ const SearchResult = () => {
         </div>
       </div>
 
+      {/* 🔹 Content */}
       {isLoading ? (
-        <div className="text-center py-20">{t('Yuklanmoqda')}</div>
-      ) : searchRes && searchRes.length > 0 ? (
+        <div className="text-center py-20">{t('Yuklanmoqda')}...</div>
+      ) : data.length > 0 ? (
         <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-          {searchRes
-            .filter((product) => product.is_active)
-            .map((product) => (
-              <ProductCard key={product.id} product={product} />
-            ))}
+          {data.map((products) => (
+            <ProductCard
+              product={products as ProductListResult}
+              key={(products as ProductListResult).id}
+            />
+          ))}
         </div>
       ) : (
         <div className="text-center py-20">{t('Natija topilmadi')}</div>