-
Notifications
You must be signed in to change notification settings - Fork 517
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
Patient encounter notes #9617
Patient encounter notes #9617
Conversation
Caution Review failedThe pull request is closed. WalkthroughThis pull request introduces enhancements to the notes functionality in a healthcare application. Changes include updates to a localization file, the addition of new API routes for managing patient notes, and the creation of a new React component for displaying and interacting with these notes. A new tab for "EncounterNotes" is integrated into the encounter view, allowing users to manage notes effectively. TypeScript interfaces for messages and threads are also added to ensure type safety. Changes
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (5)
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 (
|
Deploying care-fe with Cloudflare Pages
|
@coderabbitai review |
✅ Actions performedReview triggered.
|
f968ac5
to
2765b11
Compare
✅ Deploy Preview for care-ohc ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
There was a problem hiding this 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/Utils/request/api.tsx (1)
1645-1673
: Add optional error handling callbacks for note-related routes.
While the new note-related routes (listThreads
,createThread
,getMessages
,postMessage
) follow the established pattern, consider adding standardized error handling (e.g., HTTP 4xx or 5xx responses) to help keep consumers of these routes informed about potential request failures.src/pages/Encounters/tabs/EncounterNotesTab.tsx (3)
31-43
: Consider a configurable skeleton item count.
For loading states, make the skeleton item count configurable or dynamic, instead of[1, 2, 3]
, to handle long message lists or different UI states.
67-82
: Add fallback for missing or anonymized user data.
While the avatar logic is correct, consider gracefully handling a scenario whereusername
orprofile_picture_url
might be absent, to avoid runtime errors or broken images.
136-373
: Handle API errors for thread and message creation.
Overall, the component is well-designed with infinite scroll, thread creation, and message posting. For completeness, consider addingonError
callbacks in thecreateThreadMutation
andcreateMessageMutation
to handle failures gracefully, e.g., showing a toast notification on error.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (6)
public/locale/en.json
(4 hunks)src/Utils/request/api.tsx
(2 hunks)src/pages/Encounters/EncounterShow.tsx
(2 hunks)src/pages/Encounters/tabs/EncounterNotesTab.tsx
(1 hunks)src/types/notes/messages.ts
(1 hunks)src/types/notes/threads.ts
(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (4)
- src/types/notes/messages.ts
- src/types/notes/threads.ts
- public/locale/en.json
- src/pages/Encounters/EncounterShow.tsx
🔇 Additional comments (4)
src/Utils/request/api.tsx (1)
104-105
: Imports are consistent and well-organized.
No issues found with these new imports.
src/pages/Encounters/tabs/EncounterNotesTab.tsx (3)
45-66
: Thread item layout and style are clear.
The code snippet is straightforward. The highlighting for selected threads is intuitive. No issues.
83-127
: Well-structured message rendering.
The usage of conditional classes for the sender vs. recipient is well-conceived. Optionally, you can display timestamps or message statuses here if needed.
129-134
: Generic paginated response interface is a good approach.
This interface is consistent with the rest of the codebase. No issues found.
onClick={handleCreateThread} | ||
disabled={!newThreadTitle} | ||
> | ||
{t("Create")} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
{t("Create")} | |
{t("create")} |
onClick={() => setShowNewThreadForm(true)} | ||
> | ||
<Plus className="mr-2 h-4 w-4" /> | ||
{t("Create New Thread")} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
translation keys missing in en.json, needs to be added as mentioned in Merge Checklist
{t("Create New Thread")} | |
{t("create_new_thread")} |
queryFn: async ({ pageParam = 0 }) => { | ||
const response = await query(routes.notes.patient.getMessages, { | ||
pathParams: { | ||
patientId: encounter.patient.id, | ||
threadId: selectedThread!, | ||
}, | ||
queryParams: { | ||
limit: String(LIMIT), | ||
offset: String(pageParam), | ||
}, | ||
})({ signal: new AbortController().signal }); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
won't we get signal
from the queryFn
's callbacks args itself? 🤔
queryFn: async ({ pageParam = 0 }) => { | |
const response = await query(routes.notes.patient.getMessages, { | |
pathParams: { | |
patientId: encounter.patient.id, | |
threadId: selectedThread!, | |
}, | |
queryParams: { | |
limit: String(LIMIT), | |
offset: String(pageParam), | |
}, | |
})({ signal: new AbortController().signal }); | |
queryFn: async ({ pageParam = 0, signal }) => { | |
const response = await query(routes.notes.patient.getMessages, { | |
pathParams: { | |
patientId: encounter.patient.id, | |
threadId: selectedThread!, | |
}, | |
queryParams: { | |
limit: String(LIMIT), | |
offset: String(pageParam), | |
}, | |
})({ signal }); |
}) => ( | ||
<div | ||
className={`relative p-3 cursor-pointer rounded-lg transition-colors ${ | ||
isSelected ? "bg-primary/10" : "hover:bg-muted" |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
we don't have muted
color configured/defined.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice find
const UserAvatar = ({ user }: { user: Message["created_by"] }) => { | ||
const initials = user.username.charAt(0).toUpperCase(); | ||
|
||
return user.profile_picture_url ? ( | ||
<img | ||
src={user.profile_picture_url} | ||
alt={user.username} | ||
className="w-8 h-8 rounded-full object-cover" | ||
/> | ||
) : ( | ||
<div className="w-8 h-8 rounded-full bg-primary/10 flex items-center justify-center text-primary font-medium"> | ||
{initials} | ||
</div> | ||
); | ||
}; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We can reuse the existing Avatar
component right?
interface PaginatedResponse<T> { | ||
count: number; | ||
next: string | null; | ||
previous: string | null; | ||
results: T[]; | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is already defined in src/Utils/request/types.ts
, let's not redefine it
@@ -22,6 +22,8 @@ import { EncounterUpdatesTab } from "@/pages/Encounters/tabs/EncounterUpdatesTab | |||
import { Encounter } from "@/types/emr/encounter"; | |||
import { Patient } from "@/types/emr/newPatient"; | |||
|
|||
import { EncounterNotesTab } from "./tabs/EncounterNotesTab"; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
switch to absolute imports
Reminder: To add the "needs testing" label, comment "ready for testing" on this PR. |
CARE Run #4127
Run Properties:
|
Project |
CARE
|
Branch Review |
encounter-notes
|
Run status |
Failed #4127
|
Run duration | 01m 41s |
Commit |
157307f2df: Patient encounter notes
|
Committer | Bodhisha Thomas |
View all properties for this run ↗︎ |
Test results | |
---|---|
Failures |
1
|
Flaky |
0
|
Pending |
0
|
Skipped |
0
|
Passing |
2
|
View all changes introduced in this branch ↗︎ |
Tests for review
cypress/e2e/public_spec/loginpage.cy.ts • 1 failed test
Test | Artifacts | |
---|---|---|
Login Page > should successfully login with admin credentials |
Test Replay
Screenshots
|
Co-authored-by: Rithvik Nishad <[email protected]>
Co-authored-by: Rithvik Nishad <[email protected]>
There was a problem hiding this 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/types/notes/messages.ts (2)
3-9
: Consider improving type safety for message_historyThe interface looks well-structured, but the
message_history
property usingRecord<string, unknown>
could be more type-safe. Consider defining a specific type for the history entries to better document and enforce the expected structure.+interface MessageHistoryEntry { + timestamp: string; + previous_message: string; + updated_by: UserBase; +} + export interface Message { id: string; message: string; - message_history: Record<string, unknown>; + message_history: Record<string, MessageHistoryEntry>; created_by: UserBase; updated_by: UserBase; }
10-10
: Remove extra newlines at end of fileKeep only one newline at the end of the file to comply with linting rules.
} - - +🧰 Tools
🪛 eslint
[error] 10-11: Delete
⏎
(prettier/prettier)
🪛 GitHub Check: lint
[failure] 10-10:
Delete⏎
src/types/notes/threads.ts (2)
1-4
: Consider adding more thread properties for medical context.The interface structure is clean and follows TypeScript best practices. However, for a medical notes system, consider adding these essential properties:
createdAt
: Timestamp for when the thread was createdauthorId
: ID of the healthcare provider who created the threadpatientId
: Reference to the associated patientstatus
: Thread state (e.g., active, archived)lastUpdated
: Timestamp for the latest modificationHere's a suggested enhancement:
export interface Thread { id: string; title: string; + createdAt: string; + authorId: string; + patientId: string; + status: 'active' | 'archived'; + lastUpdated: string; }
5-5
: Remove extra newlines at the end of file.} - -🧰 Tools
🪛 eslint
[error] 5-6: Delete
⏎
(prettier/prettier)
🪛 GitHub Check: lint
[failure] 5-5:
Delete⏎
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
src/types/notes/messages.ts
(1 hunks)src/types/notes/threads.ts
(1 hunks)
🧰 Additional context used
🪛 GitHub Check: lint
src/types/notes/threads.ts
[failure] 5-5:
Delete ⏎
src/types/notes/messages.ts
[failure] 10-10:
Delete ⏎
@bodhisha 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! 🙌 |
Co-authored-by: Bodhisha Thomas <[email protected]> Co-authored-by: Bodhish Thomas <[email protected]>
* added patient home actions plugin hook * expose core app env in global scope * enable heatmap and fix appointments column size (#9713) * Fix: Forgot password error should be handled properly (#9707) * forgot password mutation * updated * Added no user assingned message (#9666) Co-authored-by: Rithvik Nishad <[email protected]> * Remove facility name from facility users page (#9746) * Enhance organization management by adding new organization types and updating related components. Refactor organization level retrieval to use metadata for improved localization. Remove deprecated organization levels constant and clean up unused code in various components. * Cancel button fix in Book Appointment screen (#9757) * Add public flag to facility (#9759) * Auto-Hide Sidebar on mobile (#9758) * Implement Permission Context and Update User Permissions Handling - Introduced a new PermissionContext to manage user permissions and super admin status across the application. - Updated AppRouter to utilize PermissionProvider for managing permissions. - Changed UserModel to store permissions as strings instead of objects. - Refactored OrganizationFacilities and OrganizationPatients components to use updated permission checks and organization identifiers. - Enhanced OrganizationLayout to conditionally render navigation items based on user permissions. This commit improves the permission management system and ensures consistent handling of user permissions throughout the application. * Replaced ButtonV2's with Button in entire codebase (#9736) * fixes overlapping text (#9767) * Care Loading icon in organization and facility users (#9723) * Clean up facility search in index * Add searchPostFix prop to ValueSetSelect and related components - Introduced a new `searchPostFix` prop in `ValueSetSelect` to allow appending a suffix to the search query. - Updated `MedicationRequestQuestion` and `MedicationStatementQuestion` components to utilize the `searchPostFix` prop with a default value of " clinical drug". - This change enhances search functionality by providing more context in search queries. * Clean up patient login * Fix cancel button in update encounter form (#9772) * disabled image build and deploy for care stagin (#9779) * Bump @tanstack/react-query-devtools from 5.62.11 to 5.62.15 (#9785) Bumps [@tanstack/react-query-devtools](https://github.com/TanStack/query/tree/HEAD/packages/react-query-devtools) from 5.62.11 to 5.62.15. - [Release notes](https://github.com/TanStack/query/releases) - [Commits](https://github.com/TanStack/query/commits/HEAD/packages/react-query-devtools) --- updated-dependencies: - dependency-name: "@tanstack/react-query-devtools" dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * Patient encounter notes (#9617) Co-authored-by: Bodhisha Thomas <[email protected]> Co-authored-by: Bodhish Thomas <[email protected]> * Fix Auto hide without hook (#9780) * Enhance encounter data handling by adding encounterId prop across multiple components (#9793) * Disable encounter create during save (#9795) * Enhance encounter data handling by adding encounterId prop across multiple components - Added `encounterId` prop to `ObservationChart`, `ObservationHistoryTable`, `ObservationsList`, `QuestionnaireResponsesList`, and `StructuredResponseView` components to improve data fetching and display related to specific encounters. - Updated query parameters in API calls to include `encounterId` for better data context. - Refactored `EncounterPlotsTab` and `EncounterUpdatesTab` to pass the new `encounterId` prop, ensuring consistent data handling across the application. This change improves the overall functionality and user experience by ensuring that encounter-specific data is accurately retrieved and displayed. * fix: disable encounter create button during save to prevent multiple submissions #9794 * Refactor PatientHome and EncounterShow components; update FacilityOrganizationSelector labels - Removed unused state and commented-out code in PatientHome for improved readability. - Enhanced patient data display by updating the last updated and created by fields to use `updated_by` instead of `modified_by`. - Updated date formatting functions to ensure consistent display of patient and encounter dates. - Changed labels in FacilityOrganizationSelector from "Organization" to "Select Department" and adjusted related text for clarity. These changes streamline the codebase and improve user interface clarity. * Partial Cleanup Public Router | Public Pages Header * Rewire enableWhen * Remove localStorage watch from AuthUserProvider * Implement immediate redirection after successful login * Fix: Update the value to Home Health in Create Encounter Form (#9806) * Update Questionnaire Styling * Update Questionnaire Styling * Update Auth Handling * Cleanup Patient Auth State * Handle Null created_by * Types for null patient.created_by * Bump i18next from 24.2.0 to 24.2.1 (#9818) Bumps [i18next](https://github.com/i18next/i18next) from 24.2.0 to 24.2.1. - [Release notes](https://github.com/i18next/i18next/releases) - [Changelog](https://github.com/i18next/i18next/blob/master/CHANGELOG.md) - [Commits](i18next/i18next@v24.2.0...v24.2.1) --- updated-dependencies: - dependency-name: i18next dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * Bump input-otp from 1.4.1 to 1.4.2 (#9819) Bumps [input-otp](https://github.com/guilhermerodz/input-otp/tree/HEAD/packages/input-otp) from 1.4.1 to 1.4.2. - [Changelog](https://github.com/guilhermerodz/input-otp/blob/master/CHANGELOG.md) - [Commits](https://github.com/guilhermerodz/input-otp/commits/HEAD/packages/input-otp) --- updated-dependencies: - dependency-name: input-otp dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * Rename dosage field to frequency in ongoing medication form (#9811) * feat: Add new fields to Question interface (#9824) * Cleanup Labels in Questionnaire * Allergy intolerance Cleanup (#9812) * cleanup CarePatientTokenKey (#9827) * changed the facility name (#9829) * Cleanup localStorage Management in Patient Login; Fix Time in Confirmation * Use PatientContext from Router when required * Cleanup Navbars * AllergyList: Add i18n; map key * Add Actions in Encounter * Remove Shortcut for Nursing Care * Update Crowdin configuration file * Update Crowdin configuration file * Fix: Replace InputWithError and InputErrors components with ShadCN’s components directly. (#9847) * fixed eslint errors caused while creating plugin map * refactored the patient registration form using react hook form * added patient registration form plugin hook * updated validations * added patient info card actions plugin hook * set same_phone_number to true by default in patient registration * set same_address to true and same_phone_number to false by default in patient registration --------- Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: Mohammed Nihal <[email protected]>
Proposed Changes
@ohcnetwork/care-fe-code-reviewers
Merge Checklist
Summary by CodeRabbit
Release Notes
New Features
Localization
These release notes highlight the addition of a comprehensive notes system for patient encounters, allowing healthcare professionals to create, view, and manage discussion threads and messages directly within the patient's encounter view.