Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Adds regex validation for PhoneNumberFormField same as in backend and validate onBlur instead of onSubmit #5789

Merged
merged 12 commits into from
Jul 12, 2023
Merged

Adds regex validation for PhoneNumberFormField same as in backend and validate onBlur instead of onSubmit #5789

merged 12 commits into from
Jul 12, 2023

Conversation

rithviknishad
Copy link
Member

@rithviknishad rithviknishad commented Jun 28, 2023 •
edited
Loading

WHAT

🤖 Generated by Copilot at 0f5f660

The pull request enhances the validation of phone number and email inputs in the form components. It refactors the EmailValidator function to use a generic RegexValidator function and adds a new PhoneNumberValidator function. It also modifies the PhoneNumberFormField component to use the new validator and show error messages.

Proposed Changes

image image

@coronasafe/care-fe-code-reviewers @coronasafe/code-reviewers

Merge Checklist

  • Add specs that demonstrate bug / test a new feature.
  • Update product documentation.
  • Ensure that UI text is kept in I18n files.
  • Prep screenshot or demo video for changelog entry, and attach it to issue.
  • Request for Peer Reviews
  • Completion of QA

HOW

🤖 Generated by Copilot at 0f5f660

  • Refactor EmailValidator function to use a generic RegexValidator function and add new validators for phone numbers and email addresses (link)
  • Update PhoneNumberFormField component to import and use the new PhoneNumberValidator function and the FieldError type from FieldValidators.tsx (link)
  • Add a local state variable error to PhoneNumberFormField component to store and display the validation error message from PhoneNumberValidator (link, link)
  • Pass the error state to the parent FormField component as part of the field prop to enable the validation logic and error handling (link)

@rithviknishad rithviknishad requested a review from a team June 28, 2023 06:49
@rithviknishad rithviknishad requested a review from a team as a code owner June 28, 2023 06:49
@vercel
Copy link

vercel bot commented Jun 28, 2023 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
care-storybook ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jul 11, 2023 1:32pm

@netlify
Copy link

netlify bot commented Jun 28, 2023 •
edited
Loading

✅ Deploy Preview for care-egov-staging ready!

Name Link
🔨 Latest commit 63dd0a8
🔍 Latest deploy log https://app.netlify.com/sites/care-egov-staging/deploys/64ad59b3742a260008e32dd6
😎 Deploy Preview https://deploy-preview-5789--care-egov-staging.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@rithviknishad rithviknishad added needs testing P1 breaking issue or vital feature labels Jun 28, 2023
@github-actions github-actions bot added the cypress failed pull request with cypress test failure label Jun 28, 2023
@github-actions github-actions bot added cypress passed and removed cypress failed pull request with cypress test failure labels Jun 28, 2023
@nihal467
Copy link
Member

@rithviknishad
image

when, we start typing it, the error is showing, doesn't seem good, any other approach have in mind

@rithviknishad
Copy link
Member Author

For validating on submit, we'll have to update everywhere it's used manually as it would become outside the scope of the reusable component.

@rithviknishad
Copy link
Member Author

Isn't this better, user will be aware immediatley if it's wrong instead rather than waiting to submit and come back

@rithviknishad rithviknishad changed the title Adds custom as you type regex validation for PhoneNumberFormField Adds regex validation for PhoneNumberFormField same as in backend and validate onBlur instead of onSubmit Jun 30, 2023
@github-actions github-actions bot added cypress failed pull request with cypress test failure and removed cypress passed labels Jul 3, 2023
@nihal467
Copy link
Member

nihal467 commented Jul 3, 2023 •
edited
Loading

@rithviknishad
image

there is a bug in the field, that is why cypress is failing

  • when we are inputting 10 digit's the initial +91 is auto-removed and there is a 0 by-default added

@github-actions github-actions bot added the merge conflict pull requests with merge conflict label Jul 5, 2023
@github-actions
Copy link

github-actions bot commented Jul 5, 2023

👋 Hi, @rithviknishad,
Conflicts have been detected against the base branch. Please rebase your branch against the base branch.

This message is automatically generated by prince-chrismc/label-merge-conflicts-action so don't hesitate to report issues/improvements there.

@rithviknishad rithviknishad mentioned this pull request Jul 7, 2023
Closed
@Ashesh3
Copy link
Member

Ashesh3 commented Jul 7, 2023

@rithviknishad The page is crashing when opening advanced filters on User page.

@github-actions github-actions bot removed the merge conflict pull requests with merge conflict label Jul 7, 2023
@rithviknishad
Copy link
Member Author

I've resolved the crash; not the issue #5846

@rithviknishad
Copy link
Member Author

@Ashesh3

@nihal467
Copy link
Member

nihal467 commented Jul 7, 2023

@rithviknishad fix the cypress

@github-actions github-actions bot added cypress passed and removed cypress failed pull request with cypress test failure labels Jul 11, 2023
@nihal467
Copy link
Member

LGTM

@khavinshankar khavinshankar merged commit c49ffcd into develop Jul 12, 2023
29 checks passed
@khavinshankar khavinshankar deleted the asyoutype-phone-number-validate branch July 12, 2023 08:21
@github-actions
Copy link

@rithviknishad We truly appreciate your efforts. Thank you for taking the time to contribute; this is a very valuable contribution to us 🥇. We always welcome your contribution 🙂, so feel free to contribute to anything anytime, and never lose that spirit of innovation 🙌.

Ashesh3 pushed a commit that referenced this pull request Jul 12, 2023
@rithviknishad @Ashesh3
Adds regex validation for PhoneNumberFormField same as in backend a…
4fffe36 
…nd validate `onBlur` instead of `onSubmit` (#5789)

* Adds custom as you type validation for `PhoneNumberFormField`

* validation for support numbers

* fix priority

* validate onBlur

* improved validation and formatting

* skip formatting if country disabled

* fix length

* fix

* fix cypress
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@khavinshankar khavinshankar khavinshankar approved these changes

@bodhish bodhish Awaiting requested review from bodhish

Assignees
No one assigned
Labels
cypress passed P1 breaking issue or vital feature tested
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

add phone number as you type regex validation in PhoneNumberFormField
4 participants
@rithviknishad @nihal467 @Ashesh3 @khavinshankar