alma/NeahFront7
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

calendar 15

Browse Source
This commit is contained in:
Alma 2025-04-13 14:20:23 +02:00
parent 0d78cc4e6a
commit f8dc611a8b
1 changed files with 39 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
components/calendar/calendar-client.tsx
View File

@ -90,6 +90,8 @@ function CalendarDialog({ open, onClose, onSave, onDelete, initialData }: Calend
const [isSubmitting, setIsSubmitting] = useState(false); const [isSubmitting, setIsSubmitting] = useState(false);
const [customColorMode, setCustomColorMode] = useState(false); const [customColorMode, setCustomColorMode] = useState(false);
const isMainCalendar = initialData?.name === "Calendrier principal";
useEffect(() => { useEffect(() => {
if (open) { if (open) {
setName(initialData?.name || ""); setName(initialData?.name || "");
@ -119,7 +121,11 @@ function CalendarDialog({ open, onClose, onSave, onDelete, initialData }: Calend
}; };
const handleDelete = async () => { const handleDelete = async () => {
if (!initialData?.id || !onDelete) return; if (!initialData?.id || !onDelete || isMainCalendar) return;
if (!confirm("Êtes-vous sûr de vouloir supprimer ce calendrier ? Tous les événements associés seront également supprimés.")) {
return;
}
setIsSubmitting(true); setIsSubmitting(true);
try { try {
@ -160,6 +166,7 @@ function CalendarDialog({ open, onClose, onSave, onDelete, initialData }: Calend
onChange={(e) => setName(e.target.value)} onChange={(e) => setName(e.target.value)}
placeholder="Nom du calendrier" placeholder="Nom du calendrier"
required required
disabled={isMainCalendar}
className="rounded-lg border-gray-300 focus:border-indigo-500 focus:ring-indigo-500" className="rounded-lg border-gray-300 focus:border-indigo-500 focus:ring-indigo-500"
/> />
</div> </div>
@ -245,12 +252,12 @@ function CalendarDialog({ open, onClose, onSave, onDelete, initialData }: Calend
<DialogFooter className="mt-6 border-t border-gray-100 pt-4"> <DialogFooter className="mt-6 border-t border-gray-100 pt-4">
<div className="flex justify-between w-full"> <div className="flex justify-between w-full">
{initialData?.id && ( {initialData?.id && !isMainCalendar && (
<Button <Button
type="button" type="button"
variant="destructive" variant="destructive"
onClick={handleDelete} onClick={handleDelete}
disabled={isSubmitting} disabled={isSubmitting || isMainCalendar}
> >
<X className="w-4 h-4 mr-2" /> <X className="w-4 h-4 mr-2" />
Supprimer Supprimer
@ -268,7 +275,7 @@ function CalendarDialog({ open, onClose, onSave, onDelete, initialData }: Calend
</Button> </Button>
<Button <Button
type="submit" type="submit"
disabled={!name || isSubmitting} disabled={!name || isSubmitting || isMainCalendar}
className="rounded-lg bg-indigo-600 hover:bg-indigo-700 text-white" className="rounded-lg bg-indigo-600 hover:bg-indigo-700 text-white"
> >
{isSubmitting {isSubmitting
@ -653,20 +660,35 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
// Add a calendar selector component // Add a calendar selector component
const CalendarSelector = () => ( const CalendarSelector = () => (
<div className="flex items-center gap-4 mb-4"> <div className="flex flex-wrap items-center gap-2 mb-4">
{calendars.map((calendar) => ( {calendars.map((calendar) => (
<Button <div key={calendar.id} className="relative group">
key={calendar.id} <Button
variant={calendar.id === selectedCalendarId ? "secondary" : "ghost"} variant={calendar.id === selectedCalendarId ? "secondary" : "ghost"}
className="flex items-center gap-2" className="flex items-center gap-2 pr-8"
onClick={() => setSelectedCalendarId(calendar.id)} onClick={() => setSelectedCalendarId(calendar.id)}
> >
<div <div
className="w-3 h-3 rounded-full" className="w-3 h-3 rounded-full"
style={{ backgroundColor: calendar.color }} style={{ backgroundColor: calendar.color }}
/> />
<span>{calendar.name}</span> <span>{calendar.name}</span>
</Button> </Button>
{calendar.name !== "Calendrier principal" && (
<Button
variant="ghost"
size="icon"
className="absolute right-0 top-1/2 -translate-y-1/2 opacity-0 group-hover:opacity-100 transition-opacity"
onClick={(e) => {
e.stopPropagation();
setSelectedCalendar(calendar);
setIsCalendarModalOpen(true);
}}
>
<Settings className="h-4 w-4" />
</Button>
)}
</div>
))} ))}
</div> </div>
); );