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

Tailwinds Patient Home (Confirm Transfer Complete Dialog) #5662

Merged
merged 1 commit into from
Jun 21, 2023
Merged

Tailwinds Patient Home (Confirm Transfer Complete Dialog) #5662

Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
123 changes: 32 additions & 91 deletions src/Components/Patient/PatientHome.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
import { CircularProgress } from "@material-ui/core";
import { navigate } from "raviger";
import moment from "moment";
import React, { useCallback, useEffect, useState } from "react";
Expand All @@ -23,21 +22,19 @@ import { ConsultationCard } from "../Facility/ConsultationCard";
import { ConsultationModel } from "../Facility/models";
import { PatientModel, SampleTestModel } from "./models";
import { SampleTestCard } from "./SampleTestCard";
import Dialog from "@material-ui/core/Dialog";
import DialogActions from "@material-ui/core/DialogActions";
import DialogTitle from "@material-ui/core/DialogTitle";
import { LegacyErrorHelperText } from "../Common/HelperInputFields";
import Modal from "@material-ui/core/Modal";
import Chip from "../../CAREUI/display/Chip";
import { classNames, formatDate } from "../../Utils/utils";
import ButtonV2 from "../Common/components/ButtonV2";
import { NonReadOnlyUsers } from "../../Utils/AuthorizeFor";
import RelativeDateUserMention from "../Common/RelativeDateUserMention";
import CareIcon from "../../CAREUI/icons/CareIcon";
import { useTranslation } from "react-i18next";
import CircularProgress from "../Common/components/CircularProgress";
import Page from "../Common/components/Page";
import ConfirmDialogV2 from "../Common/ConfirmDialogV2";
import { FieldErrorText } from "../Form/FormFields/FormField";

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

export const PatientHome = (props: any) => {
const { facilityId, id } = props;
Expand Down Expand Up @@ -339,7 +336,7 @@ export const PatientHome = (props: any) => {
let consultationList, sampleList;

if (isConsultationLoading) {
consultationList = <CircularProgress size={20} />;
consultationList = <CircularProgress />;
} else if (consultationListData.length === 0) {
consultationList = (
<div>
Expand All @@ -360,7 +357,7 @@ export const PatientHome = (props: any) => {
}

if (isSampleLoading) {
sampleList = <CircularProgress size={20} />;
sampleList = <CircularProgress />;
} else if (sampleListData.length === 0) {
sampleList = (
<div>
Expand Down Expand Up @@ -394,7 +391,14 @@ export const PatientHome = (props: any) => {
};

return (
<div className="px-2 pb-2">
<Page
title={"Patient Details"}
crumbsReplacements={{
[facilityId]: { name: patientData?.facility_object?.name },
[id]: { name: patientData?.name },
}}
backUrl={facilityId ? `/facility/${facilityId}/patients` : "/patients"}
>
{showAlertMessage.show && (
<AlertDialog
title={showAlertMessage.title}
Expand All @@ -404,18 +408,7 @@ export const PatientHome = (props: any) => {
/>
)}

<div id="revamp">
<PageTitle
title={"Patient Details"}
crumbsReplacements={{
[facilityId]: { name: patientData?.facility_object?.name },
[id]: { name: patientData?.name },
}}
backUrl={
facilityId ? `/facility/${facilityId}/patients` : "/patients"
}
/>

<div>
<div className="relative mt-2">
<div className="max-w-screen-xl mx-auto py-3 px-3 sm:px-6 lg:px-8">
<div className="md:flex">
Expand Down Expand Up @@ -959,55 +952,19 @@ export const PatientHome = (props: any) => {
>
{t("transfer_to_receiving_facility")}
</ButtonV2>
<Modal
open={modalFor === shift.external_id}
<ConfirmDialogV2
title="Confirm Transfer Complete"
description="Are you sure you want to mark this transfer as complete? The Origin facility will no longer have access to this patient"
show={modalFor === shift.external_id}
action="Confirm"
onClose={() =>
setModalFor({
externalId: undefined,
loading: false,
})
}
>
<div className="h-screen w-full absolute flex items-center justify-center bg-modal">
<div className="bg-white rounded shadow p-8 m-4 max-w-sm max-h-full text-center">
<div className="mb-4">
<h1 className="text-2xl">
Confirm Transfer Complete!
</h1>
</div>
<div className="mb-8">
<p>
Are you sure you want to mark this
transfer as complete? The Origin facility
will no longer have access to this patient
</p>
</div>
<div className="flex gap-2 justify-center">
<ButtonV2
size="small"
className="w-full"
onClick={() => {
setModalFor({
externalId: undefined,
loading: false,
});
}}
>
Cancel
</ButtonV2>
<ButtonV2
size="small"
className="w-full"
onClick={() =>
handleTransferComplete(shift)
}
>
Confirm
</ButtonV2>
</div>
</div>
</div>
</Modal>
onConfirm={() => handleTransferComplete(shift)}
/>
</div>
)}
</div>
Expand Down Expand Up @@ -1479,16 +1436,11 @@ export const PatientHome = (props: any) => {
</section>
</div>

<Dialog
maxWidth={"md"}
open={openAssignVolunteerDialog}
<ConfirmDialogV2
title={`Assign a volunteer to ${patientData.name}`}
show={openAssignVolunteerDialog}
onClose={() => setOpenAssignVolunteerDialog(false)}
>
<div className="mx-10 my-5">
<DialogTitle id="form-dialog-title">
Assign a volunteer to {patientData.name}
</DialogTitle>

description={
<div>
<OnlineUsersSelect
userId={assignedVolunteerObject?.id || patientData.assigned_to}
Expand All @@ -1497,23 +1449,12 @@ export const PatientHome = (props: any) => {
user_type={"Volunteer"}
outline={false}
/>
<LegacyErrorHelperText error={errors.assignedVolunteer} />
<FieldErrorText error={errors.assignedVolunteer} />
</div>

<DialogActions>
<ButtonV2
variant="secondary"
onClick={() => {
handleVolunteerSelect(patientData.assigned_to_object);
setOpenAssignVolunteerDialog(false);
}}
>
Cancel
</ButtonV2>
<ButtonV2 onClick={handleAssignedVolunteer}>Submit</ButtonV2>
</DialogActions>
</div>
</Dialog>
}
action="Assign"
onConfirm={handleAssignedVolunteer}
/>

<div>
<h2 className="font-semibold text-2xl leading-tight ml-0 mt-9">
Expand Down Expand Up @@ -1548,6 +1489,6 @@ export const PatientHome = (props: any) => {
</div>
)}
</div>
</div>
</Page>
);
};