Match the gate to the actual EOI's structure (Section 2 vs Section 3) so
the rep can generate the document the moment they have what they need —
and not before.
Required (Section 2 — top paragraph):
- Client name
- Client primary email
- Client primary address
Optional (Section 3 — left blank when absent):
- Linked yacht (name, dimensions)
- Linked berth (mooring number)
Previously the dialog blocked generation unless yacht AND berth were both
linked, which was overzealous — early-stage EOIs are routinely sent before
a specific berth is pinned down.
- eoi-context.ts: yacht and berth are now nullable in the returned
context. The hard ValidationError is now driven by the EOI's Section
2 fields (name/email/address) rather than yacht/berth presence. The
owner block falls back to the interest's client when no yacht is
linked, so signing parties remain resolvable.
- documenso-payload.ts + fill-eoi-form.ts: Section 3 form values
render as empty strings when yacht or berth are absent, so the
rendered PDF leaves those template inputs blank.
- document-templates.ts: yacht.* and berth.* tokens fall back to
empty strings; the legacy-fallback catch handler also recognises
the new "missing required client details" error.
- interests.service.ts: getInterestById now also returns
`clientPrimaryEmail` and `clientHasAddress` so the Documents tab
can compute the EOI prerequisites checklist client-side without an
extra fetch.
- eoi-generate-dialog.tsx: prereqs split into two groups visually —
Required (with red ✗ when missing) and Optional (with grey – when
absent). The Generate button only requires the Required block to
pass. A small amber banner surfaces when Required is incomplete so
the rep knows where to add the missing data.
Tests: 835/835 pass. Replaces the obsolete "throws on missing yacht/
berth" tests with parity coverage for the new behaviour ("builds a
valid context when yacht/berth missing", "throws when client email/
address missing"). Adds a payload test for the empty-Section-3 case.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
86 lines
3.0 KiB
TypeScript
86 lines
3.0 KiB
TypeScript
'use client';
|
|
|
|
import { useState } from 'react';
|
|
import { useQuery } from '@tanstack/react-query';
|
|
import { FileSignature } from 'lucide-react';
|
|
|
|
import { Button } from '@/components/ui/button';
|
|
import { DocumentList } from '@/components/documents/document-list';
|
|
import { EoiGenerateDialog } from '@/components/documents/eoi-generate-dialog';
|
|
import { apiFetch } from '@/lib/api/client';
|
|
|
|
interface InterestDocumentsTabProps {
|
|
interestId: string;
|
|
}
|
|
|
|
interface InterestData {
|
|
id: string;
|
|
yachtId?: string | null;
|
|
berthId?: string | null;
|
|
clientName?: string | null;
|
|
/** Surfaced by getInterestById for the EOI prerequisites checklist. */
|
|
clientPrimaryEmail?: string | null;
|
|
clientHasAddress?: boolean;
|
|
}
|
|
|
|
export function InterestDocumentsTab({ interestId }: InterestDocumentsTabProps) {
|
|
const [eoiDialogOpen, setEoiDialogOpen] = useState(false);
|
|
|
|
// Same query key + queryFn shape as InterestDetail's parent query, so the
|
|
// cache is consistent. (Mismatched shapes on the same key clobber each other
|
|
// and the parent header degenerates to "Unknown Client".)
|
|
const { data: interest } = useQuery<InterestData>({
|
|
queryKey: ['interests', interestId],
|
|
queryFn: () =>
|
|
apiFetch<{ data: InterestData }>(`/api/v1/interests/${interestId}`).then((r) => r.data),
|
|
});
|
|
|
|
const prerequisites = {
|
|
// Required (EOI Section 2 — top paragraph): name, address, email.
|
|
hasName: Boolean(interest?.clientName),
|
|
hasEmail: Boolean(interest?.clientPrimaryEmail),
|
|
hasAddress: Boolean(interest?.clientHasAddress),
|
|
// Optional (EOI Section 3): yacht + berth. Render blank when absent.
|
|
hasYacht: Boolean(interest?.yachtId),
|
|
hasBerth: Boolean(interest?.berthId),
|
|
};
|
|
|
|
return (
|
|
<div className="space-y-4">
|
|
<div className="flex items-center justify-between">
|
|
<h3 className="text-sm font-medium text-muted-foreground">Documents</h3>
|
|
<Button size="sm" variant="outline" onClick={() => setEoiDialogOpen(true)}>
|
|
Generate EOI
|
|
</Button>
|
|
</div>
|
|
|
|
<DocumentList
|
|
interestId={interestId}
|
|
emptyState={
|
|
<div className="flex flex-col items-center gap-3 rounded-lg border border-dashed border-border bg-muted/20 px-6 py-10 text-center">
|
|
<div className="flex size-10 items-center justify-center rounded-full bg-background text-muted-foreground">
|
|
<FileSignature className="size-5" />
|
|
</div>
|
|
<div className="space-y-1">
|
|
<p className="text-sm font-medium text-foreground">No documents yet</p>
|
|
<p className="text-xs text-muted-foreground">
|
|
Generate the EOI to send it for signing in one click.
|
|
</p>
|
|
</div>
|
|
<Button size="sm" onClick={() => setEoiDialogOpen(true)}>
|
|
Generate EOI
|
|
</Button>
|
|
</div>
|
|
}
|
|
/>
|
|
|
|
<EoiGenerateDialog
|
|
interestId={interestId}
|
|
open={eoiDialogOpen}
|
|
onOpenChange={setEoiDialogOpen}
|
|
prerequisites={prerequisites}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|