fix responsiveness of date field and gender in public patient registration form #10294
Conversation
WalkthroughThe pull request introduces modifications to two components: Changes
Suggested labels
Suggested reviewers
Possibly related PRs
Poem
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
✅ Deploy Preview for care-ohc ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
Deploying care-fe with
|
| Latest commit: |
65a1866
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://5fd6b28e.care-fe.pages.dev |
| Branch Preview URL: | https://rithviknishad-fix-date-field.care-fe.pages.dev |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
src/pages/PublicAppointments/PatientRegistration.tsx (1)
270-293: Excellent improvements to the gender selection's responsive layout!The changes effectively enhance mobile responsiveness through:
- Consistent vertical spacing with
space-y-3- Flexible wrapping with
flex-wrap- Proper spacing between options with
gap-5- Improved accessibility with proper form structure
Consider adding a min-width to prevent awkward single-item wrapping on narrow screens:
-className="flex gap-5 flex-wrap" +className="flex gap-5 flex-wrap [&>*]:min-w-[120px]"
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
src/components/ui/date-field.tsx(3 hunks)src/pages/PublicAppointments/PatientRegistration.tsx(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: cypress-run (1)
- GitHub Check: Cloudflare Pages: care-fe
🔇 Additional comments (1)
src/components/ui/date-field.tsx (1)
Line range hint
105-149: Great improvements to the date field's responsive layout!The changes effectively enhance mobile responsiveness by:
- Using
flex-1to distribute space evenly between date fields- Adding consistent label margins
- Removing fixed width constraints that could cause overflow on small screens
CARE
|
||||||||||||||||||||||||||||||||||||||||
| Project |
CARE
|
| Branch Review |
rithviknishad/fix/date-field-and-gender-responsiveness
|
| Run status |
|
| Run duration | 06m 54s |
| Commit |
|
| Committer | Rithvik Nishad |
| View all properties for this run ↗︎ | |
| Test results | |
|---|---|
Failures
|
2
|
Flaky
|
0
|
Pending
|
0
|
Skipped
|
0
|
Passing
|
8
|
| View all changes introduced in this branch ↗︎ | |
Tests for review
patient_creation.cy.ts • 1 failed test
| Test | Artifacts | |
|---|---|---|
| Patient Management > Search patient with phone number and create a new encounter |
Test Replay
Screenshots
|
|
patient_encounter.cy.ts • 1 failed test
| Test | Artifacts | |
|---|---|---|
| Patient Encounter Questionnaire > Create a new ABG questionnaire and verify the values |
Test Replay
Screenshots
|
|
|
LGTM |
gigincg
deleted the
rithviknishad/fix/date-field-and-gender-responsiveness
branch
|
@rithviknishad Your efforts have helped advance digital healthcare and TeleICU systems. 🚀 Thank you for taking the time out to make CARE better. We hope you continue to innovate and contribute; your impact is immense! 🙌 |
Proposed Changes
@ohcnetwork/care-fe-code-reviewers
Summary by CodeRabbit