feat(10-03): add SendQuoteModal component and assignQuoteToLead server action
- Created SendQuoteModal.tsx with two tabs: existing quote (paste token) and create new - Existing quote tab: paste quote token and submit to link quote to lead - New quote tab: button redirects to quote builder pre-filled with lead_id - Added assignQuoteToLead server action to link quote and update lead status to proposal_sent - Validates quote token existence before linking - Revalidates lead detail page on successful assignment Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,129 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { useState } from "react";
|
||||||
|
import { useForm } from "react-hook-form";
|
||||||
|
import { zodResolver } from "@hookform/resolvers/zod";
|
||||||
|
import { z } from "zod";
|
||||||
|
import { assignQuoteToLead } from "@/app/admin/leads/actions";
|
||||||
|
import {
|
||||||
|
Dialog,
|
||||||
|
DialogContent,
|
||||||
|
DialogHeader,
|
||||||
|
DialogTitle,
|
||||||
|
DialogTrigger,
|
||||||
|
} from "@/components/ui/dialog";
|
||||||
|
import {
|
||||||
|
Form,
|
||||||
|
FormControl,
|
||||||
|
FormField,
|
||||||
|
FormItem,
|
||||||
|
FormLabel,
|
||||||
|
FormMessage,
|
||||||
|
} from "@/components/ui/form";
|
||||||
|
import { Input } from "@/components/ui/input";
|
||||||
|
import { Button } from "@/components/ui/button";
|
||||||
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
|
||||||
|
import { Loader2 } from "lucide-react";
|
||||||
|
|
||||||
|
const assignQuoteSchema = z.object({
|
||||||
|
lead_id: z.string().min(1),
|
||||||
|
quote_token: z.string().min(1).optional(),
|
||||||
|
generate_new: z.boolean(),
|
||||||
|
}).transform(data => ({
|
||||||
|
...data,
|
||||||
|
generate_new: data.generate_new ?? false,
|
||||||
|
}));
|
||||||
|
|
||||||
|
export function SendQuoteModal({ leadId }: { leadId: string }) {
|
||||||
|
const [open, setOpen] = useState(false);
|
||||||
|
const [loading, setLoading] = useState(false);
|
||||||
|
const [tab, setTab] = useState<"existing" | "new">("existing");
|
||||||
|
const form = useForm<z.infer<typeof assignQuoteSchema>>({
|
||||||
|
resolver: zodResolver(assignQuoteSchema),
|
||||||
|
defaultValues: {
|
||||||
|
lead_id: leadId,
|
||||||
|
generate_new: false,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
async function onSubmit(data: z.infer<typeof assignQuoteSchema>) {
|
||||||
|
setLoading(true);
|
||||||
|
try {
|
||||||
|
const result = await assignQuoteToLead({
|
||||||
|
...data,
|
||||||
|
generate_new: tab === "new",
|
||||||
|
});
|
||||||
|
if (result.success) {
|
||||||
|
setOpen(false);
|
||||||
|
form.reset();
|
||||||
|
}
|
||||||
|
} finally {
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Dialog open={open} onOpenChange={setOpen}>
|
||||||
|
<DialogTrigger asChild>
|
||||||
|
<Button variant="outline" size="sm">
|
||||||
|
Invia Preventivo
|
||||||
|
</Button>
|
||||||
|
</DialogTrigger>
|
||||||
|
<DialogContent className="max-w-md">
|
||||||
|
<DialogHeader>
|
||||||
|
<DialogTitle>Invia Preventivo al Lead</DialogTitle>
|
||||||
|
</DialogHeader>
|
||||||
|
<Tabs value={tab} onValueChange={(v) => setTab(v as "existing" | "new")}>
|
||||||
|
<TabsList className="grid w-full grid-cols-2">
|
||||||
|
<TabsTrigger value="existing">Preventivo Esistente</TabsTrigger>
|
||||||
|
<TabsTrigger value="new">Crea Nuovo</TabsTrigger>
|
||||||
|
</TabsList>
|
||||||
|
|
||||||
|
<TabsContent value="existing" className="mt-4">
|
||||||
|
<Form {...form}>
|
||||||
|
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="quote_token"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem>
|
||||||
|
<FormLabel>Token Preventivo</FormLabel>
|
||||||
|
<FormControl>
|
||||||
|
<Input
|
||||||
|
placeholder="Incolla il token del preventivo"
|
||||||
|
{...field}
|
||||||
|
/>
|
||||||
|
</FormControl>
|
||||||
|
<FormMessage />
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
<p className="text-xs text-gray-600">
|
||||||
|
Copia il token dal preventivo e incollalo qui. Il lead sarà aggiornato a "Proposal Sent".
|
||||||
|
</p>
|
||||||
|
<Button type="submit" disabled={loading} className="w-full">
|
||||||
|
{loading && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
|
||||||
|
Invia
|
||||||
|
</Button>
|
||||||
|
</form>
|
||||||
|
</Form>
|
||||||
|
</TabsContent>
|
||||||
|
|
||||||
|
<TabsContent value="new" className="mt-4">
|
||||||
|
<p className="text-sm text-gray-600 mb-4">
|
||||||
|
Crea un nuovo preventivo per questo lead. Ti reindirizzeremo al builder.
|
||||||
|
</p>
|
||||||
|
<Button
|
||||||
|
className="w-full"
|
||||||
|
onClick={() => {
|
||||||
|
window.location.href = `/admin/quotes/new?lead_id=${leadId}`;
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Apri Quote Builder
|
||||||
|
</Button>
|
||||||
|
</TabsContent>
|
||||||
|
</Tabs>
|
||||||
|
</DialogContent>
|
||||||
|
</Dialog>
|
||||||
|
);
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user