portabase/app/(customer)/dashboard/(admin)/agents/[agentId]/page.tsx

import { PageParams } from "@/types/next";
import {
  Page,
  PageContent,
  PageDescription,
  PageTitle,
} from "@/features/layout/page";
import { db } from "@/db";
import * as drizzleDb from "@/db";
import { eq } from "drizzle-orm";
import { notFound } from "next/navigation";
import { ButtonDeleteAgent } from "@/components/wrappers/dashboard/agent/button-delete-agent/button-delete-agent";
import { capitalizeFirstLetter } from "@/utils/text";
import { generateEdgeKey } from "@/utils/edge_key";
import { getServerUrl } from "@/utils/get-server-url";
import { AgentContentPage } from "@/components/wrappers/dashboard/agent/agent-content";
import { AgentDialog } from "@/features/agents/components/agent.dialog";
import { AgentType } from "@/features/agents/agents.schema";

export default async function RoutePage(
  props: PageParams<{ agentId: string }>,
) {
  const { agentId } = await props.params;

  const agent = await db.query.agent.findFirst({
    where: eq(drizzleDb.schemas.agent.id, agentId),
    with: {
      databases: true,
    },
  });

  if (!agent) {
    notFound();
  }

  const edgeKey = await generateEdgeKey(getServerUrl(), agent.id);

  return (
    <Page>
      <div className="justify-between gap-2 sm:flex">
        <PageTitle className="flex flex-col md:flex-row items-center justify-between w-full ">
          <div className="min-w-full md:min-w-fit ">
            {capitalizeFirstLetter(agent.name)}
          </div>
          <div className="flex items-center gap-2 md:justify-between w-full ">
            <div className="flex items-center gap-2">
              <AgentDialog
                agent={agent as AgentType & { id: string }}
                typeTrigger={"edit"}
              />
            </div>
            <div className="flex items-center gap-2">
              <ButtonDeleteAgent agentId={agentId} text={"Delete Agent"} />
            </div>
          </div>
        </PageTitle>
      </div>

      {agent.description && (
        <PageDescription className="mt-5 sm:mt-0">
          {agent.description}
        </PageDescription>
      )}
      <PageContent className="flex flex-col w-full h-full justify-between gap-6">
        <AgentContentPage agent={agent} edgeKey={edgeKey} />
      </PageContent>
    </Page>
  );
}