Fix calendar auto-jump to next month when no slots are available#28887
Fix calendar auto-jump to next month when no slots are available#28887rakshityadav1868 wants to merge 5 commits intocalcom:mainfrom
Conversation
…urrent month Signed-off-by: Rakshit Yadav <yadavrakshit60@gmail.com>
|
Hey there and thank you for opening this pull request! 👋🏼 We require pull request titles to follow the Conventional Commits specification and it looks like your proposed title needs to be adjusted. Details: |
📝 WalkthroughWalkthroughThe 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
🧹 Nitpick comments (1)
apps/web/modules/bookings/components/DatePicker.tsx (1)
105-113: Remove the now-dead auto-jump binding to avoid maintenance drift.The behavior fix is correct—the callback invocation is intentionally commented out. However,
moveToNextMonthOnNoAvailabilityremains destructured but unused, and theuseMoveToNextMonthOnNoAvailabilityhook is called only to supply this unused binding. Removing the hook call and binding simplifies the code and eliminates dead code.♻️ Suggested cleanup
- const { moveToNextMonthOnNoAvailability } = useMoveToNextMonthOnNoAvailability({ - browsingDate, - nonEmptyScheduleDays, - onMonthChange, - isLoading: isLoading ?? true, - }); // Disabled auto-jump to allow users to stay in current month - // moveToNextMonthOnNoAvailability();🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/web/modules/bookings/components/DatePicker.tsx` around lines 105 - 113, Remove the now-unused auto-jump binding by deleting the call to useMoveToNextMonthOnNoAvailability and the destructured moveToNextMonthOnNoAvailability variable; update the surrounding code to pass existing props (browsingDate, nonEmptyScheduleDays, onMonthChange, isLoading) directly where needed without invoking the hook, and also remove any import of useMoveToNextMonthOnNoAvailability if it becomes unused; ensure no other references to moveToNextMonthOnNoAvailability remain.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In `@apps/web/modules/bookings/components/DatePicker.tsx`:
- Around line 105-113: Remove the now-unused auto-jump binding by deleting the
call to useMoveToNextMonthOnNoAvailability and the destructured
moveToNextMonthOnNoAvailability variable; update the surrounding code to pass
existing props (browsingDate, nonEmptyScheduleDays, onMonthChange, isLoading)
directly where needed without invoking the hook, and also remove any import of
useMoveToNextMonthOnNoAvailability if it becomes unused; ensure no other
references to moveToNextMonthOnNoAvailability remain.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 1c1886fa-e446-4334-aca6-9ac6678068a7
📒 Files selected for processing (1)
apps/web/modules/bookings/components/DatePicker.tsx
romitg2
left a comment
romitg2
left a comment
There was a problem hiding this comment.
can we make autojumptonextmonth on initial load, but allow to go to previous month thereafter.
Signed-off-by: Rakshit Yadav <yadavrakshit60@gmail.com>
Screen.Recording.2026-04-14.at.8.13.25.PM.mp4Applied the changes @romitg2, now moveToNextMonthOnNoAvailability will only be rendered on initial load using UseEffect, UseRef hooks. |
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
apps/web/modules/bookings/components/DatePicker.tsx (1)
106-120:⚠️ Potential issue | 🟡 MinorNormalize loading state before one-time jump gating.
Line 110 treats
undefinedas loading (isLoading ?? true), but Line 116 treatsundefinedas loaded (!isLoading). That mismatch can fliphasInitialJumpOccurredtoo early and prevent the intended first jump once loading actually completes.🔧 Suggested fix
+ const resolvedIsLoading = isLoading ?? true; const { moveToNextMonthOnNoAvailability } = useMoveToNextMonthOnNoAvailability({ browsingDate, nonEmptyScheduleDays, onMonthChange, - isLoading: isLoading ?? true, + isLoading: resolvedIsLoading, }); const hasInitialJumpOccurred = useRef(false); useEffect(() => { - // Only auto-jump on initial load when data is loaded - if (!isLoading && !hasInitialJumpOccurred.current) { - moveToNextMonthOnNoAvailability(); - hasInitialJumpOccurred.current = true; - } - }, [isLoading]); + if (resolvedIsLoading || hasInitialJumpOccurred.current) return; + moveToNextMonthOnNoAvailability(); + hasInitialJumpOccurred.current = true; + }, [resolvedIsLoading, moveToNextMonthOnNoAvailability]);🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/web/modules/bookings/components/DatePicker.tsx` around lines 106 - 120, The component mixes raw isLoading and a different defaulted value (isLoading ?? true) which causes the initial-jump gating to misfire; normalize the loading state once (e.g., const normalizedIsLoading = isLoading ?? true) and use that same normalized variable both when calling useMoveToNextMonthOnNoAvailability and inside the useEffect that checks hasInitialJumpOccurred, so moveToNextMonthOnNoAvailability only runs after the consistent “loaded” state is observed; refer to useMoveToNextMonthOnNoAvailability, moveToNextMonthOnNoAvailability, hasInitialJumpOccurred, isLoading, and the useEffect for where to apply the change.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Outside diff comments:
In `@apps/web/modules/bookings/components/DatePicker.tsx`:
- Around line 106-120: The component mixes raw isLoading and a different
defaulted value (isLoading ?? true) which causes the initial-jump gating to
misfire; normalize the loading state once (e.g., const normalizedIsLoading =
isLoading ?? true) and use that same normalized variable both when calling
useMoveToNextMonthOnNoAvailability and inside the useEffect that checks
hasInitialJumpOccurred, so moveToNextMonthOnNoAvailability only runs after the
consistent “loaded” state is observed; refer to
useMoveToNextMonthOnNoAvailability, moveToNextMonthOnNoAvailability,
hasInitialJumpOccurred, isLoading, and the useEffect for where to apply the
change.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 1057661c-ccd0-41d7-89ba-c5708461195d
📒 Files selected for processing (1)
apps/web/modules/bookings/components/DatePicker.tsx
3 participants
What does this PR do?
This PR fixes an issue where the calendar automatically jumps to the next month when there are no available slots in the current month, preventing users from navigating back.
Previously, if a month (e.g., April) had no availability, the calendar would auto-switch to the next available month (e.g., May). However, users were unable to return to the original month, leading to a confusing and restrictive experience.
BEFORE:
Screen.Recording.2026-04-14.at.7.15.55.PM.mp4
AFTER:
Screen.Recording.2026-04-14.at.7.17.27.PM.mp4
Mandatory Tasks (DO NOT REMOVE)