148 lines · 4.6 KB
import { useState } from "react";
import { setIssueAssignees, setIssueLabels, setIssueLock } from "~/fns/labels";
import { useAction } from "~/hooks/use-action";
import { Avatar, LabelChip } from "./ui/Primitives";
import { Button } from "./ui/Button";

type Props = {
  owner: string;
  repo: string;
  number: number;
  canMaintain: boolean;
  locked: boolean;
  labels: Array<{ id: string; name: string; color: string }>;
  allLabels: Array<{ id: string; name: string; color: string }>;
  assignees: Array<{ name: string }>;
  assignable: string[];
  children?: React.ReactNode;
};

function Section({ title, onEdit, children }: { title: string; onEdit?: () => void; children: React.ReactNode }) {
  return (
    <section className="space-y-2 border-b border-gray-800 pb-4">
      <div className="flex items-center justify-between">
        <h3 className="label-caps text-gray-500">{title}</h3>
        {onEdit && (
          <button type="button" onClick={onEdit} className="text-xs text-gray-500 hover:text-accent-400">
            Edit
          </button>
        )}
      </div>
      {children}
    </section>
  );
}

function Picker({
  options,
  selected,
  onSave,
  pending,