fix: fields for opens at and expires at on new form marked as mandatory by priscila-moneo · Pull Request #813 · fntechgit/summit-admin

priscila-moneo · 2026-03-04T22:06:27Z

ref: https://app.clickup.com/t/86b84u74z

Summary by CodeRabbit

Tests
- Added unit tests for the date picker covering required-field display and validation error after user interaction.
Bug Fixes
- Improved date picker behavior so validation errors appear reliably after users interact and close the picker.
Updates
- Date fields in sponsor forms are now marked as required to improve form clarity.

coderabbitai · 2026-03-04T22:06:38Z

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 3afd6a50-ee15-43d6-806d-a08796f86b58

📥 Commits

Reviewing files that changed from the base of the PR and between 50b0e5c and 8be526a.

📒 Files selected for processing (3)

src/components/mui/__tests__/mui-formik-datepicker.test.js
src/components/mui/formik-inputs/mui-formik-datepicker.js
src/pages/sponsors/sponsor-forms-tab/components/customized-form/customized-form.js

🚧 Files skipped from review as they are similar to previous changes (2)

src/pages/sponsors/sponsor-forms-tab/components/customized-form/customized-form.js
src/components/mui/tests/mui-formik-datepicker.test.js

📝 Walkthrough

Walkthrough

Adds touched-on-blur handling to MuiFormikDatepicker, marks two sponsor form date fields as required (visual), and introduces unit tests verifying required marker and validation error on blur.

Changes

Cohort / File(s)	Summary
MuiFormikDatepicker component `src/components/mui/formik-inputs/mui-formik-datepicker.js`	Added `handleBlur` to mark field as touched; wired `onClose` and `onBlur` to update Formik touched state so validation errors show after closing the picker or blurring the input.
Unit tests for datepicker `src/components/mui/__tests__/mui-formik-datepicker.test.js`	New test file: `renderWithFormik` helper plus two tests asserting the required label marker and that "This field is required" appears after focus+blur.
Sponsor form fields (UI) `src/pages/sponsors/sponsor-forms-tab/components/customized-form/customized-form.js`	Set `required` attribute on `opens_at` and `expires_at` date picker fields to show visual required marker (no validation/schema changes).

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Possibly related PRs

86b7gyddp - fix: add asterisks #741: Modifies usage of the same MuiFormikDatepicker fields (opens_at, expires_at) and adjusts required-related behavior, closely related to the touched/required UI changes.

Suggested reviewers

smarcet

Poem

🐰 I hopped into code with a tiny cheer,

Blur set to "touched", the errors now clear.
Asterisks gleam on dates that are due,
Tests confirm what the bunny could view. 🥕

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately describes the main change: marking the 'Opens at' and 'Expires at' date picker fields as mandatory in the form.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

📝 Generate docstrings (stacked PR)
📝 Generate docstrings (commit on current branch)

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch fix/new-form-mark-mandatory-fields

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.}

martinquiroga-exo

@priscila-moneo please see comments. Thanks.

martinquiroga-exo · 2026-03-06T18:10:55Z

src/components/mui/formik-inputs/mui-formik-datepicker.js

  const [field, meta, helpers] = useField(name);
  const requiredLabel = `${label} *`;
+  const handleBlur = () => {
+    helpers.setTouched(true);


This relies on implicit Formik behavior. It should explicitly trigger validation.:

helpers.setTouched(true, true);

martinquiroga-exo · 2026-03-06T18:14:42Z

src/components/mui/formik-inputs/mui-formik-datepicker.js

        value={field.value}
        onChange={helpers.setValue}
+        onClose={handleBlur}
        slotProps={{


NIT: Since this is out of the scope of this PR I will just call it out:

If a caller passes slotProps through ...props, it will override this entire object, breaking the wrapper.

@caseylocker @smarcet For you consideration.

martinquiroga-exo · 2026-03-06T18:20:22Z

src/components/mui/__tests__/mui-formik-datepicker.test.js

+    renderWithFormik({ required: true });
+
+    const user = userEvent.setup();
+    const input = screen.getByLabelText("Test Date *");


You only asserts the error appears. It does not prove the blur caused it.

expect(screen.queryByText("This field is required")).not.toBeInTheDocument();

Before the interaction to be explicit.

martinquiroga-exo · 2026-03-06T18:21:40Z

src/components/mui/__tests__/mui-formik-datepicker.test.js

+    const user = userEvent.setup();
+    const input = screen.getByLabelText("Test Date *");
+    await user.click(input);
+    input.blur();


Mixes user-event with imperative DOM manipulation and bypasses normal event sequencing.

await user.tab();

This ensures blur happens through the testing-library interaction model.

… as mandatory

martinquiroga-exo

LGTM

priscila-moneo marked this pull request as ready for review March 4, 2026 22:07

martinquiroga-exo requested review from caseylocker, martinquiroga-exo and smarcet March 6, 2026 17:47

martinquiroga-exo requested changes Mar 6, 2026

View reviewed changes

fix: datepicker fields for opens at and expires at on new form marked…

8be526a

… as mandatory

priscila-moneo force-pushed the fix/new-form-mark-mandatory-fields branch from 50b0e5c to 8be526a Compare March 6, 2026 20:00

martinquiroga-exo approved these changes Mar 6, 2026

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

fix: fields for opens at and expires at on new form marked as mandatory#813

fix: fields for opens at and expires at on new form marked as mandatory#813
priscila-moneo wants to merge 1 commit intomasterfrom
fix/new-form-mark-mandatory-fields

priscila-moneo commented Mar 4, 2026 •

edited by coderabbitai bot

Loading

Uh oh!

coderabbitai bot commented Mar 4, 2026 •

edited

Loading

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested reviewers

Poem

Uh oh!

martinquiroga-exo left a comment

Uh oh!

martinquiroga-exo Mar 6, 2026

Uh oh!

martinquiroga-exo Mar 6, 2026

Uh oh!

martinquiroga-exo Mar 6, 2026

Uh oh!

martinquiroga-exo Mar 6, 2026

Uh oh!

martinquiroga-exo left a comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Conversation

priscila-moneo commented Mar 4, 2026 • edited by coderabbitai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Uh oh!

coderabbitai bot commented Mar 4, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested reviewers

Poem

Uh oh!

martinquiroga-exo left a comment

Choose a reason for hiding this comment

Uh oh!

martinquiroga-exo Mar 6, 2026

Choose a reason for hiding this comment

Uh oh!

martinquiroga-exo Mar 6, 2026

Choose a reason for hiding this comment

Uh oh!

martinquiroga-exo Mar 6, 2026

Choose a reason for hiding this comment

Uh oh!

martinquiroga-exo Mar 6, 2026

Choose a reason for hiding this comment

Uh oh!

martinquiroga-exo left a comment

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

priscila-moneo commented Mar 4, 2026 •

edited by coderabbitai bot

Loading

coderabbitai bot commented Mar 4, 2026 •

edited

Loading