gitfor/platform

import { createFileRoute } from "@tanstack/react-router";
import { getMergeFixSettings, saveMergeFixSettings } from "~/fns/mergefix";
import { AiEndpointForm } from "~/components/ai/AiEndpointForm";
import { useAction } from "~/hooks/use-action";
import { Panel } from "~/ui/Panel";
import { Button } from "~/ui/Button";
import { CheckboxField, TextField } from "~/ui/Field";
import { ErrorBanner } from "~/ui/Callout";

export const Route = createFileRoute("/$owner/$repo/settings/ai")({
  loader: ({ params }) => getMergeFixSettings({ data: { owner: params.owner, repo: params.repo } }),
  component: MergeFixSettingsPage,
});

function RepoSettingsForm() {
  const data = Route.useLoaderData();
  const params = Route.useParams();
  const save = useAction(saveMergeFixSettings);
  return (
    <Panel title="AI merge fixes">
      <form
        method="post"
        className="space-y-4 p-4"
        onSubmit={(event) => {
          event.preventDefault();
          const form = new FormData(event.currentTarget);
          void save.run({
            data: {
              ...params,
              queueEnabled: form.get("queueEnabled") === "on",
              allowPrivate: form.get("allowPrivate") === "on",
              autoApply: form.get("autoApply") === "on",
              confidence: Number(form.get("confidence")),
              margin: Number(form.get("margin")),
            },
          });
        }}
      >
        <ErrorBanner message={save.error} />
        <p className="text-sm text-gray-400">