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

Add edit functionality to patient notes #5126

Closed
wants to merge 6 commits into from
Closed

Add edit functionality to patient notes #5126

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
e0f325c
feat(PatientNotes): add edit functionality to patient notes
Ashesh3 Mar 18, 2023
7767d56
Merge branch 'develop' into issue-4884
Ashesh3 Apr 18, 2023
3dbbcc0
Update logic
Ashesh3 Apr 18, 2023
f28ea12
Merge branch 'develop' into issue-4884
Ashesh3 Jul 21, 2023
36101d2
use edit_window_seconds
Ashesh3 Jul 21, 2023
011135d
Merge branch 'develop' into issue-4884
Ashesh3 Jul 21, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion src/Components/Facility/ConsultationForm.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,6 @@ import { DraftSection, useAutoSaveReducer } from "../../Utils/AutoSave";
import { FormAction } from "../Form/Utils";
import UserAutocompleteFormField from "../Common/UserAutocompleteFormField";


const Loading = loadable(() => import("../Common/Loading"));
const PageTitle = loadable(() => import("../Common/PageTitle"));

Expand Down
119 changes: 107 additions & 12 deletions src/Components/Patient/PatientNotes.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import {
getPatientNotes,
addPatientNote,
getPatient,
updatePatientNote,
} from "../../Redux/actions";
import * as Notification from "../../Utils/Notifications.js";
import PageTitle from "../Common/PageTitle";
Expand All @@ -13,7 +14,9 @@ import { navigate } from "raviger";
import { RESULTS_PER_PAGE_LIMIT } from "../../Common/constants";
import Loading from "../Common/Loading";
import { formatDate } from "../../Utils/utils";
import CareIcon from "../../CAREUI/icons/CareIcon";
import ButtonV2 from "../Common/components/ButtonV2";
import moment from "moment";
import { NonReadOnlyUsers } from "../../Utils/AuthorizeFor";

interface PatientNotesProps {
Expand All @@ -34,6 +37,11 @@ const PatientNotes = (props: PatientNotesProps) => {
const [facilityName, setFacilityName] = useState("");
const [patientName, setPatientName] = useState("");
const [patientActive, setPatientActive] = useState(true);
const [editMode, setEditMode] = useState({
edit: false,
id: "",
text: "",
});

const fetchData = useCallback(
async (page = 1, status: statusType = { aborted: false }) => {
Expand Down Expand Up @@ -84,23 +92,44 @@ const PatientNotes = (props: PatientNotesProps) => {
fetchData(page);
}

const onAddNote = () => {
const payload = {
note: noteField,
};
if (!/\S+/.test(noteField)) {
const validate = (note: string) => {
if (!/\S+/.test(note)) {
Notification.Error({
msg: "Note Should Contain At Least 1 Character",
});
return;
return false;
}
return true;
};

const onAddNote = () => {
const payload = {
note: noteField,
};
if (!validate(noteField)) return;
dispatch(addPatientNote(props.patientId, payload)).then(() => {
Notification.Success({ msg: "Note added successfully" });
setNoteField("");
fetchData();
});
};

const updateNote = (id: string, note: string) => {
const payload = {
note,
};
if (!validate(note)) return false;
dispatch(updatePatientNote(props.patientId, id, payload)).then(
(res: any) => {
if (res && res.status === 200) {
Notification.Success({ msg: "Note updated successfully" });
fetchData();
}
}
);
return true;
};

if (isLoading) {
return <Loading />;
}
Expand Down Expand Up @@ -141,12 +170,33 @@ const PatientNotes = (props: PatientNotesProps) => {
key={note.id}
className="flex p-4 bg-white rounded-lg text-gray-800 mt-4 flex-col w-full border border-gray-300"
>
<span className="whitespace-pre-wrap break-words">
{note.note}
</span>
<div className="mt-3">
<span className="text-xs text-gray-500">
{formatDate(note.created_date) || "-"}
{editMode.edit && editMode.id === note.id ? (
<div className="flex flex-col">
<textarea
rows={2}
placeholder="Type your Note"
className="border border-gray-500 rounded-lg p-4 focus:outline-none focus:ring-primary-500 focus:border-primary-500"
onChange={(e) =>
setEditMode({ ...editMode, text: e.target.value })
}
defaultValue={note.note}
/>
</div>
) : (
<span className="md:whitespace-pre">{note.note}</span>
)}
<div className="my-3">
<span className="text-xs text-gray-500 flex flex-col">
{note.modified_date &&
moment(note.created_date).format("YYYY-MM-DD HH:mm:ss") !=
moment(note.modified_date).format(
"YYYY-MM-DD HH:mm:ss"
) && (
<div>Edited: {formatDate(note.modified_date)} </div>
)}
{note.created_date && (
<div>Sent: {formatDate(note.created_date) || "-"}</div>
)}
</span>
</div>

Expand All @@ -172,6 +222,51 @@ const PatientNotes = (props: PatientNotesProps) => {
{note.facility?.name || "Unknown"}
</span>
</div>
{editMode.edit && editMode.id === note.id ? (
<div className="flex flex-col ml-auto gap-2 md:flex-row">
<ButtonV2
onClick={() => {
updateNote(note.id, editMode.text) &&
setEditMode({ edit: false, id: "", text: "" });
}}
disabled={!patientActive}
>
Update
</ButtonV2>
<ButtonV2
onClick={() =>
setEditMode({ edit: false, id: "", text: "" })
}
variant="secondary"
disabled={!patientActive}
>
Cancel
</ButtonV2>
</div>
) : (
<>
{patientActive &&
moment() <=
moment(note.created_date).add(
note.edit_window_seconds,
"seconds"
) && (
<ButtonV2
className="flex gap-2 ml-auto py-2 px-3 w-full md:w-fit"
onClick={() =>
setEditMode({
edit: true,
id: note.id,
text: note.note,
})
}
>
<CareIcon className="care-l-pen h-4 mr-1" />
Edit
</ButtonV2>
)}
</>
)}
</div>
</div>
))
Expand Down
7 changes: 7 additions & 0 deletions src/Redux/actions.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -433,6 +433,13 @@ export const getPatientNotes = (
export const addPatientNote = (patientId: string, params: object) => {
return fireRequest("addPatientNote", [], params, { patientId });
};
export const updatePatientNote = (
patientId: string,
noteId: string,
params: object
) => {
return fireRequest("updatePatientNote", [], params, { patientId, noteId });
};

export const getStates = () => {
return fireRequest("statesList", []);
Expand Down
4 changes: 4 additions & 0 deletions src/Redux/api.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -456,6 +456,10 @@ const routes: Routes = {
path: "/api/v1/patient/{patientId}/notes/",
method: "POST",
},
updatePatientNote: {
path: "/api/v1/patient/{patientId}/notes/{noteId}/",
method: "PUT",
},
sampleTestList: {
path: "/api/v1/patient/{patientId}/test_sample/",
},
Expand Down
Loading