import { getUsers } from '@/app/actions/admin'
import { UserList } from './user-list'
import { CreateUserDialog } from './create-user-dialog'
import { auth } from '@/auth'
import { redirect } from 'next/navigation'
import Link from 'next/link'
import { Button } from '@/components/ui/button'
import { Settings } from 'lucide-react'

export default async function AdminPage() {
  const session = await auth()
  
  if ((session?.user as any)?.role !== 'ADMIN') {
    redirect('/')
  }

  const users = await getUsers()

  return (
    <div className="container mx-auto py-10 px-4">
      <div className="flex justify-between items-center mb-8">
        <h1 className="text-3xl font-bold">User Management</h1>
        <div className="flex gap-2">
          <Link href="/admin/settings">
            <Button variant="outline">
              <Settings className="mr-2 h-4 w-4" />
              Settings
            </Button>
          </Link>
          <CreateUserDialog />
        </div>
      </div>
      
      <div className="bg-white dark:bg-zinc-900 rounded-lg shadow overflow-hidden border border-gray-200 dark:border-gray-800">
        <UserList initialUsers={users} />
      </div>
    </div>
  )
}