checkbox for status visibility in frontend

This commit is contained in:
gom-by
2025-02-03 16:11:10 +01:00
parent 97dc0b8022
commit 83e6d145b2
4 changed files with 47 additions and 36 deletions

View File

@@ -18,7 +18,7 @@ type Event struct {
bun.BaseModel `bun:"table:events"`
EventID uuid.UUID `bun:"event_id,type:uuid,pk,default:gen_random_uuid()" json:"id"`
Title string `bun:"title,notnull,default:'no title'" json:"title"`
Title string `bun:"title,notnull" json:"title"`
CreationDate time.Time `bun:"creation_date,notnull,default:current_timestamp" json:"creationDate"`
ScheduleStart time.Time `bun:"schedule_start,notnull" json:"start"`
ScheduleEnd time.Time `bun:"schedule_end,notnull" json:"end"`

View File

@@ -28,7 +28,10 @@ import { Button } from "@/components/ui/button";
import { KeyedMutator } from "swr";
import { getCookie } from "cookies-next";
import { useTheme } from "next-themes";
import { Checkbox } from "@radix-ui/react-checkbox";
import { Checkbox } from "@/components/ui/checkbox";
import { eventNames } from "process";
import { useSearchParams } from "next/navigation";
import { CheckedState } from "@radix-ui/react-checkbox";
interface CalendarEventExternalDB extends CalendarEventExternal {
status: "Active" | "Inactive"
@@ -291,6 +294,9 @@ const EventDialog: React.FC<
onActiveStateChange,
event,
}) => {
const [checked, setChecked] = useState<CheckedState>(event.status === "Active")
return (
<Dialog open={open} onOpenChange={onOpenChange}>
<DialogContent className="sm:max-w-md">
@@ -379,18 +385,23 @@ const EventDialog: React.FC<
Rendre cette évènement actif ?
</Label>
<Checkbox
className="grid-cols-4 p-0 m-0 h-4 w-4 border rounded"
id="status"
checked={true}
checked={
checked
}
onCheckedChange={(e) => {
const isChecked = typeof e === "boolean" ? e : false;
if (onActiveStateChange != undefined) {
onActiveStateChange(isChecked)
const booleanCheck = !!e
setChecked(prev => { return !prev })
if (onActiveStateChange) {
onActiveStateChange(booleanCheck)
}
}}
/>
</div>
</div>
<div className="">
Date syntax : yyyy-MM-dd HH:mm
</div>
<DialogFooter className="flex flex-row justify-end">
{onUpdate && (
<Button

View File

@@ -1,10 +1,10 @@
"use client";
"use client"
import * as React from "react";
import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
import { Check } from "lucide-react";
import * as React from "react"
import * as CheckboxPrimitive from "@radix-ui/react-checkbox"
import { Check } from "lucide-react"
import { cn } from "@/lib/utils";
import { cn } from "@/lib/utils"
const Checkbox = React.forwardRef<
React.ElementRef<typeof CheckboxPrimitive.Root>,
@@ -14,7 +14,7 @@ const Checkbox = React.forwardRef<
ref={ref}
className={cn(
"peer h-4 w-4 shrink-0 rounded-sm border border-primary shadow focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
className,
className
)}
{...props}
>
@@ -24,7 +24,7 @@ const Checkbox = React.forwardRef<
<Check className="h-4 w-4" />
</CheckboxPrimitive.Indicator>
</CheckboxPrimitive.Root>
));
Checkbox.displayName = CheckboxPrimitive.Root.displayName;
))
Checkbox.displayName = CheckboxPrimitive.Root.displayName
export { Checkbox };
export { Checkbox }

View File

@@ -1993,9 +1993,9 @@
"license": "MIT"
},
"node_modules/@schedule-x/calendar": {
"version": "2.14.3",
"resolved": "https://registry.npmjs.org/@schedule-x/calendar/-/calendar-2.14.3.tgz",
"integrity": "sha512-JR2HxAOzaz+6DguGhT7gYp8ydJmIgbPeTd4hTDd05zyF6OoUcbEgFmiZDC5VvDTbThzjkS1a9v/OM2n0WAHcPA==",
"version": "2.17.0",
"resolved": "https://registry.npmjs.org/@schedule-x/calendar/-/calendar-2.17.0.tgz",
"integrity": "sha512-a/Rpf+yOKjTpiMXNmZzhzlsF1/NvbUL4CRglHlY4Dn/oK/d3bOA1Q++y/Qzsv77y+cM7Ly1zLVl2aFvJNqT7Zg==",
"license": "MIT",
"peer": true,
"peerDependencies": {