gitfor/platform

import { useState } from "react";
import { removeProjectItem, updateProjectItem } from "~/fns/projects";
import { useAction } from "~/hooks/use-action";
import { ItemTitle } from "./ItemTitle";
import type { ProjectData, ProjectField, ProjectItem } from "./ItemTitle";
import { inputClass } from "~/ui/Field";
import { EmptyState } from "~/ui/EmptyState";
import { cn } from "~/utils/cn";

type Ref = { owner: string; number: number };

function Cell({
  projectRef,
  item,
  field,
  canWrite,
}: {
  projectRef: Ref;
  item: ProjectItem;
  field: ProjectField;
  canWrite: boolean;
}) {
  const current = item.values[field.id] ?? "";
  const [draft, setDraft] = useState(current);
  const update = useAction(updateProjectItem);
  const save = (value: string) => {
    if (value === current) return;
    void update.run({ data: { ...projectRef, itemId: item.id, fieldId: field.id, value: value || null } });
  };
  if (!canWrite) return <span className="text-gray-300">{current}</span>;
  if (field.kind === "single_select")
    return (
      <select
        aria-label={field.name}
        value={current}
        onChange={(event) => save(event.target.value)}
        className={cn(inputClass, "h-7 border-transparent bg-transparent text-xs")}
      >
        <option value="">—</option>
        {field.options.map((option) => (