cal.com icon indicating copy to clipboard operation
cal.com copied to clipboard

feat: booker atom automatic phone country code detection

Open Anshumancanrock opened this issue 4 months ago • 11 comments

What does this PR do?

This PR fixes the phone field in Booker Atom (Platform mode) to auto-detect the user's country, matching the behavior of the main web app. Previously, the phone field always defaulted to US (+1) regardless of the user's actual location.

Before:

  • Phone field in Booker Atom was hardcoded to always show US flag 🇺🇸 and +1 prefix
  • No country detection logic in the platform code path
  • Inconsistent behavior between web app (which worked correctly) and Booker Atom

After:

  • Created BasePhoneInputPlatform component that uses the same useDefaultCountry() hook as BasePhoneInputWeb
  • Both web and platform modes now use identical country detection logic
  • Maintains backward compatibility and all existing functionality

Visual Demo (For contributors especially)

Mandatory Tasks (DO NOT REMOVE)

  • [x] I have self-reviewed the code (A decent size PR without self-review might be rejected).
  • [x] I have updated the developer docs in /docs if this PR makes changes that would require a documentation change. If N/A, write N/A here and check the checkbox.
  • [x] I confirm automated tests are in place that prove my fix is effective or that my feature works.

How should this be tested?

  • No special environment variables needed
  • Standard Cal.com development setup

Checklist

Anshumancanrock avatar Oct 02 '25 13:10 Anshumancanrock

@Anshumancanrock is attempting to deploy a commit to the cal Team on Vercel.

A member of the Team first needs to authorize it.

vercel[bot] avatar Oct 02 '25 13:10 vercel[bot]

Walkthrough

Replaces platform-specific rendering in PhoneInput.tsx with a single unified BasePhoneInput that always renders one PhoneInput. Removes useIsPlatform branching and BasePhoneInputWeb/platform variants. Derives defaultCountry via a new useDefaultCountry hook and updates the signature to Omit<PhoneInputProps, "defaultCountry">. Merges inputStyle and flagButtonStyle into the underlying component’s style/ button props and preserves value normalization and onChange (including prefix handling).

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)
Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. You can run `@coderabbitai generate docstrings` to improve docstring coverage.
✅ Passed checks (4 passed)
Check name Status Explanation
Title Check ✅ Passed The title clearly summarizes the core change of the pull request by stating it adds automatic phone country code detection in the Booker Atom component, which aligns with the PR’s main objective of replicating the web app’s behavior.
Linked Issues Check ✅ Passed The implemented useDefaultCountry hook and unified BasePhoneInput component satisfy the linked issues’ requirement to replicate the web app’s country detection logic in Booker Atom and eliminate the hardcoded US default, fully addressing #24214 and CAL-6501.
Out of Scope Changes Check ✅ Passed All modifications—including removing platform-specific branches, updating the BasePhoneInput signature, and merging style props—directly support implementing automatic country detection and do not introduce any unrelated or out-of-scope changes.
Description Check ✅ Passed The description directly addresses the changes made to enable automatic country detection in the Booker Atom phone field, outlines the before and after behavior, references the relevant issues, and describes testing steps, so it is clearly related to the changeset.
✨ Finishing touches
  • [ ] 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • [ ] Create PR with unit tests
  • [ ] Post copyable unit tests in a comment

📜 Recent review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

  • Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 24f13eef33cd7180afe98e5cb9924c348cb496da and d95f760f8b35c334ca9096b388d2bfb979eb3e65.

📒 Files selected for processing (1)
  • packages/features/components/phone-input/PhoneInput.tsx (1 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
  • packages/features/components/phone-input/PhoneInput.tsx

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.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

coderabbitai[bot] avatar Oct 02 '25 13:10 coderabbitai[bot]

@dhairyashiil I’ve made the changes as requested. Please review now. Thanks !

Anshumancanrock avatar Oct 03 '25 17:10 Anshumancanrock

E2E results are ready!

github-actions[bot] avatar Oct 03 '25 19:10 github-actions[bot]

Hi @supalarry , Could you please review this PR? Thank you !

Anshumancanrock avatar Oct 16 '25 04:10 Anshumancanrock

Hi @supalarry , Could you please review this PR? Thank you !

TwanBox avatar Oct 27 '25 10:10 TwanBox

@dhairyashiil I have resolved the conflicts and no need to be sorry ser 🙂

Anshumancanrock avatar Nov 16 '25 21:11 Anshumancanrock

@dhairyashiil please review it now . Fixed the conflicts.

Anshumancanrock avatar Nov 19 '25 21:11 Anshumancanrock

@dhairyashiil please review it now . Fixed the conflicts.

Yes, I already asked Lauris for the review in our Slack. Thank you 🙏🏼

dhairyashiil avatar Nov 19 '25 23:11 dhairyashiil

Marking this draft until

Pallava-Joshi avatar Nov 25 '25 13:11 Pallava-Joshi

Hey guys, We'd really appreciate this simple fix, we've kinda been forced to use the regular text Input field on platform. Since it does not make sense at all for our (European) user to have to see & update a US phone field..

Thanks again!

TwanBox avatar Dec 09 '25 09:12 TwanBox