feat: Improve edit availability workflow (#5159)

* feat: return data fromsetupDefaultSchedule

* feat: update returned data of "schedule.update" resolver as same as "schedule" query resolver.

* feat: set query data from updated results and invalidate prev default availability if it's changed.

* chore: add comments

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

apps/web/pages/availability/[schedule].tsx

@@ -1,5 +1,4 @@
 import { GetStaticPaths, GetStaticProps } from "next";
-import { useRouter } from "next/router";
 import { useEffect } from "react";
 import { Controller, useForm } from "react-hook-form";
 import { z } from "zod";
@@ -39,7 +38,6 @@ type AvailabilityFormValues = {
 
 export default function Availability({ schedule }: { schedule: number }) {
   const { t, i18n } = useLocale();
-  const router = useRouter();
   const utils = trpc.useContext();
   const me = useMeQuery();
   const { timeFormat } = me.data || { timeFormat: null };
@@ -60,13 +58,20 @@ export default function Availability({ schedule }: { schedule: number }) {
   }, [data, isLoading, reset]);
 
   const updateMutation = trpc.useMutation("viewer.availability.schedule.update", {
-    onSuccess: async ({ schedule }) => {
-      await utils.invalidateQueries(["viewer.availability.schedule"]);
-      await utils.refetchQueries(["viewer.availability.schedule"]);
-      await router.push("/availability");
+    onSuccess: async ({ prevDefaultId, currentDefaultId, ...data }) => {
+      if (prevDefaultId && currentDefaultId) {
+        // check weather the default schedule has been changed by comparing  previous default schedule id and current default schedule id.
+        if (prevDefaultId !== currentDefaultId) {
+          // if not equal, invalidate previous default schedule id and refetch previous default schedule id.
+          utils.invalidateQueries(["viewer.availability.schedule", { scheduleId: prevDefaultId }]);
+          utils.refetchQueries(["viewer.availability.schedule", { scheduleId: prevDefaultId }]);
+        }
+      }
+      utils.setQueryData(["viewer.availability.schedule", { scheduleId: data.schedule.id }], data);
+      utils.invalidateQueries(["viewer.availability.list"]);
       showToast(
         t("availability_updated_successfully", {
-          scheduleName: schedule.name,
+          scheduleName: data.schedule.name,
         }),
         "success"
       );

packages/trpc/server/routers/viewer/availability.tsx

@@ -210,8 +210,10 @@ export const availabilityRouter = createProtectedRouter()
       const { user, prisma } = ctx;
       const availability = getAvailabilityFromSchedule(input.schedule);
 
+      let updatedUser;
       if (input.isDefault) {
-        setupDefaultSchedule(user.id, input.scheduleId, prisma);
+        const setupDefault = await setupDefaultSchedule(user.id, input.scheduleId, prisma);
+        updatedUser = setupDefault;
       }
 
       // Not able to update the schedule with userId where clause, so fetch schedule separately and then validate
@@ -255,10 +257,33 @@ export const availabilityRouter = createProtectedRouter()
             },
           },
         },
+        select: {
+          id: true,
+          userId: true,
+          name: true,
+          availability: true,
+          timeZone: true,
+          eventType: {
+            select: {
+              _count: true,
+              id: true,
+              eventName: true,
+            },
+          },
+        },
       });
 
+      const userAvailability = convertScheduleToAvailability(schedule);
+
       return {
         schedule,
+        availability: userAvailability,
+        timeZone: schedule.timeZone || user.timeZone,
+        isDefault: updatedUser
+          ? updatedUser.defaultScheduleId === schedule.id
+          : user.defaultScheduleId === schedule.id,
+        prevDefaultId: user.defaultScheduleId,
+        currentDefaultId: updatedUser ? updatedUser.defaultScheduleId : user.defaultScheduleId,
       };
     },
   });
@@ -297,7 +322,7 @@ export const convertScheduleToAvailability = (
 };
 
 const setupDefaultSchedule = async (userId: number, scheduleId: number, prisma: PrismaClient) => {
-  await prisma.user.update({
+  return prisma.user.update({
     where: {
       id: userId,
     },