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

feat: Added Date in question on Booking page

Open saurabhraghuvanshii opened this issue 3 months ago • 22 comments

What does this PR do?

Added a new input type "Date" for booking questions.

  • Fixes #23952
  • Fixes CAL-6434

Visual Demo (For contributors especially)

Screenshot From 2025-09-20 00-51-09 Screenshot From 2025-09-20 00-51-31

For screenshot of the booking page: comment

Mandatory Tasks (DO NOT REMOVE)

  • [x] I have self-reviewed the code (A decent size PR without self-review might be rejected).
  • [ ] 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.
  • [ ] I confirm automated tests are in place that prove my fix is effective or that my feature works.

saurabhraghuvanshii avatar Sep 19 '25 19:09 saurabhraghuvanshii

@saurabhraghuvanshii 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 Sep 19 '25 19:09 vercel[bot]

Walkthrough

Adds a new "date" booking-question type across the codebase. Introduces a DateWidget (uses DatePicker) and registers it for query-builder/form-builder usage; extends form builder propsTypes, Components map, FormBuilderField rendering, fieldTypes config, and schema validation (preprocess + superRefine enforcing YYYY‑MM‑DD and required handling). Extends platform enums, Prisma/Zod fieldType enum, and event-type input/output models to include date. Updates API transformers to produce date outputs. Adds backend and Playwright e2e tests for creation, update, validation, prefill, and UI interactions with date fields.

Possibly related PRs

  • calcom/cal.com#22770 — Changes DatePicker props and setSelectedDate signatures; relevant because this PR adds and uses a DateWidget that imports/uses DatePicker.

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 pull request title clearly describes the primary change—adding a Date input type to booking questions on the Booking page—and is concise and directly relevant to the changeset without using generic or misleading wording.
Linked Issues Check ✅ Passed The changes fulfill the objectives from linked issues #23952 and CAL-6434 by introducing a new “Date” input type for booking questions, integrating it with the project’s date picker component across form-builder, API, and data models, and including UI and E2E tests to verify behavior.
Out of Scope Changes Check ✅ Passed All modifications align with the linked issues’ goal of adding a Date input type for booking questions, and no unrelated changes outside the scope of introducing and testing the date field have been detected.
Description Check ✅ Passed The PR description accurately states that a new Date input type for booking questions is being added, references the fixed issues, and includes visual demos; 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 46e552a55c4567e6626972ab878140c24736ddea and d6ea6c8171e3aec1f4f118b14f1775b4cb71780a.

📒 Files selected for processing (2)
  • apps/api/v2/src/ee/event-types/event-types_2024_06_14/controllers/event-types.controller.e2e-spec.ts (5 hunks)
  • apps/api/v2/src/ee/event-types/event-types_2024_06_14/transformers/internal-to-api/booking-fields.ts (3 hunks)
🚧 Files skipped from review as they are similar to previous changes (2)
  • apps/api/v2/src/ee/event-types/event-types_2024_06_14/transformers/internal-to-api/booking-fields.ts
  • apps/api/v2/src/ee/event-types/event-types_2024_06_14/controllers/event-types.controller.e2e-spec.ts
⏰ Context from checks skipped due to timeout of 180000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
  • GitHub Check: Install dependencies / Yarn install & cache

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 Sep 24 '25 13:09 coderabbitai[bot]

@Udit-takkar done

saurabhraghuvanshii avatar Sep 24 '25 14:09 saurabhraghuvanshii

@saurabhraghuvanshii Thank you for this PR. Can you please provide a Loom Video of the solution as well as add a test confirming your changes work? We can't merge the PR unless there's a test confirming your solution works as expected. 🙏

alishaz-polymath avatar Sep 30 '25 10:09 alishaz-polymath

@alishaz-polymath in description video is added

saurabhraghuvanshii avatar Sep 30 '25 10:09 saurabhraghuvanshii

@alishaz-polymath in description video is added

I don't see the video link in the description, only two screenshots. Am I missing something? 🤔

alishaz-polymath avatar Sep 30 '25 10:09 alishaz-polymath

@alishaz-polymath in description video is added

I don't see the video link in the description, only two screenshots. Am I missing something? 🤔

Sorry, i thought I added a video, i update soon.

saurabhraghuvanshii avatar Sep 30 '25 10:09 saurabhraghuvanshii

@alishaz-polymath in description video is added

I don't see the video link in the description, only two screenshots. Am I missing something? 🤔

Sorry, i thought I added a video, i update soon.

Thank you. A loom in the description and an E2E test for the new field should suffice 🙌

alishaz-polymath avatar Sep 30 '25 10:09 alishaz-polymath

done ....

saurabhraghuvanshii avatar Sep 30 '25 18:09 saurabhraghuvanshii

E2E results are ready!

github-actions[bot] avatar Oct 01 '25 08:10 github-actions[bot]

@saurabhraghuvanshii Also these tests are failing

3 failed [@***com/web] › apps/web/playwright/manage-booking-questions.e2e.ts:36:9 › Manage Booking Questions › For User EventType › Do a booking with a Address type question and verify a few thing in b/w [@***com/web] › apps/web/playwright/manage-booking-questions.e2e.ts:103:9 › Manage Booking Questions › For User EventType › Do a booking with a Date type question and verify a few thing in b/w [@***com/web] › apps/web/playwright/manage-booking-questions.e2e.ts:400:9 › Manage Booking Questions › For Team EventType › Do a booking with a user added question and verify a few thing in b/w

