@ticketboothapp/booking 1.2.123 → 1.2.124

package/src/components/booking/use-standard-booking-availability.ts

@@ -0,0 +1,806 @@
+import {
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+  type Dispatch,
+  type SetStateAction,
+} from 'react';
+import { isAfter, isBefore, parseISO } from 'date-fns';
+import { formatInTimeZone, fromZonedTime } from 'date-fns-tz';
+
+import {
+  getAvailabilities,
+  type Availability,
+  type PrecomputedPricesByCategory,
+  type PricingConfig,
+  type Product,
+  type ReturnOption,
+} from '../../lib/booking-api';
+import { filterAvailabilitiesAfterPublicBookingCutoff } from '../../lib/booking/booking-cutoffs';
+import { shouldReplacePricingConfig } from '../../lib/booking/pricing-config';
+import { useAvailabilitiesCache, buildAvailabilitiesCacheKey } from '../../contexts/AvailabilitiesCacheContext';
+import {
+  availabilityMatchesSelectedDate,
+  availabilityWithOptionId,
+  deriveDefaultQuantitiesFromAvailabilities,
+  findMergedAvailabilityForSelection,
+  getAvailabilityCacheKey,
+  getAvailabilityOptionId,
+  getInitialAvailabilityRangeEnd,
+  getInitialAvailabilityRangeStart,
+  getStartOfCurrentDay,
+  mergeAvailabilitiesIntoMap,
+  mergePrecomputedPricesFromAvailabilityResult,
+  parseAvailabilityDateTime,
+  shouldSyncSelectedAvailability,
+} from './standard-booking-availability';
+
+interface UseStandardBookingAvailabilityParams {
+  product: Product;
+  activeOptions: Product['options'];
+  activeOptionIdsKey: string;
+  isPrivateShuttle: boolean;
+  isPartialLaunch: boolean;
+  isAdmin: boolean;
+  companyTimezone: string;
+  appliedPromoCode: string | null;
+  pricingProfileIdForAvailabilities: string | null;
+  cancellationPolicyProfileIdForAvailabilities: string | null;
+  bookingCutoffNow: Date;
+  bookingCutoffMinutes?: number | null;
+  setQuantities: Dispatch<SetStateAction<Record<string, number>>>;
+  setError: Dispatch<SetStateAction<string>>;
+}
+
+type DateRange = { start: Date; end: Date };
+
+function formatAvailabilityRequestRange(
+  start: Date,
+  end: Date,
+  isPrivateShuttle: boolean,
+  companyTimezone: string,
+): { startDateStr: string; endDateStr: string } {
+  if (isPrivateShuttle) {
+    return {
+      startDateStr: formatInTimeZone(start, companyTimezone, 'yyyy-MM-dd'),
+      endDateStr: formatInTimeZone(end, companyTimezone, 'yyyy-MM-dd'),
+    };
+  }
+
+  const startDateInTz = formatInTimeZone(start, companyTimezone, 'yyyy-MM-dd');
+  const endDateInTz = formatInTimeZone(end, companyTimezone, 'yyyy-MM-dd');
+  const startMoment = fromZonedTime(parseISO(`${startDateInTz}T00:00:00.000`), companyTimezone);
+  const endMoment = fromZonedTime(parseISO(`${endDateInTz}T23:59:59.999`), companyTimezone);
+  return {
+    startDateStr: formatInTimeZone(startMoment, 'UTC', "yyyy-MM-dd'T'HH:mm:ss.SSS'Z'"),
+    endDateStr: formatInTimeZone(endMoment, 'UTC', "yyyy-MM-dd'T'HH:mm:ss.SSS'Z'"),
+  };
+}
+
+function formatSelectedDateRequestRange(
+  selectedDate: string,
+  isPrivateShuttle: boolean,
+  companyTimezone: string,
+): { startDateStr: string; endDateStr: string } {
+  if (isPrivateShuttle) {
+    return { startDateStr: selectedDate, endDateStr: selectedDate };
+  }
+
+  const startMoment = fromZonedTime(parseISO(`${selectedDate}T00:00:00.000`), companyTimezone);
+  const endMoment = fromZonedTime(parseISO(`${selectedDate}T23:59:59.999`), companyTimezone);
+  return {
+    startDateStr: formatInTimeZone(startMoment, 'UTC', "yyyy-MM-dd'T'HH:mm:ss.SSS'Z'"),
+    endDateStr: formatInTimeZone(endMoment, 'UTC', "yyyy-MM-dd'T'HH:mm:ss.SSS'Z'"),
+  };
+}
+
+function clampAvailabilityRange(
+  range: DateRange,
+  companyTimezone: string,
+  extensionDate?: string,
+): DateRange {
+  const startOfEarliestDay = fromZonedTime(new Date(2026, 5, 1, 0, 0, 0, 0), companyTimezone);
+  const endOfLatestDay = fromZonedTime(new Date(2026, 9, 12, 23, 59, 59, 999), companyTimezone);
+  const startOfCurrentDay = getStartOfCurrentDay(companyTimezone);
+  const minimumStart = isAfter(startOfCurrentDay, startOfEarliestDay) ? startOfCurrentDay : startOfEarliestDay;
+  const clampedStart = isBefore(range.start, minimumStart) ? minimumStart : range.start;
+  let clampedEnd = isAfter(range.end, endOfLatestDay) ? endOfLatestDay : range.end;
+  if (isBefore(clampedEnd, clampedStart)) {
+    clampedEnd = clampedStart;
+  }
+
+  if (extensionDate) {
+    try {
+      const selectedDateObj = parseISO(extensionDate);
+      if (isAfter(selectedDateObj, clampedEnd)) {
+        clampedEnd = selectedDateObj;
+      }
+    } catch {
+      // Ignore parse errors.
+    }
+  }
+
+  return { start: clampedStart, end: clampedEnd };
+}
+
+function mergeFetchedRanges(ranges: DateRange[]): DateRange[] {
+  const sorted = [...ranges].sort((a, b) => a.start.getTime() - b.start.getTime());
+  const merged: DateRange[] = [];
+  for (const range of sorted) {
+    if (merged.length === 0 || merged[merged.length - 1].end < range.start) {
+      merged.push({ start: range.start, end: range.end });
+    } else {
+      merged[merged.length - 1].end =
+        range.end > merged[merged.length - 1].end ? range.end : merged[merged.length - 1].end;
+    }
+  }
+  return merged;
+}
+
+export function useStandardBookingAvailability({
+  product,
+  activeOptions,
+  activeOptionIdsKey,
+  isPrivateShuttle,
+  isPartialLaunch,
+  isAdmin,
+  companyTimezone,
+  appliedPromoCode,
+  pricingProfileIdForAvailabilities,
+  cancellationPolicyProfileIdForAvailabilities,
+  bookingCutoffNow,
+  bookingCutoffMinutes,
+  setQuantities,
+  setError,
+}: UseStandardBookingAvailabilityParams) {
+  const availabilitiesCache = useAvailabilitiesCache();
+  const [availabilities, setAvailabilities] = useState<Availability[]>([]);
+  const [selectedAvailability, setSelectedAvailability] = useState<Availability | null>(null);
+  const [selectedReturnOption, setSelectedReturnOption] = useState<ReturnOption | null>(null);
+  const [loadingAvailabilities, setLoadingAvailabilities] = useState(true);
+  const [isFetchingMoreAvailabilities, setIsFetchingMoreAvailabilities] = useState(false);
+  const [pricingConfig, setPricingConfig] = useState<PricingConfig | null>(null);
+  const [precomputedPricesByOption, setPrecomputedPricesByOption] =
+    useState<Record<string, PrecomputedPricesByCategory> | null>(null);
+  const [visibleRange, setVisibleRange] = useState<DateRange | null>(null);
+  const [selectedDate, setSelectedDate] = useState('');
+  const pricingConfigSetRef = useRef(false);
+  const fetchingRef = useRef(false);
+  const hasLoadedAvailabilitiesRef = useRef(false);
+  const inFlightRangeRef = useRef<DateRange | null>(null);
+  const fetchedRangesRef = useRef<DateRange[]>([]);
+  const pendingRangeRef = useRef<DateRange | null>(null);
+  const selectedDateHydrationInFlightKeyRef = useRef<string | null>(null);
+  const lastVisibleRangeRef = useRef<DateRange | null>(null);
+  const activeOptionsLength = activeOptions.length;
+
+  const applyPricingConfig = useCallback((next?: PricingConfig | null) => {
+    setPricingConfig((prev) => {
+      if (!shouldReplacePricingConfig(prev, next)) return prev;
+      pricingConfigSetRef.current = true;
+      return next ?? null;
+    });
+  }, []);
+
+  const applyCachedPricingConfig = useCallback((next: PricingConfig) => {
+    setPricingConfig(next);
+    pricingConfigSetRef.current = true;
+  }, []);
+
+  const selectedDateRangeExtensionKey = useMemo(() => {
+    if (!visibleRange || !selectedDate) return '';
+    try {
+      return isAfter(parseISO(selectedDate), visibleRange.end) ? selectedDate : '';
+    } catch {
+      return '';
+    }
+  }, [selectedDate, visibleRange]);
+
+  const needsFetch = useCallback((start: Date, end: Date): boolean => {
+    if (fetchedRangesRef.current.length === 0) return true;
+    return !fetchedRangesRef.current.some((range) => {
+      const rangeStart = range.start.getTime();
+      const rangeEnd = range.end.getTime();
+      const reqStart = start.getTime();
+      const reqEnd = end.getTime();
+      return rangeStart <= reqStart && rangeEnd >= reqEnd;
+    });
+  }, []);
+
+  const getCacheKey = useCallback(
+    () =>
+      availabilitiesCache
+        ? buildAvailabilitiesCacheKey(
+            product.productId,
+            activeOptionIdsKey,
+            appliedPromoCode,
+            pricingProfileIdForAvailabilities,
+            cancellationPolicyProfileIdForAvailabilities,
+          )
+        : null,
+    [
+      activeOptionIdsKey,
+      appliedPromoCode,
+      availabilitiesCache,
+      cancellationPolicyProfileIdForAvailabilities,
+      pricingProfileIdForAvailabilities,
+      product.productId,
+    ],
+  );
+
+  const mergeFetchedAvailabilities = useCallback(
+    (fetchedAvailabilities: Availability[]) => {
+      let mergedOut: Availability[] = [];
+      setAvailabilities((prev) => {
+        const existingMap = new Map(prev.map((availability) => [getAvailabilityCacheKey(availability), availability]));
+        mergeAvailabilitiesIntoMap(existingMap, fetchedAvailabilities);
+        mergedOut = Array.from(existingMap.values());
+        return mergedOut;
+      });
+      return mergedOut;
+    },
+    [],
+  );
+
+  const mergePrecomputedPrices = useCallback(
+    (results: Array<Parameters<typeof mergePrecomputedPricesFromAvailabilityResult>[1]>) => {
+      setPrecomputedPricesByOption((prev) => {
+        const next = { ...(prev || {}) };
+        results.forEach((result) => mergePrecomputedPricesFromAvailabilityResult(next, result));
+        return Object.keys(next).length > 0 ? next : prev;
+      });
+    },
+    [],
+  );
+
+  const updateCache = useCallback(
+    (
+      fetchedAvailabilities: Availability[],
+      results: Array<Parameters<typeof mergePrecomputedPricesFromAvailabilityResult>[1]>,
+      fetchedRanges?: DateRange[],
+      pricingConfigOverride?: PricingConfig | null,
+    ) => {
+      const cacheKey = getCacheKey();
+      if (!cacheKey || !availabilitiesCache) return;
+
+      const existingCache = availabilitiesCache.get(cacheKey);
+      const existingAvailabilities = existingCache?.availabilities ?? [];
+      const mergedAvailabilitiesMap = new Map(
+        existingAvailabilities.map((availability) => [getAvailabilityCacheKey(availability), availability]),
+      );
+      mergeAvailabilitiesIntoMap(mergedAvailabilitiesMap, fetchedAvailabilities);
+
+      const mergedPrecomputed = { ...(existingCache?.precomputedPricesByOption ?? {}) };
+      results.forEach((result) => mergePrecomputedPricesFromAvailabilityResult(mergedPrecomputed, result));
+      const firstPricingConfig =
+        pricingConfigOverride ??
+        results.find((result) => result.pricingConfig)?.pricingConfig ??
+        existingCache?.pricingConfig ??
+        null;
+
+      availabilitiesCache.merge(cacheKey, {
+        fetchedRanges: fetchedRanges ?? existingCache?.fetchedRanges ?? fetchedRangesRef.current,
+        availabilities: Array.from(mergedAvailabilitiesMap.values()),
+        pricingConfig: firstPricingConfig,
+        precomputedPricesByOption: Object.keys(mergedPrecomputed).length > 0 ? mergedPrecomputed : null,
+      });
+    },
+    [availabilitiesCache, getCacheKey],
+  );
+
+  const reloadAvailabilitiesAfterReserveConflict = useCallback(async (): Promise<Availability[]> => {
+    if (isPartialLaunch || !visibleRange || activeOptionsLength === 0) {
+      return [];
+    }
+
+    const { start, end } = clampAvailabilityRange(visibleRange, companyTimezone, selectedDate || undefined);
+    const { startDateStr, endDateStr } = formatAvailabilityRequestRange(
+      start,
+      end,
+      isPrivateShuttle,
+      companyTimezone,
+    );
+
+    const result = await getAvailabilities(product.productId, startDateStr, endDateStr, {
+      allOptions: true,
+      promoCode: appliedPromoCode || undefined,
+      ...(pricingProfileIdForAvailabilities ? { pricingProfileId: pricingProfileIdForAvailabilities } : {}),
+      ...(cancellationPolicyProfileIdForAvailabilities
+        ? { cancellationPolicyProfileId: cancellationPolicyProfileIdForAvailabilities }
+        : {}),
+    });
+    applyPricingConfig(result.pricingConfig);
+
+    const results = [{
+      optionId: product.productId,
+      availabilities: result.availabilities.map((availability) => availabilityWithOptionId(availability)),
+      precomputedPrices: result.precomputedPrices,
+      precomputedPricesByOption: result.precomputedPricesByOption,
+      pricingConfig: result.pricingConfig,
+    }];
+    const allFetchedAvailabilities = results.flatMap((fetchResult) => fetchResult.availabilities);
+
+    mergePrecomputedPrices(results);
+    const mergedOut = mergeFetchedAvailabilities(allFetchedAvailabilities);
+
+    const mergedRanges = mergeFetchedRanges([
+      ...fetchedRangesRef.current,
+      { start: new Date(start), end: new Date(end) },
+    ]);
+    fetchedRangesRef.current = mergedRanges;
+    updateCache(allFetchedAvailabilities, results, mergedRanges);
+
+    return mergedOut;
+  }, [
+    activeOptionsLength,
+    appliedPromoCode,
+    applyPricingConfig,
+    cancellationPolicyProfileIdForAvailabilities,
+    companyTimezone,
+    isPartialLaunch,
+    isPrivateShuttle,
+    mergeFetchedAvailabilities,
+    mergePrecomputedPrices,
+    pricingProfileIdForAvailabilities,
+    product.productId,
+    selectedDate,
+    updateCache,
+    visibleRange,
+  ]);
+
+  const refreshSelectedDateDetailsForCheckout = useCallback(async (): Promise<{
+    availabilities: Availability[];
+    pricingConfig?: PricingConfig | null;
+  }> => {
+    if (!selectedDate || activeOptionsLength === 0) return { availabilities: [] };
+
+    const { startDateStr, endDateStr } = formatSelectedDateRequestRange(
+      selectedDate,
+      isPrivateShuttle,
+      companyTimezone,
+    );
+    const result = await getAvailabilities(product.productId, startDateStr, endDateStr, {
+      allOptions: true,
+      promoCode: appliedPromoCode || undefined,
+      ...(pricingProfileIdForAvailabilities ? { pricingProfileId: pricingProfileIdForAvailabilities } : {}),
+      ...(cancellationPolicyProfileIdForAvailabilities
+        ? { cancellationPolicyProfileId: cancellationPolicyProfileIdForAvailabilities }
+        : {}),
+    });
+
+    const results = [{
+      optionId: product.productId,
+      availabilities: result.availabilities.map((availability) => availabilityWithOptionId(availability)),
+      precomputedPrices: result.precomputedPrices,
+      precomputedPricesByOption: result.precomputedPricesByOption,
+      pricingConfig: result.pricingConfig,
+    }];
+    const detailedAvailabilities = results.flatMap((fetchResult) => fetchResult.availabilities);
+    if (detailedAvailabilities.length === 0) {
+      return { availabilities: [], pricingConfig: result.pricingConfig };
+    }
+
+    applyPricingConfig(result.pricingConfig);
+    mergePrecomputedPrices(results);
+    mergeFetchedAvailabilities(detailedAvailabilities);
+    updateCache(detailedAvailabilities, results, undefined, result.pricingConfig);
+
+    return { availabilities: detailedAvailabilities, pricingConfig: result.pricingConfig };
+  }, [
+    activeOptionsLength,
+    appliedPromoCode,
+    applyPricingConfig,
+    cancellationPolicyProfileIdForAvailabilities,
+    companyTimezone,
+    isPrivateShuttle,
+    mergeFetchedAvailabilities,
+    mergePrecomputedPrices,
+    pricingProfileIdForAvailabilities,
+    product.productId,
+    selectedDate,
+    updateCache,
+  ]);
+
+  useEffect(() => {
+    if (!visibleRange) {
+      const initialStart = getInitialAvailabilityRangeStart(companyTimezone);
+      const initialEnd = getInitialAvailabilityRangeEnd(initialStart);
+      setVisibleRange({ start: initialStart, end: initialEnd });
+    }
+  }, [companyTimezone, visibleRange]);
+
+  useEffect(() => {
+    if (isPartialLaunch) {
+      setLoadingAvailabilities(false);
+      return;
+    }
+    if (activeOptionsLength === 0) {
+      setError('No active product options available');
+      setLoadingAvailabilities(false);
+      return;
+    }
+    if (!visibleRange) return;
+
+    async function fetchAvailabilities() {
+      if (!visibleRange) return;
+      if (fetchingRef.current) {
+        const inFlight = inFlightRangeRef.current;
+        if (
+          inFlight &&
+          inFlight.start.getTime() === visibleRange.start.getTime() &&
+          inFlight.end.getTime() === visibleRange.end.getTime()
+        ) {
+          return;
+        }
+        pendingRangeRef.current = { start: visibleRange.start, end: visibleRange.end };
+        return;
+      }
+
+      const { start: clampedStart, end: clampedEnd } = clampAvailabilityRange(
+        visibleRange,
+        companyTimezone,
+        selectedDateRangeExtensionKey || undefined,
+      );
+
+      const cacheKey = getCacheKey();
+      const cached = cacheKey ? availabilitiesCache?.get(cacheKey) : undefined;
+      let shouldRevalidateCachedRange = false;
+      if (cached && cached.availabilities.length > 0) {
+        const cachedInitialQuantities = deriveDefaultQuantitiesFromAvailabilities(cached.availabilities);
+        if (cachedInitialQuantities) {
+          setQuantities((prev) => (Object.keys(prev).length > 0 ? prev : cachedInitialQuantities));
+        }
+        const cacheCoversRange = cached.fetchedRanges.some(
+          (range) =>
+            range.start.getTime() <= clampedStart.getTime() &&
+            range.end.getTime() >= clampedEnd.getTime(),
+        );
+        const isStale = availabilitiesCache?.isStale(cached) ?? false;
+        if (cacheCoversRange) {
+          shouldRevalidateCachedRange = true;
+          setAvailabilities(cached.availabilities);
+          if (cached.availabilities.length > 0) {
+            hasLoadedAvailabilitiesRef.current = true;
+          }
+          if (cached.pricingConfig) {
+            applyCachedPricingConfig(cached.pricingConfig);
+          }
+          if (cached.precomputedPricesByOption && Object.keys(cached.precomputedPricesByOption).length > 0) {
+            setPrecomputedPricesByOption(cached.precomputedPricesByOption);
+          }
+          setLoadingAvailabilities(false);
+          setIsFetchingMoreAvailabilities(false);
+          if (!isStale) {
+            fetchedRangesRef.current = [...cached.fetchedRanges];
+          }
+        }
+
+        setAvailabilities(cached.availabilities);
+        if (cached.availabilities.length > 0) {
+          hasLoadedAvailabilitiesRef.current = true;
+        }
+        if (cached.pricingConfig) {
+          applyCachedPricingConfig(cached.pricingConfig);
+        }
+        if (cached.precomputedPricesByOption && Object.keys(cached.precomputedPricesByOption).length > 0) {
+          setPrecomputedPricesByOption(cached.precomputedPricesByOption);
+        }
+        fetchedRangesRef.current = [...cached.fetchedRanges];
+        setLoadingAvailabilities(false);
+      }
+
+      const shouldFetch = shouldRevalidateCachedRange || needsFetch(clampedStart, clampedEnd);
+      if (!shouldFetch) {
+        setLoadingAvailabilities(false);
+        setIsFetchingMoreAvailabilities(false);
+        fetchingRef.current = false;
+        return;
+      }
+
+      const hasPartialCache = cached && cached.availabilities.length > 0;
+      const shouldUsePrimaryLoader = !hasPartialCache && !hasLoadedAvailabilitiesRef.current;
+      fetchingRef.current = true;
+      inFlightRangeRef.current = {
+        start: new Date(clampedStart),
+        end: new Date(clampedEnd),
+      };
+      if (shouldUsePrimaryLoader) setLoadingAvailabilities(true);
+      else if (!shouldRevalidateCachedRange) setIsFetchingMoreAvailabilities(true);
+
+      try {
+        const { startDateStr, endDateStr } = formatAvailabilityRequestRange(
+          clampedStart,
+          clampedEnd,
+          isPrivateShuttle,
+          companyTimezone,
+        );
+        const result = await getAvailabilities(product.productId, startDateStr, endDateStr, {
+          allOptions: true,
+          summary: true,
+          promoCode: appliedPromoCode || undefined,
+          ...(pricingProfileIdForAvailabilities ? { pricingProfileId: pricingProfileIdForAvailabilities } : {}),
+          ...(cancellationPolicyProfileIdForAvailabilities
+            ? { cancellationPolicyProfileId: cancellationPolicyProfileIdForAvailabilities }
+            : {}),
+        });
+        applyPricingConfig(result.pricingConfig);
+
+        const results = [{
+          optionId: product.productId,
+          availabilities: result.availabilities.map((availability) => availabilityWithOptionId(availability)),
+          precomputedPrices: result.precomputedPrices,
+          precomputedPricesByOption: result.precomputedPricesByOption,
+          pricingConfig: result.pricingConfig,
+        }];
+        const allFetchedAvailabilities = results.flatMap((fetchResult) => fetchResult.availabilities);
+        if (allFetchedAvailabilities.length > 0) {
+          hasLoadedAvailabilitiesRef.current = true;
+        }
+
+        mergePrecomputedPrices(results);
+        mergeFetchedAvailabilities(allFetchedAvailabilities);
+
+        const merged = mergeFetchedRanges([
+          ...fetchedRangesRef.current,
+          { start: new Date(clampedStart), end: new Date(clampedEnd) },
+        ]);
+        fetchedRangesRef.current = merged;
+        updateCache(allFetchedAvailabilities, results, merged);
+
+        const fetchedInitialQuantities = deriveDefaultQuantitiesFromAvailabilities(allFetchedAvailabilities);
+        if (fetchedInitialQuantities) {
+          setQuantities((prev) => (Object.keys(prev).length > 0 ? prev : fetchedInitialQuantities));
+        }
+      } catch (err) {
+        if (shouldRevalidateCachedRange && cached?.availabilities.length) {
+          console.warn('Background availability refresh failed; keeping cached availability visible.', err);
+        } else {
+          setError(err instanceof Error ? err.message : 'Failed to load availabilities');
+          console.error('Error fetching availabilities:', err);
+        }
+      } finally {
+        setLoadingAvailabilities(false);
+        setIsFetchingMoreAvailabilities(false);
+        fetchingRef.current = false;
+        inFlightRangeRef.current = null;
+        const pending = pendingRangeRef.current;
+        if (pending) {
+          pendingRangeRef.current = null;
+          setVisibleRange({ start: pending.start, end: pending.end });
+        }
+      }
+    }
+
+    fetchAvailabilities();
+  }, [
+    activeOptionIdsKey,
+    activeOptionsLength,
+    appliedPromoCode,
+    applyCachedPricingConfig,
+    applyPricingConfig,
+    availabilitiesCache,
+    cancellationPolicyProfileIdForAvailabilities,
+    companyTimezone,
+    getCacheKey,
+    isPartialLaunch,
+    isPrivateShuttle,
+    mergeFetchedAvailabilities,
+    mergePrecomputedPrices,
+    needsFetch,
+    pricingProfileIdForAvailabilities,
+    product.productId,
+    selectedDateRangeExtensionKey,
+    setError,
+    setQuantities,
+    updateCache,
+    visibleRange,
+  ]);
+
+  useEffect(() => {
+    fetchedRangesRef.current = [];
+  }, [
+    appliedPromoCode,
+    pricingProfileIdForAvailabilities,
+    cancellationPolicyProfileIdForAvailabilities,
+  ]);
+
+  const handleVisibleRangeChange = useCallback((start: Date, end: Date) => {
+    const lastRange = lastVisibleRangeRef.current;
+    const rangeChanged =
+      !lastRange ||
+      Math.abs(lastRange.start.getTime() - start.getTime()) > 24 * 60 * 60 * 1000 ||
+      Math.abs(lastRange.end.getTime() - end.getTime()) > 24 * 60 * 60 * 1000;
+
+    if (rangeChanged) {
+      lastVisibleRangeRef.current = { start, end };
+      setVisibleRange({ start, end });
+    }
+  }, []);
+
+  const publicVisibleAvailabilities = useMemo(
+    () => {
+      const todayStr = formatInTimeZone(new Date(), companyTimezone, 'yyyy-MM-dd');
+      const currentOrFutureAvailabilities = availabilities.filter((availability) => {
+        const dateTime = parseAvailabilityDateTime(availability.dateTime);
+        return formatInTimeZone(dateTime, companyTimezone, 'yyyy-MM-dd') >= todayStr;
+      });
+
+      return isAdmin
+        ? currentOrFutureAvailabilities
+        : filterAvailabilitiesAfterPublicBookingCutoff(
+          currentOrFutureAvailabilities,
+          bookingCutoffNow,
+          bookingCutoffMinutes,
+        );
+    },
+    [availabilities, bookingCutoffMinutes, bookingCutoffNow, companyTimezone, isAdmin],
+  );
+
+  const availabilitiesByDate = useMemo(() => {
+    const grouped = publicVisibleAvailabilities.reduce((acc, availability) => {
+      const dateTime = parseAvailabilityDateTime(availability.dateTime);
+      const dateInCompanyTz = formatInTimeZone(dateTime, companyTimezone, 'yyyy-MM-dd');
+      if (!acc[dateInCompanyTz]) acc[dateInCompanyTz] = [];
+      acc[dateInCompanyTz].push(availability);
+      return acc;
+    }, {} as Record<string, Availability[]>);
+
+    const sorted: Record<string, Availability[]> = {};
+    Object.keys(grouped).forEach((date) => {
+      sorted[date] = [...grouped[date]].sort((a, b) => {
+        const timeA = parseAvailabilityDateTime(a.dateTime).getTime();
+        const timeB = parseAvailabilityDateTime(b.dateTime).getTime();
+        return timeA - timeB;
+      });
+    });
+
+    return sorted;
+  }, [companyTimezone, publicVisibleAvailabilities]);
+
+  const dates = useMemo(() => Object.keys(availabilitiesByDate).sort(), [availabilitiesByDate]);
+
+  useEffect(() => {
+    if (!selectedDate || activeOptionsLength === 0) return;
+    if (!selectedAvailability) return;
+    if (!availabilityMatchesSelectedDate(selectedAvailability, selectedDate, companyTimezone)) return;
+    if (selectedAvailability.isSummary !== true) return;
+    const selectionToHydrate = selectedAvailability;
+
+    const hydrationKey = [
+      product.productId,
+      selectedDate,
+      activeOptionIdsKey,
+      appliedPromoCode ?? '',
+      pricingProfileIdForAvailabilities ?? '',
+      cancellationPolicyProfileIdForAvailabilities ?? '',
+    ].join('|');
+    if (selectedDateHydrationInFlightKeyRef.current === hydrationKey) return;
+    selectedDateHydrationInFlightKeyRef.current = hydrationKey;
+
+    let cancelled = false;
+    async function hydrateSelectedDateDetails() {
+      setIsFetchingMoreAvailabilities(true);
+      try {
+        const { startDateStr, endDateStr } = formatSelectedDateRequestRange(
+          selectedDate,
+          isPrivateShuttle,
+          companyTimezone,
+        );
+        const result = await getAvailabilities(product.productId, startDateStr, endDateStr, {
+          allOptions: true,
+          responseMode: 'booking-day',
+          promoCode: appliedPromoCode || undefined,
+          ...(pricingProfileIdForAvailabilities ? { pricingProfileId: pricingProfileIdForAvailabilities } : {}),
+          ...(cancellationPolicyProfileIdForAvailabilities
+            ? { cancellationPolicyProfileId: cancellationPolicyProfileIdForAvailabilities }
+            : {}),
+        });
+        const results = [{
+          optionId: product.productId,
+          availabilities: result.availabilities.map((availability) => availabilityWithOptionId(availability)),
+          precomputedPrices: result.precomputedPrices,
+          precomputedPricesByOption: result.precomputedPricesByOption,
+          pricingConfig: result.pricingConfig,
+        }];
+        if (cancelled) return;
+
+        const detailedAvailabilities = results.flatMap((fetchResult) => fetchResult.availabilities);
+        if (detailedAvailabilities.length === 0) return;
+
+        const firstPricingConfig = results.find((fetchResult) => fetchResult.pricingConfig)?.pricingConfig;
+        applyPricingConfig(firstPricingConfig);
+        mergePrecomputedPrices(results);
+        mergeFetchedAvailabilities(detailedAvailabilities);
+
+        const updatedSelection = findMergedAvailabilityForSelection(detailedAvailabilities, selectionToHydrate);
+        if (updatedSelection && shouldSyncSelectedAvailability(selectionToHydrate, updatedSelection)) {
+          setSelectedAvailability(updatedSelection);
+          if (selectedReturnOption && updatedSelection.returnOptions) {
+            const updatedReturnOption = updatedSelection.returnOptions.find(
+              (option) => option.returnAvailabilityId === selectedReturnOption.returnAvailabilityId,
+            );
+            if (updatedReturnOption) setSelectedReturnOption(updatedReturnOption);
+          }
+        }
+
+        updateCache(detailedAvailabilities, results, undefined, firstPricingConfig);
+      } catch (err) {
+        if (!cancelled) {
+          console.error('Error hydrating availability details:', err);
+        }
+      } finally {
+        if (selectedDateHydrationInFlightKeyRef.current === hydrationKey) {
+          selectedDateHydrationInFlightKeyRef.current = null;
+        }
+        if (!cancelled) setIsFetchingMoreAvailabilities(false);
+      }
+    }
+
+    hydrateSelectedDateDetails();
+    return () => {
+      cancelled = true;
+    };
+  }, [
+    activeOptionIdsKey,
+    activeOptionsLength,
+    appliedPromoCode,
+    applyPricingConfig,
+    cancellationPolicyProfileIdForAvailabilities,
+    companyTimezone,
+    isPrivateShuttle,
+    mergeFetchedAvailabilities,
+    mergePrecomputedPrices,
+    pricingProfileIdForAvailabilities,
+    product.productId,
+    selectedAvailability,
+    selectedDate,
+    selectedReturnOption,
+    updateCache,
+  ]);
+
+  useEffect(() => {
+    if (selectedAvailability && availabilities.length > 0) {
+      const updatedAvailability = availabilities.find(
+        (availability) =>
+          availability.dateTime === selectedAvailability.dateTime &&
+          getAvailabilityOptionId(availability) === getAvailabilityOptionId(selectedAvailability),
+      );
+      if (updatedAvailability && shouldSyncSelectedAvailability(selectedAvailability, updatedAvailability)) {
+        setSelectedAvailability(updatedAvailability);
+
+        if (selectedReturnOption && updatedAvailability.returnOptions) {
+          const updatedReturnOption = updatedAvailability.returnOptions.find(
+            (option) => option.returnAvailabilityId === selectedReturnOption.returnAvailabilityId,
+          );
+          if (updatedReturnOption) {
+            setSelectedReturnOption(updatedReturnOption);
+          }
+        }
+      }
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [availabilities]);
+
+  return {
+    availabilities,
+    selectedAvailability,
+    setSelectedAvailability,
+    selectedReturnOption,
+    setSelectedReturnOption,
+    selectedDate,
+    setSelectedDate,
+    loadingAvailabilities,
+    isFetchingMoreAvailabilities,
+    pricingConfig,
+    precomputedPricesByOption,
+    publicVisibleAvailabilities,
+    availabilitiesByDate,
+    dates,
+    handleVisibleRangeChange,
+    reloadAvailabilitiesAfterReserveConflict,
+    refreshSelectedDateDetailsForCheckout,
+    fetchedRangesRef,
+  };
+}