Skip to content

Commit

Permalink
#1259 | Improve DEA subject profile load speed
Browse files Browse the repository at this point in the history
  • Loading branch information
@1t5j0y
1t5j0y committed Jul 9, 2024
1 parent 2aac895 commit 20705e4
Show file tree
Hide file tree
Showing 3 changed files with 45 additions and 107 deletions.
35 changes: 13 additions & 22 deletions src/dataEntryApp/sagas/subjectDashboardSaga.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,21 +7,12 @@ import {
setVoidServerError,
setSubjectDashboardLoaded
} from "../reducers/subjectDashboardReducer";
import {
mapProfile,
mapGroupMembers,
mapProgram,
mapGeneral
} from "../../common/subjectModelMapper";
import { mapProfile, mapGroupMembers, mapProgram, mapGeneral } from "../../common/subjectModelMapper";
import api from "../api";
import commonApi from "../../common/service";
import { setLoad } from "../reducers/loadReducer";
import { selectSubjectProfile, selectOperationalModules } from "./selectors";
import {
getRegistrationForm,
selectRegistrationForm,
setRegistrationForm
} from "../reducers/registrationReducer";
import { getRegistrationForm, selectRegistrationForm, setRegistrationForm } from "../reducers/registrationReducer";
import { filter, isEmpty, map, includes, get } from "lodash";
import { setSubjectProgram } from "../reducers/programSubjectDashboardReducer";
import { setSubjectGeneral } from "../reducers/generalSubjectDashboardReducer";
Expand Down Expand Up @@ -51,9 +42,11 @@ export function* loadSubjectDashboardWatcher() {

export function* loadSubjectDashboardWorker({ subjectUUID }) {
yield put.resolve(setSubjectDashboardLoaded(false));
yield call(subjectProfileFetchWorker, { subjectUUID });
yield call(subjectGeneralFetchWorker, { subjectGeneralUUID: subjectUUID });
yield call(subjectProgramFetchWorker, { subjectProgramUUID: subjectUUID });
yield all([
call(subjectProfileFetchWorker, { subjectUUID }),
call(subjectGeneralFetchWorker, { subjectGeneralUUID: subjectUUID }),
call(subjectProgramFetchWorker, { subjectProgramUUID: subjectUUID })
]);
yield put.resolve(setSubjectDashboardLoaded(true));
}

Expand All @@ -65,8 +58,10 @@ export function* subjectProfileFetchWorker({ subjectUUID }) {
yield put.resolve(setLoad(false));
yield put.resolve(setRegistrationForm());
yield put.resolve(setSubjectProfile());
const organisationConfigs = yield call(commonApi.fetchOrganisationConfigs);
const subjectProfileJson = yield call(api.fetchSubjectProfile, subjectUUID);
const [organisationConfigs, subjectProfileJson] = yield all([
call(commonApi.fetchOrganisationConfigs),
call(api.fetchSubjectProfile, subjectUUID)
]);
const subjectProfile = mapProfile(subjectProfileJson);
const subjectType = subjectProfile.subjectType;
const operationalModules = yield select(selectOperationalModules);
Expand All @@ -76,17 +71,13 @@ export function* subjectProfileFetchWorker({ subjectUUID }) {
filter(
operationalModules.formMappings,
({ subjectTypeUUID, programUUID }) =>
subjectTypeUUID === subjectType.uuid &&
!isEmpty(programUUID) &&
includes(programUUIDs, programUUID)
subjectTypeUUID === subjectType.uuid && !isEmpty(programUUID) && includes(programUUIDs, programUUID)
).length > 0;
const hasAnyGeneralEncounters =
filter(
operationalModules.formMappings,
({ subjectTypeUUID, formType, encounterTypeUUID }) =>
subjectTypeUUID === subjectType.uuid &&
formType === "Encounter" &&
includes(encounterTypeUUIDs, encounterTypeUUID)
subjectTypeUUID === subjectType.uuid && formType === "Encounter" && includes(encounterTypeUUIDs, encounterTypeUUID)
).length > 0;
const showGeneralTab = showProgramTab && hasAnyGeneralEncounters;
const displayGeneralInfoInProfileTab = hasAnyGeneralEncounters && !showGeneralTab;
Expand Down
61 changes: 16 additions & 45 deletions src/dataEntryApp/views/subjectDashBoard/components/ProfileDetails.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -124,15 +124,7 @@ const useStyles = makeStyles(theme => ({
}
}));

const ProfileDetails = ({
profileDetails,
getPrograms,
programs,
subjectUuid,
match,
load,
tabsStatus
}) => {
const ProfileDetails = ({ profileDetails, getPrograms, programs, subjectUuid, match, load, tabsStatus, organisationConfigs }) => {
const classes = useStyles();
const [selectedProgram, setSelectedProgram] = React.useState("");
const [openComment, setOpenComment] = React.useState(false);
Expand Down Expand Up @@ -162,11 +154,7 @@ const ProfileDetails = ({
<DialogContent>
<form className={classes.form} noValidate>
<FormControl className={classes.formControl}>
<InputLabel
shrink
id="demo-simple-select-placeholder-label-label"
className={errorStatus ? classes.errorText : ""}
>
<InputLabel shrink id="demo-simple-select-placeholder-label-label" className={errorStatus ? classes.errorText : ""}>
{t("Program")}
</InputLabel>

Expand Down Expand Up @@ -195,8 +183,7 @@ const ProfileDetails = ({
</DialogContent>
);

const allowEnrolment =
tabsStatus && tabsStatus.showProgramTab && !profileDetails.voided && isMultipleProgramEligible;
const allowEnrolment = tabsStatus && tabsStatus.showProgramTab && !profileDetails.voided && isMultipleProgramEligible;

return (
<div className={classes.tableView}>
Expand All @@ -222,34 +209,22 @@ const ProfileDetails = ({
<Table aria-label="caption table" className={classes.tableContainer}>
<TableHead>
<TableRow className={classes.tableHeader}>
{profileDetails.subjectType.isPerson() && (
<TableCell className={classes.tableCell}>{t("gender")}</TableCell>
)}
{profileDetails.subjectType.isPerson() && (
<TableCell className={classes.tableCell}>{t("age")}</TableCell>
)}
{profileDetails.lowestAddressLevel.titleLineage && (
<TableCell className={classes.tableCell}>{t("Address")}</TableCell>
)}
{profileDetails.subjectType.isPerson() && <TableCell className={classes.tableCell}>{t("gender")}</TableCell>}
{profileDetails.subjectType.isPerson() && <TableCell className={classes.tableCell}>{t("age")}</TableCell>}
{profileDetails.lowestAddressLevel.titleLineage && <TableCell className={classes.tableCell}>{t("Address")}</TableCell>}
</TableRow>
</TableHead>
<TableBody>
<TableRow>
{profileDetails.subjectType.isPerson() && (
<TableCell className={classes.tableCellDetails}>
{t(profileDetails.gender.name)}
</TableCell>
<TableCell className={classes.tableCellDetails}>{t(profileDetails.gender.name)}</TableCell>
)}
{profileDetails.subjectType.isPerson() && (
<TableCell className={classes.tableCellDetails}>
{profileDetails.dateOfBirth
? AgeUtil.getDisplayAge(profileDetails.dateOfBirth, i18n)
: "-"}
{profileDetails.dateOfBirth ? AgeUtil.getDisplayAge(profileDetails.dateOfBirth, i18n) : "-"}
</TableCell>
)}
<TableCell className={classes.tableCellDetails}>
{profileDetails.lowestAddressLevel.titleLineage}
</TableCell>
<TableCell className={classes.tableCellDetails}>{profileDetails.lowestAddressLevel.titleLineage}</TableCell>
</TableRow>
</TableBody>
</Table>
Expand All @@ -261,6 +236,7 @@ const ProfileDetails = ({
typeUUID={profileDetails.subjectType.uuid}
typeName={profileDetails.subjectType.name}
scopeType={extensionScopeTypes.subjectDashboard}
configExtensions={get(organisationConfigs, "organisationConfig.extensions")}
/>
<Grid item>
{enableComment && (
Expand Down Expand Up @@ -312,17 +288,11 @@ const ProfileDetails = ({
) : (
!isEmpty(programs) && (
<Link
to={`/app/subject/enrol?uuid=${subjectUuid}&programName=${
programs[0].name
}&formType=ProgramEnrolment&subjectTypeName=${profileDetails.subjectType.name}`}
to={`/app/subject/enrol?uuid=${subjectUuid}&programName=${programs[0].name}&formType=ProgramEnrolment&subjectTypeName=${
profileDetails.subjectType.name
}`}
>
<Fab
id={programs[0].name}
className={classes.enrollButtonStyle}
variant="extended"
color="primary"
aria-label="add"
>
<Fab id={programs[0].name} className={classes.enrollButtonStyle} variant="extended" color="primary" aria-label="add">
{t(`Enrol in ${programs[0].name}`)}
</Fab>
</Link>
Expand All @@ -338,7 +308,8 @@ const ProfileDetails = ({
const mapStateToProps = state => ({
programs: state.dataEntry.programs ? state.dataEntry.programs.programs : "",
load: state.dataEntry.loadReducer.load,
tabsStatus: state.dataEntry.subjectProfile.tabsStatus
tabsStatus: state.dataEntry.subjectProfile.tabsStatus,
organisationConfigs: state.dataEntry.metadata.organisationConfigs
});

const mapDispatchToProps = {
Expand Down
56 changes: 16 additions & 40 deletions src/dataEntryApp/views/subjectDashBoard/components/subjectDashboardProgramView.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,18 +14,10 @@ import { connect, useDispatch, useSelector } from "react-redux";
import { withParams } from "../../../../common/components/utils";
import { getProgramEnrolmentForm } from "../../../reducers/programSubjectDashboardReducer";
import { filter, get, isEmpty, isNil } from "lodash";
import {
clearVoidServerError,
voidProgramEncounter,
voidProgramEnrolment
} from "../../../reducers/subjectDashboardReducer";
import { clearVoidServerError, voidProgramEncounter, voidProgramEnrolment } from "../../../reducers/subjectDashboardReducer";
import ConfirmDialog from "../../../components/ConfirmDialog";
import MessageDialog from "../../../components/MessageDialog";
import {
fetchProgramSummary,
selectFetchingRulesResponse,
selectProgramSummary
} from "../../../reducers/serverSideRulesReducer";
import { fetchProgramSummary, selectFetchingRulesResponse, selectProgramSummary } from "../../../reducers/serverSideRulesReducer";
import { RuleSummary } from "./RuleSummary";
import { extensionScopeTypes } from "../../../../formDesigner/components/Extensions/ExtensionReducer";
import { ExtensionOption } from "./extension/ExtensionOption";
Expand Down Expand Up @@ -68,8 +60,7 @@ const useStyles = makeStyles(theme => ({
expansionPanel: {
marginBottom: "11px",
borderRadius: "5px",
boxShadow:
"0px 0px 3px 0px rgba(0,0,0,0.4), 0px 1px 1px 0px rgba(0,0,0,0.14), 0px 2px 1px -1px rgba(0,0,0,0.12)"
boxShadow: "0px 0px 3px 0px rgba(0,0,0,0.4), 0px 1px 1px 0px rgba(0,0,0,0.14), 0px 2px 1px -1px rgba(0,0,0,0.12)"
},
paper: {
textAlign: "left",
Expand Down Expand Up @@ -147,16 +138,13 @@ const ProgramView = ({
voidError,
clearVoidServerError,
voidProgramEnrolment,
voidProgramEncounter
voidProgramEncounter,
organisationConfigs
}) => {
React.useEffect(() => {
const formType = programData.programExitDateTime ? "ProgramExit" : "ProgramEnrolment";
getProgramEnrolmentForm(
subjectProfile.subjectType.name,
programData.program.operationalProgramName,
formType
);
}, [programData]);
getProgramEnrolmentForm(subjectProfile.subjectType.name, programData.program.operationalProgramName, formType);
}, [programData.program.operationalProgramName]);

const classes = useStyles();
const { t } = useTranslation();
Expand All @@ -172,12 +160,11 @@ const ProgramView = ({

useEffect(() => {
dispatch(fetchProgramSummary(programData.uuid));
}, [dispatch, programData]);
}, [dispatch, programData.uuid]);

const plannedVisits = filter(
get(programData, "encounters", []),
({ voided, encounterDateTime, cancelDateTime }) =>
!voided && isNil(encounterDateTime) && isNil(cancelDateTime)
({ voided, encounterDateTime, cancelDateTime }) => !voided && isNil(encounterDateTime) && isNil(cancelDateTime)
);

return (
Expand All @@ -188,22 +175,17 @@ const ProgramView = ({
typeUUID={programData.program.uuid}
typeName={programData.program.operationalProgramName}
scopeType={extensionScopeTypes.programEnrolment}
configExtensions={get(organisationConfigs, "organisationConfig.extensions")}
/>
<Grid item xs={4} container direction="row" justify="flex-start" alignItems="flex-start">
<label className={classes.programLabel}>
{t(programData.program.operationalProgramName)} {t("programdetails")}
</label>
</Grid>
{!subjectVoided && isNotExited && (
<NewProgramEncounterButton enrolmentUUID={programData.uuid} />
)}
{!subjectVoided && isNotExited && <NewProgramEncounterButton enrolmentUUID={programData.uuid} />}
</Grid>
<Paper className={classes.root}>
<RuleSummary
title={"programSummary"}
isFetching={isFetchingSummary}
summaryObservations={programSummary}
/>
<RuleSummary title={"programSummary"} isFetching={isFetchingSummary} summaryObservations={programSummary} />
{programData && programData.programExitDateTime && (
<EnrolmentDetails
t={t}
Expand Down Expand Up @@ -271,9 +253,7 @@ const ProgramView = ({
</Typography>
</ExpansionPanelSummary>
<ExpansionPanelDetails style={{ padding: 0, display: "block" }}>
{isExpanded && (
<CompletedVisits entityUuid={programData.uuid} isForProgramEncounters={true} />
)}
{isExpanded && <CompletedVisits entityUuid={programData.uuid} isForProgramEncounters={true} />}
</ExpansionPanelDetails>
</ExpansionPanel>
</Paper>
Expand All @@ -284,12 +264,7 @@ const ProgramView = ({
message={t("ProgramEnrolmentVoidAlertMessage")}
onConfirm={() => voidProgramEnrolment(programData.uuid)}
/>
<MessageDialog
title={t("ProgramEnrolmentErrorTitle")}
open={!isEmpty(voidError)}
message={voidError}
onOk={clearVoidServerError}
/>
<MessageDialog title={t("ProgramEnrolmentErrorTitle")} open={!isEmpty(voidError)} message={voidError} onOk={clearVoidServerError} />
</div>
);
};
Expand All @@ -298,7 +273,8 @@ const mapStateToProps = state => ({
subjectProgram: state.dataEntry.subjectProgram.subjectProgram,
subjectProfile: state.dataEntry.subjectProfile.subjectProfile,
programEnrolmentForm: state.dataEntry.subjectProgram.programEnrolmentForm,
voidError: state.dataEntry.subjectProfile.voidError
voidError: state.dataEntry.subjectProfile.voidError,
organisationConfigs: state.dataEntry.metadata.organisationConfigs
});

const mapDispatchToProps = {
Expand Down

0 comments on commit 20705e4

Please sign in to comment.