import { Users } from "lucide-react";

import { ListPageCard } from "@/app/dashboard/_components";
import { ErrorBanner } from "@/components/shared/error-banner";
import { parseListSearchParams } from "@/lib/server/parse-list-search-params";
import { UsersHeaderActions } from "./_components/list-header-actions";
import { UsersTable } from "./_components/users-table";
import { fetchBackendUsers } from "./_lib/users-server-api";

type UsersPageProps = {
  searchParams: Promise<Record<string, string | undefined>>;
};

export default async function UsersPage({ searchParams }: UsersPageProps) {
  const query = await searchParams;
  const { page, pageSize } = parseListSearchParams(query, 50);
  const { rows, errorMessage, totalCount, pageCount } = await fetchBackendUsers({
    page,
    pageSize,
  });

  return (
    <ListPageCard
      icon={Users}
      title="Users"
      description="Backend operator accounts."
      breadcrumb={[
        { label: "Admins & Access", href: "/dashboard/admins/users" },
        { label: "Users" },
      ]}
      actions={<UsersHeaderActions data={rows} />}
    >
      <ErrorBanner message={errorMessage} className="mb-4" />
      <UsersTable data={rows} pagination={{ page, pageSize, totalCount, pageCount }} />
    </ListPageCard>
  );
}