import { api } from '@/lib/api'
import { usePaged } from '@/lib/usePaged'
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table'
import { Button } from '@/components/ui/button'
import { Badge } from '@/components/ui/badge'
import { Card, CardContent } from '@/components/ui/card'
import { Pager } from '@/components/Pager'

const statusMap: Record<string, { label: string; variant: any }> = {
  published: { label: '已发布', variant: 'success' },
  hidden: { label: '已隐藏', variant: 'muted' },
  deleted: { label: '已删除', variant: 'destructive' },
}

export default function Posts() {
  const { page, setPage, data, totalPages, reload } = usePaged<any>(api.posts)

  async function setStatus(id: number, status: string) {
    await api.setPostStatus(id, status)
    reload()
  }

  return (
    <div>
      <h1 className="text-2xl font-bold mb-6">帖子审核</h1>
      <Card>
        <CardContent className="pt-6">
          <Table>
            <TableHeader>
              <TableRow>
                <TableHead>ID</TableHead>
                <TableHead>作者</TableHead>
                <TableHead>内容</TableHead>
                <TableHead>赞/评</TableHead>
                <TableHead>状态</TableHead>
                <TableHead className="text-right">操作</TableHead>
              </TableRow>
            </TableHeader>
            <TableBody>
              {data?.list?.map((p) => (
                <TableRow key={p.id}>
                  <TableCell>{p.id}</TableCell>
                  <TableCell className="whitespace-nowrap">
                    <span className="mr-1">{p.author_emoji}</span>
                    {p.author_name}
                  </TableCell>
                  <TableCell className="max-w-sm truncate">{p.content}</TableCell>
                  <TableCell className="whitespace-nowrap">
                    {p.like_count} / {p.comment_count}
                  </TableCell>
                  <TableCell>
                    <Badge variant={statusMap[p.status]?.variant}>{statusMap[p.status]?.label ?? p.status}</Badge>
                  </TableCell>
                  <TableCell className="text-right space-x-2 whitespace-nowrap">
                    {p.status !== 'published' && (
                      <Button variant="outline" size="sm" onClick={() => setStatus(p.id, 'published')}>
                        恢复
                      </Button>
                    )}
                    {p.status === 'published' && (
                      <Button variant="outline" size="sm" onClick={() => setStatus(p.id, 'hidden')}>
                        隐藏
                      </Button>
                    )}
                    <Button variant="destructive" size="sm" onClick={() => setStatus(p.id, 'deleted')}>
                      删除
                    </Button>
                  </TableCell>
                </TableRow>
              ))}
            </TableBody>
          </Table>
          <Pager page={page} totalPages={totalPages} total={data?.total ?? 0} onChange={setPage} />
        </CardContent>
      </Card>
    </div>
  )
}