41 lines · 1.6 KB
import { SelectField } from "./ui/Field";

type Range = { kind: "all" } | { kind: "commit"; sha: string } | { kind: "since"; sha: string };

type Props = {
  commits: Array<{ sha: string; shortSha: string; subject: string }>;
  range: Range;
  lastReviewSha: string | null;
  headSha: string;
  onChange: (search: { commit?: string; since?: string }) => void;
};

/** Chooses which slice of the pull request to review: everything, one commit, or changes since your last review. */
export function DiffRangePicker({ commits, range, lastReviewSha, headSha, onChange }: Props) {
  const sinceAvailable = lastReviewSha !== null && lastReviewSha !== headSha;
  const options = [
    { value: "all", label: "All changes" },
    ...(sinceAvailable ? [{ value: `since:${lastReviewSha}`, label: "Changes since your last review" }] : []),
    ...commits.map((commit) => ({ value: `commit:${commit.sha}`, label: `${commit.shortSha} ${commit.subject}` })),
  ];
  const value = range.kind === "all" ? "all" : `${range.kind}:${range.sha}`;
  return (
    <div className="flex flex-wrap items-end gap-3">
      <SelectField
        label="Show"
        value={value}
        options={options}
        onChange={(event) => {
          const [kind, sha] = event.target.value.split(":");
          if (kind === "commit") onChange({ commit: sha });
          else if (kind === "since") onChange({ since: sha });
          else onChange({});
        }}
      />
      {range.kind !== "all" && (
        <p className="pb-2 text-xs text-gray-500">Comments can be added from the “All changes” view.</p>
      )}
    </div>
  );
}