feat: save country form

EyeSeeTea · Oct 23, 2023 · b829f07 · b829f07
1 parent 43a3100
commit b829f07
Show file tree

Hide file tree

Showing 8 changed files with 82 additions and 25 deletions.
diff --git a/src/domain/usecases/GetAllSurveysUseCase.ts b/src/domain/usecases/GetAllSurveysUseCase.ts
@@ -1,23 +1,34 @@
 import { Id } from "@eyeseetea/d2-api";
 import { FutureData } from "../../data/api-futures";
-import { PPS_SURVEY_FORM_ID } from "../../data/repositories/SurveyFormD2Repository";
+import {
+    PPS_COUNTRY_QUESTIONNAIRE_ID,
+    PPS_SURVEY_FORM_ID,
+} from "../../data/repositories/SurveyFormD2Repository";
 import { Future } from "../entities/generic/Future";
 import { Survey, SURVEY_FORM_TYPES } from "../entities/Survey";
 import { SurveyRepository } from "../repositories/SurveyRepository";
 
 export class GetAllSurveysUseCase {
     constructor(private surveyReporsitory: SurveyRepository) {}
 
-    public execute(surveyType: SURVEY_FORM_TYPES, orgUnitId: Id): FutureData<Survey[]> {
+    public execute(
+        surveyType: SURVEY_FORM_TYPES,
+        orgUnitId: Id,
+        parentSurveyId: Id | undefined
+    ): FutureData<Survey[]> {
         let programId = "";
         switch (surveyType) {
             case "PPSSurveyForm":
                 programId = PPS_SURVEY_FORM_ID;
                 break;
+            case "PPSCountryQuestionnaire":
+                programId = PPS_COUNTRY_QUESTIONNAIRE_ID;
+                break;
             default:
                 return Future.error(new Error("Unknown survey type"));
         }
 
+        console.debug(parentSurveyId);
         return this.surveyReporsitory.getSurveys(programId, orgUnitId);
     }
 }
diff --git a/src/webapp/components/survey-list/SurveyList.tsx b/src/webapp/components/survey-list/SurveyList.tsx
@@ -19,13 +19,16 @@ import { Id } from "../../../domain/entities/Ref";
 import { useSurveys } from "../../hooks/useSurveys";
 import { palette } from "../../pages/app/themes/dhis2.theme";
 import { ActionMenuButton } from "../action-menu-button/ActionMenuButton";
-
+import { SURVEY_FORM_TYPES } from "../../../domain/entities/Survey";
 import { CustomCard } from "../custom-card/CustomCard";
 import { StyledLoaderContainer } from "../survey/SurveyForm";
 
-export const SurveyList: React.FC = () => {
-    const surveyType = "PPSSurveyForm"; //TO DO: Get from Props.
-    const { surveys, loading } = useSurveys(surveyType);
+interface SurveyListProps {
+    parentSurveyId?: Id;
+    surveyType: SURVEY_FORM_TYPES;
+}
+export const SurveyList: React.FC<SurveyListProps> = ({ surveyType, parentSurveyId }) => {
+    const { surveys, loading } = useSurveys(surveyType, parentSurveyId);
     const history = useHistory();
 
     const editSurvey = (surveyId: Id) => {
@@ -41,6 +44,13 @@ export const SurveyList: React.FC = () => {
         });
     };
 
+    // const listCountries = (surveyId: Id) => {
+    //     history.push({
+    //         pathname: `/surveys/PPSCountryQuestionnaire`,
+    //         state: { parentSurveyId: surveyId },
+    //     });
+    // };
+
     return (
         <ContentWrapper>
             <Backdrop open={loading} style={{ color: "#fff", zIndex: 1 }}>
@@ -110,7 +120,11 @@ export const SurveyList: React.FC = () => {
                                                 <TableCell>{survey.assignedOrgUnit.name}</TableCell>
                                                 <TableCell style={{ opacity: 0.5 }}>
                                                     <ActionMenuButton
-                                                        options={["Edit", "Assign Country"]}
+                                                        options={[
+                                                            "Edit",
+                                                            "Assign Country",
+                                                            "List Countries",
+                                                        ]}
                                                         optionClickHandler={[
                                                             {
                                                                 option: "Edit",
@@ -122,6 +136,12 @@ export const SurveyList: React.FC = () => {
                                                                 handler: () =>
                                                                     assignCountry(survey.id),
                                                             },
+                                                            {
+                                                                option: "List Countries",
+                                                                handler: () => {
+                                                                    alert("Coming soon!");
+                                                                },
+                                                            },
                                                         ]}
                                                     />
                                                 </TableCell>

diff --git a/src/webapp/hooks/useMenu.ts b/src/webapp/hooks/useMenu.ts
@@ -38,7 +38,7 @@ export function useMenu() {
                 {
                     kind: "MenuLeaf",
                     title: "Surveys",
-                    path: "/surveys",
+                    path: `/surveys/PPSSurveyForm`,
                 },
             ];
 

diff --git a/src/webapp/hooks/useSurveys.ts b/src/webapp/hooks/useSurveys.ts
@@ -1,11 +1,12 @@
 import { useSnackbar } from "@eyeseetea/d2-ui-components";
 import i18n from "@eyeseetea/feedback-component/locales";
 import { useEffect, useState } from "react";
+import { Id } from "../../domain/entities/Ref";
 import { Survey, SURVEY_FORM_TYPES } from "../../domain/entities/Survey";
 import { useAppContext } from "../contexts/app-context";
 import { useCurrentOrgUnitContext } from "../contexts/current-org-unit-context/current-orgUnit-context";
 
-export function useSurveys(surveyType: SURVEY_FORM_TYPES) {
+export function useSurveys(surveyType: SURVEY_FORM_TYPES, parentSurveyId: Id | undefined) {
     const { compositionRoot } = useAppContext();
     const [surveys, setSurveys] = useState<Survey[]>();
     const [loading, setLoading] = useState(false);
@@ -14,17 +15,25 @@ export function useSurveys(surveyType: SURVEY_FORM_TYPES) {
 
     useEffect(() => {
         setLoading(true);
-        compositionRoot.surveys.getSurveys.execute(surveyType, currentOrgUnitAccess.orgUnitId).run(
-            surveys => {
-                setSurveys(surveys);
-                setLoading(false);
-            },
-            err => {
-                snackbar.error(i18n.t(err.message));
-                setLoading(false);
-            }
-        );
-    }, [currentOrgUnitAccess.orgUnitId, snackbar, compositionRoot.surveys.getSurveys, surveyType]);
+        compositionRoot.surveys.getSurveys
+            .execute(surveyType, currentOrgUnitAccess.orgUnitId, parentSurveyId)
+            .run(
+                surveys => {
+                    setSurveys(surveys);
+                    setLoading(false);
+                },
+                err => {
+                    snackbar.error(i18n.t(err.message));
+                    setLoading(false);
+                }
+            );
+    }, [
+        currentOrgUnitAccess.orgUnitId,
+        snackbar,
+        compositionRoot.surveys.getSurveys,
+        surveyType,
+        parentSurveyId,
+    ]);
 
     return { surveys, loading };
 }
diff --git a/src/webapp/pages/Router.tsx b/src/webapp/pages/Router.tsx
@@ -16,7 +16,7 @@ export function Router() {
                 <Switch>
                     <Route path="/user-profile" render={() => <UserProfilePage />} />
                     <Route path="/user-settings" render={() => <UserSettingsPage />} />
-                    <Route path="/surveys" render={() => <SurveyListPage />} />
+                    <Route path="/surveys/:type" render={() => <SurveyListPage />} />
                     <Route path="/new-survey/:type" render={() => <NewSurveyPage />} />
                     <Route path="/survey/:type/:id" render={() => <SurveyPage />} />
 

diff --git a/src/webapp/pages/edit-survey/SurveyPage.tsx b/src/webapp/pages/edit-survey/SurveyPage.tsx
@@ -10,7 +10,7 @@ export const SurveyPage: React.FC = () => {
     const history = useHistory();
 
     const hideForm = () => {
-        history.push(`/surveys`);
+        history.push(`/surveys/${type}`);
     };
 
     return (

diff --git a/src/webapp/pages/new-survey/NewSurveyPage.tsx b/src/webapp/pages/new-survey/NewSurveyPage.tsx
@@ -28,7 +28,7 @@ export const NewSurveyPage: React.FC = () => {
     }, [setParentSurveyId, location.state?.parentSurveyId, resetOrgUnit]);
 
     const hideForm = () => {
-        history.push(`/surveys`);
+        history.push(`/surveys/${type}`);
     };
 
     //Do not load any children forms until parent Id is set

diff --git a/src/webapp/pages/survey-list/SurveyListPage.tsx b/src/webapp/pages/survey-list/SurveyListPage.tsx
@@ -1,11 +1,28 @@
-import React from "react";
+import { CircularProgress } from "material-ui";
+import React, { useEffect, useState } from "react";
+import { useLocation, useParams } from "react-router-dom";
 import styled from "styled-components";
+import { SURVEY_FORM_TYPES } from "../../../domain/entities/Survey";
 import { SurveyList } from "../../components/survey-list/SurveyList";
 
 export const SurveyListPage: React.FC = React.memo(() => {
+    const { type } = useParams<{ type: SURVEY_FORM_TYPES }>();
+    const [parentSurveyId, setParentSurveyId] = useState<string | undefined>();
+    const location = useLocation<{ parentSurveyId: string }>();
+
+    useEffect(() => {
+        const parentSurveyIdL = location.state?.parentSurveyId;
+        if (parentSurveyIdL) setParentSurveyId(parentSurveyIdL);
+    }, [setParentSurveyId, location.state?.parentSurveyId]);
+
+    //Do not load any children forms until parent Id is set
+    if (!parentSurveyId && type === "PPSCountryQuestionnaire") {
+        return <CircularProgress></CircularProgress>;
+    }
+
     return (
         <ContentWrapper>
-            <SurveyList />
+            <SurveyList surveyType={type} parentSurveyId={parentSurveyId} />
         </ContentWrapper>
     );
 });