import { forbidden } from "next/navigation";
import { getTranslations } from "next-intl/server";
import { dehydrate, HydrationBoundary } from "@tanstack/react-query";
import { createHelpers } from "@/lib/trpc/server";
import { nuqsTransformServerSchema } from "@/lib/utils/nuqs-transform-server-schema";
import { SessionList } from "@/components/dashboard/session/session-list";
import { DashboardLayout, DashboardBreadcrump } from "@/components/layout/dashboard";
import { SessionListQueryValidator } from "@/server/modules/auth/validators/session-list-query.validator";

type Props = {
  searchParams: Promise<Record<string, string | string[] | undefined>>;
};

export default async function Page({ searchParams }: Props) {
    const params = nuqsTransformServerSchema(SessionListQueryValidator).parse(
        await searchParams
    );
    const helpers = await createHelpers();
    const t = await getTranslations();

    if (
      !(await helpers.gate.can.fetch({ resource: "session", action: "list" }))
    ) {
        forbidden();
    }

    await Promise.all([
        helpers.auth.session.count.prefetch({
            userId: params.userId || undefined,
            search: params.search || undefined
        }),
        helpers.auth.session.list.prefetch({
            with: ["user", "impersonator"],
            offset: params.page * params.perPage,
            userId: params.userId || undefined,
            limit: params.perPage,
            orderBy: params.orderBy,
            orderDir: params.orderDir,
            search: params.search || undefined
        })
    ]);

    return (
        <HydrationBoundary state={dehydrate(helpers.queryClient)}>
            <DashboardLayout
              title={t("dashboard.session.list.title")}
              description={t("dashboard.session.list.description")}>
                <DashboardBreadcrump>
                    <DashboardBreadcrump.Item>{t("dashboard.session.list.title")}</DashboardBreadcrump.Item>
                </DashboardBreadcrump>

                <SessionList />
            </DashboardLayout>
        </HydrationBoundary>
    );
}