125 lines · 3.7 KB
import { Link, useNavigate } from "@tanstack/react-router";
import { IssueList } from "./IssueList";
import { Panel } from "./ui/Primitives";
import { buttonClass } from "./ui/Button";
import { inputClass } from "./ui/Field";
import { cn } from "~/utils/cn";
import type { listIssues } from "~/fns/issues";

type Data = Awaited<ReturnType<typeof listIssues>>;
type Search = { state?: "open" | "closed" | "all"; q?: string; label?: string; page?: number };

export function IssueListPage({
  owner,
  repo,
  data,
  search,
  kind,
}: {
  owner: string;
  repo: string;
  data: Data;
  search: Search;
  kind: "issue" | "pull";
}) {
  const navigate = useNavigate();
  const to = kind === "pull" ? "/$owner/$repo/pulls" : "/$owner/$repo/issues";
  const state = search.state ?? "open";
  const page = search.page ?? 1;
  const filters = [
    { id: "open", label: `${data.openCount} Open` },
    { id: "closed", label: `${data.closedCount} Closed` },
  ] as const;

  return (
    <div className="space-y-4">
      <div className="flex flex-wrap items-center gap-3">
        <form
          className="min-w-64 flex-1"
          onSubmit={(event) => {
            event.preventDefault();