gitfor/platform

import { createFileRoute } from "@tanstack/react-router";
import { z } from "zod";
import { listIssues } from "~/fns/issues";
import { IssueListPage } from "~/components/IssueListPage";
import { BranchPushSuggestions } from "~/components/BranchPushSuggestions";
import { useRepo } from "~/hooks/use-repo";

export const Route = createFileRoute("/$owner/$repo/pulls")({
  validateSearch: z.object({
    state: z.enum(["open", "closed", "all"]).optional(),
    q: z.string().optional(),
    label: z.string().optional(),
    page: z.number().int().min(1).optional(),
  }),
  loaderDeps: ({ search }) => search,
  loader: ({ params, deps }) =>
    listIssues({
      data: {
        owner: params.owner,
        repo: params.repo,
        kind: "pull",
        state: deps.state ?? "open",
        q: deps.q,
        label: deps.label,
        page: deps.page ?? 1,
      },
    }),
  component: ListPage,
});

function ListPage() {
  const data = Route.useLoaderData();
  const search = Route.useSearch();
  const { owner, repo } = Route.useParams();
  const header = useRepo();
  return (
    <div className="space-y-4">
      <BranchPushSuggestions owner={owner} repo={repo} defaultBranch={header.repo.defaultBranch} />
      <IssueListPage owner={owner} repo={repo} data={data} search={search} kind="pull" />
    </div>