// "use client"

// import { useState } from "react"
// import { DataTable } from "./data-table"
// import { columns, User } from "./column"
// import { useQuery } from "react-query"
// import { getUsers } from "../../user-management/action"
// import { UserDetailSheet } from "./sheet"


// export function UsersTable() {
//   const [selectedUser, setSelectedUser] = useState<User | null>(null)
//   const [sheetOpen, setSheetOpen] = useState(false)

//   const { data: users = [], isLoading } = useQuery({
//     queryKey: ["users"],
//     queryFn: getUsers,
//   })

//   const handleRowClick = (user: User) => {
//     setSelectedUser(user)
//     setSheetOpen(true)
//   }

//   if (isLoading) {
//     return <div>Loading...</div>
//   }

//   return (
//     <div className="w-full">
//       <DataTable columns={columns} data={users} onRowClick={handleRowClick} />
//       {selectedUser && <UserDetailSheet user={selectedUser} open={sheetOpen} onOpenChange={setSheetOpen} />}
//     </div>
//   )
// }