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

Vision Refactor

Browse Source
This commit is contained in:
alma 2026-01-14 11:30:33 +01:00
parent 8c51fae1a7
commit 2e5dc2e9f7
1 changed files with 76 additions and 86 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

162
app/vision/page.tsx
View File

@ -50,7 +50,6 @@ export default function VisionPage() {
} | null>(null); } | null>(null);
const [jitsiUrl, setJitsiUrl] = useState<string | null>(null); const [jitsiUrl, setJitsiUrl] = useState<string | null>(null);
const [scheduledMeetings, setScheduledMeetings] = useState<ScheduledMeeting[]>([]); const [scheduledMeetings, setScheduledMeetings] = useState<ScheduledMeeting[]>([]);
const [showCalendar, setShowCalendar] = useState(false);
const [showMeetingDialog, setShowMeetingDialog] = useState(false); const [showMeetingDialog, setShowMeetingDialog] = useState(false);
const [selectedDate, setSelectedDate] = useState<Date | undefined>(new Date()); const [selectedDate, setSelectedDate] = useState<Date | undefined>(new Date());
const [meetingForm, setMeetingForm] = useState<{ const [meetingForm, setMeetingForm] = useState<{
@ -371,90 +370,81 @@ export default function VisionPage() {
{/* Calendar Section */} {/* Calendar Section */}
<div className="mb-8"> <div className="mb-8">
<div className="bg-white rounded-lg border border-gray-200 p-4"> <div className="bg-white rounded-lg border border-gray-200 p-4">
<div className="flex items-center justify-between mb-4"> <div className="flex items-center gap-2 mb-4">
<div className="flex items-center gap-2"> <Calendar className="h-5 w-5 text-purple-600" />
<Calendar className="h-5 w-5 text-purple-600" /> <h2 className="text-xl font-semibold text-gray-900">
<h2 className="text-xl font-semibold text-gray-900"> Calendrier des réunions
Calendrier des réunions </h2>
</h2>
</div>
<Button
variant="outline"
size="sm"
onClick={() => setShowCalendar(!showCalendar)}
className="flex items-center gap-2"
>
{showCalendar ? "Masquer" : "Afficher"} le calendrier
</Button>
</div> </div>
{showCalendar && ( <div className="flex flex-col lg:flex-row gap-6">
<div className="flex flex-col lg:flex-row gap-6"> <div className="flex-1">
<div className="flex-1"> <CalendarComponent
<CalendarComponent mode="single"
mode="single" selected={selectedDate}
selected={selectedDate} onSelect={setSelectedDate}
onSelect={setSelectedDate} className="rounded-md border"
className="rounded-md border" classNames={{
modifiers={{ day: "h-9 w-9 p-0 font-normal border border-gray-200 bg-white aria-selected:bg-blue-600 aria-selected:text-white",
hasMeeting: (date) => { }}
if (!date) return false; modifiers={{
return getMeetingsForDate(date).length > 0; hasMeeting: (date) => {
}, if (!date) return false;
}} return getMeetingsForDate(date).length > 0;
modifiersClassNames={{ },
hasMeeting: "bg-blue-100 text-blue-900 font-semibold", }}
}} modifiersClassNames={{
/> hasMeeting: "bg-blue-100 text-blue-900 font-semibold",
</div> }}
<div className="flex-1"> />
{selectedDate && (
<div>
<h3 className="font-semibold text-gray-900 mb-3">
Réunions du {selectedDate.toLocaleDateString('fr-FR', { weekday: 'long', day: 'numeric', month: 'long' })}
</h3>
{getMeetingsForDate(selectedDate).length === 0 ? (
<p className="text-gray-500 text-sm">Aucune réunion planifiée</p>
) : (
<div className="space-y-2">
{getMeetingsForDate(selectedDate).map((meeting) => (
<div
key={meeting.id}
className="bg-gray-50 rounded-lg border border-gray-200 p-3 flex items-center justify-between"
>
<div>
<h4 className="font-medium text-gray-900">
{meeting.title || `${meeting.type === "group" ? "Groupe" : "Mission"}: ${meeting.entityName}`}
</h4>
<p className="text-sm text-gray-500">{meeting.time}</p>
</div>
<div className="flex items-center gap-2">
<Button
size="sm"
variant="outline"
onClick={() => handleConferenceClick(meeting.type, meeting.entityId, meeting.entityName)}
>
<Video className="h-4 w-4 mr-1" />
Rejoindre
</Button>
<Button
variant="ghost"
size="sm"
onClick={() => handleDeleteMeeting(meeting.id)}
className="text-red-600 hover:text-red-700"
>
<X className="h-4 w-4" />
</Button>
</div>
</div>
))}
</div>
)}
</div>
)}
</div>
</div> </div>
)} <div className="flex-1">
{selectedDate && (
<div>
<h3 className="font-semibold text-gray-900 mb-3">
Réunions du {selectedDate.toLocaleDateString('fr-FR', { weekday: 'long', day: 'numeric', month: 'long' })}
</h3>
{getMeetingsForDate(selectedDate).length === 0 ? (
<p className="text-gray-500 text-sm">Aucune réunion planifiée</p>
) : (
<div className="space-y-2">
{getMeetingsForDate(selectedDate).map((meeting) => (
<div
key={meeting.id}
className="bg-gray-50 rounded-lg border border-gray-200 p-3 flex items-center justify-between"
>
<div>
<h4 className="font-medium text-gray-900">
{meeting.title || `${meeting.type === "group" ? "Groupe" : "Mission"}: ${meeting.entityName}`}
</h4>
<p className="text-sm text-gray-500">{meeting.time}</p>
</div>
<div className="flex items-center gap-2">
<Button
size="sm"
variant="outline"
onClick={() => handleConferenceClick(meeting.type, meeting.entityId, meeting.entityName)}
>
<Video className="h-4 w-4 mr-1" />
Rejoindre
</Button>
<Button
variant="ghost"
size="sm"
onClick={() => handleDeleteMeeting(meeting.id)}
className="text-red-600 hover:text-red-700"
>
<X className="h-4 w-4" />
</Button>
</div>
</div>
))}
</div>
)}
</div>
)}
</div>
</div>
</div> </div>
</div> </div>
@ -622,7 +612,7 @@ export default function VisionPage() {
value={meetingForm.title} value={meetingForm.title}
onChange={(e) => setMeetingForm({ ...meetingForm, title: e.target.value })} onChange={(e) => setMeetingForm({ ...meetingForm, title: e.target.value })}
placeholder={`Réunion ${meetingForm.type === "group" ? "du groupe" : "de la mission"}`} placeholder={`Réunion ${meetingForm.type === "group" ? "du groupe" : "de la mission"}`}
className="mt-1" className="mt-1 bg-black text-white border-gray-700 placeholder-gray-400"
/> />
</div> </div>
<div> <div>
@ -632,7 +622,7 @@ export default function VisionPage() {
type="date" type="date"
value={meetingForm.date} value={meetingForm.date}
onChange={(e) => setMeetingForm({ ...meetingForm, date: e.target.value })} onChange={(e) => setMeetingForm({ ...meetingForm, date: e.target.value })}
className="mt-1" className="mt-1 bg-black text-white border-gray-700"
required required
/> />
</div> </div>
@ -643,7 +633,7 @@ export default function VisionPage() {
type="time" type="time"
value={meetingForm.time} value={meetingForm.time}
onChange={(e) => setMeetingForm({ ...meetingForm, time: e.target.value })} onChange={(e) => setMeetingForm({ ...meetingForm, time: e.target.value })}
className="mt-1" className="mt-1 bg-black text-white border-gray-700"
required required
/> />
</div> </div>
@ -655,7 +645,6 @@ export default function VisionPage() {
</div> </div>
<DialogFooter> <DialogFooter>
<Button <Button
variant="outline"
onClick={() => { onClick={() => {
setShowMeetingDialog(false); setShowMeetingDialog(false);
setMeetingForm({ setMeetingForm({
@ -667,6 +656,7 @@ export default function VisionPage() {
title: "", title: "",
}); });
}} }}
className="bg-black text-white hover:bg-gray-900 border border-black"
> >
Annuler Annuler
</Button> </Button>