Udit-takkar avatar Oct 01 '25 09:10 Udit-takkar

@Udit-takkar done update both files

saurabhraghuvanshii avatar Oct 01 '25 11:10 saurabhraghuvanshii

@saurabhraghuvanshii Tests are still failing, can you please fix those first.

alishaz-polymath avatar Oct 06 '25 07:10 alishaz-polymath

You can check these here https://github.com/calcom/cal.com/actions/runs/18271666284/job/52015669338?pr=23957

Udit-takkar avatar Oct 06 '25 07:10 Udit-takkar

@alishaz-polymath @Udit-takkar now tests are passed, can you check.

saurabhraghuvanshii avatar Oct 07 '25 19:10 saurabhraghuvanshii

Hey @Udit-takkar I think now this Pr is completed.

saurabhraghuvanshii avatar Oct 09 '25 17:10 saurabhraghuvanshii

@alishaz-polymath @Udit-takkar tests are passing in local but failing on Pr workflows

  Consider splitting slow test files to speed up parallel execution
  1 passed (3.3m)

To open last HTML report run:

  yarn playwright show-report test-results/reports/playwright-html-report

saurabh:~/Oss/cal.com$```

saurabhraghuvanshii avatar Oct 18 '25 19:10 saurabhraghuvanshii

@alishaz-polymath @Udit-takkar Now all tests are passing, checked multiple times.

saurabhraghuvanshii avatar Oct 21 '25 13:10 saurabhraghuvanshii

@alishaz-polymath @Udit-takkar Hey, just a reminder it’s been a while, could you please take a look at this PR?

saurabhraghuvanshii avatar Nov 01 '25 09:11 saurabhraghuvanshii

@saurabhraghuvanshii works fine for me. I'll ask for one more review

Udit-takkar avatar Nov 06 '25 19:11 Udit-takkar

Hi @Udit-takkar @saurabhraghuvanshii - It looks like this component does not take into account the selected timezone of the booker; so it can show incorrect dates when the system time is different from the selected timezone, albeit rare.

Could we fix this?

emrysal avatar Dec 01 '25 17:12 emrysal

thanks @emrysal I'll look into this

saurabhraghuvanshii avatar Dec 01 '25 17:12 saurabhraghuvanshii

@saurabhraghuvanshii This test is erroring out with timeout

 Retry #2 ───────────────────────────────────────────────────────────────────────────────────────

    Test timeout of 120000ms exceeded.

    Error: page.waitForResponse: Test timeout of 120000ms exceeded.
    =========================== logs ===========================
    waiting for response "/api/trpc/eventTypes/heavy/update?batch=1"
    ============================================================

       at apps/web/playwright/lib/testUtils.ts:499

      497 |   { action = () => page.locator('[type="submit"]').click(), expectedStatusCode = 200 } = {}
      498 | ) {
    > 499 |   const submitPromise = page.waitForResponse(url);
          |                              ^
      500 |   await action();
      501 |   const response = await submitPromise;
      502 |   expect(response.status()).toBe(expectedStatusCode);

        at submitAndWaitForResponse (/home/runner/actions-runner/_work/***.com/***.com/apps/web/playwright/lib/testUtils.ts:499:30)
        at saveEventType (/home/runner/actions-runner/_work/***.com/***.com/apps/web/playwright/manage-booking-questions-date.e2e.ts:418:35)
        at addQuestionAndSave (/home/runner/actions-runner/_work/***.com/***.com/apps/web/playwright/manage-booking-questions-date.e2e.ts:325:11)
        at /home/runner/actions-runner/_work/***.com/***.com/apps/web/playwright/manage-booking-questions-date.e2e.ts:47:17
        at /home/runner/actions-runner/_work/***.com/***.com/apps/web/playwright/manage-booking-questions-date.e2e.ts:46:13

    attachment #1: trace (application/zip) ─────────────────────────────────────────────────────────
    test-results/results/manage-booking-questions-d-ce41c--verify-a-few-things-in-b-w--***com-web-retry2/trace.zip
    Usage:

        yarn playwright show-trace test-results/results/manage-booking-questions-d-ce41c--verify-a-few-things-in-b-w--***com-web-retry2/trace.zip

    ────────────────────────────────────────────────────────────────────────────────────────────────

  Slow test file: [@***com/web] › apps/web/playwright/lo***e.e2e.ts (59.3s)
  Consider splitting slow test files to speed up parallel execution
  1 failed
    [@***com/web] › apps/web/playwright/manage-booking-questions-date.e2e.ts:27:13 › Manage Booking Questions - Date Type › For User EventType › Do a booking with a Date type question and verify a few things in b/w 

alishaz-polymath avatar Dec 10 '25 18:12 alishaz-polymath

@alishaz-polymath All tests have passed. Can you review once?

saurabhraghuvanshii avatar Dec 11 '25 22:12 saurabhraghuvanshii

@supalarry Can you review this as well please 🙏

alishaz-polymath avatar Dec 16 '25 05:12 alishaz-polymath