52d5261b51
* display UTM parameters * persist view (list | calendar) in localStorage * move to next page on clicking "next" of last item in the page improve navigation ^ Conflicts: ^ apps/web/modules/bookings/components/BookingCalendarContainer.tsx * fix navigation on calendar view * Delete apps/web/modules/bookings/NAVIGATION_IMPLEMENTATION.md * avoid page size being 0 * check feature flag on user level * use map to improve useBookingListData * address feedback * feat(bookings): add smart navigation for calendar view - Add sort option to tRPC bookings.get schema and handler - Create NAVIGATION_PROBE_WINDOW_MONTHS constant (3 months) - Create useNearestFutureBooking hook to find nearest future booking - Create useNearestPastBooking hook to find nearest past booking - Update useCalendarNavigationCapabilities to use probe results - Update BookingCalendarContainer to wire up probe hooks This enables the booking details sheet to: - Disable next/prev buttons when no bookings exist in that direction - Jump directly to the week containing the nearest booking Co-Authored-By: eunjae@cal.com <hey@eunjae.dev> * fix type error * feat: add booking selection state when using slideover (#25637) * implement booking selection when using slideover * remove pixel shift * fix * auto scroll to selected event on calendar * make DateValues header sticky when scrolling --------- Co-authored-by: Eunjae Lee <hey@eunjae.dev> * prefetch previous / next weeks on calendar view * clean up classes * handle "fetched & but no data" situation more correctly in useCalendarAutoSelector --------- Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com> Co-authored-by: sean-brydon <55134778+sean-brydon@users.noreply.github.com>
55 lines
1.7 KiB
TypeScript
55 lines
1.7 KiB
TypeScript
import type { Dayjs } from "@calcom/dayjs";
|
|
import { trpc } from "@calcom/trpc/react";
|
|
|
|
import { NAVIGATION_PROBE_WINDOW_MONTHS } from "../lib/constants";
|
|
import type { BookingListingStatus } from "../types";
|
|
|
|
interface UseNearestFutureBookingProps {
|
|
currentWeekStart: Dayjs;
|
|
filters: {
|
|
statuses: BookingListingStatus[];
|
|
userIds?: number[];
|
|
};
|
|
enabled?: boolean;
|
|
}
|
|
|
|
/**
|
|
* Probe hook to find the nearest future booking after the current week.
|
|
* Used for calendar view navigation to determine if there are any bookings
|
|
* in the future and to jump directly to the week containing that booking.
|
|
*
|
|
* Uses a broad date range (NAVIGATION_PROBE_WINDOW_MONTHS) but only fetches
|
|
* 1 booking (the nearest one) to minimize data transfer.
|
|
*/
|
|
export function useNearestFutureBooking({
|
|
currentWeekStart,
|
|
filters,
|
|
enabled = true,
|
|
}: UseNearestFutureBookingProps) {
|
|
// Search from the end of current week to NAVIGATION_PROBE_WINDOW_MONTHS months ahead
|
|
const afterDate = currentWeekStart.add(1, "week").startOf("day");
|
|
const beforeDate = currentWeekStart.add(NAVIGATION_PROBE_WINDOW_MONTHS, "month").endOf("day");
|
|
|
|
const query = trpc.viewer.bookings.get.useQuery(
|
|
{
|
|
filters: {
|
|
statuses: filters.statuses,
|
|
userIds: filters.userIds,
|
|
afterStartDate: afterDate.toISOString(),
|
|
beforeEndDate: beforeDate.toISOString(),
|
|
},
|
|
limit: 1, // Only need the nearest one
|
|
// Default sort for "upcoming" status is ASC, which gives us the nearest future booking
|
|
},
|
|
{
|
|
enabled,
|
|
staleTime: 5 * 60 * 1000, // 5 minutes
|
|
}
|
|
);
|
|
|
|
return {
|
|
nearestBooking: query.data?.bookings[0] ?? null,
|
|
isLoading: query.isLoading,
|
|
};
|
|
}
|