import { useState } from 'react' import { Button } from "/components/ui/button" import { Input } from "/components/ui/input" import { Card, CardContent, CardHeader, CardTitle } from "/components/ui/card" import { X } from 'lucide-react' type Appointment = { id: string name: string phone: string time: string link: string } export default function AppointmentReminder() { const [appointments, setAppointments] = useState([ { id: Date.now().toString(), name: '', phone: '', time: '', link: '' } ]) const [error, setError] = useState('') const MAX_APPOINTMENTS = 10 const addAppointment = () => { if (appointments.length >= MAX_APPOINTMENTS) return setAppointments([ ...appointments, { id: Date.now().toString(), name: '', phone: '', time: '', link: '' } ]) } const removeAppointment = (id: string) => { if (appointments.length <= 1) return setAppointments(appointments.filter(appt => appt.id !== id)) } const updateAppointment = (id: string, field: keyof Appointment, value: string) => { setAppointments( appointments.map(appt => appt.id === id ? { ...appt, [field]: value } : appt ) ) } const generateMessages = (name: string, time: string, link: string) => { return { tomorrow: `Buongiorno ${name || '[Nome]'}, con questo messaggio ricordo la chiamata in programma DOMANI alle ${time || '[Orario]'}, tramite Google Meet.\nPer accedere alla consulenza ti basterà copiare questo link nel tuo browser:\n${link || '[Link Meet]'}`, today: `Buongiorno ${name || '[Nome]'}, con questo messaggio ricordo la chiamata in programma OGGI alle ${time || '[Orario]'}, tramite Google Meet.\nPer accedere alla consulenza ti basterà copiare questo link nel tuo browser:\n${link || '[Link Meet]'}` } } const generateCSV = () => { const csvContent = ['phone,name,Param1'] let isValid = true appointments.forEach(appt => { const { name, phone, time, link } = appt if (!name || !phone || !time || !link) { isValid = false return } const messages = generateMessages(name, time, link) csvContent.push( `"${phone}","${name.replace(/"/g, '""')}","${messages.tomorrow.replace(/"/g, '""')}"`, `"${phone}","${name.replace(/"/g, '""')}","${messages.today.replace(/"/g, '""')}"` ) }) if (isValid && csvContent.length > 1) { const csvString = csvContent.join('\n') const blob = new Blob([csvString], { type: 'text/csv;charset=utf-8;' }) const url = URL.createObjectURL(blob) const link = document.createElement('a') link.href = url link.download = 'appuntamenti.csv' document.body.appendChild(link) link.click() document.body.removeChild(link) setError('') } else { setError('Compila tutti i campi per ogni appuntamento!') } } return (

📅 Promemoria Appuntamenti

{appointments.map((appt) => (

updateAppointment(appt.id, 'name', e.target.value)} required /> updateAppointment(appt.id, 'phone', e.target.value)} required /> updateAppointment(appt.id, 'time', e.target.value)} required /> updateAppointment(appt.id, 'link', e.target.value)} required />

{appointments.length > 1 && ( )}

))}

Appuntamenti aggiunti: {appointments.length}/{MAX_APPOINTMENTS}

{error && (

{error}

)}

Anteprima

{appointments.map((appt) => { const messages = generateMessages(appt.name, appt.time, appt.link) return (

{appt.name || '[Nome]'}

{appt.time || '[Orario]'}

{appt.link || '[Link Meet]'}

Promemoria per domani

{messages.tomorrow}

Promemoria per oggi

{messages.today}

) })}

) }