Fix: Incorrect Icon in Patient nav bar | Facility switcher hovering and some minor fixes #10080
Conversation
WalkthroughThis pull request introduces several enhancements across different components, focusing on internationalization, user interface improvements, and minor visual updates. The changes include adding localization entries for medical terminology, implementing translation support in diagnosis and symptom tables, updating sidebar component interactions, modifying patient navigation icons, and refining appointment status badge representations. Changes
Assessment against linked issues
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (3)
🚧 Files skipped from review as they are similar to previous changes (3)
⏰ Context from checks skipped due to timeout of 90000ms (1)
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. |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (6)
src/pages/Patient/components/AppointmentDialog.tsx (2)
90-90: Use AppointmentCancelledStatuses for status checkInstead of directly comparing with "cancelled" string, use the AppointmentCancelledStatuses array for better type safety and maintainability.
- disabled={isPending || appointment.status == "cancelled"} + disabled={isPending || AppointmentCancelledStatuses.includes(appointment.status as AppointmentCancelledStatus)}
Line range hint
99-102: Track TODO comment for reschedule functionalityThe TODO comment about wiring up the reschedule functionality should be tracked in the issue tracker.
Would you like me to create an issue to track the implementation of the reschedule functionality?
src/pages/Patient/index.tsx (2)
57-59: Refactor nested ternary operators for better readabilityThe nested ternary operators make the code harder to read. Consider using a more explicit approach with a switch statement or object mapping.
- variant={ - status === "checked_in" - ? "secondary" - : status === "booked" - ? "primary" - : status === "cancelled" - ? "destructive" - : "default" - } + variant={getStatusVariant(status)} // Add this function above the component: const getStatusVariant = (status: string) => { switch (status) { case "checked_in": return "secondary"; case "booked": return "primary"; case "cancelled": return "destructive"; default: return "default"; } };
Line range hint
134-135: Use i18n for hardcoded stringsThe hardcoded strings should be internationalized using the translation system.
- <span className="text-sm">{"Currently doesn't exist"}</span> + <span className="text-sm">{t("appointment_type_not_available")}</span> - <span className="text-sm">{"Facility Location"}</span> + <span className="text-sm">{t("facility_location")}</span>src/components/Patient/symptoms/SymptomTable.tsx (1)
89-89: Consider updating Avatar name prop for consistency.While changing to display username, the Avatar component still uses first_name and last_name for the name prop. Consider updating it to match the username display for consistency.
- <Avatar - name={`${symptom.created_by?.first_name} ${symptom.created_by?.last_name}`} - className="w-4 h-4" - imageUrl={symptom.created_by?.profile_picture_url} - /> + <Avatar + name={symptom.created_by?.username} + className="w-4 h-4" + imageUrl={symptom.created_by?.profile_picture_url} + />src/components/Patient/diagnosis/DiagnosisTable.tsx (1)
89-89: Consider updating Avatar name prop for consistency.Similar to SymptomTable.tsx, consider updating the Avatar name prop to use username for consistency.
- <Avatar - name={`${diagnosis.created_by?.first_name} ${diagnosis.created_by?.last_name}`} - className="w-4 h-4" - imageUrl={diagnosis.created_by?.profile_picture_url} - /> + <Avatar + name={diagnosis.created_by?.username} + className="w-4 h-4" + imageUrl={diagnosis.created_by?.profile_picture_url} + />
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (9)
public/locale/en.json(6 hunks)src/components/Patient/diagnosis/DiagnosisTable.tsx(3 hunks)src/components/Patient/symptoms/SymptomTable.tsx(3 hunks)src/components/ui/sidebar/facility-switcher.tsx(2 hunks)src/components/ui/sidebar/organization-switcher.tsx(2 hunks)src/components/ui/sidebar/patient-nav.tsx(1 hunks)src/pages/Patient/components/AppointmentDialog.tsx(1 hunks)src/pages/Patient/index.tsx(1 hunks)src/types/scheduling/schedule.ts(1 hunks)
✅ Files skipped from review due to trivial changes (1)
- src/components/ui/sidebar/patient-nav.tsx
🔇 Additional comments (10)
src/components/Patient/symptoms/SymptomTable.tsx (1)
41-41: LGTM! Well-structured i18n implementation.The translation implementation is consistent and follows best practices.
Also applies to: 47-52
src/components/Patient/diagnosis/DiagnosisTable.tsx (1)
41-41: LGTM! Consistent i18n implementation.The translation implementation matches the pattern used in SymptomTable.tsx, maintaining consistency across components.
Also applies to: 47-52
src/components/ui/sidebar/organization-switcher.tsx (1)
67-70: LGTM! Enhanced interactive feedback.The cursor-pointer and focus styles improve the UI feedback, aligning with the PR objectives.
Also applies to: 86-88
src/components/ui/sidebar/facility-switcher.tsx (1)
61-64: LGTM! Consistent with organization switcher.The UI improvements mirror those in the organization switcher, maintaining a cohesive user experience.
Also applies to: 81-83
public/locale/en.json (6)
1471-1471: LGTM! Translation key added for onset field.The translation is consistent with other medical terminology in the file.
1867-1867: LGTM! Translation key added for role selection prompt.The translation follows the existing pattern for selection prompts in the file.
1893-1893: LGTM! Translation key added for PRN reason selection.The translation is consistent with other selection prompts and medical terminology.
1932-1932: LGTM! Translation key added for severity field.The translation is consistent with other medical terminology in the file.
2009-2009: LGTM! Translation key added for symptom field.The translation is consistent with other medical terminology in the file.
2197-2197: LGTM! Translation key added for verification field.The translation is consistent with other form field labels in the file.
|
👋 Hi, @Rishith25, This message is automatically generated by prince-chrismc/label-merge-conflicts-action so don't hesitate to report issues/improvements there. |
Rishith25
changed the title
Rishith25
changed the title
Proposed Changes
Fixes Disable Cancel appointment button after cancellation | Facility switcher hovering and some minor fixes #10074
Task 1 : Use destructive variant for cancelled badge
Task 2 : Facility and Organization switcher on hovering appearing gray it should be green
Task 3 : Incorrect icon in patient nav bar
Task 4 : User profile pic is visible but Username is not visible for symptoms and diagnosis table in encounter page
@ohcnetwork/care-fe-code-reviewers
Merge Checklist
Summary by CodeRabbit
Localization
UI Improvements
Minor Changes