vercel deploy

src/features/plans/ui/PalanTable.tsx

@@ -20,10 +20,12 @@ import {
   TableHeader,
   TableRow,
 } from "@/shared/ui/table";
-import { useQuery } from "@tanstack/react-query";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError } from "axios";
 import clsx from "clsx";
 import { Edit, Eye, Loader2, Trash } from "lucide-react";
 import type { Dispatch, SetStateAction } from "react";
+import { toast } from "sonner";
 
 interface Props {
   products: Product[] | [];
@@ -66,6 +68,36 @@ const ProductTable = ({
     },
   });
 
+  const queryClient = useQueryClient();
+
+  const { mutate: updated } = useMutation({
+    mutationFn: ({ body, id }: { id: string; body: FormData }) =>
+      plans_api.update({ body, id }),
+    onSuccess() {
+      toast.success("Mahsulot statusi o'zgardi", {
+        richColors: true,
+        position: "top-center",
+      });
+      queryClient.refetchQueries({ queryKey: ["product_list"] });
+      setDialogOpen(false);
+    },
+    onError: (err: AxiosError) => {
+      toast.error((err.response?.data as string) || "Xatolik yuz berdi", {
+        richColors: true,
+        position: "top-center",
+      });
+    },
+  });
+
+  const handleStatusChange = async (
+    product: string,
+    status: "true" | "false",
+  ) => {
+    const formData = new FormData();
+    formData.append("is_active", status);
+    updated({ body: formData, id: product });
+  };
+
   if (isLoading || isFetching) {
     return (
       <div className="flex h-full items-center justify-center">
@@ -130,7 +162,12 @@ const ProductTable = ({
                     product.is_active ? "text-green-600" : "text-red-600",
                   )}
                 >
-                  <Select value={product.is_active ? "true" : "false"}>
+                  <Select
+                    value={product.is_active ? "true" : "false"}
+                    onValueChange={(value) =>
+                      handleStatusChange(product.id, value as "true" | "false")
+                    }
+                  >
                     <SelectTrigger className="w-[180px]">
                       <SelectValue placeholder="Holati" />
                     </SelectTrigger>