cdricms/latosa-escrima
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Locations added

Browse Source
This commit is contained in:
cdricms
2025-03-10 16:25:12 +01:00
parent 7cb633b4c6
commit 4cf85981eb
32 changed files with 1504 additions and 227 deletions
Download Patch File Download Diff File Expand all files Collapse all files

148
frontend/components/event-dialog.tsx
View File

@@ -32,6 +32,20 @@ import {
} from "@/components/ui/select";
import { useForm } from "react-hook-form";
import { useEffect } from "react";
import ICalendarEvent from "@/interfaces/ICalendarEvent";
import {
Command,
CommandInput,
CommandList,
CommandEmpty,
CommandGroup,
CommandItem,
} from "@/components/ui/command";
import { Textarea } from "@/components/ui/textarea";
import { useApi } from "@/hooks/use-api";
import { Location } from "@/types/types";
import openNavigationApp from "@/lib/openNavigationMap";
import formatLocation from "@/lib/formatLocation";
export const eventFormSchema = z.object({
title: z.string().min(1, "Titre requis"),
@@ -43,6 +57,8 @@ export const eventFormSchema = z.object({
frequency: z.enum(["unique", "quotidien", "hebdomadaire", "mensuel"]),
frequencyEndDate: z.date().optional(),
isVisible: z.boolean().default(true),
description: z.string().optional(),
location: z.string().optional(), // Store as a formatted string
});
export type EventFormValues = z.infer<typeof eventFormSchema>;
@@ -55,13 +71,15 @@ const frequencies = [
];
export const EventForm: React.FC<{
event: any;
event: ICalendarEvent | Omit<ICalendarEvent, "id">;
setForm: React.Dispatch<
React.SetStateAction<
ReturnType<typeof useForm<EventFormValues>> | undefined
>
>;
}> = ({ event, setForm }) => {
const locations = useApi<Location[]>("/locations/all");
const _start = new Date(event.start ?? Date.now());
const _end = new Date(event.end ?? Date.now());
@@ -76,6 +94,8 @@ export const EventForm: React.FC<{
fullDay: event.fullday ?? false,
frequency: "unique",
isVisible: event.isVisible ?? true,
location: event.location,
description: event.description,
},
});
@@ -106,7 +126,7 @@ export const EventForm: React.FC<{
/>
<div className="grid grid-cols-[1fr,auto,1fr] items-end gap-2">
{/* Simplified startDate without FormField */}
{/* Start Date */}
<FormItem className="flex flex-col">
<FormLabel>Début</FormLabel>
<Popover>
@@ -135,25 +155,16 @@ export const EventForm: React.FC<{
align="start"
>
<div style={{ pointerEvents: "auto" }}>
{/* Force interactivity */}
<Calendar
mode="single"
selected={form.getValues("startDate")}
onSelect={(date) => {
console.log(
"Start date selected:",
date,
);
if (date) {
form.setValue(
"startDate",
date,
{ shouldValidate: true },
);
console.log(
"Updated startDate:",
form.getValues("startDate"),
);
}
}}
initialFocus
@@ -183,7 +194,7 @@ export const EventForm: React.FC<{
<span className="invisible">Until</span>
{/* Simplified endDate */}
{/* End Date */}
<FormItem className="flex flex-col">
<FormLabel>Fin</FormLabel>
<Popover>
@@ -216,18 +227,10 @@ export const EventForm: React.FC<{
mode="single"
selected={form.getValues("endDate")}
onSelect={(date) => {
console.log(
"End date selected:",
date,
);
if (date) {
form.setValue("endDate", date, {
shouldValidate: true,
});
console.log(
"Updated endDate:",
form.getValues("endDate"),
);
}
}}
initialFocus
@@ -286,7 +289,7 @@ export const EventForm: React.FC<{
>
<FormControl>
<SelectTrigger>
<SelectValue placeholder="Selectionner Fréquence" />
<SelectValue placeholder="Sélectionner Fréquence" />
</SelectTrigger>
</FormControl>
<SelectContent>
@@ -343,10 +346,6 @@ export const EventForm: React.FC<{
"frequencyEndDate",
)}
onSelect={(date) => {
console.log(
"Frequency end date selected:",
date,
);
if (date) {
form.setValue(
"frequencyEndDate",
@@ -356,12 +355,6 @@ export const EventForm: React.FC<{
true,
},
);
console.log(
"Updated frequencyEndDate:",
form.getValues(
"frequencyEndDate",
),
);
}
}}
initialFocus
@@ -380,7 +373,7 @@ export const EventForm: React.FC<{
render={({ field }) => (
<FormItem className="flex-1">
<FormLabel className="align-sub">
Evènement visible ?
Évènement visible ?
</FormLabel>
<FormControl>
<Checkbox
@@ -393,6 +386,97 @@ export const EventForm: React.FC<{
</FormItem>
)}
/>
{/* Updated Location Field with Command */}
<FormField
control={form.control}
name="location"
render={({ field }) => (
<FormItem>
<FormLabel>Lieu</FormLabel>
<FormControl>
<Command className="rounded-lg border shadow-md">
<CommandInput
placeholder="Rechercher un lieu..."
value={field.value || ""}
onValueChange={(value) =>
field.onChange(value)
}
/>
<CommandList>
{locations.isLoading && (
<CommandEmpty>
Chargement...
</CommandEmpty>
)}
{!locations.isLoading &&
!locations.data?.length && (
<CommandEmpty>
Aucun lieu trouvé.
</CommandEmpty>
)}
{!locations.isLoading &&
locations.data?.length && (
<CommandGroup heading="Suggestions">
{locations.data
.filter((location) =>
formatLocation(
location,
)
.toLowerCase()
.includes(
(
field.value ||
""
).toLowerCase(),
),
)
.map((location) => (
<CommandItem
key={
location.id
}
onSelect={() => {
const formatted =
formatLocation(
location,
);
field.onChange(
formatted,
);
}}
>
{formatLocation(
location,
)}
</CommandItem>
))}
</CommandGroup>
)}
</CommandList>
</Command>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="description"
render={({ field }) => (
<FormItem>
<FormLabel>Description</FormLabel>
<FormControl>
<Textarea
placeholder="Ajouter une description"
{...field}
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</form>
</Form>
);