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.

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

Adds support for review missed logic #8607 #9486

Open
wants to merge 10 commits into
base: develop
Choose a base branch
from

Conversation

Sancharisingh
Copy link

@Sancharisingh Sancharisingh commented Dec 18, 2024

Proposed Changes

  • Fixes Review Missed #8607
  • Added success and purple variants in badge.tsx.
  • Implemented "Review Missed" logic in managePatients.tsx.

@ohcnetwork/care-fe-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

Summary by CodeRabbit

  • New Features

    • Introduced a new Badge component for patient status notifications, replacing the previous Chip component.
    • Added new badge variants, including "primary" for upcoming reviews and "destructive" for missed reviews, enhancing visual clarity.
    • Expanded badge size options to include small, medium, and large.
    • Enhanced Badge component functionality with optional properties for icons and tooltips.
  • Bug Fixes

    • Improved clarity of patient status indicators by updating to the Badge component for various notifications.

@Sancharisingh Sancharisingh requested a review from a team as a code owner December 18, 2024 13:10
Copy link
Contributor

coderabbitai bot commented Dec 18, 2024

Walkthrough

The pull request introduces changes to the patient management interface, specifically in the ManagePatients.tsx component. The primary modification involves replacing the existing Chip component with a new Badge component to display review missed notifications. The new implementation provides more detailed information about missed reviews, showing the number of days since the review was missed or is due soon. The badge.tsx file was updated to include a new primary color variant to support this feature.

Changes

File Change Summary
src/components/Patient/ManagePatients.tsx - Added import for Badge component
- Replaced Chip with Badge for review notifications
- Implemented logic for displaying missed review days
src/components/ui/badge.tsx - Added primary badge variant with specific styling properties
- Introduced custom variant
- Expanded size variants to small, medium, large
- Updated BadgeProps interface to include new props

Assessment against linked issues

Objective Addressed Explanation
Show relative time since review missed [#8607]
Improve visibility of review missed duration

Possibly related PRs

Suggested labels

tested, reviewed

Suggested reviewers

  • Jacobjeevan
  • rithviknishad

Poem

🐰 Badges of care, dancing with flair,
Tracking reviews with mathematical flair.
Green for the due, red for the missed,
In patient management, clarity is bliss!
A rabbit's code, precise and bright,
Guiding the doctors, day and night! 🩺


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?

❤️ Share
🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>, please review it.
    • Generate unit testing code for this file.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    • @coderabbitai generate unit testing code for this file.
    • @coderabbitai modularize this function.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
    • @coderabbitai read src/utils.ts and generate unit testing code.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
    • @coderabbitai help me debug CodeRabbit configuration file.

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)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai generate docstrings to generate docstrings for this PR. (Beta)
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

Other keywords and placeholders

  • Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • Please see the configuration documentation for more information.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

Copy link

netlify bot commented Dec 18, 2024

Deploy Preview for care-ohc ready!

Name Link
🔨 Latest commit d9a34f4
🔍 Latest deploy log https://app.netlify.com/sites/care-ohc/deploys/676469442a17b20008951b22
😎 Deploy Preview https://deploy-preview-9486--care-ohc.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.

@Jacobjeevan
Copy link
Contributor

Jacobjeevan commented Dec 18, 2024

Try to salvage the other PR instead #9259

Since you haven't force pushed, you should be able to rollback all the changes (just push your new code on stash beforehand) and then merge all the changes since you opened the PR/merge and pop from stash.

@Jacobjeevan Jacobjeevan added the duplicate This issue or pull request already exists label Dec 18, 2024
@Sancharisingh
Copy link
Author

Hi @Jacobjeevan @rithviknishad ,

Thank you for your guidance! I have made the changes you suggested. Could you please reopen PR #9259 so I can push the updated changes?

Looking forward to your response.

Best regards,
Sanchari singh

@github-actions github-actions bot added needs-triage question Further information is requested labels Dec 19, 2024
@Jacobjeevan
Copy link
Contributor

Jacobjeevan commented Dec 19, 2024

Hi @Jacobjeevan @rithviknishad ,

Thank you for your guidance! I have made the changes you suggested. Could you please reopen PR #9259 so I can push the updated changes?

Looking forward to your response.

Best regards, Sanchari singh

You should have the option to reopen it 👍 But looks like the branch is deleted, so let's use this PR instead then.

