import { AppShell } from '@/components/app/app-shell'
import { BackLink } from '@/components/app/back-link'
import { listPlatformUsers } from '@/lib/data/users'
import { isRoleSwitchEnabled } from '@/lib/auth/env-users'
import { accountsAvailable } from '@/lib/auth/accounts'
import { UsersConsole } from './users-console'
import { requireSurface } from '@/lib/auth/surface-guard'
import { ModeratorAccessCard } from '@/components/app/moderator-access-card'

/**
 * User management (Task 95, 2026-09-09) — the tools support needs when a user
 * calls for help.
 *
 * Nash: "We need a page that will give us power to manage users. Let's say a
 * user needs help to reset the password. Or any other issues that the user is
 * having… Can he call? Can we reset the password for him? Can we assist him?"
 *
 * Admin-gated the same way as the other three admin consoles.
 */
export default async function AdminUsersPage() {
  const { user, profile, canManage } = await requireSurface('users')

  const [users, accountsReady] = await Promise.all([listPlatformUsers(), accountsAvailable()])

  return (
    <AppShell profile={profile}>
      <main className="mx-auto max-w-6xl px-4 py-8">
        <BackLink />
        <h1 className="mt-3 text-2xl font-bold tracking-tight">Users</h1>
        <p className="mt-1 text-sm text-neutral-500">
          Every account the platform knows about — who can sign in, what they can reach, and what
          support can change.
        </p>
        <UsersConsole
          users={users}
          meId={user.originId}
          roleSwitchOn={isRoleSwitchEnabled()}
          accountsReady={accountsReady}
        />
      </main>
      <div className="mx-auto max-w-7xl px-4 pb-8">
        <ModeratorAccessCard surface="users" canManage={canManage} />
      </div>
    </AppShell>
  )
}