116 lines
3.3 KiB
TypeScript
116 lines
3.3 KiB
TypeScript
|
'use client';
|
||
|
|
|
||
|
|
import { useState } from 'react';
|
||
|
|
import { useQueryClient } from '@tanstack/react-query';
|
||
|
|
|
||
|
|
import {
|
||
|
|
Dialog,
|
||
|
|
DialogContent,
|
||
|
|
DialogDescription,
|
||
|
|
DialogFooter,
|
||
|
|
DialogHeader,
|
||
|
|
DialogTitle,
|
||
|
|
} from '@/components/ui/dialog';
|
||
|
|
import { Button } from '@/components/ui/button';
|
||
|
|
import { apiFetch } from '@/lib/api/client';
|
||
|
|
|
||
|
|
interface EoiPrerequisites {
|
||
|
|
hasName: boolean;
|
||
|
|
hasEmail: boolean;
|
||
|
|
hasYachtDims: boolean;
|
||
|
|
hasBerth: boolean;
|
||
|
|
}
|
||
|
|
|
||
|
|
interface EoiGenerateDialogProps {
|
||
|
|
interestId: string;
|
||
|
|
open: boolean;
|
||
|
|
onOpenChange: (open: boolean) => void;
|
||
|
|
prerequisites: EoiPrerequisites;
|
||
|
|
}
|
||
|
|
|
||
|
|
const PREREQUISITE_LABELS: { key: keyof EoiPrerequisites; label: string }[] = [
|
||
|
|
{ key: 'hasName', label: 'Client has full name' },
|
||
|
|
{ key: 'hasEmail', label: 'Client has email address' },
|
||
|
|
{ key: 'hasYachtDims', label: 'Yacht dimensions set' },
|
||
|
|
{ key: 'hasBerth', label: 'Berth linked to interest' },
|
||
|
|
];
|
||
|
|
|
||
|
|
export function EoiGenerateDialog({
|
||
|
|
interestId,
|
||
|
|
open,
|
||
|
|
onOpenChange,
|
||
|
|
prerequisites,
|
||
|
|
}: EoiGenerateDialogProps) {
|
||
|
|
const queryClient = useQueryClient();
|
||
|
|
const [isGenerating, setIsGenerating] = useState(false);
|
||
|
|
const [error, setError] = useState<string | null>(null);
|
||
|
|
|
||
|
|
const allMet = Object.values(prerequisites).every(Boolean);
|
||
|
|
|
||
|
|
const handleGenerate = async () => {
|
||
|
|
if (!allMet) return;
|
||
|
|
|
||
|
|
setIsGenerating(true);
|
||
|
|
setError(null);
|
||
|
|
|
||
|
|
try {
|
||
|
|
await apiFetch('/api/v1/documents/generate-eoi', {
|
||
|
|
method: 'POST',
|
||
|
|
body: { interestId },
|
||
|
|
});
|
||
|
|
|
||
|
|
queryClient.invalidateQueries({ queryKey: ['documents', { interestId }] });
|
||
|
|
onOpenChange(false);
|
||
|
|
} catch (err) {
|
||
|
|
setError(err instanceof Error ? err.message : 'Failed to generate EOI');
|
||
|
|
} finally {
|
||
|
|
setIsGenerating(false);
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
return (
|
||
|
|
<Dialog open={open} onOpenChange={onOpenChange}>
|
||
|
|
<DialogContent className="sm:max-w-md">
|
||
|
|
<DialogHeader>
|
||
|
|
<DialogTitle>Generate Expression of Interest</DialogTitle>
|
||
|
|
<DialogDescription>
|
||
|
|
The following prerequisites must be met before generating the EOI document.
|
||
|
|
</DialogDescription>
|
||
|
|
</DialogHeader>
|
||
|
|
|
||
|
|
<div className="space-y-2 py-2">
|
||
|
|
{PREREQUISITE_LABELS.map(({ key, label }) => (
|
||
|
|
<div key={key} className="flex items-center gap-3">
|
||
|
|
<span
|
||
|
|
className={`flex h-5 w-5 items-center justify-center rounded-full text-xs font-bold ${
|
||
|
|
prerequisites[key]
|
||
|
|
? 'bg-green-100 text-green-700'
|
||
|
|
: 'bg-red-100 text-red-700'
|
||
|
|
}`}
|
||
|
|
>
|
||
|
|
{prerequisites[key] ? '✓' : '✗'}
|
||
|
|
</span>
|
||
|
|
<span className={prerequisites[key] ? 'text-foreground' : 'text-muted-foreground'}>
|
||
|
|
{label}
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
))}
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{error && (
|
||
|
|
<p className="text-sm text-destructive">{error}</p>
|
||
|
|
)}
|
||
|
|
|
||
|
|
<DialogFooter>
|
||
|
|
<Button variant="outline" onClick={() => onOpenChange(false)}>
|
||
|
|
Cancel
|
||
|
|
</Button>
|
||
|
|
<Button onClick={handleGenerate} disabled={!allMet || isGenerating}>
|
||
|
|
{isGenerating ? 'Generating...' : 'Generate EOI'}
|
||
|
|
</Button>
|
||
|
|
</DialogFooter>
|
||
|
|
</DialogContent>
|
||
|
|
</Dialog>
|
||
|
|
);
|
||
|
|
}
|