Skip to content

Commit

Permalink
refactor: use custom hooks, simplify code
Browse files Browse the repository at this point in the history
9sneha-n committed Apr 26, 2024

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
1 parent 39d983a commit 3fc725e
Showing 9 changed files with 249 additions and 194 deletions.
16 changes: 4 additions & 12 deletions src/data/utils/surveyFormMappers.ts
Original file line number Diff line number Diff line change
@@ -76,12 +76,8 @@ export const mapProgramToQuestionnaire = (
isVisible: true,
stageId: section.programStage.id,
sortOrder: section.sortOrder,
isAntibioticSection: questions.some(
q => q.type === "select" && isAntibioticQuestion(q)
),
isSpeciesSection: questions.some(
q => q.type === "select" && isSpeciesQuestion(q)
),
isAntibioticSection: questions.some(isAntibioticQuestion),
isSpeciesSection: questions.some(isSpeciesQuestion),
};
})
: //If the Program has no sections, create a single section
@@ -242,12 +238,8 @@ const getRepeatedStageEvents = (
isVisible: true,
stageId: newStageId,
sortOrder: section.sortOrder,
isAntibioticSection: currentRepeatablequestions.some(
q => q.type === "select" && isAntibioticQuestion(q)
),
isSpeciesSection: currentRepeatablequestions.some(
q => q.type === "select" && isSpeciesQuestion(q)
),
isAntibioticSection: currentRepeatablequestions.some(isAntibioticQuestion),
isSpeciesSection: currentRepeatablequestions.some(isSpeciesQuestion),
};
}) ?? [];

32 changes: 30 additions & 2 deletions src/domain/entities/Questionnaire/QuestionnaireQuestion.ts
Original file line number Diff line number Diff line change
@@ -33,14 +33,42 @@ export interface AntibioticQuestion extends SelectQuestion {
subType: "select-antibiotic";
}

