diff --git a/frontend/app/booking/page.tsx b/frontend/app/booking/page.tsx index d129422..c086c93 100644 --- a/frontend/app/booking/page.tsx +++ b/frontend/app/booking/page.tsx @@ -1,7 +1,7 @@ "use client"; import React from "react"; -import { useEffect, useState, useCallback } from "react"; +import { useEffect, useState, useCallback, useMemo } from "react"; import { Permission } from "../auth-context"; import { api } from "../api"; import { Header } from "../components/Header"; @@ -233,7 +233,8 @@ export default function BookingPage() { const [datesWithAvailability, setDatesWithAvailability] = useState>(new Set()); const [isLoadingAvailability, setIsLoadingAvailability] = useState(true); - const dates = getDateRange(minAdvanceDays, maxAdvanceDays); + // Memoize dates to prevent infinite re-renders + const dates = useMemo(() => getDateRange(minAdvanceDays, maxAdvanceDays), [minAdvanceDays, maxAdvanceDays]); const fetchSlots = useCallback(async (date: Date) => { setIsLoadingSlots(true); @@ -281,7 +282,7 @@ export default function BookingPage() { }; fetchAllAvailability(); - }, [user, isAuthorized, dates]); + }, [user, isAuthorized]); // Removed dates from dependencies - dates is memoized and stable useEffect(() => { if (selectedDate && user && isAuthorized) {