Skip to content

Commit

Permalink
Add View Consultation Button (ohcnetwork#9296)
Browse files Browse the repository at this point in the history
  • Loading branch information
@JavidSumra
JavidSumra authored Dec 23, 2024
1 parent 650b196 commit 8434b42
Show file tree
Hide file tree
Showing 3 changed files with 93 additions and 51 deletions.
1 change: 1 addition & 0 deletions public/locale/en.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1540,6 +1540,7 @@
"view_all_details": "View All Details",
"view_asset": "View Assets",
"view_cns": "View CNS",
"view_consultation": "View Latest Encounter",
"view_consultation_and_log_updates": "View Consultation / Log Updates",
"view_details": "View Details",
"view_facility": "View Facility",
Expand Down
19 changes: 19 additions & 0 deletions src/components/Common/AuthorizedButton.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
import { Button, ButtonProps } from "@headlessui/react";

import AuthorizedChild from "@/CAREUI/misc/AuthorizedChild";

import { AuthorizedElementProps } from "@/Utils/AuthorizeFor";

export const AuthorizedButton: React.FC<
AuthorizedElementProps & ButtonProps
> = ({ authorizeFor = () => true, ...props }) => {
return (
<AuthorizedChild authorizeFor={authorizeFor}>
{({ isAuthorized }) => (
<Button {...props} disabled={props.disabled || !isAuthorized}>
{props.children}
</Button>
)}
</AuthorizedChild>
);
};
124 changes: 73 additions & 51 deletions src/components/Patient/PatientHome.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,19 +5,11 @@ import { useTranslation } from "react-i18next";
import Chip from "@/CAREUI/display/Chip";
import CareIcon from "@/CAREUI/icons/CareIcon";

import { Avatar } from "@/components/Common/Avatar";
import ButtonV2 from "@/components/Common/ButtonV2";
import { Button } from "@/components/ui/button";

import { AuthorizedButton } from "@/components/Common/AuthorizedButton";
import ConfirmDialog from "@/components/Common/ConfirmDialog";
import Loading from "@/components/Common/Loading";
import Page from "@/components/Common/Page";
import UserAutocomplete from "@/components/Common/UserAutocompleteFormField";
import { patientTabs } from "@/components/Patient/PatientDetailsTab";
import { isPatientMandatoryDataFilled } from "@/components/Patient/Utils";
import {
AssignedToObjectModel,
PatientModel,
} from "@/components/Patient/models";
import { SkillModel, UserBareMinimum } from "@/components/Users/models";

import useAuthUser from "@/hooks/useAuthUser";

Expand All @@ -34,6 +26,7 @@ import dayjs from "@/Utils/dayjs";
import routes from "@/Utils/request/api";
import request from "@/Utils/request/request";
import useTanStackQueryInstead from "@/Utils/request/useQuery";

import {
formatDateTime,
formatName,
Expand All @@ -42,7 +35,14 @@ import {
isAntenatal,
isPostPartum,
relativeDate,
} from "@/Utils/utils";
} from "../../Utils/utils";
import { Avatar } from "../Common/Avatar";
import Loading from "../Common/Loading";
import Page from "../Common/Page";
import { SkillModel, UserBareMinimum } from "../Users/models";
import { patientTabs } from "./PatientDetailsTab";
import { isPatientMandatoryDataFilled } from "./Utils";
import { AssignedToObjectModel, PatientModel } from "./models";

export const parseOccupation = (occupation: string | undefined) => {
return OCCUPATION_TYPES.find((i) => i.value === occupation)?.text;
Expand Down Expand Up @@ -218,29 +218,55 @@ export const PatientHome = (props: {
<div className="h-full space-y-2">
<div className="space-y-3 border-b border-dashed text-left text-lg font-semibold text-secondary-900">
<div>
{patientData?.is_active &&
(!patientData?.last_consultation ||
patientData?.last_consultation?.discharge_date) && (
<div>
<ButtonV2
id="create-consultation"
className="w-full"
size="default"
onClick={() =>
navigate(
`/facility/${patientData?.facility}/patient/${id}/consultation`,
)
}
>
<span className="flex w-full items-center justify-start gap-2">
<CareIcon
icon="l-chat-bubble-user"
className="text-xl"
/>
{t("add_consultation")}
</span>
</ButtonV2>
</div>
{facilityId ===
patientData.facility_object?.id.toString() &&
patientData?.is_active && (
<>
{patientData?.last_consultation &&
!patientData?.last_consultation.discharge_date ? (
<div>
<Button
variant="primary"
className="w-full"
size="default"
onClick={() =>
navigate(
`/facility/${patientData.facility}/patient/${id}/consultation/${patientData.last_consultation?.id}`,
)
}
>
<span className="flex w-full items-center justify-start gap-2">
<CareIcon
icon="l-chat-bubble-user"
className="text-xl"
/>
{t("view_consultation")}
</span>
</Button>
</div>
) : (
<div>
<Button
variant="primary"
className="w-full"
size="default"
onClick={() =>
navigate(
`/facility/${patientData?.facility}/patient/${id}/consultation`,
)
}
>
<span className="flex w-full items-center justify-start gap-2">
<CareIcon
icon="l-chat-bubble-user"
className="text-xl"
/>
{t("add_consultation")}
</span>
</Button>
</div>
)}
</>
)}
</div>
</div>
Expand Down Expand Up @@ -366,7 +392,7 @@ export const PatientHome = (props: {
className="tooltip-text tooltip-bottom flex flex-col text-xs font-medium"
role="tooltip"
>
{skillsQuery.data?.results.map((skill) => (
{skillsQuery.data?.results.map((skill: any) => (
<li key={skill.skill_object.id}>
{skill.skill_object.name}
</li>
Expand Down Expand Up @@ -463,9 +489,8 @@ export const PatientHome = (props: {
<div className="mt-2 h-full space-y-2">
<div className="space-y-3 border-b border-dashed text-left text-lg font-semibold text-secondary-900">
<div>
<ButtonV2
<Button
className="w-full bg-white font-semibold text-green-800 hover:bg-secondary-200"
size="large"
onClick={() =>
navigate(`/patient/${id}/investigation_reports`)
}
Expand All @@ -477,13 +502,12 @@ export const PatientHome = (props: {
/>
{t("investigations_summary")}
</span>
</ButtonV2>
</Button>
</div>
<div>
<ButtonV2
<Button
className="w-full bg-white font-semibold text-green-800 hover:bg-secondary-200"
id="upload-patient-files"
size="large"
onClick={() =>
navigate(
`/facility/${patientData?.facility}/patient/${id}/files`,
Expand All @@ -494,34 +518,32 @@ export const PatientHome = (props: {
<CareIcon icon="l-file-upload" className="text-xl" />
{t("view_update_patient_files")}
</span>
</ButtonV2>
</Button>
</div>

{NonReadOnlyUsers && (
{NonReadOnlyUsers(authUser.user_type) && (
<div>
<ButtonV2
<AuthorizedButton
id="assign-volunteer"
onClick={() => setOpenAssignVolunteerDialog(true)}
disabled={false}
authorizeFor={NonReadOnlyUsers}
className="w-full bg-white font-semibold text-green-800 hover:bg-secondary-200"
size="large"
>
<span className="flex w-full items-center justify-start gap-2">
<CareIcon icon="l-users-alt" className="text-lg" />{" "}
{patientData.assigned_to
? t("update_volunteer")
: t("assign_to_volunteer")}
</span>
</ButtonV2>
</AuthorizedButton>
</div>
)}

<div>
<ButtonV2
<AuthorizedButton
id="patient-allow-transfer"
className="flex w-full flex-row bg-white font-semibold text-green-800 hover:bg-secondary-200"
size="large"
disabled={
!patientData.last_consultation?.id ||
!patientData.is_active
Expand All @@ -542,7 +564,7 @@ export const PatientHome = (props: {
? t("disable_transfer")
: t("allow_transfer")}
</span>
</ButtonV2>
</AuthorizedButton>
</div>
</div>
</div>
Expand Down Expand Up @@ -661,15 +683,15 @@ export const PatientHome = (props: {
{patientData.last_consultation?.new_discharge_reason ===
DISCHARGE_REASONS.find((i) => i.text == "Expired")?.id && (
<div>
<ButtonV2
<Button
id="death-report"
className="my-2 w-full"
name="death_report"
onClick={() => navigate(`/death_report/${id}`)}
>
<CareIcon icon="l-file-download" className="text-lg" />
{t("death_report")}
</ButtonV2>
</Button>
</div>
)}
</div>
Expand Down

0 comments on commit 8434b42

Please sign in to comment.