Booking Module Improvements (#3221)

* Fix momentary render of dates before skeleton

* Fix Hydration issue - We shouldnt guess timezone on server as it would be different from client causing hydration error

* Fix wrong trpcQuery result when clicking on a particular date. Also, fix last day of the month being never available

* Fix as per PR Feedback
pull/3245/head
Hariom Balhara 2022-07-06 19:55:41 +05:30 committed by GitHub
parent b7d4e3885e
commit b3f7e8e322
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 6 additions and 8 deletions

View File

@ -111,7 +111,7 @@ const useSlots = ({
endTime?: Dayjs;
timeZone: string;
}) => {
const { data, isLoading } = trpc.useQuery(
const { data, isLoading, isIdle } = trpc.useQuery(
[
"viewer.public.slots.getSchedule",
{
@ -132,7 +132,8 @@ const useSlots = ({
}
}, [data]);
return { slots: cachedSlots, isLoading };
// The very first time isIdle is set if auto-fetch is disabled, so isIdle should also be considered a loading state.
return { slots: cachedSlots, isLoading: isLoading || isIdle };
};
const SlotPicker = ({
@ -261,7 +262,7 @@ function TimezoneDropdown({
<Collapsible.Trigger className="min-w-32 text-bookinglight mb-1 -ml-2 px-2 py-1 text-left dark:text-white">
<p className="text-gray-600 dark:text-white">
<GlobeIcon className="mr-[10px] ml-[2px] -mt-1 inline-block h-4 w-4 text-gray-400" />
{timeZone || dayjs.tz.guess()}
{timeZone}
{isTimeOptionsOpen ? (
<ChevronUpIcon className="ml-1 -mt-1 inline-block h-4 w-4 text-gray-400" />
) : (

View File

@ -151,16 +151,13 @@ export const slotsRouter = createRouter().query("getSchedule", {
const startTime =
input.timeZone === "Etc/GMT"
? dayjs.utc(input.startTime)
: dayjs.utc(input.startTime).tz(input.timeZone, true);
: dayjs(input.startTime).utc().tz(input.timeZone);
const endTime =
input.timeZone === "Etc/GMT"
? dayjs.utc(input.endTime)
: dayjs.utc(input.endTime).tz(input.timeZone, true);
input.timeZone === "Etc/GMT" ? dayjs.utc(input.endTime) : dayjs(input.endTime).utc().tz(input.timeZone);
if (!startTime.isValid() || !endTime.isValid()) {
throw new TRPCError({ message: "Invalid time range given.", code: "BAD_REQUEST" });
}
let currentSeats: CurrentSeats | undefined = undefined;
const userSchedules = await Promise.all(