diff --git a/apps/web/pages/availability/index.tsx b/apps/web/pages/availability/index.tsx index b650f55cd0..cdcb76e25d 100644 --- a/apps/web/pages/availability/index.tsx +++ b/apps/web/pages/availability/index.tsx @@ -45,6 +45,24 @@ export function AvailabilityList({ schedules }: RouterOutputs["viewer"]["availab }, }); + const updateMutation = trpc.viewer.availability.schedule.update.useMutation({ + onSuccess: async ({ schedule }) => { + await utils.viewer.availability.list.invalidate(); + showToast( + t("availability_updated_successfully", { + scheduleName: schedule.name, + }), + "success" + ); + }, + onError: (err) => { + if (err instanceof HttpError) { + const message = `${err.statusCode}: ${err.message}`; + showToast(message, "error"); + } + }, + }); + // Adds smooth delete button - item fades and old item slides into place const [animationParentRef] = useAutoAnimate(); @@ -71,6 +89,7 @@ export function AvailabilityList({ schedules }: RouterOutputs["viewer"]["availab }} key={schedule.id} schedule={schedule} + updateDefault={updateMutation.mutate} deleteFunction={deleteMutation.mutate} /> ))} diff --git a/apps/web/public/static/locales/en/common.json b/apps/web/public/static/locales/en/common.json index 31a637ddcf..985c55e135 100644 --- a/apps/web/public/static/locales/en/common.json +++ b/apps/web/public/static/locales/en/common.json @@ -1408,5 +1408,6 @@ "enter_option": "Enter Option {{index}}", "add_an_option": "Add an option", "radio": "Radio", - "kbar_search_placeholder" : "Start typing to search" + "kbar_search_placeholder" : "Start typing to search", + "set_as_default": "Set as default" } diff --git a/packages/features/schedules/components/ScheduleListItem.tsx b/packages/features/schedules/components/ScheduleListItem.tsx index 83c9aaa326..00e182d0f2 100644 --- a/packages/features/schedules/components/ScheduleListItem.tsx +++ b/packages/features/schedules/components/ScheduleListItem.tsx @@ -2,9 +2,12 @@ import Link from "next/link"; import { Fragment } from "react"; import { availabilityAsString } from "@calcom/lib/availability"; +import classNames from "@calcom/lib/classNames"; import { useLocale } from "@calcom/lib/hooks/useLocale"; import { Availability } from "@calcom/prisma/client"; import { RouterOutputs } from "@calcom/trpc/react"; +import { trpc } from "@calcom/trpc/react"; +import { Schedule } from "@calcom/types/schedule"; import { Badge, Button, @@ -19,6 +22,7 @@ export function ScheduleListItem({ schedule, deleteFunction, displayOptions, + updateDefault, }: { schedule: RouterOutputs["viewer"]["availability"]["list"]["schedules"][number]; deleteFunction: ({ scheduleId }: { scheduleId: number }) => void; @@ -26,9 +30,20 @@ export function ScheduleListItem({ timeZone?: string; hour12?: boolean; }; + updateDefault: ({ + scheduleId, + isDefault, + schedule, + }: { + scheduleId: number; + isDefault: boolean; + schedule: Schedule; + }) => void; }) { const { t, i18n } = useLocale(); + const { data, isLoading } = trpc.viewer.availability.schedule.get.useQuery({ scheduleId: schedule.id }); + return (
  • @@ -67,22 +82,44 @@ export function ScheduleListItem({ - - + {!isLoading && data && ( + + + {!schedule.isDefault && ( + + )} + + + + + + )}