"use client";

// components/CompanyEditButton.tsx
// Edit button + modal for the company detail page.

import { useState } from "react";
import EditEntityModal from "@/components/EditEntityModal";
import type { YsterbaardCompany } from "@/lib/types";

interface Props {
  company: YsterbaardCompany;
}

export default function CompanyEditButton({ company }: Props) {
  const [open, setOpen] = useState(false);

  return (
    <>
      <button
        onClick={() => setOpen(true)}
        className="inline-flex items-center gap-2 px-4 py-2.5 rounded-md border border-border bg-surface text-fg text-sm font-semibold hover:bg-surface-warm transition-colors"
      >
        <svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
          <path d="M10.854 1.575a.625.625 0 0 1 .884.884L5.25 9.946l-3.75.625.625-3.75 6.487-5.488a.625.625 0 0 1 .884 0l1.258 1.242Z" fill="currentColor"/>
        </svg>
        Edit company
      </button>

      <EditEntityModal
        entity="company"
        record={company}
        open={open}
        onClose={() => setOpen(false)}
        onAfterSave={() => {
          // Force page refresh to pick up new values
          window.location.reload();
        }}
      />
    </>
  );
}