"use client";
import { useState } from "react";
export function InviteControl({ sourceId }: { sourceId: number }) {
  const [role, setRole] = useState("viewer"); const [url, setUrl] = useState(""); const [error, setError] = useState("");
  async function create() { setError(""); const response = await fetch(`/api/sources/${sourceId}/invites`, { method: "POST", headers: { "Content-Type": "application/json", Accept: "application/json" }, body: JSON.stringify({ role }) }); const body = await response.json(); if (!response.ok) setError(body.error || "無法建立邀請"); else setUrl(body.url); }
  return <div><label>邀請角色<select value={role} onChange={(event) => setRole(event.target.value)}><option value="viewer">檢視者</option><option value="editor">編輯者</option></select></label><button type="button" onClick={create}>建立 7 天一次性邀請連結</button>{url && <><input readOnly value={url} onFocus={(event) => event.currentTarget.select()} /><button type="button" onClick={() => navigator.clipboard.writeText(url)}>複製連結</button></>}{error && <p className="error">{error}</p>}</div>;
}