@Jacobjeevan Jacobjeevan removed duplicate This issue or pull request already exists question Further information is requested needs-triage labels Dec 19, 2024
@Jacobjeevan Jacobjeevan reopened this Dec 19, 2024
<Badge
variant={
dayjs().isAfter(patient.review_time)
? "purple"
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's use the destructive instead 🤔 That should be in line in what we had originally (red color).

Primary should work for the green color.

Try both of those and remove success/purple styles from badge component if they work.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ok

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There is no primary, so I changed the name of 'success' to 'primary.'

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

image

Okay, let's modify the primary to match the chip component's primary style.

While you are at it, can you also update the existing chips in the page to use the new badge component?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Sancharisingh Can you do the above as well (switch existing chips in the component to use badge)?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yes

Copy link
Author

@Sancharisingh Sancharisingh Dec 20, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi @Jacobjeevan,
I updated the Chip to Badge in the ManagePatient file. Should this change be applied project-wide, or is it fine to keep other instances as they are?

Copy link
Contributor

@Jacobjeevan Jacobjeevan Dec 20, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi @Jacobjeevan, I updated the Chip to Badge in the ManagePatient file. Should this change be applied project-wide, or is it fine to keep other instances as they are?

Just this file/component is enough.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Okay.

@github-actions github-actions bot added the Deploy-Failed Deplyment is not showing preview label Dec 19, 2024
@rithviknishad rithviknishad removed the Deploy-Failed Deplyment is not showing preview label Dec 19, 2024
@github-actions github-actions bot added the Deploy-Failed Deplyment is not showing preview label Dec 19, 2024
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

🧹 Nitpick comments (4)
src/components/ui/badge.tsx (1)

59-61: Consider using aria-describedby for tooltip

For better accessibility, consider using aria-describedby to associate the tooltip text with the badge element.

+    <div
+      role="status"
-      aria-label={tooltip || children?.toString()}
+      aria-describedby={tooltip ? "badge-tooltip" : undefined}
       className={cn(badgeVariants({ variant, size }), className)}
-      title={tooltip}
+      {...props}
+    >
+      {tooltip && (
+        <span id="badge-tooltip" className="sr-only">
+          {tooltip}
+        </span>
+      )}
src/components/Patient/ManagePatients.tsx (3)

549-556: Consider consolidating duplicate badge styling

Multiple badges share the same styling pattern (small size, destructive variant, startIcon). Consider extracting this into a reusable component to reduce duplication.

+ const AlertBadge = ({ children, ...props }) => (
+   <span className="relative inline-flex">
+     <Badge
+       size="small"
+       variant="destructive"
+       startIcon="l-notes"
+       {...props}
+     >
+       {children}
+     </Badge>
+     <span className="absolute -right-1 -top-1 flex h-3 w-3 items-center justify-center">
+       <span className="center absolute inline-flex h-4 w-4 animate-ping rounded-full bg-red-400"></span>
+       <span className="relative inline-flex h-3 w-3 rounded-full bg-red-600"></span>
+     </span>
+   </span>
+ );

Also applies to: 565-577


635-642: Consider using consistent variant naming

The badges use a mix of variant styles - some use semantic variants (primary/destructive) while others use custom styling. Consider standardizing this approach.

- variant="custom"
- className="bg-pink-100 text-pink-600"
+ variant="antenatal"

Add to badge.tsx:

variants: {
  variant: {
+   antenatal: "bg-pink-100 text-pink-600",
+   medical: "bg-blue-100 text-blue-600",
  }
}

Also applies to: 645-652


1035-1123: Consider grouping related filter badges

The filter badges list is quite long and could be more maintainable if grouped by category (e.g., patient info, dates, facility info, etc.).

+ const patientInfoBadges = [
+   phoneNumber("Primary number", "phone_number"),
+   phoneNumber("Emergency number", "emergency_phone_number"),
+   badge("Patient name", "name"),
+   badge("IP/OP number", "patient_no"),
+ ];

+ const dateBadges = [
+   ...dateRange("Modified", "modified_date"),
+   ...dateRange("Created", "created_date"),
+   ...dateRange("Admitted", "last_consultation_encounter_date"),
+   ...dateRange("Discharged", "last_consultation_discharge_date"),
+ ];

badges={({ badge, value, kasp, phoneNumber, dateRange, range, ordering }) => [
+  ...patientInfoBadges,
+  ...dateBadges,
   // ... rest of the badges
]}
🧰 Tools
🪛 eslint

[error] 1035-1035: Delete ··

(prettier/prettier)


[error] 1036-1036: Delete ··

(prettier/prettier)


[error] 1037-1037: Delete ··

(prettier/prettier)


[error] 1038-1038: Replace ·············· with ············

(prettier/prettier)


[error] 1039-1039: Delete ··

(prettier/prettier)


[error] 1040-1040: Delete ··

(prettier/prettier)


[error] 1041-1041: Replace ·············· with ············

(prettier/prettier)


[error] 1042-1042: Delete ··

(prettier/prettier)


[error] 1043-1043: Delete ··

(prettier/prettier)


[error] 1044-1044: Replace ·············· with ············

(prettier/prettier)


[error] 1045-1045: Delete ··

(prettier/prettier)


[error] 1046-1046: Delete ··

(prettier/prettier)


[error] 1047-1047: Replace ·············· with ············

(prettier/prettier)


[error] 1048-1048: Delete ··

(prettier/prettier)


[error] 1049-1049: Delete ··

(prettier/prettier)


[error] 1050-1050: Delete ··

(prettier/prettier)


[error] 1051-1051: Delete ··

(prettier/prettier)


[error] 1052-1052: Replace ·············· with ············

(prettier/prettier)


[error] 1053-1053: Delete ··

(prettier/prettier)


[error] 1054-1054: Delete ··

(prettier/prettier)


[error] 1055-1055: Delete ··

(prettier/prettier)


[error] 1056-1056: Delete ··

(prettier/prettier)


[error] 1057-1057: Replace ·················· with ················

(prettier/prettier)


[error] 1058-1058: Delete ··

(prettier/prettier)


[error] 1059-1059: Delete ··

(prettier/prettier)


[error] 1060-1060: Delete ··

(prettier/prettier)


[error] 1061-1061: Delete ··

(prettier/prettier)


[error] 1062-1062: Replace ················ with ··············

(prettier/prettier)


[error] 1063-1063: Delete ··

(prettier/prettier)


[error] 1064-1064: Delete ··

(prettier/prettier)


[error] 1065-1065: Delete ··

(prettier/prettier)


[error] 1066-1066: Delete ··

(prettier/prettier)


[error] 1067-1067: Delete ··

(prettier/prettier)


[error] 1068-1068: Delete ··

(prettier/prettier)


[error] 1069-1069: Replace ·················· with ················

(prettier/prettier)


[error] 1070-1070: Insert ··

(prettier/prettier)


[error] 1071-1071: Delete ··

(prettier/prettier)


[error] 1072-1072: Delete ··

(prettier/prettier)


[error] 1073-1073: Delete ··

(prettier/prettier)


[error] 1074-1074: Delete ··

(prettier/prettier)


[error] 1075-1075: Delete ··

(prettier/prettier)


[error] 1076-1076: Delete ··

(prettier/prettier)


[error] 1077-1077: Delete ··

(prettier/prettier)


[error] 1078-1078: Delete ··

(prettier/prettier)


[error] 1079-1079: Replace ·············· with ············

(prettier/prettier)


[error] 1080-1080: Delete ··

(prettier/prettier)


[error] 1081-1081: Delete ··

(prettier/prettier)


[error] 1082-1082: Delete ··

(prettier/prettier)


[error] 1083-1083: Delete ··

(prettier/prettier)


[error] 1084-1084: Delete ··

(prettier/prettier)


[error] 1086-1086: Delete ··

(prettier/prettier)


[error] 1087-1087: Replace ·············· with ············

(prettier/prettier)


[error] 1088-1088: Delete ··

(prettier/prettier)


[error] 1089-1089: Delete ··

(prettier/prettier)


[error] 1090-1090: Delete ··

(prettier/prettier)


[error] 1091-1091: Delete ··

(prettier/prettier)


[error] 1092-1092: Replace ·············· with ············

(prettier/prettier)


[error] 1093-1093: Delete ··

(prettier/prettier)


[error] 1094-1094: Delete ··

(prettier/prettier)


[error] 1095-1095: Delete ··

(prettier/prettier)


[error] 1096-1096: Delete ··

(prettier/prettier)


[error] 1097-1097: Replace ·············· with ············

(prettier/prettier)


[error] 1098-1098: Delete ··

(prettier/prettier)


[error] 1099-1099: Delete ··

(prettier/prettier)


[error] 1100-1100: Delete ··

(prettier/prettier)


[error] 1101-1101: Delete ··

(prettier/prettier)


[error] 1102-1102: Replace ·············· with ············

(prettier/prettier)


[error] 1103-1103: Delete ··

(prettier/prettier)


[error] 1104-1104: Delete ··

(prettier/prettier)


[error] 1105-1105: Delete ··

(prettier/prettier)


[error] 1106-1106: Delete ··

(prettier/prettier)


[error] 1107-1107: Delete ··

(prettier/prettier)


[error] 1108-1108: Delete ··

(prettier/prettier)


[error] 1109-1109: Replace ·············· with ············

(prettier/prettier)


[error] 1110-1110: Delete ··

(prettier/prettier)


[error] 1111-1111: Delete ··

(prettier/prettier)


[error] 1112-1112: Delete ··

(prettier/prettier)


[error] 1113-1113: Delete ··

(prettier/prettier)


[error] 1114-1114: Replace ················ with ··············

(prettier/prettier)


[error] 1115-1115: Delete ··

(prettier/prettier)


[error] 1116-1116: Replace ·············· with ············

(prettier/prettier)


[error] 1117-1117: Delete ··

(prettier/prettier)


[error] 1118-1118: Delete ··

(prettier/prettier)


[error] 1119-1119: Delete ··

(prettier/prettier)


[error] 1120-1120: Delete ··

(prettier/prettier)


[error] 1121-1121: Replace ·················· with ················

(prettier/prettier)


[error] 1122-1122: Delete ··

(prettier/prettier)


[error] 1123-1123: Delete ··

(prettier/prettier)

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 1256abb and 55bfafd.

📒 Files selected for processing (2)
  • src/components/Patient/ManagePatients.tsx (9 hunks)
  • src/components/ui/badge.tsx (2 hunks)
🧰 Additional context used
🪛 eslint
src/components/ui/badge.tsx

[error] 3-5: Replace import·CareIcon,·{·IconName·}·from·"@/CAREUI/icons/CareIcon";⏎⏎import·{·cn·}·from·"@/lib/utils with ⏎import·{·cn·}·from·"@/lib/utils";⏎⏎import·CareIcon,·{·IconName·}·from·"@/CAREUI/icons/CareIcon

(prettier/prettier)

src/components/Patient/ManagePatients.tsx

[error] 113-113: Delete ··

(prettier/prettier)


[error] 463-463: Delete ··

(prettier/prettier)


[error] 565-565: Delete ··

(prettier/prettier)


[error] 566-566: Delete ··

(prettier/prettier)


[error] 567-567: Delete ··

(prettier/prettier)


[error] 568-568: Delete ··

(prettier/prettier)


[error] 586-589: Replace ⏎··························size="small"⏎··························variant="primary"⏎························ with ·size="small"·variant="primary"

(prettier/prettier)


[error] 590-590: Insert ⏎····························

(prettier/prettier)


[error] 591-591: Delete ··

(prettier/prettier)


[error] 592-593: Delete

(prettier/prettier)


[error] 611-611: Insert ··

(prettier/prettier)


[error] 612-612: Replace ·························· with ····························

(prettier/prettier)


[error] 614-614: Insert ··

(prettier/prettier)


[error] 615-615: Insert ··

(prettier/prettier)


[error] 628-629: Delete

(prettier/prettier)


[error] 1035-1035: Delete ··

(prettier/prettier)


[error] 1036-1036: Delete ··

(prettier/prettier)


[error] 1037-1037: Delete ··

(prettier/prettier)


[error] 1038-1038: Replace ·············· with ············

(prettier/prettier)


[error] 1039-1039: Delete ··

(prettier/prettier)


[error] 1040-1040: Delete ··

(prettier/prettier)


[error] 1041-1041: Replace ·············· with ············

(prettier/prettier)


[error] 1042-1042: Delete ··

(prettier/prettier)


[error] 1043-1043: Delete ··

(prettier/prettier)


[error] 1044-1044: Replace ·············· with ············

(prettier/prettier)


[error] 1045-1045: Delete ··

(prettier/prettier)


[error] 1046-1046: Delete ··

(prettier/prettier)


[error] 1047-1047: Replace ·············· with ············

(prettier/prettier)


[error] 1048-1048: Delete ··

(prettier/prettier)


[error] 1049-1049: Delete ··

(prettier/prettier)


[error] 1050-1050: Delete ··

(prettier/prettier)


[error] 1051-1051: Delete ··

(prettier/prettier)


[error] 1052-1052: Replace ·············· with ············

(prettier/prettier)


[error] 1053-1053: Delete ··

(prettier/prettier)


[error] 1054-1054: Delete ··

(prettier/prettier)


[error] 1055-1055: Delete ··

(prettier/prettier)


[error] 1056-1056: Delete ··

(prettier/prettier)


[error] 1057-1057: Replace ·················· with ················

(prettier/prettier)


[error] 1058-1058: Delete ··

(prettier/prettier)


[error] 1059-1059: Delete ··

(prettier/prettier)


[error] 1060-1060: Delete ··

(prettier/prettier)


[error] 1061-1061: Delete ··

(prettier/prettier)


[error] 1062-1062: Replace ················ with ··············

(prettier/prettier)


[error] 1063-1063: Delete ··

(prettier/prettier)


[error] 1064-1064: Delete ··

(prettier/prettier)


[error] 1065-1065: Delete ··

(prettier/prettier)


[error] 1066-1066: Delete ··

(prettier/prettier)


[error] 1067-1067: Delete ··

(prettier/prettier)


[error] 1068-1068: Delete ··

(prettier/prettier)


[error] 1069-1069: Replace ·················· with ················

(prettier/prettier)


[error] 1070-1070: Insert ··

(prettier/prettier)


[error] 1071-1071: Delete ··

(prettier/prettier)


[error] 1072-1072: Delete ··

(prettier/prettier)


[error] 1073-1073: Delete ··

(prettier/prettier)


[error] 1074-1074: Delete ··

(prettier/prettier)


[error] 1075-1075: Delete ··

(prettier/prettier)


[error] 1076-1076: Delete ··

(prettier/prettier)


[error] 1077-1077: Delete ··

(prettier/prettier)


[error] 1078-1078: Delete ··

(prettier/prettier)


[error] 1079-1079: Replace ·············· with ············

(prettier/prettier)


[error] 1080-1080: Delete ··

(prettier/prettier)


[error] 1081-1081: Delete ··

(prettier/prettier)


[error] 1082-1082: Delete ··

(prettier/prettier)


[error] 1083-1083: Delete ··

(prettier/prettier)


[error] 1084-1084: Delete ··

(prettier/prettier)


[error] 1086-1086: Delete ··

(prettier/prettier)


[error] 1087-1087: Replace ·············· with ············

(prettier/prettier)


[error] 1088-1088: Delete ··

(prettier/prettier)


[error] 1089-1089: Delete ··

(prettier/prettier)


[error] 1090-1090: Delete ··

(prettier/prettier)


[error] 1091-1091: Delete ··

(prettier/prettier)


[error] 1092-1092: Replace ·············· with ············

(prettier/prettier)


[error] 1093-1093: Delete ··

(prettier/prettier)


[error] 1094-1094: Delete ··

(prettier/prettier)


[error] 1095-1095: Delete ··

(prettier/prettier)


[error] 1096-1096: Delete ··

(prettier/prettier)


[error] 1097-1097: Replace ·············· with ············

(prettier/prettier)


[error] 1098-1098: Delete ··

(prettier/prettier)


[error] 1099-1099: Delete ··

(prettier/prettier)


[error] 1100-1100: Delete ··

(prettier/prettier)


[error] 1101-1101: Delete ··

(prettier/prettier)


[error] 1102-1102: Replace ·············· with ············

(prettier/prettier)


[error] 1103-1103: Delete ··

(prettier/prettier)


[error] 1104-1104: Delete ··

(prettier/prettier)


[error] 1105-1105: Delete ··

(prettier/prettier)


[error] 1106-1106: Delete ··

(prettier/prettier)


[error] 1107-1107: Delete ··

(prettier/prettier)


[error] 1108-1108: Delete ··

(prettier/prettier)


[error] 1109-1109: Replace ·············· with ············

(prettier/prettier)


[error] 1110-1110: Delete ··

(prettier/prettier)


[error] 1111-1111: Delete ··

(prettier/prettier)


[error] 1112-1112: Delete ··

(prettier/prettier)


[error] 1113-1113: Delete ··

(prettier/prettier)


[error] 1114-1114: Replace ················ with ··············

(prettier/prettier)


[error] 1115-1115: Delete ··

(prettier/prettier)


[error] 1116-1116: Replace ·············· with ············

(prettier/prettier)


[error] 1117-1117: Delete ··

(prettier/prettier)


[error] 1118-1118: Delete ··

(prettier/prettier)


[error] 1119-1119: Delete ··

(prettier/prettier)


[error] 1120-1120: Delete ··

(prettier/prettier)


[error] 1121-1121: Replace ·················· with ················

(prettier/prettier)


[error] 1122-1122: Delete ··

(prettier/prettier)


[error] 1123-1123: Delete ··

(prettier/prettier)


[error] 1124-1124: Delete ··

(prettier/prettier)


[error] 1125-1125: Delete ··

(prettier/prettier)

🔇 Additional comments (5)
src/components/ui/badge.tsx (3)

21-23: Consider using semantic color tokens for the primary variant

The primary variant is using specific color values like bg-green-500. Consider using semantic color tokens (e.g., bg-primary-500) to maintain consistency with the design system and make it easier to update colors globally.

-          "border-transparent bg-green-500 text-gray-50 shadow hover:bg-green-500/80 dark:bg-green-900 dark:text-gray-50 dark:hover:bg-green-900/80",
+          "border-transparent bg-primary-500 text-gray-50 shadow hover:bg-primary-500/80 dark:bg-primary-900 dark:text-gray-50 dark:hover:bg-primary-900/80",

25-28: LGTM: Size variants are well defined

The size variants provide good flexibility with appropriate spacing and text size adjustments.


40-44: LGTM: Props interface is well structured

The BadgeProps interface cleanly extends HTMLDivElement props and includes well-typed optional properties for icons and tooltip.

src/components/Patient/ManagePatients.tsx (2)

599-616: LGTM: Review missed logic is well implemented

The implementation correctly:

  • Checks for review time and review interval
  • Shows appropriate messages for missed and upcoming reviews
  • Uses correct variants (destructive/primary) based on status
🧰 Tools
🪛 eslint

[error] 611-611: Insert ··

(prettier/prettier)


[error] 612-612: Replace ·························· with ····························

(prettier/prettier)


[error] 614-614: Insert ··

(prettier/prettier)


[error] 615-615: Insert ··

(prettier/prettier)


586-593: LGTM: Patient information badges are well structured

The badges for patient numbers and IP day count are appropriately styled and provide clear information.

Also applies to: 622-629

🧰 Tools
🪛 eslint

[error] 586-589: Replace ⏎··························size="small"⏎··························variant="primary"⏎························ with ·size="small"·variant="primary"

(prettier/prettier)


[error] 590-590: Insert ⏎····························

(prettier/prettier)


[error] 591-591: Delete ··

(prettier/prettier)


[error] 592-593: Delete

(prettier/prettier)

@Jacobjeevan
Copy link
Contributor

image

Seeing all these together 😅 and all the consultations filed ones, I feel these might be a bit too intense. Let's ping @vinutv
and see what he thinks. If we are keeping current styles (below), we can either add or modify the existing variants.

image

@Sancharisingh
Copy link
Author

Yeah, I am also thinking of modifying all these variants.

@nihal467 nihal467 added question Further information is requested discussion required and removed needs testing needs review Deploy-Failed Deplyment is not showing preview labels Dec 23, 2024
@nihal467 nihal467 requested a review from vinutv December 23, 2024 04:45
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

🧹 Nitpick comments (2)
src/components/Patient/ManagePatients.tsx (2)

598-615: Review missed logic implementation looks good, consider adding error handling

The implementation correctly:

  • Checks review time and interval
  • Calculates days difference
  • Uses appropriate badge variants
  • Shows clear messages

Consider adding error handling for invalid review_time values.

 {patient.review_time &&
   !patient.last_consultation?.discharge_date &&
   Number(patient.last_consultation?.review_interval) > 0 && (
+    // Ensure review_time is valid before calculations
+    dayjs(patient.review_time).isValid() ? (
     <Badge
       variant={
         dayjs().isAfter(patient.review_time)
           ? "destructive"
           : "primary"
       }
       className="flex items-center gap-1"
     >
       <i className="icon-class l-clock"></i>
       {dayjs().isAfter(patient.review_time)
         ? `Review Missed ${Math.abs(
             dayjs().diff(dayjs(patient.review_time), "days"),
           )} days ago`
         : `Review Due in ${Math.abs(
             dayjs(patient.review_time).diff(dayjs(), "days"),
           )} days`}
     </Badge>
+    ) : null
   )}
🧰 Tools
🪛 eslint

[error] 610-610: Insert ··

(prettier/prettier)


[error] 611-611: Replace ·························· with ····························

(prettier/prettier)


[error] 613-613: Insert ··

(prettier/prettier)


[error] 614-614: Insert ··

(prettier/prettier)


1034-1124: Consider improving type safety for filter badges

The filter badges implementation is comprehensive but could benefit from stronger typing:

  • Consider creating a type for the filter badge configuration
  • Use string literal types for filter keys to prevent typos
type FilterBadgeKey = 
  | 'phone_number'
  | 'emergency_phone_number'
  | 'name'
  | 'patient_no'
  // ... add other keys

interface FilterBadgeConfig {
  name: string;
  paramKey: FilterBadgeKey;
  value?: string;
}
🧰 Tools
🪛 eslint

[error] 1034-1034: Delete ··

(prettier/prettier)


[error] 1035-1035: Delete ··

(prettier/prettier)


[error] 1036-1036: Delete ··

(prettier/prettier)


[error] 1037-1037: Replace ·············· with ············

(prettier/prettier)


[error] 1038-1038: Delete ··

(prettier/prettier)


[error] 1039-1039: Delete ··

(prettier/prettier)


[error] 1040-1040: Replace ·············· with ············

(prettier/prettier)


[error] 1041-1041: Delete ··

(prettier/prettier)


[error] 1042-1042: Delete ··

(prettier/prettier)


[error] 1043-1043: Replace ·············· with ············

(prettier/prettier)


[error] 1044-1044: Delete ··

(prettier/prettier)


[error] 1045-1045: Delete ··

(prettier/prettier)


[error] 1046-1046: Replace ·············· with ············

(prettier/prettier)


[error] 1047-1047: Delete ··

(prettier/prettier)


[error] 1048-1048: Delete ··

(prettier/prettier)


[error] 1049-1049: Delete ··

(prettier/prettier)


[error] 1050-1050: Delete ··

(prettier/prettier)


[error] 1051-1051: Replace ·············· with ············

(prettier/prettier)


[error] 1052-1052: Delete ··

(prettier/prettier)


[error] 1053-1053: Delete ··

(prettier/prettier)


[error] 1054-1054: Delete ··

(prettier/prettier)


[error] 1055-1055: Delete ··

(prettier/prettier)


[error] 1056-1056: Replace ·················· with ················

(prettier/prettier)


[error] 1057-1057: Delete ··

(prettier/prettier)


[error] 1058-1058: Delete ··

(prettier/prettier)


[error] 1059-1059: Delete ··

(prettier/prettier)


[error] 1060-1060: Delete ··

(prettier/prettier)


[error] 1061-1061: Replace ················ with ··············

(prettier/prettier)


[error] 1062-1062: Delete ··

(prettier/prettier)


[error] 1063-1063: Delete ··

(prettier/prettier)


[error] 1064-1064: Delete ··

(prettier/prettier)


[error] 1065-1065: Delete ··

(prettier/prettier)


[error] 1066-1066: Delete ··

(prettier/prettier)


[error] 1067-1067: Delete ··

(prettier/prettier)


[error] 1068-1068: Replace ·················· with ················

(prettier/prettier)


[error] 1069-1069: Insert ··

(prettier/prettier)


[error] 1070-1070: Delete ··

(prettier/prettier)


[error] 1071-1071: Delete ··

(prettier/prettier)


[error] 1072-1072: Delete ··

(prettier/prettier)


[error] 1073-1073: Delete ··

(prettier/prettier)


[error] 1074-1074: Delete ··

(prettier/prettier)


[error] 1075-1075: Delete ··

(prettier/prettier)


[error] 1076-1076: Delete ··

(prettier/prettier)


[error] 1077-1077: Delete ··

(prettier/prettier)


[error] 1078-1078: Replace ·············· with ············

(prettier/prettier)


[error] 1079-1079: Delete ··

(prettier/prettier)


[error] 1080-1080: Delete ··

(prettier/prettier)


[error] 1081-1081: Delete ··

(prettier/prettier)


[error] 1082-1082: Delete ··

(prettier/prettier)


[error] 1083-1083: Delete ··

(prettier/prettier)


[error] 1085-1085: Delete ··

(prettier/prettier)


[error] 1086-1086: Replace ·············· with ············

(prettier/prettier)


[error] 1087-1087: Delete ··

(prettier/prettier)


[error] 1088-1088: Delete ··

(prettier/prettier)


[error] 1089-1089: Delete ··

(prettier/prettier)


[error] 1090-1090: Delete ··

(prettier/prettier)


[error] 1091-1091: Replace ·············· with ············

(prettier/prettier)


[error] 1092-1092: Delete ··

(prettier/prettier)


[error] 1093-1093: Delete ··

(prettier/prettier)


[error] 1094-1094: Delete ··

(prettier/prettier)


[error] 1095-1095: Delete ··

(prettier/prettier)


[error] 1096-1096: Replace ·············· with ············

(prettier/prettier)


[error] 1097-1097: Delete ··

(prettier/prettier)


[error] 1098-1098: Delete ··

(prettier/prettier)


[error] 1099-1099: Delete ··

(prettier/prettier)


[error] 1100-1100: Delete ··

(prettier/prettier)


[error] 1101-1101: Replace ·············· with ············

(prettier/prettier)


[error] 1102-1102: Delete ··

(prettier/prettier)


[error] 1103-1103: Delete ··

(prettier/prettier)


[error] 1104-1104: Delete ··

(prettier/prettier)


[error] 1105-1105: Delete ··

(prettier/prettier)


[error] 1106-1106: Delete ··

(prettier/prettier)


[error] 1107-1107: Delete ··

(prettier/prettier)


[error] 1108-1108: Replace ·············· with ············

(prettier/prettier)


[error] 1109-1109: Delete ··

(prettier/prettier)


[error] 1110-1110: Delete ··

(prettier/prettier)


[error] 1111-1111: Delete ··

(prettier/prettier)


[error] 1112-1112: Delete ··

(prettier/prettier)


[error] 1113-1113: Replace ················ with ··············

(prettier/prettier)


[error] 1114-1114: Delete ··

(prettier/prettier)


[error] 1115-1115: Replace ·············· with ············

(prettier/prettier)


[error] 1116-1116: Delete ··

(prettier/prettier)


[error] 1117-1117: Delete ··

(prettier/prettier)


[error] 1118-1118: Delete ··

(prettier/prettier)


[error] 1119-1119: Delete ··

(prettier/prettier)


[error] 1120-1120: Replace ·················· with ················

(prettier/prettier)


[error] 1121-1121: Delete ··

(prettier/prettier)


[error] 1122-1122: Delete ··

(prettier/prettier)


[error] 1123-1123: Delete ··

(prettier/prettier)


[error] 1124-1124: Delete ··

(prettier/prettier)

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 55bfafd and d9a34f4.

📒 Files selected for processing (1)
  • src/components/Patient/ManagePatients.tsx (8 hunks)
🧰 Additional context used
🪛 eslint
src/components/Patient/ManagePatients.tsx

[error] 112-112: Delete ··

(prettier/prettier)


[error] 462-462: Delete ··

(prettier/prettier)


[error] 564-564: Delete ··

(prettier/prettier)


[error] 565-565: Delete ··

(prettier/prettier)


[error] 566-566: Delete ··

(prettier/prettier)


[error] 567-567: Delete ··

(prettier/prettier)


[error] 585-588: Replace ⏎··························size="small"⏎··························variant="primary"⏎························ with ·size="small"·variant="primary"

(prettier/prettier)


[error] 589-589: Insert ⏎····························

(prettier/prettier)


[error] 590-590: Delete ··

(prettier/prettier)


[error] 591-592: Delete

(prettier/prettier)


[error] 610-610: Insert ··

(prettier/prettier)


[error] 611-611: Replace ·························· with ····························

(prettier/prettier)


[error] 613-613: Insert ··

(prettier/prettier)


[error] 614-614: Insert ··

(prettier/prettier)


[error] 627-628: Delete

(prettier/prettier)


[error] 1034-1034: Delete ··

(prettier/prettier)


[error] 1035-1035: Delete ··

(prettier/prettier)


[error] 1036-1036: Delete ··

(prettier/prettier)


[error] 1037-1037: Replace ·············· with ············

(prettier/prettier)


[error] 1038-1038: Delete ··

(prettier/prettier)


[error] 1039-1039: Delete ··

(prettier/prettier)


[error] 1040-1040: Replace ·············· with ············

(prettier/prettier)


[error] 1041-1041: Delete ··

(prettier/prettier)


[error] 1042-1042: Delete ··

(prettier/prettier)


[error] 1043-1043: Replace ·············· with ············

(prettier/prettier)


[error] 1044-1044: Delete ··

(prettier/prettier)


[error] 1045-1045: Delete ··

(prettier/prettier)


[error] 1046-1046: Replace ·············· with ············

(prettier/prettier)


[error] 1047-1047: Delete ··

(prettier/prettier)


[error] 1048-1048: Delete ··

(prettier/prettier)


[error] 1049-1049: Delete ··

(prettier/prettier)


[error] 1050-1050: Delete ··

(prettier/prettier)


[error] 1051-1051: Replace ·············· with ············

(prettier/prettier)


[error] 1052-1052: Delete ··

(prettier/prettier)


[error] 1053-1053: Delete ··

(prettier/prettier)


[error] 1054-1054: Delete ··

(prettier/prettier)


[error] 1055-1055: Delete ··

(prettier/prettier)


[error] 1056-1056: Replace ·················· with ················

(prettier/prettier)


[error] 1057-1057: Delete ··

(prettier/prettier)


[error] 1058-1058: Delete ··

(prettier/prettier)


[error] 1059-1059: Delete ··

(prettier/prettier)


[error] 1060-1060: Delete ··

(prettier/prettier)


[error] 1061-1061: Replace ················ with ··············

(prettier/prettier)


[error] 1062-1062: Delete ··

(prettier/prettier)


[error] 1063-1063: Delete ··

(prettier/prettier)


[error] 1064-1064: Delete ··

(prettier/prettier)


[error] 1065-1065: Delete ··

(prettier/prettier)


[error] 1066-1066: Delete ··

(prettier/prettier)


[error] 1067-1067: Delete ··

(prettier/prettier)


[error] 1068-1068: Replace ·················· with ················

(prettier/prettier)


[error] 1069-1069: Insert ··

(prettier/prettier)


[error] 1070-1070: Delete ··

(prettier/prettier)


[error] 1071-1071: Delete ··

(prettier/prettier)


[error] 1072-1072: Delete ··

(prettier/prettier)


[error] 1073-1073: Delete ··

(prettier/prettier)


[error] 1074-1074: Delete ··

(prettier/prettier)


[error] 1075-1075: Delete ··

(prettier/prettier)


[error] 1076-1076: Delete ··

(prettier/prettier)


[error] 1077-1077: Delete ··

(prettier/prettier)


[error] 1078-1078: Replace ·············· with ············

(prettier/prettier)


[error] 1079-1079: Delete ··

(prettier/prettier)


[error] 1080-1080: Delete ··

(prettier/prettier)


[error] 1081-1081: Delete ··

(prettier/prettier)


[error] 1082-1082: Delete ··

(prettier/prettier)


[error] 1083-1083: Delete ··

(prettier/prettier)


[error] 1085-1085: Delete ··

(prettier/prettier)


[error] 1086-1086: Replace ·············· with ············

(prettier/prettier)


[error] 1087-1087: Delete ··

(prettier/prettier)


[error] 1088-1088: Delete ··

(prettier/prettier)


[error] 1089-1089: Delete ··

(prettier/prettier)


[error] 1090-1090: Delete ··

(prettier/prettier)


[error] 1091-1091: Replace ·············· with ············

(prettier/prettier)


[error] 1092-1092: Delete ··

(prettier/prettier)


[error] 1093-1093: Delete ··

(prettier/prettier)


[error] 1094-1094: Delete ··

(prettier/prettier)


[error] 1095-1095: Delete ··

(prettier/prettier)


[error] 1096-1096: Replace ·············· with ············

(prettier/prettier)


[error] 1097-1097: Delete ··

(prettier/prettier)


[error] 1098-1098: Delete ··

(prettier/prettier)


[error] 1099-1099: Delete ··

(prettier/prettier)


[error] 1100-1100: Delete ··

(prettier/prettier)


[error] 1101-1101: Replace ·············· with ············

(prettier/prettier)


[error] 1102-1102: Delete ··

(prettier/prettier)


[error] 1103-1103: Delete ··

(prettier/prettier)


[error] 1104-1104: Delete ··

(prettier/prettier)


[error] 1105-1105: Delete ··

(prettier/prettier)


[error] 1106-1106: Delete ··

(prettier/prettier)


[error] 1107-1107: Delete ··

(prettier/prettier)


[error] 1108-1108: Replace ·············· with ············

(prettier/prettier)


[error] 1109-1109: Delete ··

(prettier/prettier)


[error] 1110-1110: Delete ··

(prettier/prettier)


[error] 1111-1111: Delete ··

(prettier/prettier)


[error] 1112-1112: Delete ··

(prettier/prettier)


[error] 1113-1113: Replace ················ with ··············

(prettier/prettier)


[error] 1114-1114: Delete ··

(prettier/prettier)


[error] 1115-1115: Replace ·············· with ············

(prettier/prettier)


[error] 1116-1116: Delete ··

(prettier/prettier)


[error] 1117-1117: Delete ··

(prettier/prettier)


[error] 1118-1118: Delete ··

(prettier/prettier)


[error] 1119-1119: Delete ··

(prettier/prettier)


[error] 1120-1120: Replace ·················· with ················

(prettier/prettier)


[error] 1121-1121: Delete ··

(prettier/prettier)


[error] 1122-1122: Delete ··

(prettier/prettier)


[error] 1123-1123: Delete ··

(prettier/prettier)


[error] 1124-1124: Delete ··

(prettier/prettier)

🪛 GitHub Check: lint
src/components/Patient/ManagePatients.tsx

[failure] 112-112:
Delete ··


[failure] 462-462:
Delete ··


[failure] 564-564:
Delete ··


[failure] 565-565:
Delete ··


[failure] 566-566:
Delete ··


[failure] 567-567:
Delete ··


[failure] 585-585:
Replace ⏎··························size="small"⏎··························variant="primary"⏎························ with ·size="small"·variant="primary"


[failure] 589-589:
Insert ⏎····························


[failure] 590-590:
Delete ··


[failure] 591-591:
Delete

🔇 Additional comments (1)
src/components/Patient/ManagePatients.tsx (1)

548-555: LGTM: Badge component replacements look good!

The Badge component replacements follow the discussed patterns:

  • Using "destructive" variant for warning/error states
  • Using "primary" variant for normal states
  • Using "custom" variant with specific styling for special cases

Also applies to: 569-576, 634-641, 644-651, 664-671

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
discussion required question Further information is requested
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Review Missed
4 participants