91 lines
4.7 KiB
TypeScript
91 lines
4.7 KiB
TypeScript
import {
|
||
Table,
|
||
TableBody,
|
||
TableCell,
|
||
TableHead,
|
||
TableHeader,
|
||
TableRow,
|
||
} from "@/components/ui/table";
|
||
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
|
||
import { Button } from "@/components/ui/button";
|
||
import { RefreshCcw, ShieldAlert } from "lucide-react";
|
||
import { User } from "@/lib/features/auth/authSlice";
|
||
import { getAvatarUrl } from "@/lib/utils";
|
||
|
||
interface DeletedUserTableProps {
|
||
users: (User & { deleted_at?: string })[];
|
||
onRestore: (id: string) => void;
|
||
onHardDelete: (id: string) => void;
|
||
}
|
||
|
||
export function DeletedUserTable({ users, onRestore, onHardDelete }: DeletedUserTableProps) {
|
||
return (
|
||
<div className="rounded-md border border-destructive/20 bg-destructive/5">
|
||
<Table>
|
||
<TableHeader>
|
||
<TableRow>
|
||
<TableHead className="w-14">Avatar</TableHead>
|
||
<TableHead>Username (Silinmiş)</TableHead>
|
||
<TableHead>Email</TableHead>
|
||
<TableHead>Silinme Tarihi</TableHead>
|
||
<TableHead className="text-right">İşlemler</TableHead>
|
||
</TableRow>
|
||
</TableHeader>
|
||
<TableBody>
|
||
{users.length === 0 ? (
|
||
<TableRow>
|
||
<TableCell colSpan={5} className="h-24 text-center text-muted-foreground">
|
||
Çöp kutusu boş.
|
||
</TableCell>
|
||
</TableRow>
|
||
) : (
|
||
users.map((user) => (
|
||
<TableRow key={user.id}>
|
||
<TableCell>
|
||
<Avatar className="h-9 w-9 grayscale opacity-50">
|
||
<AvatarImage src={getAvatarUrl(user.avatar_url)} alt={user.username} />
|
||
<AvatarFallback className="text-xs">
|
||
{user.username?.slice(0, 2).toUpperCase() || "?"}
|
||
</AvatarFallback>
|
||
</Avatar>
|
||
</TableCell>
|
||
<TableCell className="font-medium text-muted-foreground line-through">
|
||
{user.username}
|
||
</TableCell>
|
||
<TableCell className="text-muted-foreground">{user.email}</TableCell>
|
||
<TableCell className="text-muted-foreground text-sm">
|
||
{user.deleted_at ? new Date(user.deleted_at).toLocaleString('tr-TR') : "-"}
|
||
</TableCell>
|
||
<TableCell className="text-right">
|
||
<div className="inline-flex rounded-md border border-input bg-background [&>button]:rounded-none [&>button:first-child]:rounded-l-md [&>button:last-child]:rounded-r-md [&>button:first-child]:border-r [&>button:first-child]:border-input">
|
||
<Button
|
||
variant="ghost"
|
||
size="icon"
|
||
className="h-9 w-9 text-green-600 hover:text-green-700 hover:bg-green-100 dark:hover:bg-green-900/20"
|
||
onClick={() => onRestore(user.id)}
|
||
title="Geri Yükle"
|
||
>
|
||
<RefreshCcw className="h-4 w-4" />
|
||
<span className="sr-only">Geri Yükle</span>
|
||
</Button>
|
||
<Button
|
||
variant="ghost"
|
||
size="icon"
|
||
className="h-9 w-9 text-destructive hover:text-destructive hover:bg-destructive/10"
|
||
onClick={() => onHardDelete(user.id)}
|
||
title="Kalıcı Sil (Hard)"
|
||
>
|
||
<ShieldAlert className="h-4 w-4" />
|
||
<span className="sr-only">Kalıcı Sil</span>
|
||
</Button>
|
||
</div>
|
||
</TableCell>
|
||
</TableRow>
|
||
))
|
||
)}
|
||
</TableBody>
|
||
</Table>
|
||
</div>
|
||
);
|
||
}
|