export const isSpeciesQuestion = (question: SelectQuestion): question is SpeciesQuestion => {
export interface ASTResultsQuestion extends SelectQuestion {
subType: "select-ast-results";
}

export interface AntibioticValueQuestion extends TextQuestion {
subType: "text-antibiotic-value";
}

export interface AddNewAntibioticQuestion extends BooleanQuestion {
subType: "text-add-new-antibiotic";
}

export const isSpeciesQuestion = (question: Question): question is SpeciesQuestion => {
return (question as SpeciesQuestion).subType === "select-species";
};

export const isAntibioticQuestion = (question: SelectQuestion): question is AntibioticQuestion => {
export const isAntibioticQuestion = (question: Question): question is AntibioticQuestion => {
return (question as AntibioticQuestion).subType === "select-antibiotic";
};

export const isASTResultsQuestion = (question: Question): question is ASTResultsQuestion => {
return question.type === "select" && question.text === "AST results";
};

export const isAntibioticValueQuestion = (
question: Question
): question is AntibioticValueQuestion => {
return question.type === "text" && question.text === "Value (unit)";
};

export const isAddNewAntibioticQuestion = (
question: Question
): question is AddNewAntibioticQuestion => {
return question.type === "boolean" && question.text === "Add new antibiotic";
};

const ANTIBIOTIC_QUESTION_FORM_NAME = "Specify the antibiotic";
export const isSectionAntibioticQuestion = (
question: Question,
17 changes: 16 additions & 1 deletion src/domain/entities/Questionnaire/QuestionnaireSection.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,13 @@
import { Questionnaire } from "./Questionnaire";
import { Code, Question, QuestionnaireQuestion } from "./QuestionnaireQuestion";
import {
ASTResultsQuestion,
AddNewAntibioticQuestion,
AntibioticQuestion,
AntibioticValueQuestion,
Code,
Question,
QuestionnaireQuestion,
} from "./QuestionnaireQuestion";
import { QuestionnaireRule } from "./QuestionnaireRules";
import _ from "../generic/Collection";

@@ -15,6 +23,13 @@ export interface QuestionnaireSection {
isAntibioticSection: boolean;
}

export interface AntibioticSection {
antibioticQuestion: AntibioticQuestion;
astResultsQuestion: ASTResultsQuestion;
valueQuestion: AntibioticValueQuestion;
addNewAntibioticQuestion: AddNewAntibioticQuestion;
}

export class QuestionnaireSectionM {
static getSpeciesSection(sections: QuestionnaireSection[]): QuestionnaireSection | undefined {
return sections.find(section => section.title.startsWith(SPECIES_TITLE));
76 changes: 27 additions & 49 deletions src/webapp/components/survey/GridRow.tsx
Original file line number Diff line number Diff line change
@@ -1,73 +1,51 @@
import SearchableSelect from "../survey-questions/widgets/SearchableSelect";
import {
ASTResultsQuestion,
AddNewAntibioticQuestion,
AntibioticQuestion,
BooleanQuestion,
AntibioticValueQuestion,
Question,
QuestionOption,
QuestionnaireQuestion,
SelectQuestion,
TextQuestion,
} from "../../../domain/entities/Questionnaire/QuestionnaireQuestion";
import TextWidget from "../survey-questions/widgets/TextWidget";
import styled from "styled-components";
import { useCallback } from "react";
import { Typography } from "@material-ui/core";
import { useGridRow } from "./hook/useGridRow";

interface GridRowProps {
option: string;
antibiotic: AntibioticQuestion;
astResults: SelectQuestion;
valueQuestion: TextQuestion;
addNewAntibioticQuestion: BooleanQuestion;
astResults: ASTResultsQuestion;
valueQuestion: AntibioticValueQuestion;
addNewAntibioticQuestion: AddNewAntibioticQuestion;
updateAstResults: (question: Question) => void;
updateValue: (question: Question) => void;
updateAntibitoticQuestion: (question: Question) => void;
updateAddNewAntibiotic: (question: Question) => void;
}

export const GridRow: React.FC<GridRowProps> = ({
option,
antibiotic,
astResults,
valueQuestion,
addNewAntibioticQuestion,
updateAstResults,
updateValue,
updateAntibitoticQuestion,
updateAddNewAntibiotic,
}) => {
export const GridRow: React.FC<GridRowProps> = props => {
const {
option,
antibiotic,
astResults,
valueQuestion,
addNewAntibioticQuestion,
updateAstResults,
updateValue,
updateAntibitoticQuestion,
updateAddNewAntibiotic,
} = props;
const { update } = QuestionnaireQuestion;

const updateGridRow = useCallback(
(question: Question) => {
if (question.type === "select") {
updateAstResults(question);
} else if (question.type === "text") {
updateValue(question);
}
const updatedAntibiotic: AntibioticQuestion = {
...antibiotic,
value: antibiotic.options.find(op => op.name === option),
};

updateAntibitoticQuestion(updatedAntibiotic);

const newAddNewAntibiotic: BooleanQuestion = {
...addNewAntibioticQuestion,
value: true,
};

updateAddNewAntibiotic(newAddNewAntibiotic);
},
[
antibiotic,
option,
updateAstResults,
updateValue,
updateAntibitoticQuestion,
addNewAntibioticQuestion,
updateAddNewAntibiotic,
]
const { updateGridRow } = useGridRow(
updateAstResults,
updateValue,
antibiotic,
option,
updateAntibitoticQuestion,
addNewAntibioticQuestion,
updateAddNewAntibiotic
);

return (
103 changes: 9 additions & 94 deletions src/webapp/components/survey/GridSection.tsx
Original file line number Diff line number Diff line change
@@ -1,21 +1,14 @@
import styled from "styled-components";
import {
AntibioticQuestion,
BooleanQuestion,
Question,
SelectQuestion,
TextQuestion,
isAntibioticQuestion,
isSpeciesQuestion,
} from "../../../domain/entities/Questionnaire/QuestionnaireQuestion";
import { Question } from "../../../domain/entities/Questionnaire/QuestionnaireQuestion";
import { GridRow } from "./GridRow";
import _ from "../../../domain/entities/generic/Collection";
import { AntibioticSection } from "./SurveyForm";
import { QuestionnaireSection } from "../../../domain/entities/Questionnaire/QuestionnaireSection";
import { QuestionnaireStage } from "../../../domain/entities/Questionnaire/Questionnaire";
import { SurveySection } from "./SurveySection";
import React, { useCallback, useEffect, useState } from "react";
import { useASTGuidelinesOptions } from "../../hooks/useASTGuidelinesOptions";
import React from "react";

import _c from "../../../domain/entities/generic/Collection";
import { useGridSection } from "./hook/useGridSection";

interface GridSectionProps {
speciesSection: QuestionnaireSection;
@@ -26,88 +19,10 @@ interface GridSectionProps {

export const GridSection: React.FC<GridSectionProps> = React.memo(
({ speciesSection, antibioticStage, updateQuestion, viewOnly }) => {
const { getAntibioticOptions } = useASTGuidelinesOptions();
const [gridOptions, setGridOptions] = useState<string[]>();
const [antibioticSets, setAntibioticSets] = useState<AntibioticSection[]>();

useEffect(() => {
const speciesQuestion = speciesSection.questions.find(
question => question.type === "select" && isSpeciesQuestion(question)
);
if (speciesQuestion?.type === "select" && isSpeciesQuestion(speciesQuestion)) {
const options = getAntibioticOptions(speciesQuestion);
setGridOptions(options);
}

const antibioticSections = antibioticStage.sections.filter(
section => section.isAntibioticSection
);
const antibioticGroups: AntibioticSection[] = antibioticSections.map(section => {
const antibioticQuestion = section?.questions.find(
q => q.type === "select" && isAntibioticQuestion(q)
);

const astQuestion = section?.questions.find(
q => q.type === "select" && q.text === "AST results"
);

const valueQuestion = section?.questions.find(
q => q.type === "text" && q.text === "Value (unit)"
);
const addNewAntibioticQuestion = section?.questions.find(
q => q.type === "boolean" && q.text === "Add new antibiotic"
);

const antiBioticSet: AntibioticSection = {
antibioticQuestion: antibioticQuestion as unknown as AntibioticQuestion,
astResultsQuestion: astQuestion as unknown as SelectQuestion,
valueQuestion: valueQuestion as unknown as TextQuestion,
addNewAntibioticQuestion:
addNewAntibioticQuestion as unknown as BooleanQuestion,
};

return antiBioticSet;
});

setAntibioticSets(antibioticGroups);
}, [antibioticStage.sections, getAntibioticOptions, gridOptions, speciesSection.questions]);

const updateSpeciesQuestion = useCallback(
(question: Question) => {
if (question.type === "select" && isSpeciesQuestion(question)) {
const options = getAntibioticOptions(question);
setGridOptions(options);
antibioticSets?.map(antibioticSet => {
if (antibioticSet.addNewAntibioticQuestion?.value) {
updateQuestion({
...antibioticSet.addNewAntibioticQuestion,
value: false,
});
}
if (antibioticSet.antibioticQuestion?.value) {
updateQuestion({
...antibioticSet.antibioticQuestion,
value: undefined,
});
}

if (antibioticSet.astResultsQuestion?.value) {
updateQuestion({
...antibioticSet.astResultsQuestion,
value: undefined,
});
}
if (antibioticSet.valueQuestion?.value) {
updateQuestion({
...antibioticSet.valueQuestion,
value: undefined,
});
}
});
}
updateQuestion(question);
},
[antibioticSets, getAntibioticOptions, updateQuestion, setGridOptions]
const { updateSpeciesQuestion, gridOptions, antibioticSets } = useGridSection(
speciesSection,
antibioticStage,
updateQuestion
);

return (
13 changes: 0 additions & 13 deletions src/webapp/components/survey/SurveyForm.tsx
Original file line number Diff line number Diff line change
@@ -14,12 +14,6 @@ import { SurveyFormOUSelector } from "./SurveyFormOUSelector";
import { SurveySection } from "./SurveySection";
import { useHistory } from "react-router-dom";
import useReadOnlyAccess from "./hook/useReadOnlyAccess";
import {
AntibioticQuestion,
BooleanQuestion,
SelectQuestion,
TextQuestion,
} from "../../../domain/entities/Questionnaire/QuestionnaireQuestion";
import { GridSection } from "./GridSection";
import _c from "../../../domain/entities/generic/Collection";

@@ -40,13 +34,6 @@ const CancelButton = withStyles(() => ({
},
}))(Button);

export interface AntibioticSection {
antibioticQuestion: AntibioticQuestion;
astResultsQuestion: SelectQuestion;
valueQuestion: TextQuestion;
addNewAntibioticQuestion: BooleanQuestion;
}

export const SurveyForm: React.FC<SurveyFormProps> = props => {
const snackbar = useSnackbar();
const history = useHistory();
Loading

0 comments on commit 3fc725e

Please sign in to comment.