'use client';
import { useActionState } from 'react';
import { setNotesReadAccess } from '@/app/actions/notes-access';
export function NotesGrantForm({ workspaceId }: { workspaceId: string }) {
  const [state, action, pending] = useActionState(setNotesReadAccess, {});
  return <form action={action} className="grid gap-3 max-w-xl">
    <h2 className="text-lg font-semibold">Workspace notes access</h2>
    <p>This separate grant allows one existing API key or your own OAuth connection to read the latest 50 notes in this workspace. It adds no write permission.</p>
    <input type="hidden" name="org_id" value={workspaceId} />
    <label htmlFor="credential-kind">Credential type</label>
    <select name="kind" id="credential-kind"><option value="api">API key</option><option value="oauth">My OAuth connection</option></select>
    <label htmlFor="notes-credential">Credential ID from the authenticated key/connection list</label>
    <input name="credential" id="notes-credential" required className="border rounded-md p-2" />
    <button name="enabled" value="true" disabled={pending} className="border rounded-md p-2">Allow reading workspace notes</button>
    <button name="enabled" value="false" disabled={pending} className="border rounded-md p-2">Remove notes access</button>
    <p role="status">{state.error || state.success}</p>
  </form>;
}
