feat(05-04): lock field placer to read-only when document is Sent

- Add readOnly prop to FieldPlacer; when true: hide palette, disable all pointer
  events on field boxes, show fields at 60% opacity, suppress delete button and
  all four resize handles
- PdfViewer accepts docStatus prop and derives readOnly={docStatus==='Sent'||'Signed'}
- PdfViewerWrapper forwards docStatus prop to PdfViewer
- page.tsx passes docStatus={doc.status} to PdfViewerWrapper

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Chandler Copeland
2026-03-20 10:36:25 -06:00
parent 08719a6109
commit bd73f0cc76
3 changed files with 7 additions and 5 deletions

View File

@@ -19,12 +19,14 @@ interface PageInfo {
scale: number;
}
export function PdfViewer({ docId }: { docId: string }) {
export function PdfViewer({ docId, docStatus }: { docId: string; docStatus?: string }) {
const [numPages, setNumPages] = useState(0);
const [pageNumber, setPageNumber] = useState(1);
const [scale, setScale] = useState(1.0);
const [pageInfo, setPageInfo] = useState<PageInfo | null>(null);
const readOnly = docStatus === 'Sent' || docStatus === 'Signed';
return (
<div className="flex flex-col items-center gap-4">
<div className="flex items-center gap-3 text-sm">
@@ -65,7 +67,7 @@ export function PdfViewer({ docId }: { docId: string }) {
</div>
{/* PDF canvas wrapped in FieldPlacer for drag-and-drop field placement */}
<FieldPlacer docId={docId} pageInfo={pageInfo} currentPage={pageNumber}>
<FieldPlacer docId={docId} pageInfo={pageInfo} currentPage={pageNumber} readOnly={readOnly}>
<Document
file={`/api/documents/${docId}/file`}
onLoadSuccess={({ numPages }) => setNumPages(numPages)}

View File

@@ -3,6 +3,6 @@ import dynamic from 'next/dynamic';
const PdfViewer = dynamic(() => import('./PdfViewer').then(m => m.PdfViewer), { ssr: false });
export function PdfViewerWrapper({ docId }: { docId: string }) {
return <PdfViewer docId={docId} />;
export function PdfViewerWrapper({ docId, docStatus }: { docId: string; docStatus?: string }) {
return <PdfViewer docId={docId} docStatus={docStatus} />;
}

View File

@@ -48,7 +48,7 @@ export default async function DocumentPage({
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
<div className="lg:col-span-2">
<PdfViewerWrapper docId={docId} />
<PdfViewerWrapper docId={docId} docStatus={doc.status} />
</div>
<div className="lg:col-span-1">
<PreparePanel