import BreadCrumbLink from "@/layouts/shared/page.breadcrumbLink";
import { createPrompt } from "@/lib/features/chatbot/prompt/action";
import { listPrompts } from "@/lib/features/chatbot/prompt/query";
import { Title } from "@mantine/core";
import PromptForm from "../(widgets)/PromptForm";

export const handle = {
  breadcrumb: () => (
    <BreadCrumbLink links={[{ label: "Chatbot", to: "/admin/chatbot" }, { label: "Prompts", to: "/admin/chatbot/prompts" }, { label: "Create Prompt" }]} />
  ),
};

export async function loader({ request }: { request: Request }) {
  const headers = { Cookie: request.headers.get("Cookie") ?? "" };
  const res: any = await listPrompts(0, 200, headers);
  const rows = res?.data?.items ?? res?.data ?? [];
  const usedPipelineKeys = rows
    .map((p: any) => p.prompt_key)
    .filter(Boolean) as string[];
  return { usedPipelineKeys };
}

export default function CreatePromptPage({
  loaderData,
}: {
  loaderData: { usedPipelineKeys: string[] };
}) {
  return (
    <>
      <Title order={4} c="dimmed" mb="sm">Create Prompt</Title>
      <PromptForm
        mode="create"
        usedPipelineKeys={loaderData.usedPipelineKeys}
        onSubmit={(payload) => createPrompt(payload)}
      />
    </>
  );
}