doctor and pharmacies crud

src/features/objects/ui/ObjectTable.tsx

@@ -0,0 +1,124 @@
+import type { ObjectListData } from "@/features/objects/lib/data";
+import { Badge } from "@/shared/ui/badge";
+import { Button } from "@/shared/ui/button";
+import {
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow,
+} from "@/shared/ui/table";
+import { Eye, Loader2, Pencil, Trash2 } from "lucide-react";
+import type { Dispatch, SetStateAction } from "react";
+
+interface Props {
+  filteredData: ObjectListData[] | [];
+  setDetail: Dispatch<SetStateAction<ObjectListData | null>>;
+  setDetailDialog: Dispatch<SetStateAction<boolean>>;
+  setEditingPlan: Dispatch<SetStateAction<ObjectListData | null>>;
+  setDialogOpen: Dispatch<SetStateAction<boolean>>;
+  handleDelete: (object: ObjectListData) => void;
+  isLoading: boolean;
+  isError: boolean;
+}
+
+const ObjectTable = ({
+  filteredData,
+  setDetail,
+  setDetailDialog,
+  setEditingPlan,
+  handleDelete,
+  setDialogOpen,
+  isError,
+  isLoading,
+}: Props) => {
+  return (
+    <div className="flex-1 overflow-auto">
+      {isLoading && (
+        <div className="h-full flex items-center justify-center bg-white/70 z-10">
+          <span className="text-lg font-medium">
+            <Loader2 className="animate-spin" />
+          </span>
+        </div>
+      )}
+
+      {isError && (
+        <div className="h-full flex items-center justify-center z-10">
+          <span className="text-lg font-medium text-red-600">
+            Ma'lumotlarni olishda xatolik yuz berdi.
+          </span>
+        </div>
+      )}
+      {!isError && !isLoading && (
+        <Table>
+          <TableHeader>
+            <TableRow>
+              <TableHead>#</TableHead>
+              <TableHead>Obyekt nomi</TableHead>
+              <TableHead>Tuman</TableHead>
+              <TableHead>Foydalanuvchi</TableHead>
+              <TableHead className="text-right">Amallar</TableHead>
+            </TableRow>
+          </TableHeader>
+          <TableBody>
+            {filteredData && filteredData.length > 0 ? (
+              filteredData.map((item, index) => (
+                <TableRow key={item.id}>
+                  <TableCell>{index + 1}</TableCell>
+                  <TableCell className="font-medium">{item.name}</TableCell>
+                  <TableCell>
+                    <Badge variant="outline">{item.district.name}</Badge>
+                  </TableCell>
+                  <TableCell>
+                    {item.user.first_name} {item.user.last_name}
+                  </TableCell>
+                  <TableCell className="text-right flex gap-2 justify-end">
+                    <Button
+                      variant="outline"
+                      size="icon"
+                      onClick={() => {
+                        setDetail(item);
+                        setDetailDialog(true);
+                      }}
+                      className="bg-green-600 text-white cursor-pointer hover:bg-green-600 hover:text-white"
+                    >
+                      <Eye size={18} />
+                    </Button>
+                    <Button
+                      variant="outline"
+                      size="icon"
+                      className="bg-blue-600 text-white cursor-pointer hover:bg-blue-600 hover:text-white"
+                      onClick={() => {
+                        setEditingPlan(item);
+                        setDialogOpen(true);
+                      }}
+                    >
+                      <Pencil size={18} />
+                    </Button>
+                    <Button
+                      variant="destructive"
+                      size="icon"
+                      className="cursor-pointer"
+                      onClick={() => handleDelete(item)}
+                    >
+                      <Trash2 size={18} />
+                    </Button>
+                  </TableCell>
+                </TableRow>
+              ))
+            ) : (
+              <TableRow>
+                <TableCell colSpan={5} className="text-center py-4 text-lg">
+                  Obyekt topilmadi.
+                </TableCell>
+              </TableRow>
+            )}
+          </TableBody>
+        </Table>
+      )}
+    </div>
+  );
+};
+
+export default ObjectTable;