diff --git a/packages/atoms/availabilitylist/ScheduleListItem.tsx b/packages/atoms/availabilitylist/ScheduleListItem.tsx index c8fabf6387..090693631d 100644 --- a/packages/atoms/availabilitylist/ScheduleListItem.tsx +++ b/packages/atoms/availabilitylist/ScheduleListItem.tsx @@ -1,4 +1,17 @@ import { Badge } from "@/components/ui/badge"; +import { Button } from "@/components/ui/button"; +import { + DropdownMenu, + DropdownMenuTrigger, + DropdownMenuContent, + DropdownMenuItem, +} from "@/components/ui/dropdown-menu"; +import { Toaster } from "@/components/ui/toaster"; +import { useToast } from "@/components/ui/use-toast"; +import { Globe, MoreHorizontal, Star, Copy, Trash } from "lucide-react"; +import { Fragment } from "react"; + +import { availabilityAsString } from "@calcom/lib/availability"; type Schedule = { isDefault: boolean; @@ -21,14 +34,22 @@ export function ScheduleListItem({ schedule, isDeletable, displayOptions, + updateDefault, + duplicateFunction, + deleteFunction, }: { schedule: Schedule; isDeletable: boolean; + updateDefault: ({ scheduleId, isDefault }: { scheduleId: number; isDefault: boolean }) => void; + duplicateFunction: ({ scheduleId }: { scheduleId: number }) => void; + deleteFunction: ({ scheduleId }: { scheduleId: number }) => void; displayOptions?: { timeZone?: string; hour12?: boolean; }; }) { + const { toast } = useToast(); + return (
  • @@ -42,16 +63,72 @@ export function ScheduleListItem({ {schedule.availability .filter((availability) => !!availability.days.length) .map((availability) => ( -

    Return fragment here

    + + {availabilityAsString(availability, { + hour12: displayOptions?.hour12, + })} +
    +
    ))} {(schedule.timeZone || displayOptions?.timeZone) && (

    - Display globe here  {schedule.timeZone ?? displayOptions?.timeZone} + +  {schedule.timeZone ?? displayOptions?.timeZone}

    )}

    + + + + + + {!schedule.isDefault && ( + { + updateDefault({ + scheduleId: schedule.id, + isDefault: true, + }); + }} + className="min-w-40 focus:ring-mute min-w-40 focus:ring-muted"> + + Set as default + + )} + { + duplicateFunction({ + scheduleId: schedule.id, + }); + }}> + + Duplicate + + { + console.log("hi"); + if (!isDeletable) { + toast({ + description: "You are required to have at least one schedule", + }); + } else { + deleteFunction({ + scheduleId: schedule.id, + }); + } + }}> + + Delete + + + +
  • );