156 lines · 5.8 KB
import { useState } from "react";
import { requestReviewers } from "~/fns/reviews";
import { dismissReview, rerequestPullReview } from "~/fns/pull-review";
import { usePull } from "~/hooks/use-pull";
import { useAction } from "~/hooks/use-action";
import { useViewer } from "~/hooks/use-viewer";
import { Avatar } from "~/ui/Avatar";
import { Badge } from "~/ui/Badge";
import { Button } from "~/ui/Button";
import { inputClass } from "~/ui/Field";
import { ErrorBanner } from "~/ui/Callout";
import { cn } from "~/utils/cn";
import { SidebarSection } from "~/ui/Heading";

const REVIEW_TONE = { approved: "success", changes_requested: "danger", dismissed: "neutral" } as const;

function toneOf(state: string) {
  return state in REVIEW_TONE ? REVIEW_TONE[state as keyof typeof REVIEW_TONE] : "neutral";
}

function DismissForm({ onDismiss, pending }: { onDismiss: (reason: string) => void; pending: boolean }) {
  const [reason, setReason] = useState("");
  return (
    <form
      className="flex gap-1"
      onSubmit={(event) => {
        event.preventDefault();
        if (reason.trim()) onDismiss(reason);
      }}
    >
      <label className="sr-only" htmlFor="dismiss-reason">
        Reason
      </label>
      <input
        id="dismiss-reason"
        value={reason}
        onChange={(event) => setReason(event.target.value)}
        placeholder="Reason for dismissal"
        className={cn(inputClass, "h-7 text-xs")}
      />