From 876f56e2607c73727de5718471314fde9d0af17b Mon Sep 17 00:00:00 2001
From: Chukwudumebi Onwuli <37223065+deeonwuli@users.noreply.github.com>
Date: Tue, 8 Oct 2024 12:45:16 +0100
Subject: [PATCH 01/14] feat: implement incident action plan pages (wip)

create form summary page, action plan form and response action form
---
 src/CompositionRoot.ts                        |   9 +-
 .../IncidentActionD2Repository.ts             | 191 +++++++++
 src/data/repositories/OptionsD2Repository.ts  |  36 ++
 .../consts/DiseaseOutbreakConstants.ts        |   2 +
 .../consts/IncidentActionConstants.ts         | 120 ++++++
 .../test/IncidentActionTestRepository.ts      |  24 ++
 .../test/OptionsTestRepository.ts             |  26 ++
 .../utils/IncidentActionMapper.ts             | 233 +++++++++++
 .../utils/RiskAssessmentMapper.ts             |   2 +-
 src/domain/entities/ConfigurableForm.ts       |  31 +-
 .../incident-action-plan/ActionPlan.ts        |  16 +-
 .../IncidentActionPlan.ts                     |   3 +-
 .../incident-action-plan/ResponseAction.ts    |  35 +-
 .../repositories/IncidentActionRepository.ts  |  19 +
 src/domain/repositories/OptionsRepository.ts  |   6 +
 .../usecases/GetDiseaseOutbreakByIdUseCase.ts |  12 +-
 .../usecases/GetEntityWithOptionsUseCase.ts   |  27 ++
 src/domain/usecases/SaveEntityUseCase.ts      |  10 +-
 .../incident-action/GetIncidentActionById.ts  |  95 +++++
 .../GetIncidentActionPlanWithOptions.ts       |  67 +++
 .../form-summary/ActionPlanFormSummary.tsx    |  71 ++++
 .../layout/side-bar/SideBarContent.tsx        |  17 +-
 src/webapp/hooks/useRoutes.ts                 |   6 +-
 src/webapp/pages/form-page/FormPage.tsx       |   4 +-
 .../updateDiseaseOutbreakEventFormState.ts    |   5 +-
 .../mapIncidentActionToInitialFormState.ts    | 395 ++++++++++++++++++
 .../pages/form-page/mapEntityToFormState.ts   |   8 +
 .../form-page/mapFormStateToEntityData.ts     | 138 ++++++
 src/webapp/pages/form-page/useForm.ts         |  19 +
 .../IncidentActionPlanPage.tsx                | 168 +++++++-
 .../useIncidentActionPlan.ts                  | 136 ++++++
 31 files changed, 1899 insertions(+), 32 deletions(-)
 create mode 100644 src/data/repositories/IncidentActionD2Repository.ts
 create mode 100644 src/data/repositories/consts/IncidentActionConstants.ts
 create mode 100644 src/data/repositories/test/IncidentActionTestRepository.ts
 create mode 100644 src/data/repositories/utils/IncidentActionMapper.ts
 create mode 100644 src/domain/repositories/IncidentActionRepository.ts
 create mode 100644 src/domain/usecases/utils/incident-action/GetIncidentActionById.ts
 create mode 100644 src/domain/usecases/utils/incident-action/GetIncidentActionPlanWithOptions.ts
 create mode 100644 src/webapp/components/form/form-summary/ActionPlanFormSummary.tsx
 create mode 100644 src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
 create mode 100644 src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts

diff --git a/src/CompositionRoot.ts b/src/CompositionRoot.ts
index a0130516..f62e7d66 100644
--- a/src/CompositionRoot.ts
+++ b/src/CompositionRoot.ts
@@ -26,6 +26,9 @@ import { SaveEntityUseCase } from "./domain/usecases/SaveEntityUseCase";
 import { RiskAssessmentRepository } from "./domain/repositories/RiskAssessmentRepository";
 import { RiskAssessmentD2Repository } from "./data/repositories/RiskAssessmentD2Repository";
 import { RiskAssessmentTestRepository } from "./data/repositories/test/RiskAssessmentTestRepository";
+import { IncidentActionRepository } from "./domain/repositories/IncidentActionRepository";
+import { IncidentActionD2Repository } from "./data/repositories/IncidentActionD2Repository";
+import { IncidentActionTestRepository } from "./data/repositories/test/IncidentActionTestRepository";
 
 export type CompositionRoot = ReturnType<typeof getCompositionRoot>;
 
@@ -37,6 +40,7 @@ type Repositories = {
     teamMemberRepository: TeamMemberRepository;
     orgUnitRepository: OrgUnitRepository;
     riskAssessmentRepository: RiskAssessmentRepository;
+    incidentActionRepository: IncidentActionRepository;
 };
 
 function getCompositionRoot(repositories: Repositories) {
@@ -44,7 +48,8 @@ function getCompositionRoot(repositories: Repositories) {
         getWithOptions: new GetEntityWithOptionsUseCase(repositories),
         save: new SaveEntityUseCase(
             repositories.diseaseOutbreakEventRepository,
-            repositories.riskAssessmentRepository
+            repositories.riskAssessmentRepository,
+            repositories.incidentActionRepository
         ),
         users: {
             getCurrent: new GetCurrentUserUseCase(repositories.usersRepository),
@@ -68,6 +73,7 @@ export function getWebappCompositionRoot(api: D2Api) {
         teamMemberRepository: new TeamMemberD2Repository(api),
         orgUnitRepository: new OrgUnitD2Repository(api),
         riskAssessmentRepository: new RiskAssessmentD2Repository(api),
+        incidentActionRepository: new IncidentActionD2Repository(api),
     };
 
     return getCompositionRoot(repositories);
@@ -82,6 +88,7 @@ export function getTestCompositionRoot() {
         teamMemberRepository: new TeamMemberTestRepository(),
         orgUnitRepository: new OrgUnitTestRepository(),
         riskAssessmentRepository: new RiskAssessmentTestRepository(),
+        incidentActionRepository: new IncidentActionTestRepository(),
     };
 
     return getCompositionRoot(repositories);
diff --git a/src/data/repositories/IncidentActionD2Repository.ts b/src/data/repositories/IncidentActionD2Repository.ts
new file mode 100644
index 00000000..66c6ab85
--- /dev/null
+++ b/src/data/repositories/IncidentActionD2Repository.ts
@@ -0,0 +1,191 @@
+import { D2Api } from "../../types/d2-api";
+import { Maybe } from "../../utils/ts-utils";
+import { apiToFuture, FutureData } from "../api-futures";
+import { Id } from "../../domain/entities/Ref";
+import {
+    RTSL_ZEBRA_INCIDENT_ACTION_PLAN_PROGRAM_STAGE_ID,
+    RTSL_ZEBRA_INCIDENT_RESPONSE_ACTION_PROGRAM_STAGE_ID,
+    RTSL_ZEBRA_ORG_UNIT_ID,
+    RTSL_ZEBRA_PROGRAM_ID,
+} from "./consts/DiseaseOutbreakConstants";
+import { IncidentActionRepository } from "../../domain/repositories/IncidentActionRepository";
+import {
+    mapDataElementsToIncidentActionPlan,
+    mapDataElementsToIncidentResponseActions,
+    mapIncidentActionToDataElements,
+} from "./utils/IncidentActionMapper";
+import { ActionPlanFormData, ResponseActionFormData } from "../../domain/entities/ConfigurableForm";
+import { getProgramStage } from "./utils/MetadataHelper";
+import { Future } from "../../domain/entities/generic/Future";
+import { D2TrackerEvent } from "@eyeseetea/d2-api/api/trackerEvents";
+import { Status, Verification } from "../../domain/entities/incident-action-plan/ResponseAction";
+
+export const incidentActionPlanIds = {
+    iapType: "wr1I51WTHhl",
+    phoecLevel: "KgTXZonQEsm",
+    criticalInfoRequirements: "sgZ6MgzCI7m",
+    planningAssumptions: "RZviL2uz1Wa",
+    responseObjectives: "giq2C0lvCza",
+    responseStrategies: "lbcbEZ8bEpK",
+    expectedResults: "sB1N7Nkm5Y1",
+    responseActivitiesNarrative: "RnWk88dYOXN",
+} as const;
+
+export type IncidentActionPlanDataValues = {
+    id: string;
+    iapType: Maybe<string>;
+    phoecLevel: Maybe<string>;
+    criticalInfoRequirements: Maybe<string>;
+    planningAssumptions: Maybe<string>;
+    responseObjectives: Maybe<string>;
+    responseStrategies: Maybe<string>;
+    expectedResults: Maybe<string>;
+    responseActivitiesNarrative: Maybe<string>;
+};
+
+export const incidentResponseActionsIds = {
+    mainTask: "k3FiTDWD18d",
+    subActivities: "i728CZUYlRB",
+    subPillar: "BQhCqEHOyej",
+    searchAssignRO: "Z9a067KbV5J",
+    dueDate: "i2M51y9qBoC",
+    timeLine: "xvWvQ3K1GVA",
+    status: "mUR4eNxgAwg",
+    verification: "M62NkbKXhqZ",
+};
+
+export type IncidentResponseActionsDataValues = {
+    id: string;
+    mainTask: Maybe<string>;
+    subActivities: Maybe<string>;
+    subPillar: Maybe<string>;
+    searchAssignRO: Maybe<string>;
+    dueDate: Maybe<string>;
+    timeLine: Maybe<string>;
+    status: Maybe<Status>;
+    verification: Maybe<Verification>;
+};
+
+export class IncidentActionD2Repository implements IncidentActionRepository {
+    constructor(private api: D2Api) {}
+
+    private fields = {
+        event: true,
+        dataValues: {
+            dataElement: { id: true, code: true },
+            value: true,
+        },
+        trackedEntity: true,
+    };
+
+    getIncidentActionPlan(diseaseOutbreakId: Id): FutureData<Maybe<IncidentActionPlanDataValues>> {
+        return apiToFuture(
+            this.api.tracker.events.get({
+                program: RTSL_ZEBRA_PROGRAM_ID,
+                orgUnit: RTSL_ZEBRA_ORG_UNIT_ID,
+                trackedEntity: diseaseOutbreakId,
+                programStage: RTSL_ZEBRA_INCIDENT_ACTION_PLAN_PROGRAM_STAGE_ID,
+                fields: this.fields,
+            })
+        ).map(events => {
+            if (!events.instances[0]?.event) return undefined;
+
+            const plan: IncidentActionPlanDataValues = mapDataElementsToIncidentActionPlan(
+                events.instances[0].event,
+                events.instances[0].dataValues
+            );
+
+            return plan;
+        });
+    }
+
+    getIncidentResponseActions(
+        diseaseOutbreakId: Id
+    ): FutureData<Maybe<IncidentResponseActionsDataValues>> {
+        return apiToFuture(
+            this.api.tracker.events.get({
+                program: RTSL_ZEBRA_PROGRAM_ID,
+                orgUnit: RTSL_ZEBRA_ORG_UNIT_ID,
+                trackedEntity: diseaseOutbreakId,
+                programStage: RTSL_ZEBRA_INCIDENT_RESPONSE_ACTION_PROGRAM_STAGE_ID,
+                fields: this.fields,
+            })
+        ).map(events => {
+            const responseActions: IncidentResponseActionsDataValues =
+                mapDataElementsToIncidentResponseActions(
+                    events.instances[0]?.event ?? diseaseOutbreakId,
+                    events.instances[0]?.dataValues ?? []
+                );
+
+            return responseActions;
+        });
+    }
+
+    saveIncidentAction(
+        formData: ActionPlanFormData | ResponseActionFormData,
+        diseaseOutbreakId: Id
+    ): FutureData<void> {
+        const programStageId = this.getProgramStageByFormType(formData.type);
+
+        return getProgramStage(this.api, programStageId).flatMap(incidentResponse => {
+            const incidentDataElements = incidentResponse.objects[0]?.programStageDataElements;
+
+            if (!incidentDataElements)
+                return Future.error(
+                    new Error(` ${formData.type} Program Stage metadata not found`)
+                );
+
+            //Get the enrollment Id for the disease outbreak
+            return apiToFuture(
+                this.api.tracker.enrollments.get({
+                    fields: {
+                        enrollment: true,
+                    },
+                    trackedEntity: diseaseOutbreakId,
+                    enrolledBefore: new Date().toISOString(),
+                    program: RTSL_ZEBRA_PROGRAM_ID,
+                    orgUnit: RTSL_ZEBRA_ORG_UNIT_ID,
+                })
+            ).flatMap(enrollmentResponse => {
+                const enrollmentId = enrollmentResponse.instances[0]?.enrollment;
+                if (!enrollmentId) {
+                    return Future.error(new Error(`Enrollment not found for Disease Outbreak`));
+                }
+
+                const events: D2TrackerEvent = mapIncidentActionToDataElements(
+                    formData,
+                    programStageId,
+                    diseaseOutbreakId,
+                    enrollmentId,
+                    incidentDataElements
+                );
+
+                return apiToFuture(
+                    this.api.tracker.post(
+                        { importStrategy: "CREATE_AND_UPDATE" },
+                        { events: [events] }
+                    )
+                ).flatMap(saveResponse => {
+                    if (saveResponse.status === "ERROR" || !diseaseOutbreakId) {
+                        return Future.error(
+                            new Error(`Error saving Incident Action Plan Risk Assessment Grading`)
+                        );
+                    } else {
+                        return Future.success(undefined);
+                    }
+                });
+            });
+        });
+    }
+
+    private getProgramStageByFormType(formType: string) {
+        switch (formType) {
+            case "incident-action-plan":
+                return RTSL_ZEBRA_INCIDENT_ACTION_PLAN_PROGRAM_STAGE_ID;
+            case "incident-response-action":
+                return RTSL_ZEBRA_INCIDENT_RESPONSE_ACTION_PROGRAM_STAGE_ID;
+            default:
+                throw new Error("Incident Action Form type not supported");
+        }
+    }
+}
diff --git a/src/data/repositories/OptionsD2Repository.ts b/src/data/repositories/OptionsD2Repository.ts
index aa550ad4..274b8373 100644
--- a/src/data/repositories/OptionsD2Repository.ts
+++ b/src/data/repositories/OptionsD2Repository.ts
@@ -34,6 +34,8 @@ export class OptionsD2Repository implements OptionsRepository {
     private likelihoodOptions: Map<string, Option> = new Map();
     private consequencesOptions: Map<string, Option> = new Map();
     private lowMediumHighOptions: Map<string, Option> = new Map();
+    private statusOptions: Map<string, Option> = new Map();
+    private verificationOptions: Map<string, Option> = new Map();
 
     getMainSyndrome(optionCode: Code): FutureData<Option> {
         return this.get(optionCode, MAIN_SYNDROME_OPTION_SET_CODE);
@@ -158,6 +160,40 @@ export class OptionsD2Repository implements OptionsRepository {
         });
     }
 
+    // Incident action plan options
+    getIapTypeOptions(): FutureData<Option[]> {
+        return this.getOptionSetByCode("RTSL_ZEB_OS_IAP_TYPE");
+    }
+
+    getPhoecLevelOptions(): FutureData<Option[]> {
+        return this.getOptionSetByCode("RTSL_ZEB_OS_PHOEC_ACT_LEVEL");
+    }
+
+    // Incident response action options
+    getStatusOptions(): FutureData<Option[]> {
+        return this.getOptionSetByCode("RTSL_ZEB_OS_STATUS");
+    }
+
+    getStatusOption(optionCode: Code): FutureData<Option> {
+        if (this.statusOptions.has(optionCode)) {
+            const cachedOption = this.statusOptions.get(optionCode);
+            if (cachedOption) return Future.success(cachedOption);
+        }
+        return this.get(optionCode, "RTSL_ZEB_OS_STATUS");
+    }
+
+    getVerificationOptions(): FutureData<Option[]> {
+        return this.getOptionSetByCode("RTSL_ZEB_OS_VERIFICATION");
+    }
+
+    getVerificationOption(optionCode: Code): FutureData<Option> {
+        if (this.verificationOptions.has(optionCode)) {
+            const cachedOption = this.verificationOptions.get(optionCode);
+            if (cachedOption) return Future.success(cachedOption);
+        }
+        return this.get(optionCode, "RTSL_ZEB_OS_VERIFICATION");
+    }
+
     private getOptionSetByCode(code: string): FutureData<Option[]> {
         return apiToFuture(
             this.api.metadata.get({
diff --git a/src/data/repositories/consts/DiseaseOutbreakConstants.ts b/src/data/repositories/consts/DiseaseOutbreakConstants.ts
index 16a55341..b1ff865c 100644
--- a/src/data/repositories/consts/DiseaseOutbreakConstants.ts
+++ b/src/data/repositories/consts/DiseaseOutbreakConstants.ts
@@ -14,6 +14,8 @@ export const RTSL_ZEBRA_RISK_ASSESSMENT_GRADING_PROGRAM_STAGE_ID = "swh2ZukmkDk"
 export const RTSL_ZEBRA_RISK_ASSESSMENT_SUMMARY_PROGRAM_STAGE_ID = "jBjvgjSgf9d";
 export const RTSL_ZEBRA_RISK_ASSESSMENT_QUESTIONNAIRE_PROGRAM_STAGE_ID = "Ltmf2awDAkS";
 export const RTSL_ZEBRA_RISK_ASSESSMENT_QUESTIONNAIRE_CUSTOM_PROGRAM_STAGE_ID = "LpB1gNXEbEV";
+export const RTSL_ZEBRA_INCIDENT_ACTION_PLAN_PROGRAM_STAGE_ID = "FwUxJTqq35X";
+export const RTSL_ZEBRA_INCIDENT_RESPONSE_ACTION_PROGRAM_STAGE_ID = "bxy7o3UOY6T";
 
 export const RTSL_ZEBRA_ALERTS_PROGRAM_ID = "MQtbs8UkBxy";
 export const RTSL_ZEBRA_ALERTS_NATIONAL_DISEASE_OUTBREAK_EVENT_ID_TEA_ID = "Pq1drzz2HJk";
diff --git a/src/data/repositories/consts/IncidentActionConstants.ts b/src/data/repositories/consts/IncidentActionConstants.ts
new file mode 100644
index 00000000..710b757c
--- /dev/null
+++ b/src/data/repositories/consts/IncidentActionConstants.ts
@@ -0,0 +1,120 @@
+import { ActionPlanAttrs } from "../../../domain/entities/incident-action-plan/ActionPlan";
+import {
+    ResponseAction,
+    Status,
+    Verification,
+} from "../../../domain/entities/incident-action-plan/ResponseAction";
+import { GetValue } from "../../../utils/ts-utils";
+
+export const actionPlanConstants = {
+    iapType: "RTSL_ZEB_DET_IAP_TYPE",
+    phoecLevel: "RTSL_ZEB_DET_PHOEC_ACT_LEVEL",
+    criticalInfoRequirements: "RTSL_ZEB_DET_CIR",
+    planningAssumptions: "RTSL_ZEB_DET_PLANNING_ASSUMPTIONS",
+    responseObjectives: "RTSL_ZEB_DET_RESPONSE_OBJECTIVES",
+    responseStrategies: "RTSL_ZEB_DET_RESPONSE_STRATEGIES",
+    expectedResults: "RTSL_ZEB_DET_SECTIONS_OBJECTIVES_EXPECTED_RESULTS",
+    responseActivitiesNarrative: "RTSL_ZEB_DET_RESPONSE_ACTIVITIES_NARRATIVE",
+} as const;
+
+export type ActionPlanCodes = GetValue<typeof actionPlanConstants>;
+
+export type IncidentActionPlanKeyCode =
+    (typeof actionPlanConstants)[keyof typeof actionPlanConstants];
+
+export function isStringInIncidentActionPlanCodes(code: string): code is IncidentActionPlanKeyCode {
+    return (Object.values(actionPlanConstants) as string[]).includes(code);
+}
+
+type IAPType = "Initial" | "Update" | "Final";
+
+export const iapTypeCodeMap: Record<IAPType, string> = {
+    Initial: "RTSL_ZEB_OS_IAP_TYPE_INITIAL",
+    Update: "RTSL_ZEB_OS_IAP_TYPE_UPDATE",
+    Final: "RTSL_ZEB_OS_IAP_TYPE_FINAL",
+};
+
+export function getIAPTypeByCode(iapTypeCode: string): IAPType | undefined {
+    return (Object.keys(iapTypeCodeMap) as IAPType[]).find(
+        key => iapTypeCodeMap[key] === iapTypeCode
+    );
+}
+
+type PhoecLevel = "Response" | "Watch" | "Alert";
+
+export const phoecLevelCodeMap: Record<PhoecLevel, string> = {
+    Response: "RTSL_ZEB_OS_PHOEC_ACT_LEVEL_RESPONSE",
+    Watch: "RTSL_ZEB_OS_PHOEC_ACT_LEVEL_WATCH",
+    Alert: "RTSL_ZEB_OS_PHOEC_ACT_LEVEL_ALERT",
+};
+
+export function getPhoecLevelByCode(phoecLevelCode: string): PhoecLevel | undefined {
+    return (Object.keys(phoecLevelCodeMap) as PhoecLevel[]).find(
+        key => phoecLevelCodeMap[key] === phoecLevelCode
+    );
+}
+
+export const responseActionConstants = {
+    mainTask: "RTSL_ZEB_DET_MAIN_TASK",
+    subActivities: "RTSL_ZEB_DET_SUB_ACTIVITIES",
+    subPillar: "RTSL_ZEB_DET_SUB_PILLAR",
+    searchAssignRO: "RTSL_ZEB_DET_SEARCH_ASSIGN_RO",
+    dueDate: "RTSL_ZEB_DET_DUE_DATE",
+    timeLine: "RTSL_ZEB_DET_TIMELINE",
+    status: "RTSL_ZEB_DET_STATUS",
+    verification: "RTSL_ZEB_DET_VERIFICATION",
+} as const;
+
+export type ResponseActionCodes = GetValue<typeof responseActionConstants>;
+
+export type IncidentResponseActionKeyCode =
+    (typeof responseActionConstants)[keyof typeof responseActionConstants];
+
+export function isStringInIncidentResponseActionCodes(
+    code: string
+): code is IncidentResponseActionKeyCode {
+    return (Object.values(responseActionConstants) as string[]).includes(code);
+}
+
+export function getValueFromIncidentActionPlan(
+    incidentActionPlan: ActionPlanAttrs
+): Record<ActionPlanCodes, string> {
+    return {
+        RTSL_ZEB_DET_IAP_TYPE: incidentActionPlan.iapType || "",
+        RTSL_ZEB_DET_PHOEC_ACT_LEVEL: incidentActionPlan.phoecLevel || "",
+        RTSL_ZEB_DET_CIR: incidentActionPlan.criticalInfoRequirements || "",
+        RTSL_ZEB_DET_PLANNING_ASSUMPTIONS: incidentActionPlan.planningAssumptions || "",
+        RTSL_ZEB_DET_RESPONSE_OBJECTIVES: incidentActionPlan.responseObjectives || "",
+        RTSL_ZEB_DET_RESPONSE_STRATEGIES: incidentActionPlan.responseStrategies || "",
+        RTSL_ZEB_DET_SECTIONS_OBJECTIVES_EXPECTED_RESULTS: incidentActionPlan.expectedResults || "",
+        RTSL_ZEB_DET_RESPONSE_ACTIVITIES_NARRATIVE:
+            incidentActionPlan.responseActivitiesNarrative || "",
+    };
+}
+
+export function getValueFromIncidentResponseAction(
+    incidentResponseAction: ResponseAction
+): Record<ResponseActionCodes, string> {
+    return {
+        RTSL_ZEB_DET_MAIN_TASK: incidentResponseAction.mainTask || "",
+        RTSL_ZEB_DET_SUB_ACTIVITIES: incidentResponseAction.subActivities || "",
+        RTSL_ZEB_DET_SUB_PILLAR: incidentResponseAction.subPillar || "",
+        RTSL_ZEB_DET_SEARCH_ASSIGN_RO: incidentResponseAction.searchAssignRO?.username || "",
+        RTSL_ZEB_DET_DUE_DATE: incidentResponseAction.dueDate.toISOString(),
+        RTSL_ZEB_DET_TIMELINE: incidentResponseAction.timeLine || "",
+        RTSL_ZEB_DET_STATUS: incidentResponseAction.status,
+        RTSL_ZEB_DET_VERIFICATION: incidentResponseAction.verification,
+    };
+}
+
+export const statusMap: Record<string, Status> = {
+    RTSL_ZEB_OS_STATUS_NOT_DONE: Status.RTSL_ZEB_OS_STATUS_NOT_DONE,
+    RTSL_ZEB_OS_STATUS_PENDING: Status.RTSL_ZEB_OS_STATUS_PENDING,
+    RTSL_ZEB_OS_STATUS_IN_PROGRESS: Status.RTSL_ZEB_OS_STATUS_IN_PROGRESS,
+    RTSL_ZEB_OS_STATUS_COMPLETE: Status.RTSL_ZEB_OS_STATUS_COMPLETE,
+};
+
+export const verificationMap: Record<string, Verification> = {
+    RTSL_ZEB_OS_VERIFICATION_UNVERIFIED: Verification.RTSL_ZEB_OS_VERIFICATION_UNVERIFIED,
+    RTSL_ZEB_OS_VERIFICATION_VERIFIED: Verification.RTSL_ZEB_OS_VERIFICATION_VERIFIED,
+};
diff --git a/src/data/repositories/test/IncidentActionTestRepository.ts b/src/data/repositories/test/IncidentActionTestRepository.ts
new file mode 100644
index 00000000..b6b78163
--- /dev/null
+++ b/src/data/repositories/test/IncidentActionTestRepository.ts
@@ -0,0 +1,24 @@
+import { Id } from "../../../domain/entities/Ref";
+import { IncidentActionRepository } from "../../../domain/repositories/IncidentActionRepository";
+import { Maybe } from "../../../utils/ts-utils";
+import { FutureData } from "../../api-futures";
+import {
+    IncidentActionPlanDataValues,
+    IncidentResponseActionsDataValues,
+} from "../IncidentActionD2Repository";
+
+export class IncidentActionTestRepository implements IncidentActionRepository {
+    getIncidentActionPlan(_diseaseOutbreakId: Id): FutureData<Maybe<IncidentActionPlanDataValues>> {
+        throw new Error("Method not implemented.");
+    }
+
+    getIncidentResponseActions(
+        _diseaseOutbreakId: Id
+    ): FutureData<Maybe<IncidentResponseActionsDataValues>> {
+        throw new Error("Method not implemented.");
+    }
+
+    saveIncidentAction(_formData: any, _diseaseOutbreakId: Id): FutureData<void> {
+        throw new Error("Method not implemented.");
+    }
+}
diff --git a/src/data/repositories/test/OptionsTestRepository.ts b/src/data/repositories/test/OptionsTestRepository.ts
index c6e65632..70f303ce 100644
--- a/src/data/repositories/test/OptionsTestRepository.ts
+++ b/src/data/repositories/test/OptionsTestRepository.ts
@@ -105,5 +105,31 @@ export class OptionsTestRepository implements OptionsRepository {
         return Future.success([{ id: "1", name: "Test Incident Status" }]);
     }
 
+    // Incident action plan options
+    getIapTypeOptions(): FutureData<Option[]> {
+        return Future.success([{ id: "1", name: "Test IAP Type" }]);
+    }
+
+    getPhoecLevelOptions(): FutureData<Option[]> {
+        return Future.success([{ id: "1", name: "Test PHOEC Level" }]);
+    }
+
+    // Incident response action options
+    getStatusOptions(): FutureData<Option[]> {
+        return Future.success([{ id: "1", name: "Test Status" }]);
+    }
+
+    getStatusOption(_optionCode: Code): FutureData<Option> {
+        throw new Error("Method not implemented.");
+    }
+
+    getVerificationOptions(): FutureData<Option[]> {
+        return Future.success([{ id: "1", name: "Test Verification" }]);
+    }
+
+    getVerificationOption(_optionCode: Code): FutureData<Option> {
+        throw new Error("Method not implemented.");
+    }
+
     //Risk Grading Options
 }
diff --git a/src/data/repositories/utils/IncidentActionMapper.ts b/src/data/repositories/utils/IncidentActionMapper.ts
new file mode 100644
index 00000000..42d59cb5
--- /dev/null
+++ b/src/data/repositories/utils/IncidentActionMapper.ts
@@ -0,0 +1,233 @@
+import { D2TrackerEvent, DataValue } from "@eyeseetea/d2-api/api/trackerEvents";
+import {
+    IncidentActionPlanDataValues,
+    incidentActionPlanIds,
+    IncidentResponseActionsDataValues,
+    incidentResponseActionsIds,
+} from "../IncidentActionD2Repository";
+import { Id } from "../../../domain/entities/Ref";
+import { Maybe } from "../../../utils/ts-utils";
+import {
+    ActionPlanFormData,
+    ResponseActionFormData,
+} from "../../../domain/entities/ConfigurableForm";
+import { D2ProgramStageDataElementsMetadata } from "./RiskAssessmentMapper";
+import { ActionPlanAttrs } from "../../../domain/entities/incident-action-plan/ActionPlan";
+import {
+    ActionPlanCodes,
+    getValueFromIncidentActionPlan,
+    getValueFromIncidentResponseAction,
+    IncidentActionPlanKeyCode,
+    IncidentResponseActionKeyCode,
+    isStringInIncidentActionPlanCodes,
+    isStringInIncidentResponseActionCodes,
+    ResponseActionCodes,
+    responseActionConstants,
+    statusMap,
+    verificationMap,
+} from "../consts/IncidentActionConstants";
+import { RTSL_ZEBRA_ORG_UNIT_ID, RTSL_ZEBRA_PROGRAM_ID } from "../consts/DiseaseOutbreakConstants";
+import { ResponseAction } from "../../../domain/entities/incident-action-plan/ResponseAction";
+
+export function mapDataElementsToIncidentActionPlan(
+    id: Id,
+    dataValues: DataValue[]
+): IncidentActionPlanDataValues {
+    const iapType = getValueById(dataValues, incidentActionPlanIds.iapType);
+    const phoecLevel = getValueById(dataValues, incidentActionPlanIds.phoecLevel);
+    const criticalInfoRequirements = getValueById(
+        dataValues,
+        incidentActionPlanIds.criticalInfoRequirements
+    );
+    const planningAssumptions = getValueById(dataValues, incidentActionPlanIds.planningAssumptions);
+    const responseObjectives = getValueById(dataValues, incidentActionPlanIds.responseObjectives);
+    const responseStrategies = getValueById(dataValues, incidentActionPlanIds.responseStrategies);
+    const expectedResults = getValueById(dataValues, incidentActionPlanIds.expectedResults);
+    const responseActivitiesNarrative = getValueById(
+        dataValues,
+        incidentActionPlanIds.responseActivitiesNarrative
+    );
+
+    const incidentActionPlan: IncidentActionPlanDataValues = {
+        id: id,
+        iapType: iapType,
+        phoecLevel: phoecLevel,
+        criticalInfoRequirements: criticalInfoRequirements,
+        planningAssumptions: planningAssumptions,
+        responseObjectives: responseObjectives,
+        responseStrategies: responseStrategies,
+        expectedResults: expectedResults,
+        responseActivitiesNarrative: responseActivitiesNarrative,
+    };
+
+    return incidentActionPlan;
+}
+
+export function mapDataElementsToIncidentResponseActions(
+    id: Id,
+    dataValues: DataValue[]
+): IncidentResponseActionsDataValues {
+    const fromMap = (key: keyof typeof responseActionConstants) => getValueFromMap(key, dataValues);
+
+    const mainTask = getValueById(dataValues, incidentResponseActionsIds.mainTask);
+    const subActivities = getValueById(dataValues, incidentResponseActionsIds.subActivities);
+    const subPillar = getValueById(dataValues, incidentResponseActionsIds.subPillar);
+    const searchAssignRO = getValueById(dataValues, incidentResponseActionsIds.searchAssignRO);
+    const dueDate = getValueById(dataValues, incidentResponseActionsIds.dueDate);
+    const timeLine = getValueById(dataValues, incidentResponseActionsIds.timeLine);
+
+    const status = statusMap[fromMap("status")];
+    const verification = verificationMap[fromMap("verification")];
+
+    const incidentActionPlan: IncidentResponseActionsDataValues = {
+        id: id,
+        mainTask: mainTask,
+        subActivities: subActivities,
+        subPillar: subPillar,
+        searchAssignRO: searchAssignRO,
+        dueDate: dueDate,
+        timeLine: timeLine,
+        status: status,
+        verification: verification,
+    };
+
+    return incidentActionPlan;
+}
+
+function getValueFromMap(
+    key: keyof typeof responseActionConstants,
+    dataValues: DataValue[]
+): string {
+    return (
+        dataValues.find(dataValue => dataValue.value === responseActionConstants[key])?.value ?? ""
+    );
+}
+
+export function mapIncidentActionToDataElements(
+    formData: ActionPlanFormData | ResponseActionFormData,
+    programStageId: Id,
+    teiId: Id,
+    enrollmentId: Id,
+    programStageDataElementsMetadata: D2ProgramStageDataElementsMetadata[]
+) {
+    if (!formData.entity) throw new Error("No form data found");
+
+    switch (formData.type) {
+        case "incident-action-plan":
+            return mapIncidentActionPlanToDataElements(
+                programStageId,
+                teiId,
+                enrollmentId,
+                formData.entity,
+                programStageDataElementsMetadata
+            );
+        case "incident-response-action":
+            return mapIncidentResponseActionToDataElements(
+                programStageId,
+                teiId,
+                enrollmentId,
+                formData.entity,
+                programStageDataElementsMetadata
+            );
+        default:
+            throw new Error("Form type not supported");
+    }
+}
+
+function mapIncidentActionPlanToDataElements(
+    programStageId: Id,
+    teiId: Id,
+    enrollmentId: Id,
+    incidentActionPlan: ActionPlanAttrs,
+    programStageDataElementsMetadata: D2ProgramStageDataElementsMetadata[]
+): D2TrackerEvent {
+    const dataElementValues: Record<ActionPlanCodes, string> =
+        getValueFromIncidentActionPlan(incidentActionPlan);
+
+    const dataValues: DataValue[] = programStageDataElementsMetadata.map(programStage => {
+        if (!isStringInIncidentActionPlanCodes(programStage.dataElement.code)) {
+            throw new Error(
+                `DataElement code ${programStage.dataElement.code} not found in Incident Action Plan Codes`
+            );
+        }
+        const typedCode: IncidentActionPlanKeyCode = programStage.dataElement.code;
+        return getPopulatedDataElement(programStage.dataElement.id, dataElementValues[typedCode]);
+    });
+
+    return getIncidentActionTrackerEvent(
+        programStageId,
+        incidentActionPlan.id,
+        enrollmentId,
+        dataValues,
+        teiId
+    );
+}
+
+function mapIncidentResponseActionToDataElements(
+    programStageId: Id,
+    teiId: Id,
+    enrollmentId: Id,
+    incidentResponseAction: ResponseAction,
+    programStageDataElementsMetadata: D2ProgramStageDataElementsMetadata[]
+): D2TrackerEvent {
+    const dataElementValues: Record<ResponseActionCodes, string> =
+        getValueFromIncidentResponseAction(incidentResponseAction);
+
+    const dataValues: DataValue[] = programStageDataElementsMetadata.map(programStage => {
+        if (!isStringInIncidentResponseActionCodes(programStage.dataElement.code)) {
+            throw new Error(
+                `DataElement code ${programStage.dataElement.code} not found in Incident Action Plan Codes`
+            );
+        }
+        const typedCode: IncidentResponseActionKeyCode = programStage.dataElement.code;
+
+        return getPopulatedDataElement(programStage.dataElement.id, dataElementValues[typedCode]);
+    });
+
+    return getIncidentActionTrackerEvent(
+        programStageId,
+        incidentResponseAction.id,
+        enrollmentId,
+        dataValues,
+        teiId
+    );
+}
+
+function getPopulatedDataElement(dataElement: Id, value: Maybe<string>): DataValue {
+    const populatedDataElement: DataValue = {
+        dataElement: dataElement,
+        value: value ?? "",
+        updatedAt: new Date().toISOString(),
+        storedBy: "",
+        createdAt: new Date().toISOString(),
+        providedElsewhere: false,
+    };
+
+    return populatedDataElement;
+}
+
+function getIncidentActionTrackerEvent(
+    programStageId: Id,
+    id: Maybe<Id>,
+    enrollmentId: Id,
+    dataValues: DataValue[],
+    teiId: Id
+): D2TrackerEvent {
+    const d2IncidentAction: D2TrackerEvent = {
+        event: id ?? "",
+        status: "ACTIVE",
+        program: RTSL_ZEBRA_PROGRAM_ID,
+        programStage: programStageId,
+        enrollment: enrollmentId,
+        orgUnit: RTSL_ZEBRA_ORG_UNIT_ID,
+        occurredAt: new Date().toISOString(),
+        dataValues: dataValues,
+        trackedEntity: teiId,
+    };
+
+    return d2IncidentAction;
+}
+
+function getValueById(dataValues: DataValue[], dataElement: string): Maybe<string> {
+    return dataValues.find(dataValue => dataValue.dataElement === dataElement)?.value;
+}
diff --git a/src/data/repositories/utils/RiskAssessmentMapper.ts b/src/data/repositories/utils/RiskAssessmentMapper.ts
index 9d0650cf..88d28e9c 100644
--- a/src/data/repositories/utils/RiskAssessmentMapper.ts
+++ b/src/data/repositories/utils/RiskAssessmentMapper.ts
@@ -36,7 +36,7 @@ import {
 } from "../../../domain/entities/ConfigurableForm";
 import { RiskAssessmentQuestionnaire } from "../../../domain/entities/risk-assessment/RiskAssessmentQuestionnaire";
 
-type D2ProgramStageDataElementsMetadata = {
+export type D2ProgramStageDataElementsMetadata = {
     dataElement: SelectedPick<
         D2DataElementSchema,
         {
diff --git a/src/domain/entities/ConfigurableForm.ts b/src/domain/entities/ConfigurableForm.ts
index 8eb1c5f4..e390c51b 100644
--- a/src/domain/entities/ConfigurableForm.ts
+++ b/src/domain/entities/ConfigurableForm.ts
@@ -10,6 +10,8 @@ import { FormType } from "../../webapp/pages/form-page/FormPage";
 import { RiskAssessmentGrading } from "./risk-assessment/RiskAssessmentGrading";
 import { RiskAssessmentSummary } from "./risk-assessment/RiskAssessmentSummary";
 import { RiskAssessmentQuestionnaire } from "./risk-assessment/RiskAssessmentQuestionnaire";
+import { ActionPlanAttrs } from "./incident-action-plan/ActionPlan";
+import { ResponseAction } from "./incident-action-plan/ResponseAction";
 
 export type DiseaseOutbreakEventOptions = {
     dataSources: Option[];
@@ -48,6 +50,17 @@ export type RiskAssessmentQuestionnaireOptions = {
     risk: Option[];
 };
 
+export type IncidentActionPlanOptions = {
+    iapType: Option[];
+    phoecLevel: Option[];
+};
+
+export type IncidentResponseActionOptions = {
+    searchAssignRO: TeamMember[];
+    status: Option[];
+    verification: Option[];
+};
+
 export type FormLables = {
     errors: Record<string, string>;
 };
@@ -84,8 +97,24 @@ export type RiskAssessmentQuestionnaireFormData = BaseFormData & {
     options: RiskAssessmentQuestionnaireOptions;
 };
 
+export type ActionPlanFormData = BaseFormData & {
+    type: "incident-action-plan";
+    eventTrackerDetails: DiseaseOutbreakEvent;
+    entity: Maybe<ActionPlanAttrs>;
+    options: IncidentActionPlanOptions;
+};
+
+export type ResponseActionFormData = BaseFormData & {
+    type: "incident-response-action";
+    eventTrackerDetails: DiseaseOutbreakEvent;
+    entity: Maybe<ResponseAction>;
+    options: IncidentResponseActionOptions;
+};
+
 export type ConfigurableForm =
     | DiseaseOutbreakEventFormData
     | RiskAssessmentGradingFormData
     | RiskAssessmentSummaryFormData
-    | RiskAssessmentQuestionnaireFormData;
+    | RiskAssessmentQuestionnaireFormData
+    | ActionPlanFormData
+    | ResponseActionFormData;
diff --git a/src/domain/entities/incident-action-plan/ActionPlan.ts b/src/domain/entities/incident-action-plan/ActionPlan.ts
index 09336e77..b5f2b84a 100644
--- a/src/domain/entities/incident-action-plan/ActionPlan.ts
+++ b/src/domain/entities/incident-action-plan/ActionPlan.ts
@@ -1,8 +1,16 @@
-import { Property } from "../Properties";
 import { Struct } from "../generic/Struct";
+import { Id } from "../Ref";
 
-interface ActionPlanAttrs {
-    properties: Property[];
-}
+export type ActionPlanAttrs = {
+    id: Id;
+    iapType: string;
+    phoecLevel: string;
+    criticalInfoRequirements: string;
+    planningAssumptions: string;
+    responseObjectives: string;
+    responseStrategies: string;
+    expectedResults: string;
+    responseActivitiesNarrative: string;
+};
 
 export class ActionPlan extends Struct<ActionPlanAttrs>() {}
diff --git a/src/domain/entities/incident-action-plan/IncidentActionPlan.ts b/src/domain/entities/incident-action-plan/IncidentActionPlan.ts
index 222a8df2..8654dd1d 100644
--- a/src/domain/entities/incident-action-plan/IncidentActionPlan.ts
+++ b/src/domain/entities/incident-action-plan/IncidentActionPlan.ts
@@ -2,10 +2,11 @@ import { ActionPlan } from "./ActionPlan";
 import { Ref } from "../Ref";
 import { Struct } from "../generic/Struct";
 import { ResponseAction } from "./ResponseAction";
+import { Maybe } from "../../../utils/ts-utils";
 
 interface IncidentActionPlanAttrs extends Ref {
     lastUpdated: Date;
-    actionPlan: ActionPlan;
+    actionPlan: Maybe<ActionPlan>;
     responseActions: ResponseAction[];
 }
 
diff --git a/src/domain/entities/incident-action-plan/ResponseAction.ts b/src/domain/entities/incident-action-plan/ResponseAction.ts
index 1d2c268c..2c32d2a8 100644
--- a/src/domain/entities/incident-action-plan/ResponseAction.ts
+++ b/src/domain/entities/incident-action-plan/ResponseAction.ts
@@ -1,22 +1,33 @@
-import { CodedNamedRef } from "../Ref";
+import { Maybe } from "../../../utils/ts-utils";
+import { Id } from "../Ref";
 import { Struct } from "../generic/Struct";
 import { TeamMember } from "../incident-management-team/TeamMember";
 
-type ResponseActionStatusType = "NotDone" | "Pending" | "InProgress" | "Complete";
-type ResponseActionVerificationType = "Verified" | "Unverified";
-type MainTask = CodedNamedRef;
-type SubPillar = CodedNamedRef;
-type TimeLine = CodedNamedRef;
+export type ResponseActionStatusType = "Not done" | "Pending" | "In Progress" | "Complete";
+export type ResponseActionVerificationType = "Verified" | "Unverified";
+
+export enum Status {
+    RTSL_ZEB_OS_STATUS_NOT_DONE = "RTSL_ZEB_OS_STATUS_NOT_DONE",
+    RTSL_ZEB_OS_STATUS_PENDING = "RTSL_ZEB_OS_STATUS_PENDING",
+    RTSL_ZEB_OS_STATUS_IN_PROGRESS = "RTSL_ZEB_OS_STATUS_IN_PROGRESS",
+    RTSL_ZEB_OS_STATUS_COMPLETE = "RTSL_ZEB_OS_STATUS_COMPLETE",
+}
+
+export enum Verification {
+    RTSL_ZEB_OS_VERIFICATION_VERIFIED = "RTSL_ZEB_OS_VERIFICATION_VERIFIED",
+    RTSL_ZEB_OS_VERIFICATION_UNVERIFIED = "RTSL_ZEB_OS_VERIFICATION_UNVERIFIED",
+}
 
 interface ResponseActionAttrs {
-    mainTask: MainTask;
+    id: Id;
+    mainTask: string;
     subActivities: string;
-    subPillar: SubPillar;
-    responsibleOfficer: TeamMember;
+    subPillar: string;
+    searchAssignRO: Maybe<TeamMember>;
     dueDate: Date;
-    timeLine: TimeLine;
-    status: ResponseActionStatusType;
-    verification: ResponseActionVerificationType;
+    timeLine: string;
+    status: Status;
+    verification: Verification;
 }
 
 export class ResponseAction extends Struct<ResponseActionAttrs>() {}
diff --git a/src/domain/repositories/IncidentActionRepository.ts b/src/domain/repositories/IncidentActionRepository.ts
new file mode 100644
index 00000000..22fd46c0
--- /dev/null
+++ b/src/domain/repositories/IncidentActionRepository.ts
@@ -0,0 +1,19 @@
+import { FutureData } from "../../data/api-futures";
+import {
+    IncidentActionPlanDataValues,
+    IncidentResponseActionsDataValues,
+} from "../../data/repositories/IncidentActionD2Repository";
+import { Maybe } from "../../utils/ts-utils";
+import { ActionPlanFormData, ResponseActionFormData } from "../entities/ConfigurableForm";
+import { Id } from "../entities/Ref";
+
+export interface IncidentActionRepository {
+    getIncidentActionPlan(diseaseOutbreakId: Id): FutureData<Maybe<IncidentActionPlanDataValues>>;
+    getIncidentResponseActions(
+        diseaseOutbreakId: Id
+    ): FutureData<Maybe<IncidentResponseActionsDataValues>>;
+    saveIncidentAction(
+        formData: ActionPlanFormData | ResponseActionFormData,
+        diseaseOutbreakId: Id
+    ): FutureData<void>;
+}
diff --git a/src/domain/repositories/OptionsRepository.ts b/src/domain/repositories/OptionsRepository.ts
index 13227042..d543e3cb 100644
--- a/src/domain/repositories/OptionsRepository.ts
+++ b/src/domain/repositories/OptionsRepository.ts
@@ -47,4 +47,10 @@ export interface OptionsRepository {
     getLikelihoodOption(optionCode: Code): FutureData<Option>;
     getConsequencesOptions(): FutureData<Option[]>;
     getConsequencesOption(optionCode: Code): FutureData<Option>;
+    getIapTypeOptions(): FutureData<Option[]>;
+    getPhoecLevelOptions(): FutureData<Option[]>;
+    getStatusOptions(): FutureData<Option[]>;
+    getStatusOption(optionCode: Code): FutureData<Option>;
+    getVerificationOptions(): FutureData<Option[]>;
+    getVerificationOption(optionCode: Code): FutureData<Option>;
 }
diff --git a/src/domain/usecases/GetDiseaseOutbreakByIdUseCase.ts b/src/domain/usecases/GetDiseaseOutbreakByIdUseCase.ts
index 44bf45ca..08e62c27 100644
--- a/src/domain/usecases/GetDiseaseOutbreakByIdUseCase.ts
+++ b/src/domain/usecases/GetDiseaseOutbreakByIdUseCase.ts
@@ -3,10 +3,12 @@ import { DiseaseOutbreakEvent } from "../entities/disease-outbreak-event/Disease
 import { Future } from "../entities/generic/Future";
 import { Id } from "../entities/Ref";
 import { DiseaseOutbreakEventRepository } from "../repositories/DiseaseOutbreakEventRepository";
+import { IncidentActionRepository } from "../repositories/IncidentActionRepository";
 import { OptionsRepository } from "../repositories/OptionsRepository";
 import { OrgUnitRepository } from "../repositories/OrgUnitRepository";
 import { RiskAssessmentRepository } from "../repositories/RiskAssessmentRepository";
 import { TeamMemberRepository } from "../repositories/TeamMemberRepository";
+import { getIncidentAction } from "./utils/incident-action/GetIncidentActionById";
 import { getAll } from "./utils/risk-assessment/GetRiskAssessmentById";
 
 export class GetDiseaseOutbreakByIdUseCase {
@@ -17,6 +19,7 @@ export class GetDiseaseOutbreakByIdUseCase {
             teamMemberRepository: TeamMemberRepository;
             orgUnitRepository: OrgUnitRepository;
             riskAssessmentRepository: RiskAssessmentRepository;
+            incidentActionRepository: IncidentActionRepository;
         }
     ) {}
 
@@ -56,6 +59,12 @@ export class GetDiseaseOutbreakByIdUseCase {
                         this.options.optionsRepository,
                         this.options.teamMemberRepository
                     ),
+                    incidentAction: getIncidentAction(
+                        id,
+                        this.options.incidentActionRepository,
+                        this.options.optionsRepository,
+                        this.options.teamMemberRepository
+                    ),
                 }).flatMap(
                     ({
                         mainSyndrome,
@@ -65,6 +74,7 @@ export class GetDiseaseOutbreakByIdUseCase {
                         areasAffectedProvinces,
                         areasAffectedDistricts,
                         riskAssessment,
+                        incidentAction,
                     }) => {
                         const diseaseOutbreakEvent: DiseaseOutbreakEvent = new DiseaseOutbreakEvent(
                             {
@@ -77,7 +87,7 @@ export class GetDiseaseOutbreakByIdUseCase {
                                 areasAffectedDistricts: areasAffectedDistricts,
                                 incidentManager: incidentManager,
                                 riskAssessment: riskAssessment,
-                                incidentActionPlan: undefined, //TO DO : FIXME populate once incidentActionPlan repo is implemented
+                                incidentActionPlan: incidentAction,
                                 incidentManagementTeam: undefined, //TO DO : FIXME populate once incidentManagementTeam repo is implemented
                             }
                         );
diff --git a/src/domain/usecases/GetEntityWithOptionsUseCase.ts b/src/domain/usecases/GetEntityWithOptionsUseCase.ts
index ba83468c..72f82cc4 100644
--- a/src/domain/usecases/GetEntityWithOptionsUseCase.ts
+++ b/src/domain/usecases/GetEntityWithOptionsUseCase.ts
@@ -6,9 +6,14 @@ import { DiseaseOutbreakEvent } from "../entities/disease-outbreak-event/Disease
 import { Future } from "../entities/generic/Future";
 import { Id } from "../entities/Ref";
 import { DiseaseOutbreakEventRepository } from "../repositories/DiseaseOutbreakEventRepository";
+import { IncidentActionRepository } from "../repositories/IncidentActionRepository";
 import { OptionsRepository } from "../repositories/OptionsRepository";
 import { TeamMemberRepository } from "../repositories/TeamMemberRepository";
 import { getDiseaseOutbreakWithEventOptions } from "./utils/disease-outbreak/GetDiseaseOutbreakWithOptions";
+import {
+    getIncidentActionPlanWithOptions,
+    getIncidentResponseActionWithOptions,
+} from "./utils/incident-action/GetIncidentActionPlanWithOptions";
 import {
     getRiskAssessmentGradingWithOptions,
     getRiskAssessmentQuestionnaireWithOptions,
@@ -21,6 +26,7 @@ export class GetEntityWithOptionsUseCase {
             diseaseOutbreakEventRepository: DiseaseOutbreakEventRepository;
             optionsRepository: OptionsRepository;
             teamMemberRepository: TeamMemberRepository;
+            incidentActionRepository: IncidentActionRepository;
         }
     ) {}
 
@@ -60,6 +66,27 @@ export class GetEntityWithOptionsUseCase {
                     eventTrackerDetails,
                     this.options.optionsRepository
                 );
+            case "incident-action-plan":
+                if (!eventTrackerDetails)
+                    return Future.error(
+                        new Error("Disease outbreak id is required for incident action plan")
+                    );
+
+                return getIncidentActionPlanWithOptions(
+                    eventTrackerDetails,
+                    this.options.optionsRepository
+                );
+            case "incident-response-action":
+                if (!eventTrackerDetails)
+                    return Future.error(
+                        new Error("Disease outbreak id is required for incident action plan")
+                    );
+
+                return getIncidentResponseActionWithOptions(
+                    eventTrackerDetails,
+                    this.options.optionsRepository,
+                    this.options.teamMemberRepository
+                );
 
             default:
                 return Future.error(new Error("Form type not supported"));
diff --git a/src/domain/usecases/SaveEntityUseCase.ts b/src/domain/usecases/SaveEntityUseCase.ts
index 20eadae4..d66457bf 100644
--- a/src/domain/usecases/SaveEntityUseCase.ts
+++ b/src/domain/usecases/SaveEntityUseCase.ts
@@ -3,13 +3,15 @@ import { ConfigurableForm } from "../entities/ConfigurableForm";
 import { Future } from "../entities/generic/Future";
 import { Id } from "../entities/Ref";
 import { DiseaseOutbreakEventRepository } from "../repositories/DiseaseOutbreakEventRepository";
+import { IncidentActionRepository } from "../repositories/IncidentActionRepository";
 import { RiskAssessmentRepository } from "../repositories/RiskAssessmentRepository";
 import { saveDiseaseOutbreak } from "./utils/disease-outbreak/SaveDiseaseOutbreak";
 
 export class SaveEntityUseCase {
     constructor(
         private diseaseOutbreakEventRepository: DiseaseOutbreakEventRepository,
-        private riskAssessmentRepository: RiskAssessmentRepository
+        private riskAssessmentRepository: RiskAssessmentRepository,
+        private incidentActionRepository: IncidentActionRepository
     ) {}
 
     public execute(formData: ConfigurableForm): FutureData<void | Id> {
@@ -24,6 +26,12 @@ export class SaveEntityUseCase {
                     formData,
                     formData.eventTrackerDetails.id
                 );
+            case "incident-action-plan":
+            case "incident-response-action":
+                return this.incidentActionRepository.saveIncidentAction(
+                    formData,
+                    formData.eventTrackerDetails.id
+                );
 
             default:
                 return Future.error(new Error("Form type not supported"));
diff --git a/src/domain/usecases/utils/incident-action/GetIncidentActionById.ts b/src/domain/usecases/utils/incident-action/GetIncidentActionById.ts
new file mode 100644
index 00000000..9ee4930d
--- /dev/null
+++ b/src/domain/usecases/utils/incident-action/GetIncidentActionById.ts
@@ -0,0 +1,95 @@
+import { FutureData } from "../../../../data/api-futures";
+import { IncidentResponseActionsDataValues } from "../../../../data/repositories/IncidentActionD2Repository";
+import { Maybe } from "../../../../utils/ts-utils";
+import _c from "../../../entities/generic/Collection";
+import { Future } from "../../../entities/generic/Future";
+import { ActionPlan } from "../../../entities/incident-action-plan/ActionPlan";
+import { IncidentActionPlan } from "../../../entities/incident-action-plan/IncidentActionPlan";
+import {
+    ResponseAction,
+    Status,
+    Verification,
+} from "../../../entities/incident-action-plan/ResponseAction";
+import { Id } from "../../../entities/Ref";
+import { IncidentActionRepository } from "../../../repositories/IncidentActionRepository";
+import { OptionsRepository } from "../../../repositories/OptionsRepository";
+import { TeamMemberRepository } from "../../../repositories/TeamMemberRepository";
+
+export function getIncidentAction(
+    diseaseOutbreakId: Id,
+    incidentActionRepository: IncidentActionRepository,
+    optionsRepository: OptionsRepository,
+    teamMemberRepository: TeamMemberRepository
+): FutureData<Maybe<IncidentActionPlan>> {
+    return incidentActionRepository
+        .getIncidentActionPlan(diseaseOutbreakId)
+        .flatMap(incidentActionPlan => {
+            const actionPlan = new ActionPlan({
+                id: diseaseOutbreakId,
+                iapType: incidentActionPlan?.iapType ?? "",
+                phoecLevel: incidentActionPlan?.phoecLevel ?? "",
+                criticalInfoRequirements: incidentActionPlan?.criticalInfoRequirements ?? "",
+                planningAssumptions: incidentActionPlan?.planningAssumptions ?? "",
+                responseObjectives: incidentActionPlan?.responseObjectives ?? "",
+                responseStrategies: incidentActionPlan?.responseStrategies ?? "",
+                expectedResults: incidentActionPlan?.expectedResults ?? "",
+                responseActivitiesNarrative:
+                    incidentActionPlan?.responseActivitiesNarrative ?? "" ?? "",
+            });
+
+            return incidentActionRepository
+                .getIncidentResponseActions(diseaseOutbreakId)
+                .flatMap(responseActionDataValues => {
+                    return Future.joinObj(
+                        getIncidentResponseActionOptionFutures(
+                            responseActionDataValues,
+                            optionsRepository,
+                            teamMemberRepository
+                        )
+                    ).flatMap(responseActionOptions => {
+                        const searchAssignRO = responseActionOptions.searchAssignRO;
+
+                        const responseActions = new ResponseAction({
+                            id: diseaseOutbreakId,
+                            mainTask: responseActionDataValues?.mainTask ?? "",
+                            subActivities: responseActionDataValues?.subActivities ?? "",
+                            subPillar: responseActionDataValues?.subPillar ?? "",
+                            searchAssignRO: searchAssignRO,
+                            dueDate: responseActionDataValues?.dueDate
+                                ? new Date(responseActionDataValues.dueDate)
+                                : new Date(),
+                            timeLine: responseActionDataValues?.timeLine ?? "",
+                            status: responseActionOptions.status?.name as Status,
+                            verification: responseActionOptions.verification?.name as Verification,
+                        });
+
+                        const incidentAction = new IncidentActionPlan({
+                            id: diseaseOutbreakId,
+                            lastUpdated: new Date(),
+                            actionPlan: actionPlan,
+                            responseActions: [responseActions],
+                        });
+
+                        return Future.success(incidentAction);
+                    });
+                });
+        });
+}
+
+function getIncidentResponseActionOptionFutures(
+    responseActionsBase: Maybe<IncidentResponseActionsDataValues>,
+    optionsRepository: OptionsRepository,
+    teamMemberRepository: TeamMemberRepository
+) {
+    return {
+        searchAssignRO: responseActionsBase?.searchAssignRO
+            ? teamMemberRepository.get(responseActionsBase.searchAssignRO)
+            : Future.success(undefined),
+        status: responseActionsBase?.status
+            ? optionsRepository.getStatusOption(responseActionsBase.status)
+            : Future.success(undefined),
+        verification: responseActionsBase?.verification
+            ? optionsRepository.getVerificationOption(responseActionsBase.verification)
+            : Future.success(undefined),
+    };
+}
diff --git a/src/domain/usecases/utils/incident-action/GetIncidentActionPlanWithOptions.ts b/src/domain/usecases/utils/incident-action/GetIncidentActionPlanWithOptions.ts
new file mode 100644
index 00000000..4c12b379
--- /dev/null
+++ b/src/domain/usecases/utils/incident-action/GetIncidentActionPlanWithOptions.ts
@@ -0,0 +1,67 @@
+import { FutureData } from "../../../../data/api-futures";
+import { ActionPlanFormData, ResponseActionFormData } from "../../../entities/ConfigurableForm";
+import { DiseaseOutbreakEvent } from "../../../entities/disease-outbreak-event/DiseaseOutbreakEvent";
+import { Future } from "../../../entities/generic/Future";
+import { OptionsRepository } from "../../../repositories/OptionsRepository";
+import { TeamMemberRepository } from "../../../repositories/TeamMemberRepository";
+
+export function getIncidentActionPlanWithOptions(
+    eventTrackerDetails: DiseaseOutbreakEvent,
+    optionsRepository: OptionsRepository
+): FutureData<ActionPlanFormData> {
+    return Future.joinObj({
+        iapTypeOptions: optionsRepository.getIapTypeOptions(),
+        phoecLevelOptions: optionsRepository.getPhoecLevelOptions(),
+    }).flatMap(({ iapTypeOptions, phoecLevelOptions }) => {
+        const incidentActionPlanFormData: ActionPlanFormData = {
+            type: "incident-action-plan",
+            eventTrackerDetails: eventTrackerDetails,
+            entity: eventTrackerDetails.incidentActionPlan?.actionPlan,
+            options: {
+                iapType: iapTypeOptions,
+                phoecLevel: phoecLevelOptions,
+            },
+            // TODO: Get labels from Datastore used in mapEntityToInitialFormState to create initial form state
+            labels: {
+                errors: {
+                    field_is_required: "This field is required",
+                },
+            },
+            rules: [],
+        };
+
+        return Future.success(incidentActionPlanFormData);
+    });
+}
+
+export function getIncidentResponseActionWithOptions(
+    eventTrackerDetails: DiseaseOutbreakEvent,
+    optionsRepository: OptionsRepository,
+    teamMemberRepository: TeamMemberRepository
+): FutureData<ResponseActionFormData> {
+    return Future.joinObj({
+        responsibleOfficers: teamMemberRepository.getAll(),
+        statusOptions: optionsRepository.getStatusOptions(),
+        verificationOptions: optionsRepository.getVerificationOptions(),
+    }).flatMap(({ responsibleOfficers, statusOptions, verificationOptions }) => {
+        const incidentResponseActionData: ResponseActionFormData = {
+            type: "incident-response-action",
+            eventTrackerDetails: eventTrackerDetails,
+            entity: eventTrackerDetails.incidentActionPlan?.responseActions[0],
+            options: {
+                searchAssignRO: responsibleOfficers,
+                status: statusOptions,
+                verification: verificationOptions,
+            },
+            // TODO: Get labels from Datastore used in mapEntityToInitialFormState to create initial form state
+            labels: {
+                errors: {
+                    field_is_required: "This field is required",
+                },
+            },
+            rules: [],
+        };
+
+        return Future.success(incidentResponseActionData);
+    });
+}
diff --git a/src/webapp/components/form/form-summary/ActionPlanFormSummary.tsx b/src/webapp/components/form/form-summary/ActionPlanFormSummary.tsx
new file mode 100644
index 00000000..0d53f75d
--- /dev/null
+++ b/src/webapp/components/form/form-summary/ActionPlanFormSummary.tsx
@@ -0,0 +1,71 @@
+import React, { useCallback, useEffect } from "react";
+import styled from "styled-components";
+import i18n from "@eyeseetea/d2-ui-components/locales";
+import { Section } from "../../section/Section";
+import { Box, Button, Typography } from "@material-ui/core";
+import { RouteName, useRoutes } from "../../../hooks/useRoutes";
+import { EditOutlined } from "@material-ui/icons";
+import { Loader } from "../../loader/Loader";
+import { useSnackbar } from "@eyeseetea/d2-ui-components";
+import { FormSummaryProps } from "./FormSummary";
+
+export const ActionPlanFormSummary: React.FC<FormSummaryProps> = React.memo(props => {
+    const { id, formType, formSummary, summaryError } = props;
+    const { goTo } = useRoutes();
+    const snackbar = useSnackbar();
+
+    useEffect(() => {
+        if (!summaryError) return;
+
+        snackbar.error(summaryError);
+        goTo(RouteName.DASHBOARD);
+    }, [summaryError, snackbar, goTo]);
+
+    const editButton = (
+        <Button
+            variant="outlined"
+            color="secondary"
+            onClick={() => {
+                goTo(RouteName.EDIT_FORM, { formType: formType, id: id }); //TO DO : Change to dynamic formType when available
+            }}
+            startIcon={<EditOutlined />}
+        >
+            {i18n.t("Edit Action Plan")}
+        </Button>
+    );
+
+    const getSummaryColumn = useCallback((index: number, label: string, value: string) => {
+        return (
+            <Typography key={index}>
+                <Box fontWeight="bold">{i18n.t(label)}:</Box> {i18n.t(value)}
+            </Typography>
+        );
+    }, []);
+
+    return formSummary ? (
+        <>
+            <Section
+                title={formSummary.subTitle}
+                hasSeparator={true}
+                headerButton={editButton}
+                titleVariant="secondary"
+            >
+                <SummaryContainer>
+                    {formSummary.summary.map((labelWithValue, index) =>
+                        getSummaryColumn(index, labelWithValue.label, labelWithValue.value)
+                    )}
+                </SummaryContainer>
+            </Section>
+        </>
+    ) : (
+        <Loader />
+    );
+});
+
+const SummaryContainer = styled.div`
+    display: flex;
+    flex-direction: column;
+    margin-top: 0rem;
+    color: ${props => props.theme.palette.text.hint};
+    gap: 1rem;
+`;
diff --git a/src/webapp/components/layout/side-bar/SideBarContent.tsx b/src/webapp/components/layout/side-bar/SideBarContent.tsx
index 21717a9d..243a16fa 100644
--- a/src/webapp/components/layout/side-bar/SideBarContent.tsx
+++ b/src/webapp/components/layout/side-bar/SideBarContent.tsx
@@ -1,7 +1,7 @@
 import { List, ListItem, ListItemText } from "@material-ui/core";
 import React, { useCallback } from "react";
 import styled from "styled-components";
-import { NavLink } from "react-router-dom";
+import { NavLink, useParams } from "react-router-dom";
 import { AddCircleOutline } from "@material-ui/icons";
 
 import i18n from "../../../../utils/i18n";
@@ -44,6 +44,9 @@ const DEFAULT_SIDEBAR_OPTIONS: SideBarOption[] = [
 
 export const SideBarContent: React.FC<SideBarContentProps> = React.memo(
     ({ children, hideOptions = false, showCreateEvent = false }) => {
+        const { id } = useParams<{
+            id: string;
+        }>();
         const { goTo } = useRoutes();
 
         const goToCreateEvent = useCallback(() => {
@@ -63,7 +66,12 @@ export const SideBarContent: React.FC<SideBarContentProps> = React.memo(
                 ) : (
                     <StyledList>
                         {DEFAULT_SIDEBAR_OPTIONS.map(({ text, value }) => (
-                            <ListItem button key={text} component={NavLink} to={routes[value]}>
+                            <ListItem
+                                button
+                                key={text}
+                                component={NavLink}
+                                to={getSideBarRoute(id, value)}
+                            >
                                 <StyledText primary={i18n.t(text)} selected={false} />
                             </ListItem>
                         ))}
@@ -106,3 +114,8 @@ const CreateEventContainer = styled.div`
     margin-inline-start: 30px;
     width: 245px;
 `;
+
+function getSideBarRoute(id: string, value: RouteName) {
+    const route = routes[value];
+    return route.includes(":id") ? route.replace(":id", id) : route;
+}
diff --git a/src/webapp/hooks/useRoutes.ts b/src/webapp/hooks/useRoutes.ts
index f7285bd8..02da51d8 100644
--- a/src/webapp/hooks/useRoutes.ts
+++ b/src/webapp/hooks/useRoutes.ts
@@ -19,6 +19,8 @@ const formTypes = [
     "risk-assessment-grading",
     "risk-assessment-summary",
     "risk-assessment-questionnaire",
+    "incident-action-plan",
+    "incident-response-action",
 ] as const satisfies FormType[];
 
 const formType = `:formType(${join(formTypes, "|")})` as const;
@@ -28,7 +30,7 @@ export const routes: Record<RouteName, string> = {
     [RouteName.EDIT_FORM]: `/edit/${formType}/:id`,
     [RouteName.EVENT_TRACKER]: "/event-tracker/:id",
     [RouteName.IM_TEAM_BUILDER]: "/incident-management-team-builder",
-    [RouteName.INCIDENT_ACTION_PLAN]: "/incident-action-plan",
+    [RouteName.INCIDENT_ACTION_PLAN]: "/incident-action-plan/:id",
     [RouteName.RESOURCES]: "/resources",
     [RouteName.DASHBOARD]: "/",
 } as const;
@@ -38,7 +40,7 @@ type RouteParams = {
     [RouteName.EDIT_FORM]: { formType: FormType; id: string };
     [RouteName.EVENT_TRACKER]: { id: string };
     [RouteName.IM_TEAM_BUILDER]: undefined;
-    [RouteName.INCIDENT_ACTION_PLAN]: undefined;
+    [RouteName.INCIDENT_ACTION_PLAN]: { id: string };
     [RouteName.RESOURCES]: undefined;
     [RouteName.DASHBOARD]: undefined;
 };
diff --git a/src/webapp/pages/form-page/FormPage.tsx b/src/webapp/pages/form-page/FormPage.tsx
index ddf1afde..f62ce148 100644
--- a/src/webapp/pages/form-page/FormPage.tsx
+++ b/src/webapp/pages/form-page/FormPage.tsx
@@ -11,7 +11,9 @@ export type FormType =
     | "disease-outbreak-event"
     | "risk-assessment-grading"
     | "risk-assessment-questionnaire"
-    | "risk-assessment-summary";
+    | "risk-assessment-summary"
+    | "incident-action-plan"
+    | "incident-response-action";
 
 export const FormPage: React.FC = React.memo(() => {
     const { formType, id } = useParams<{
diff --git a/src/webapp/pages/form-page/disease-outbreak-event/utils/updateDiseaseOutbreakEventFormState.ts b/src/webapp/pages/form-page/disease-outbreak-event/utils/updateDiseaseOutbreakEventFormState.ts
index cb8863b9..da16aeb0 100644
--- a/src/webapp/pages/form-page/disease-outbreak-event/utils/updateDiseaseOutbreakEventFormState.ts
+++ b/src/webapp/pages/form-page/disease-outbreak-event/utils/updateDiseaseOutbreakEventFormState.ts
@@ -60,11 +60,14 @@ function validateFormState(
 
         case "risk-assessment-grading":
             break;
-
         case "risk-assessment-summary":
             break;
         case "risk-assessment-questionnaire":
             break;
+        case "incident-action-plan":
+            break;
+        case "incident-response-action":
+            break;
     }
 
     return [...formValidationErrors, ...entityValidationErrors];
diff --git a/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts b/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
new file mode 100644
index 00000000..996d5ed3
--- /dev/null
+++ b/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
@@ -0,0 +1,395 @@
+import {
+    actionPlanConstants,
+    responseActionConstants,
+} from "../../../../data/repositories/consts/IncidentActionConstants";
+import {
+    ActionPlanFormData,
+    ResponseActionFormData,
+} from "../../../../domain/entities/ConfigurableForm";
+import { FormSectionState } from "../../../components/form/FormSectionsState";
+import { FormState } from "../../../components/form/FormState";
+import { Option as UIOption } from "../../../components/utils/option";
+import { mapToPresentationOptions } from "../mapEntityToFormState";
+
+type ActionPlanSectionKeys =
+    | "iapType"
+    | "phoecLevel"
+    | "criticalInfoRequirements"
+    | "planningAssumptions"
+    | "responseObjectives"
+    | "responseStrategies"
+    | "expectedResults"
+    | "responseActivitiesNarrative";
+
+type ResponseActionSectionKeys =
+    | "mainTask"
+    | "subActivities"
+    | "subPillar"
+    | "searchAssignRO"
+    | "dueDate"
+    | "timeline"
+    | "status"
+    | "verification";
+
+export function mapIncidentActionPlanToInitialFormState(
+    incidentActionPlanFormData: ActionPlanFormData
+): FormState {
+    const { entity: incidentActionPlan, eventTrackerDetails, options } = incidentActionPlanFormData;
+    const { iapType, phoecLevel } = options;
+
+    const iapTypeOptions: UIOption[] = mapToPresentationOptions(iapType);
+    const phoexLevelOptions: UIOption[] = mapToPresentationOptions(phoecLevel);
+
+    const mainSections: Record<ActionPlanSectionKeys, FormSectionState> = {
+        iapType: {
+            title: "IAP type",
+            id: "iap_type_section",
+            isVisible: true,
+            required: true,
+            direction: "column",
+            fields: [
+                {
+                    id: `${actionPlanConstants.iapType}-section`,
+                    isVisible: true,
+                    errors: [],
+                    type: "select",
+                    multiple: false,
+                    options: iapTypeOptions,
+                    value: incidentActionPlan?.iapType || "",
+                    required: true,
+                },
+            ],
+        },
+        phoecLevel: {
+            title: "PHOEC level",
+            id: "phoec_level_section",
+            isVisible: true,
+            required: true,
+            direction: "column",
+            fields: [
+                {
+                    id: `${actionPlanConstants.phoecLevel}-section`,
+                    isVisible: true,
+                    errors: [],
+                    type: "select",
+                    multiple: false,
+                    options: phoexLevelOptions,
+                    value: incidentActionPlan?.phoecLevel || "",
+                    required: true,
+                },
+            ],
+        },
+        criticalInfoRequirements: {
+            title: "Response mode critical information requirements (CIRs)",
+            id: "critical_info_requirements_section",
+            isVisible: true,
+            required: true,
+            direction: "column",
+            fields: [
+                {
+                    id: `${actionPlanConstants.criticalInfoRequirements}-section`,
+                    isVisible: true,
+                    errors: [],
+                    type: "text",
+                    value: incidentActionPlan?.criticalInfoRequirements || "",
+                    multiline: true,
+                    required: true,
+                },
+            ],
+        },
+        planningAssumptions: {
+            title: "Planning assumptions",
+            id: "planning_assumptions_section",
+            isVisible: true,
+            required: true,
+            direction: "column",
+            fields: [
+                {
+                    id: `${actionPlanConstants.planningAssumptions}-section`,
+                    isVisible: true,
+                    errors: [],
+                    type: "text",
+                    value: incidentActionPlan?.planningAssumptions || "",
+                    multiline: true,
+                    required: true,
+                    helperText:
+                        "Evidence based facts and assumptions in the context of developing the plan.",
+                },
+            ],
+        },
+        responseObjectives: {
+            title: "Response objectives",
+            id: "response_objectives_section",
+            isVisible: true,
+            required: true,
+            direction: "column",
+            fields: [
+                {
+                    id: `${actionPlanConstants.responseObjectives}-section`,
+                    isVisible: true,
+                    errors: [],
+                    type: "text",
+                    value: incidentActionPlan?.responseObjectives || "",
+                    multiline: true,
+                    required: true,
+                    helperText: "SMART: Specific, measurable, achievable, relevant, time-bound",
+                },
+            ],
+        },
+        responseStrategies: {
+            title: "Response strategies",
+            id: "response_strategies_section",
+            isVisible: true,
+            required: true,
+            direction: "column",
+            fields: [
+                {
+                    id: `${actionPlanConstants.responseStrategies}-section`,
+                    isVisible: true,
+                    errors: [],
+                    type: "text",
+                    value: incidentActionPlan?.responseStrategies || "",
+                    multiline: true,
+                    required: true,
+                },
+            ],
+        },
+        expectedResults: {
+            title: "Expected results",
+            id: "expected_results_section",
+            isVisible: true,
+            direction: "column",
+            fields: [
+                {
+                    id: `${actionPlanConstants.expectedResults}-section`,
+                    isVisible: true,
+                    errors: [],
+                    type: "text",
+                    value: incidentActionPlan?.expectedResults || "",
+                    multiline: true,
+                    helperText: "Clear objectives for functional area",
+                },
+            ],
+        },
+        responseActivitiesNarrative: {
+            title: "Response activities narrative",
+            id: "response_activities_narrative_section",
+            isVisible: true,
+            direction: "column",
+            fields: [
+                {
+                    id: `${actionPlanConstants.responseActivitiesNarrative}-section`,
+                    isVisible: true,
+                    errors: [],
+                    type: "text",
+                    value: incidentActionPlan?.responseActivitiesNarrative || "",
+                    multiline: true,
+                },
+            ],
+        },
+    };
+
+    return {
+        id: eventTrackerDetails.id ?? "",
+        title: "Incident Action Plan",
+        subtitle: eventTrackerDetails.name,
+        titleDescripton: "Step 1:",
+        subtitleDescripton: "Define the action plan",
+        saveButtonLabel: "Save & Continue",
+        // isValid: incidentActionPlan ? true : false,
+        isValid: true,
+        sections: [
+            mainSections.iapType,
+            mainSections.phoecLevel,
+            mainSections.criticalInfoRequirements,
+            mainSections.planningAssumptions,
+            mainSections.responseObjectives,
+            mainSections.responseStrategies,
+            mainSections.expectedResults,
+            mainSections.responseActivitiesNarrative,
+        ],
+    };
+}
+
+export function mapIncidentResponseActionToInitialFormState(
+    incidentResponseActionFormData: ResponseActionFormData
+): FormState {
+    const {
+        entity: incidentResponseActions,
+        eventTrackerDetails,
+        options,
+    } = incidentResponseActionFormData;
+
+    const { searchAssignRO, status, verification } = options;
+
+    const searchAssignROOptions: UIOption[] = mapToPresentationOptions(searchAssignRO);
+    const statusOptions: UIOption[] = mapToPresentationOptions(status);
+    const verificationOptions: UIOption[] = mapToPresentationOptions(verification);
+
+    const mainSections: Record<ResponseActionSectionKeys, FormSectionState> = {
+        mainTask: {
+            title: "Main task",
+            id: "main_task_section",
+            isVisible: true,
+            required: true,
+            fields: [
+                {
+                    id: `${responseActionConstants.mainTask}-section`,
+                    placeholder: "Select..",
+                    isVisible: true,
+                    errors: [],
+                    value: incidentResponseActions?.mainTask || "",
+                    type: "text",
+                    required: true,
+                },
+            ],
+        },
+        subActivities: {
+            title: "Sub activities",
+            id: "sub_activities_section",
+            isVisible: true,
+            required: true,
+            fields: [
+                {
+                    id: `${responseActionConstants.subActivities}-section`,
+                    placeholder: "Select..",
+                    isVisible: true,
+                    errors: [],
+                    value: incidentResponseActions?.subActivities || "",
+                    type: "text",
+                    required: true,
+                },
+            ],
+        },
+        subPillar: {
+            title: "Sub pilar",
+            id: "sub_pillar_section",
+            isVisible: true,
+            required: true,
+            fields: [
+                {
+                    id: `${responseActionConstants.subPillar}-section`,
+                    placeholder: "Select..",
+                    isVisible: true,
+                    errors: [],
+                    value: incidentResponseActions?.subPillar || "",
+                    type: "text",
+                    required: true,
+                },
+            ],
+        },
+        searchAssignRO: {
+            title: "Responsible officer",
+            id: "responsible_officer_section",
+            isVisible: true,
+            required: true,
+            fields: [
+                {
+                    id: `${responseActionConstants.searchAssignRO}-section`,
+                    placeholder: "Select..",
+                    isVisible: true,
+                    errors: [],
+                    value: incidentResponseActions?.searchAssignRO?.name || "",
+                    type: "select",
+                    multiple: false,
+                    options: searchAssignROOptions,
+                    required: true,
+                },
+            ],
+        },
+        dueDate: {
+            title: "Due date",
+            id: "due_date_section",
+            isVisible: true,
+            required: true,
+            fields: [
+                {
+                    id: `${responseActionConstants.dueDate}-section`,
+                    placeholder: "Select..",
+                    isVisible: true,
+                    errors: [],
+                    type: "date",
+                    required: true,
+                    value: incidentResponseActions?.dueDate || new Date(),
+                    width: "200px",
+                },
+            ],
+        },
+        timeline: {
+            title: "Time line",
+            id: "time_line_section",
+            isVisible: true,
+            required: true,
+            fields: [
+                {
+                    id: `${responseActionConstants.timeLine}-section`,
+                    placeholder: "Select..",
+                    isVisible: true,
+                    errors: [],
+                    value: incidentResponseActions?.timeLine || "",
+                    type: "text",
+                    required: true,
+                },
+            ],
+        },
+        status: {
+            title: "Status",
+            id: "status_section",
+            isVisible: true,
+            required: true,
+            fields: [
+                {
+                    id: `${responseActionConstants.status}-section`,
+                    placeholder: "Select..",
+                    isVisible: true,
+                    errors: [],
+                    value: incidentResponseActions?.status || "",
+                    type: "select",
+                    multiple: false,
+                    options: statusOptions,
+                    required: true,
+                },
+            ],
+        },
+        verification: {
+            title: "Verification",
+            id: "verification_section",
+            isVisible: true,
+            required: true,
+            fields: [
+                {
+                    id: `${responseActionConstants.verification}-section`,
+                    placeholder: "Select..",
+                    isVisible: true,
+                    errors: [],
+                    value: incidentResponseActions?.verification || "",
+                    type: "select",
+                    multiple: false,
+                    options: verificationOptions,
+                    required: true,
+                },
+            ],
+        },
+    };
+
+    return {
+        id: eventTrackerDetails.id ?? "",
+        title: "Incident Action Plan",
+        subtitle: eventTrackerDetails.name,
+        titleDescripton: "Step 2:",
+        subtitleDescripton: "Assign response actions",
+        saveButtonLabel: "Save plan",
+        // isValid: incidentResponseActions ? true : false,
+        isValid: true,
+        sections: [
+            mainSections.mainTask,
+            mainSections.subActivities,
+            mainSections.subPillar,
+            mainSections.searchAssignRO,
+            mainSections.dueDate,
+            mainSections.timeline,
+            mainSections.status,
+            mainSections.verification,
+        ],
+    };
+}
diff --git a/src/webapp/pages/form-page/mapEntityToFormState.ts b/src/webapp/pages/form-page/mapEntityToFormState.ts
index 125e68b5..7cce5dad 100644
--- a/src/webapp/pages/form-page/mapEntityToFormState.ts
+++ b/src/webapp/pages/form-page/mapEntityToFormState.ts
@@ -5,6 +5,10 @@ import { FormState } from "../../components/form/FormState";
 import { User } from "../../components/user-selector/UserSelector";
 import { Option as PresentationOption } from "../../components/utils/option";
 import { mapDiseaseOutbreakEventToInitialFormState } from "./disease-outbreak-event/mapDiseaseOutbreakEventToInitialFormState";
+import {
+    mapIncidentActionPlanToInitialFormState,
+    mapIncidentResponseActionToInitialFormState,
+} from "./incident-action/mapIncidentActionToInitialFormState";
 import {
     mapRiskAssessmentQuestionnaireToInitialFormState,
     mapRiskAssessmentSummaryToInitialFormState,
@@ -24,6 +28,10 @@ export function mapEntityToFormState(
             return mapRiskAssessmentSummaryToInitialFormState(configurableForm);
         case "risk-assessment-questionnaire":
             return mapRiskAssessmentQuestionnaireToInitialFormState(configurableForm);
+        case "incident-action-plan":
+            return mapIncidentActionPlanToInitialFormState(configurableForm);
+        case "incident-response-action":
+            return mapIncidentResponseActionToInitialFormState(configurableForm);
     }
 }
 
diff --git a/src/webapp/pages/form-page/mapFormStateToEntityData.ts b/src/webapp/pages/form-page/mapFormStateToEntityData.ts
index 4eb7f7e6..2f2b8603 100644
--- a/src/webapp/pages/form-page/mapFormStateToEntityData.ts
+++ b/src/webapp/pages/form-page/mapFormStateToEntityData.ts
@@ -17,9 +17,11 @@ import {
 import {
     ConfigurableForm,
     DiseaseOutbreakEventFormData,
+    ActionPlanFormData,
     RiskAssessmentGradingFormData,
     RiskAssessmentQuestionnaireFormData,
     RiskAssessmentSummaryFormData,
+    ResponseActionFormData,
 } from "../../../domain/entities/ConfigurableForm";
 import { Maybe } from "../../../utils/ts-utils";
 import { RiskAssessmentGrading } from "../../../domain/entities/risk-assessment/RiskAssessmentGrading";
@@ -34,6 +36,16 @@ import {
     RiskAssessmentQuestion,
     RiskAssessmentQuestionnaire,
 } from "../../../domain/entities/risk-assessment/RiskAssessmentQuestionnaire";
+import { ActionPlanAttrs } from "../../../domain/entities/incident-action-plan/ActionPlan";
+import {
+    actionPlanConstants as actionPlanConstants,
+    responseActionConstants,
+} from "../../../data/repositories/consts/IncidentActionConstants";
+import {
+    ResponseAction,
+    Status,
+    Verification,
+} from "../../../domain/entities/incident-action-plan/ResponseAction";
 
 export function mapFormStateToEntityData(
     formState: FormState,
@@ -81,6 +93,24 @@ export function mapFormStateToEntityData(
             };
             return riskQuestionnaireForm;
         }
+        case "incident-action-plan": {
+            const actionPlan = mapFormStateToIncidentActionPlan(formState, formData);
+            const actionPlanForm: ActionPlanFormData = {
+                ...formData,
+                entity: actionPlan,
+            };
+
+            return actionPlanForm;
+        }
+        case "incident-response-action": {
+            const responseAction = mapFormStateToIncidentResponseAction(formState, formData);
+            const responseActionForm: ResponseActionFormData = {
+                ...formData,
+                entity: responseAction,
+            };
+
+            return responseActionForm;
+        }
 
         default:
             return formData;
@@ -439,3 +469,111 @@ function mapFormStateToRiskAssessmentQuestionnaire(
         });
     return riskAssessmentQuestionnaire;
 }
+
+function mapFormStateToIncidentActionPlan(
+    formState: FormState,
+    formData: ActionPlanFormData
+): ActionPlanAttrs {
+    const allFields: FormFieldState[] = getAllFieldsFromSections(formState.sections);
+
+    const iapType = allFields.find(field => field.id.includes(actionPlanConstants.iapType))
+        ?.value as string;
+
+    const phoecLevel = allFields.find(field => field.id.includes(actionPlanConstants.phoecLevel))
+        ?.value as string;
+
+    const criticalInfoRequirements = allFields.find(field =>
+        field.id.includes(actionPlanConstants.criticalInfoRequirements)
+    )?.value as string;
+
+    const planningAssumptions = allFields.find(field =>
+        field.id.includes(actionPlanConstants.planningAssumptions)
+    )?.value as string;
+
+    const responseObjectives = allFields.find(field =>
+        field.id.includes(actionPlanConstants.responseObjectives)
+    )?.value as string;
+
+    const responseStrategies = allFields.find(field =>
+        field.id.includes(actionPlanConstants.responseStrategies)
+    )?.value as string;
+
+    const expectedResults = allFields.find(field =>
+        field.id.includes(actionPlanConstants.expectedResults)
+    )?.value as string;
+
+    const responseActivitiesNarrative = allFields.find(field =>
+        field.id.includes(actionPlanConstants.responseActivitiesNarrative)
+    )?.value as string;
+
+    const incidentActionPlan: ActionPlanAttrs = {
+        iapType: iapType,
+        phoecLevel: phoecLevel,
+        id: formData.entity?.id ?? "",
+        criticalInfoRequirements: criticalInfoRequirements,
+        planningAssumptions: planningAssumptions,
+        responseObjectives: responseObjectives,
+        responseStrategies: responseStrategies,
+        expectedResults: expectedResults,
+        responseActivitiesNarrative: responseActivitiesNarrative,
+    };
+
+    return incidentActionPlan;
+}
+
+function mapFormStateToIncidentResponseAction(
+    formState: FormState,
+    formData: ResponseActionFormData
+): ResponseAction {
+    const allFields: FormFieldState[] = getAllFieldsFromSections(formState.sections);
+
+    const mainTask = allFields.find(field => field.id.includes(responseActionConstants.mainTask))
+        ?.value as string;
+    const subActivities = allFields.find(field =>
+        field.id.includes(responseActionConstants.subActivities)
+    )?.value as string;
+    const subPillar = allFields.find(field => field.id.includes(responseActionConstants.subPillar))
+        ?.value as string;
+    const dueDate = getDateFieldValue(
+        `${responseActionConstants.dueDate}-section`,
+        allFields
+    ) as Date;
+
+    const timeLine = allFields.find(field => field.id.includes(responseActionConstants.timeLine))
+        ?.value as string;
+
+    const searchAssignROValue = allFields.find(field =>
+        field.id.includes(responseActionConstants.searchAssignRO)
+    )?.value as string;
+    const searchAssignRO = formData.options.searchAssignRO.find(
+        option => option.id === searchAssignROValue
+    );
+    if (!searchAssignRO) throw new Error("Responsible officer not found");
+
+    const statusValue = allFields.find(field => field.id.includes(responseActionConstants.status))
+        ?.value as string;
+    const status = formData.options.status.find(option => option.id === statusValue);
+    if (!status) throw new Error("Status not found");
+
+    const verificationValue = allFields.find(field =>
+        field.id.includes(responseActionConstants.verification)
+    )?.value as string;
+    const verification = formData.options.verification.find(
+        option => option.id === verificationValue
+    );
+    if (!verification) throw new Error("Verification not found");
+
+    const incidentResponseAction: ResponseAction = new ResponseAction({
+        id: formData.entity?.id ?? "",
+        mainTask: mainTask,
+        subActivities: subActivities,
+        subPillar: subPillar,
+        searchAssignRO: searchAssignRO,
+        dueDate: dueDate,
+        timeLine: timeLine,
+        status: Status.RTSL_ZEB_OS_STATUS_COMPLETE,
+        verification: Verification.RTSL_ZEB_OS_VERIFICATION_VERIFIED,
+    });
+
+    return incidentResponseAction;
+}
diff --git a/src/webapp/pages/form-page/useForm.ts b/src/webapp/pages/form-page/useForm.ts
index 7d142375..82958103 100644
--- a/src/webapp/pages/form-page/useForm.ts
+++ b/src/webapp/pages/form-page/useForm.ts
@@ -215,6 +215,25 @@ export function useForm(formType: FormType, id?: Id): State {
                             type: "success",
                         });
                         break;
+                    case "incident-action-plan":
+                        goTo(RouteName.CREATE_FORM, {
+                            formType: "incident-response-action",
+                        });
+                        setGlobalMessage({
+                            text: i18n.t(`Incident Action Plan saved successfully`),
+                            type: "success",
+                        });
+                        break;
+                    case "incident-response-action":
+                        if (currentEventTracker?.id)
+                            goTo(RouteName.INCIDENT_ACTION_PLAN, {
+                                id: currentEventTracker.id,
+                            });
+                        setGlobalMessage({
+                            text: i18n.t(`Incident Response Actions saved successfully`),
+                            type: "success",
+                        });
+                        break;
                 }
             },
             err => {
diff --git a/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx b/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
index 36728c67..32808bc3 100644
--- a/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
+++ b/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
@@ -1,13 +1,173 @@
-import React from "react";
-
+import React, { useCallback, useEffect } from "react";
 import i18n from "../../../utils/i18n";
 import { Layout } from "../../components/layout/Layout";
+import { useParams } from "react-router-dom";
+import { RouteName, useRoutes } from "../../hooks/useRoutes";
+import { useCurrentEventTracker } from "../../contexts/current-event-tracker-context";
+import { useIncidentActionPlan } from "./useIncidentActionPlan";
+import { NoticeBox } from "../../components/notice-box/NoticeBox";
+import { Box, Button, Typography } from "@material-ui/core";
+import { AddCircleOutline, EditOutlined } from "@material-ui/icons";
+import { Section } from "../../components/section/Section";
+import { Loader } from "../../components/loader/Loader";
+import styled from "styled-components";
+import { BasicTable, TableColumn } from "../../components/table/BasicTable";
+import { ActionPlanFormSummary } from "../../components/form/form-summary/ActionPlanFormSummary";
+
+export const responseActionColumns: TableColumn[] = [
+    { value: "mainTask", label: "Main task", type: "text" },
+    { value: "subActivities", label: "Sub Activities", type: "text" },
+    { value: "subPillar", label: "Sub Pillar", type: "text" },
+    { value: "searchAssignRO", label: "Responsible officer", type: "text" },
+    { value: "status", label: "Status", type: "text" },
+    { value: "verification", label: "Verification", type: "text" },
+    { value: "timeLine", label: "Timeline", type: "text" },
+    { value: "dueDate", label: "Due date", type: "text" },
+];
 
 export const IncidentActionPlanPage: React.FC = React.memo(() => {
+    const { id } = useParams<{
+        id: string;
+    }>();
+    const { goTo } = useRoutes();
+
+    const {
+        actionPlanSummary,
+        formSummary: incidentActionFormSummary,
+        responseActionRows,
+        summaryError,
+        eventTrackerDetails,
+    } = useIncidentActionPlan(id);
+    const { changeCurrentEventTracker: changeCurrentEventTrackerId } = useCurrentEventTracker();
+
+    useEffect(() => {
+        if (eventTrackerDetails) changeCurrentEventTrackerId(eventTrackerDetails);
+    }, [changeCurrentEventTrackerId, eventTrackerDetails, id]);
+
+    const getSummaryColumn = useCallback((index: number, label: string, value: string) => {
+        return (
+            <Typography key={index}>
+                <Box fontWeight="bold" display="inline">
+                    {i18n.t(label)}:
+                </Box>{" "}
+                {i18n.t(value)}
+            </Typography>
+        );
+    }, []);
+
+    console.log({
+        actionPlanSummary,
+        incidentActionFormSummary,
+        summaryError,
+        id,
+        eventTrackerDetails,
+        responseActionRows,
+    });
+
     return (
         <Layout
             title={i18n.t("Incident Action Plan")}
-            subtitle={i18n.t("Cholera in NW Province, June 2023")}
-        ></Layout>
+            subtitle={i18n.t(incidentActionFormSummary?.subTitle || "")}
+        >
+            {!incidentActionFormSummary?.summary.every(
+                summaryLabel => summaryLabel.value !== undefined
+            ) ? (
+                <IncidentActionNotice />
+            ) : incidentActionFormSummary ? (
+                <>
+                    <Section>
+                        <SummaryContainer>
+                            <SummaryColumn>
+                                {incidentActionFormSummary.summary.map((labelWithValue, index) =>
+                                    getSummaryColumn(
+                                        index,
+                                        labelWithValue.label,
+                                        labelWithValue.value
+                                    )
+                                )}
+                            </SummaryColumn>
+                        </SummaryContainer>
+                    </Section>
+
+                    <Section
+                        title="Response Actions"
+                        hasSeparator={true}
+                        headerButton={
+                            <Button
+                                variant="outlined"
+                                color="secondary"
+                                startIcon={<AddCircleOutline />}
+                                onClick={() => {
+                                    goTo(RouteName.CREATE_FORM, {
+                                        formType: "incident-response-action",
+                                    });
+                                }}
+                            >
+                                {i18n.t("Edit Response Actions")}
+                            </Button>
+                        }
+                        titleVariant="secondary"
+                    >
+                        <BasicTable columns={responseActionColumns} rows={responseActionRows} />
+                        <Box sx={{ m: 5 }} />
+                    </Section>
+
+                    <ActionPlanFormSummary
+                        formType="incident-action-plan"
+                        formSummary={actionPlanSummary}
+                        summaryError={summaryError}
+                        id={id}
+                    />
+                </>
+            ) : (
+                <Loader />
+            )}
+        </Layout>
     );
 });
+
+const SummaryContainer = styled.div`
+    display: flex;
+    width: max-content;
+    align-items: center;
+    margin-top: 0rem;
+    margin-bottom: 3rem;
+`;
+
+const SummaryColumn = styled.div`
+    flex: 1;
+    padding-right: 2rem;
+    color: ${props => props.theme.palette.text.hint};
+    min-width: fit-content;
+`;
+
+function IncidentActionNotice() {
+    const { goTo } = useRoutes();
+
+    return (
+        <NoticeBox title={i18n.t("Create an incident action plan")}>
+            <div
+                style={{
+                    display: "flex",
+                    justifyContent: "space-between",
+                    alignItems: "center",
+                }}
+            >
+                <p>{i18n.t("No plan has been created for this incident")}</p>
+
+                <Button
+                    variant="contained"
+                    color="primary"
+                    startIcon={<EditOutlined />}
+                    onClick={() => {
+                        goTo(RouteName.CREATE_FORM, {
+                            formType: "incident-action-plan",
+                        });
+                    }}
+                >
+                    {i18n.t("Create IAP")}
+                </Button>
+            </div>
+        </NoticeBox>
+    );
+}
diff --git a/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts b/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts
new file mode 100644
index 00000000..b87fbf9f
--- /dev/null
+++ b/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts
@@ -0,0 +1,136 @@
+import { useEffect, useState } from "react";
+import { Id } from "../../../domain/entities/Ref";
+import { Maybe } from "../../../utils/ts-utils";
+import { useAppContext } from "../../contexts/app-context";
+import { DiseaseOutbreakEvent } from "../../../domain/entities/disease-outbreak-event/DiseaseOutbreakEvent";
+import { getDateAsLocaleDateTimeString } from "../../../data/repositories/utils/DateTimeHelper";
+import { User } from "../../components/user-selector/UserSelector";
+import { TableRowType } from "../../components/table/BasicTable";
+import {
+    getIAPTypeByCode,
+    getPhoecLevelByCode,
+} from "../../../data/repositories/consts/IncidentActionConstants";
+
+type LabelWithValue = {
+    label: string;
+    value: string;
+};
+
+export type FormSummaryData = {
+    subTitle: string;
+    summary: LabelWithValue[];
+    incidentManager: Maybe<User>;
+};
+
+export function useIncidentActionPlan(id: Id) {
+    const { compositionRoot } = useAppContext();
+    const [formSummary, setFormSummary] = useState<FormSummaryData>();
+    const [actionPlanSummary, setActionPlanSummary] = useState<FormSummaryData>();
+    const [responseActionRows, setResponseActionRows] = useState<TableRowType[]>([]);
+    const [summaryError, setSummaryError] = useState<string>();
+    const [eventTrackerDetails, setEventTrackerDetails] = useState<DiseaseOutbreakEvent>();
+
+    useEffect(() => {
+        compositionRoot.diseaseOutbreakEvent.get.execute(id).run(
+            diseaseOutbreakEvent => {
+                setFormSummary(mapIncidentActionToFormSummary(diseaseOutbreakEvent));
+                setActionPlanSummary(mapIncidentActionPlanToFormSummary(diseaseOutbreakEvent));
+                setResponseActionRows(mapIncidentResponseActionToFormSummary(diseaseOutbreakEvent));
+                setEventTrackerDetails(diseaseOutbreakEvent);
+            },
+            err => {
+                console.debug(err);
+                setSummaryError(`Event tracker with id: ${id} does not exist`);
+            }
+        );
+    }, [compositionRoot, id]);
+
+    return {
+        actionPlanSummary: actionPlanSummary,
+        formSummary: formSummary,
+        responseActionRows: responseActionRows,
+        summaryError: summaryError,
+        eventTrackerDetails: eventTrackerDetails,
+    };
+}
+
+const mapIncidentActionToFormSummary = (
+    diseaseOutbreakEvent: DiseaseOutbreakEvent
+): FormSummaryData => {
+    const { incidentActionPlan, name, lastUpdated } = diseaseOutbreakEvent;
+
+    if (!incidentActionPlan) return { subTitle: name, summary: [], incidentManager: undefined };
+
+    const iapTypeCode = incidentActionPlan.actionPlan?.iapType ?? "";
+    const phoecLevelCode = incidentActionPlan.actionPlan?.phoecLevel ?? "";
+
+    return {
+        subTitle: name,
+        summary: [
+            {
+                label: "IAP last updated",
+                value: getDateAsLocaleDateTimeString(lastUpdated),
+            },
+            {
+                label: "IAP type",
+                value: getIAPTypeByCode(iapTypeCode) || "",
+            },
+            {
+                label: "PHOEC activation Level",
+                value: getPhoecLevelByCode(phoecLevelCode) || "",
+            },
+        ],
+        incidentManager: undefined,
+    };
+};
+
+const mapIncidentActionPlanToFormSummary = (
+    diseaseOutbreakEvent: DiseaseOutbreakEvent
+): FormSummaryData => {
+    const actionPlan = diseaseOutbreakEvent?.incidentActionPlan?.actionPlan;
+    if (!actionPlan) return { subTitle: "Action Plan", summary: [], incidentManager: undefined };
+
+    return {
+        subTitle: "Action Plan",
+        summary: [
+            {
+                label: "Response mode critical information requirements (CIRs)",
+                value: actionPlan.criticalInfoRequirements ?? "",
+            },
+            {
+                label: "Planning assumptions",
+                value: actionPlan.planningAssumptions ?? "",
+            },
+            {
+                label: "Response objectives (SMART)",
+                value: actionPlan.responseObjectives ?? "",
+            },
+            {
+                label: "Sections, functional area operational objectives, expected results",
+                value: actionPlan.expectedResults ?? "",
+            },
+            {
+                label: "Response activities narrative",
+                value: actionPlan.responseActivitiesNarrative ?? "",
+            },
+        ],
+        incidentManager: undefined,
+    };
+};
+
+const mapIncidentResponseActionToFormSummary = (diseaseOutbreakEvent: DiseaseOutbreakEvent) => {
+    if (diseaseOutbreakEvent.incidentActionPlan) {
+        return diseaseOutbreakEvent.incidentActionPlan.responseActions.map(responseAction => ({
+            mainTask: responseAction.mainTask,
+            subActivities: responseAction.subActivities,
+            subPillar: responseAction.subPillar,
+            searchAssignRO: responseAction.searchAssignRO?.username ?? "",
+            status: responseAction.status,
+            verification: responseAction.verification,
+            timeLine: responseAction.timeLine,
+            dueDate: responseAction.dueDate.toISOString(),
+        }));
+    } else {
+        return [];
+    }
+};

From b8c62bdbbefb8fde5b384b07cd35cc3546de8114 Mon Sep 17 00:00:00 2001
From: Chukwudumebi Onwuli <37223065+deeonwuli@users.noreply.github.com>
Date: Wed, 9 Oct 2024 11:43:02 +0100
Subject: [PATCH 02/14] feat: update translation files

---
 i18n/en.pot | 28 +++++++++++++++++++++++-----
 i18n/es.po  | 28 ++++++++++++++++++++++++++--
 2 files changed, 49 insertions(+), 7 deletions(-)

diff --git a/i18n/en.pot b/i18n/en.pot
index 495e3a38..63c23d2a 100644
--- a/i18n/en.pot
+++ b/i18n/en.pot
@@ -5,8 +5,8 @@ msgstr ""
 "Content-Type: text/plain; charset=utf-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=2; plural=(n != 1)\n"
-"POT-Creation-Date: 2024-09-30T07:39:32.843Z\n"
-"PO-Revision-Date: 2024-09-30T07:39:32.843Z\n"
+"POT-Creation-Date: 2024-10-09T10:40:30.273Z\n"
+"PO-Revision-Date: 2024-10-09T10:40:30.273Z\n"
 
 msgid "Low"
 msgstr ""
@@ -84,10 +84,10 @@ msgstr ""
 msgid "Cancel"
 msgstr ""
 
-msgid "Edit Details"
+msgid "Edit Action Plan"
 msgstr ""
 
-msgid "Notes"
+msgid "Edit Details"
 msgstr ""
 
 msgid "Notes"
@@ -174,14 +174,32 @@ msgstr ""
 msgid "Risk Assessment Questionnaire saved successfully"
 msgstr ""
 
+msgid "Incident Action Plan saved successfully"
+msgstr ""
+
+msgid "Incident Response Actions saved successfully"
+msgstr ""
+
 msgid "Incident Action Plan"
 msgstr ""
 
-msgid "Cholera in NW Province, June 2023"
+msgid "Edit Response Actions"
+msgstr ""
+
+msgid "Create an incident action plan"
+msgstr ""
+
+msgid "No plan has been created for this incident"
+msgstr ""
+
+msgid "Create IAP"
 msgstr ""
 
 msgid "Incident Management Team Builder"
 msgstr ""
 
+msgid "Cholera in NW Province, June 2023"
+msgstr ""
+
 msgid "Resources"
 msgstr ""
diff --git a/i18n/es.po b/i18n/es.po
index e9452c28..06a480cf 100644
--- a/i18n/es.po
+++ b/i18n/es.po
@@ -1,7 +1,7 @@
 msgid ""
 msgstr ""
 "Project-Id-Version: i18next-conv\n"
-"POT-Creation-Date: 2024-09-12T14:10:04.460Z\n"
+"POT-Creation-Date: 2024-10-09T10:40:30.273Z\n"
 "PO-Revision-Date: 2018-10-25T09:02:35.143Z\n"
 "MIME-Version: 1.0\n"
 "Content-Type: text/plain; charset=UTF-8\n"
@@ -83,9 +83,15 @@ msgstr ""
 msgid "Cancel"
 msgstr ""
 
+msgid "Edit Action Plan"
+msgstr ""
+
 msgid "Edit Details"
 msgstr ""
 
+msgid "Notes"
+msgstr ""
+
 msgid "Create Event"
 msgstr ""
 
@@ -167,15 +173,33 @@ msgstr ""
 msgid "Risk Assessment Questionnaire saved successfully"
 msgstr ""
 
+msgid "Incident Action Plan saved successfully"
+msgstr ""
+
+msgid "Incident Response Actions saved successfully"
+msgstr ""
+
 msgid "Incident Action Plan"
 msgstr ""
 
-msgid "Cholera in NW Province, June 2023"
+msgid "Edit Response Actions"
+msgstr ""
+
+msgid "Create an incident action plan"
+msgstr ""
+
+msgid "No plan has been created for this incident"
+msgstr ""
+
+msgid "Create IAP"
 msgstr ""
 
 msgid "Incident Management Team Builder"
 msgstr ""
 
+msgid "Cholera in NW Province, June 2023"
+msgstr ""
+
 msgid "Resources"
 msgstr ""
 

From 76f764878fc00dcd10f12bbe08d620a3d91e7db4 Mon Sep 17 00:00:00 2001
From: Chukwudumebi Onwuli <37223065+deeonwuli@users.noreply.github.com>
Date: Wed, 9 Oct 2024 16:05:51 +0100
Subject: [PATCH 03/14] fix: include notes in iap form summary data

---
 .../pages/incident-action-plan/useIncidentActionPlan.ts  | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts b/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts
index b87fbf9f..c26ab1e1 100644
--- a/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts
+++ b/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts
@@ -20,6 +20,7 @@ export type FormSummaryData = {
     subTitle: string;
     summary: LabelWithValue[];
     incidentManager: Maybe<User>;
+    notes: string;
 };
 
 export function useIncidentActionPlan(id: Id) {
@@ -59,7 +60,8 @@ const mapIncidentActionToFormSummary = (
 ): FormSummaryData => {
     const { incidentActionPlan, name, lastUpdated } = diseaseOutbreakEvent;
 
-    if (!incidentActionPlan) return { subTitle: name, summary: [], incidentManager: undefined };
+    if (!incidentActionPlan)
+        return { subTitle: name, summary: [], incidentManager: undefined, notes: "" };
 
     const iapTypeCode = incidentActionPlan.actionPlan?.iapType ?? "";
     const phoecLevelCode = incidentActionPlan.actionPlan?.phoecLevel ?? "";
@@ -81,6 +83,7 @@ const mapIncidentActionToFormSummary = (
             },
         ],
         incidentManager: undefined,
+        notes: diseaseOutbreakEvent.notes || "",
     };
 };
 
@@ -88,7 +91,8 @@ const mapIncidentActionPlanToFormSummary = (
     diseaseOutbreakEvent: DiseaseOutbreakEvent
 ): FormSummaryData => {
     const actionPlan = diseaseOutbreakEvent?.incidentActionPlan?.actionPlan;
-    if (!actionPlan) return { subTitle: "Action Plan", summary: [], incidentManager: undefined };
+    if (!actionPlan)
+        return { subTitle: "Action Plan", summary: [], incidentManager: undefined, notes: "" };
 
     return {
         subTitle: "Action Plan",
@@ -115,6 +119,7 @@ const mapIncidentActionPlanToFormSummary = (
             },
         ],
         incidentManager: undefined,
+        notes: diseaseOutbreakEvent.notes || "",
     };
 };
 

From 4ac190c4f35b367fa684ad760ff8c7541b395653 Mon Sep 17 00:00:00 2001
From: Chukwudumebi Onwuli <37223065+deeonwuli@users.noreply.github.com>
Date: Thu, 10 Oct 2024 09:00:48 +0100
Subject: [PATCH 04/14] feat: go to iap summary page on cancel form

---
 src/webapp/pages/form-page/useForm.ts | 18 ++++++++++++++----
 1 file changed, 14 insertions(+), 4 deletions(-)

diff --git a/src/webapp/pages/form-page/useForm.ts b/src/webapp/pages/form-page/useForm.ts
index bd8ff7ff..ee36446a 100644
--- a/src/webapp/pages/form-page/useForm.ts
+++ b/src/webapp/pages/form-page/useForm.ts
@@ -261,11 +261,21 @@ export function useForm(formType: FormType, id?: Id): State {
 
     const onCancelForm = useCallback(() => {
         if (currentEventTracker)
-            goTo(RouteName.EVENT_TRACKER, {
-                id: currentEventTracker.id,
-            });
+            switch (formType) {
+                case "incident-action-plan":
+                case "incident-response-action":
+                    goTo(RouteName.INCIDENT_ACTION_PLAN, {
+                        id: currentEventTracker.id,
+                    });
+                    break;
+                default:
+                    goTo(RouteName.EVENT_TRACKER, {
+                        id: currentEventTracker.id,
+                    });
+                    break;
+            }
         else goTo(RouteName.DASHBOARD);
-    }, [currentEventTracker, goTo]);
+    }, [currentEventTracker, formType, goTo]);
 
     return {
         formLabels,

From 4f427116300ca4bfbcfcd6fa04f749db2c8b418f Mon Sep 17 00:00:00 2001
From: Chukwudumebi Onwuli <37223065+deeonwuli@users.noreply.github.com>
Date: Thu, 10 Oct 2024 17:20:20 +0100
Subject: [PATCH 05/14] feat: incident response action form (wip)

---
 .../IncidentActionD2Repository.ts             |  18 ++-
 .../consts/IncidentActionConstants.ts         |  66 +++++----
 .../test/IncidentActionTestRepository.ts      |   4 +-
 .../utils/IncidentActionMapper.ts             | 124 ++++++++---------
 src/domain/entities/ConfigurableForm.ts       |   2 +-
 .../incident-action-plan/ActionPlan.ts        |   3 +
 .../repositories/IncidentActionRepository.ts  |   4 +-
 .../incident-action/GetIncidentActionById.ts  |  54 ++++----
 .../GetIncidentActionPlanWithOptions.ts       |   2 +-
 .../mapIncidentActionToInitialFormState.ts    | 129 ++++++++++++------
 .../form-page/mapFormStateToEntityData.ts     |  30 ++--
 src/webapp/pages/form-page/useForm.ts         |  47 ++++++-
 .../IncidentActionPlanPage.tsx                |  20 +--
 .../useIncidentActionPlan.ts                  |   6 +-
 14 files changed, 309 insertions(+), 200 deletions(-)

diff --git a/src/data/repositories/IncidentActionD2Repository.ts b/src/data/repositories/IncidentActionD2Repository.ts
index 66c6ab85..8b989b68 100644
--- a/src/data/repositories/IncidentActionD2Repository.ts
+++ b/src/data/repositories/IncidentActionD2Repository.ts
@@ -17,7 +17,6 @@ import {
 import { ActionPlanFormData, ResponseActionFormData } from "../../domain/entities/ConfigurableForm";
 import { getProgramStage } from "./utils/MetadataHelper";
 import { Future } from "../../domain/entities/generic/Future";
-import { D2TrackerEvent } from "@eyeseetea/d2-api/api/trackerEvents";
 import { Status, Verification } from "../../domain/entities/incident-action-plan/ResponseAction";
 
 export const incidentActionPlanIds = {
@@ -54,7 +53,7 @@ export const incidentResponseActionsIds = {
     verification: "M62NkbKXhqZ",
 };
 
-export type IncidentResponseActionsDataValues = {
+export type IncidentResponseActionDataValues = {
     id: string;
     mainTask: Maybe<string>;
     subActivities: Maybe<string>;
@@ -101,7 +100,7 @@ export class IncidentActionD2Repository implements IncidentActionRepository {
 
     getIncidentResponseActions(
         diseaseOutbreakId: Id
-    ): FutureData<Maybe<IncidentResponseActionsDataValues>> {
+    ): FutureData<IncidentResponseActionDataValues[]> {
         return apiToFuture(
             this.api.tracker.events.get({
                 program: RTSL_ZEBRA_PROGRAM_ID,
@@ -111,11 +110,10 @@ export class IncidentActionD2Repository implements IncidentActionRepository {
                 fields: this.fields,
             })
         ).map(events => {
-            const responseActions: IncidentResponseActionsDataValues =
-                mapDataElementsToIncidentResponseActions(
-                    events.instances[0]?.event ?? diseaseOutbreakId,
-                    events.instances[0]?.dataValues ?? []
-                );
+            if (events.instances.length === 0) return [];
+
+            const responseActions: IncidentResponseActionDataValues[] =
+                mapDataElementsToIncidentResponseActions(events.instances);
 
             return responseActions;
         });
@@ -152,7 +150,7 @@ export class IncidentActionD2Repository implements IncidentActionRepository {
                     return Future.error(new Error(`Enrollment not found for Disease Outbreak`));
                 }
 
-                const events: D2TrackerEvent = mapIncidentActionToDataElements(
+                const events = mapIncidentActionToDataElements(
                     formData,
                     programStageId,
                     diseaseOutbreakId,
@@ -163,7 +161,7 @@ export class IncidentActionD2Repository implements IncidentActionRepository {
                 return apiToFuture(
                     this.api.tracker.post(
                         { importStrategy: "CREATE_AND_UPDATE" },
-                        { events: [events] }
+                        { events: Array.isArray(events) ? events : [events] }
                     )
                 ).flatMap(saveResponse => {
                     if (saveResponse.status === "ERROR" || !diseaseOutbreakId) {
diff --git a/src/data/repositories/consts/IncidentActionConstants.ts b/src/data/repositories/consts/IncidentActionConstants.ts
index 710b757c..403ca38c 100644
--- a/src/data/repositories/consts/IncidentActionConstants.ts
+++ b/src/data/repositories/consts/IncidentActionConstants.ts
@@ -1,10 +1,14 @@
-import { ActionPlanAttrs } from "../../../domain/entities/incident-action-plan/ActionPlan";
+import {
+    ActionPlanAttrs,
+    ActionPlanIAPType,
+    ActionPlanPhoecLevel,
+} from "../../../domain/entities/incident-action-plan/ActionPlan";
 import {
     ResponseAction,
-    Status,
-    Verification,
+    ResponseActionStatusType,
+    ResponseActionVerificationType,
 } from "../../../domain/entities/incident-action-plan/ResponseAction";
-import { GetValue } from "../../../utils/ts-utils";
+import { GetValue, Maybe } from "../../../utils/ts-utils";
 
 export const actionPlanConstants = {
     iapType: "RTSL_ZEB_DET_IAP_TYPE",
@@ -26,30 +30,26 @@ export function isStringInIncidentActionPlanCodes(code: string): code is Inciden
     return (Object.values(actionPlanConstants) as string[]).includes(code);
 }
 
-type IAPType = "Initial" | "Update" | "Final";
-
-export const iapTypeCodeMap: Record<IAPType, string> = {
+const iapTypeCodeMap: Record<ActionPlanIAPType, string> = {
     Initial: "RTSL_ZEB_OS_IAP_TYPE_INITIAL",
     Update: "RTSL_ZEB_OS_IAP_TYPE_UPDATE",
     Final: "RTSL_ZEB_OS_IAP_TYPE_FINAL",
 };
 
-export function getIAPTypeByCode(iapTypeCode: string): IAPType | undefined {
-    return (Object.keys(iapTypeCodeMap) as IAPType[]).find(
+export function getIAPTypeByCode(iapTypeCode: string): Maybe<ActionPlanIAPType> {
+    return (Object.keys(iapTypeCodeMap) as ActionPlanIAPType[]).find(
         key => iapTypeCodeMap[key] === iapTypeCode
     );
 }
 
-type PhoecLevel = "Response" | "Watch" | "Alert";
-
-export const phoecLevelCodeMap: Record<PhoecLevel, string> = {
+const phoecLevelCodeMap: Record<ActionPlanPhoecLevel, string> = {
     Response: "RTSL_ZEB_OS_PHOEC_ACT_LEVEL_RESPONSE",
     Watch: "RTSL_ZEB_OS_PHOEC_ACT_LEVEL_WATCH",
     Alert: "RTSL_ZEB_OS_PHOEC_ACT_LEVEL_ALERT",
 };
 
-export function getPhoecLevelByCode(phoecLevelCode: string): PhoecLevel | undefined {
-    return (Object.keys(phoecLevelCodeMap) as PhoecLevel[]).find(
+export function getPhoecLevelByCode(phoecLevelCode: string): ActionPlanPhoecLevel | undefined {
+    return (Object.keys(phoecLevelCodeMap) as ActionPlanPhoecLevel[]).find(
         key => phoecLevelCodeMap[key] === phoecLevelCode
     );
 }
@@ -76,6 +76,32 @@ export function isStringInIncidentResponseActionCodes(
     return (Object.values(responseActionConstants) as string[]).includes(code);
 }
 
+const statusCodeMap: Record<ResponseActionStatusType, string> = {
+    "Not done": "RTSL_ZEB_OS_STATUS_NOT_DONE",
+    Pending: "RTSL_ZEB_OS_STATUS_PENDING",
+    "In Progress": "RTSL_ZEB_OS_STATUS_IN_PROGRESS",
+    Complete: "RTSL_ZEB_OS_STATUS_COMPLETE",
+} as const;
+
+export function getStatusTypeByCode(iapTypeCode: string): Maybe<ResponseActionStatusType> {
+    return (Object.keys(statusCodeMap) as ResponseActionStatusType[]).find(
+        key => statusCodeMap[key] === iapTypeCode
+    );
+}
+
+const verificationCodeMap: Record<ResponseActionVerificationType, string> = {
+    Verified: "RTSL_ZEB_OS_VERIFICATION_VERIFIED",
+    Unverified: "RTSL_ZEB_OS_VERIFICATION_UNVERIFIED",
+};
+
+export function getVerificationTypeByCode(
+    iapTypeCode: string
+): Maybe<ResponseActionVerificationType> {
+    return (Object.keys(verificationCodeMap) as ResponseActionVerificationType[]).find(
+        key => verificationCodeMap[key] === iapTypeCode
+    );
+}
+
 export function getValueFromIncidentActionPlan(
     incidentActionPlan: ActionPlanAttrs
 ): Record<ActionPlanCodes, string> {
@@ -106,15 +132,3 @@ export function getValueFromIncidentResponseAction(
         RTSL_ZEB_DET_VERIFICATION: incidentResponseAction.verification,
     };
 }
-
-export const statusMap: Record<string, Status> = {
-    RTSL_ZEB_OS_STATUS_NOT_DONE: Status.RTSL_ZEB_OS_STATUS_NOT_DONE,
-    RTSL_ZEB_OS_STATUS_PENDING: Status.RTSL_ZEB_OS_STATUS_PENDING,
-    RTSL_ZEB_OS_STATUS_IN_PROGRESS: Status.RTSL_ZEB_OS_STATUS_IN_PROGRESS,
-    RTSL_ZEB_OS_STATUS_COMPLETE: Status.RTSL_ZEB_OS_STATUS_COMPLETE,
-};
-
-export const verificationMap: Record<string, Verification> = {
-    RTSL_ZEB_OS_VERIFICATION_UNVERIFIED: Verification.RTSL_ZEB_OS_VERIFICATION_UNVERIFIED,
-    RTSL_ZEB_OS_VERIFICATION_VERIFIED: Verification.RTSL_ZEB_OS_VERIFICATION_VERIFIED,
-};
diff --git a/src/data/repositories/test/IncidentActionTestRepository.ts b/src/data/repositories/test/IncidentActionTestRepository.ts
index b6b78163..2b82fccb 100644
--- a/src/data/repositories/test/IncidentActionTestRepository.ts
+++ b/src/data/repositories/test/IncidentActionTestRepository.ts
@@ -4,7 +4,7 @@ import { Maybe } from "../../../utils/ts-utils";
 import { FutureData } from "../../api-futures";
 import {
     IncidentActionPlanDataValues,
-    IncidentResponseActionsDataValues,
+    IncidentResponseActionDataValues,
 } from "../IncidentActionD2Repository";
 
 export class IncidentActionTestRepository implements IncidentActionRepository {
@@ -14,7 +14,7 @@ export class IncidentActionTestRepository implements IncidentActionRepository {
 
     getIncidentResponseActions(
         _diseaseOutbreakId: Id
-    ): FutureData<Maybe<IncidentResponseActionsDataValues>> {
+    ): FutureData<Maybe<IncidentResponseActionDataValues[]>> {
         throw new Error("Method not implemented.");
     }
 
diff --git a/src/data/repositories/utils/IncidentActionMapper.ts b/src/data/repositories/utils/IncidentActionMapper.ts
index 42d59cb5..e7e0e6b7 100644
--- a/src/data/repositories/utils/IncidentActionMapper.ts
+++ b/src/data/repositories/utils/IncidentActionMapper.ts
@@ -2,7 +2,7 @@ import { D2TrackerEvent, DataValue } from "@eyeseetea/d2-api/api/trackerEvents";
 import {
     IncidentActionPlanDataValues,
     incidentActionPlanIds,
-    IncidentResponseActionsDataValues,
+    IncidentResponseActionDataValues,
     incidentResponseActionsIds,
 } from "../IncidentActionD2Repository";
 import { Id } from "../../../domain/entities/Ref";
@@ -22,12 +22,13 @@ import {
     isStringInIncidentActionPlanCodes,
     isStringInIncidentResponseActionCodes,
     ResponseActionCodes,
-    responseActionConstants,
-    statusMap,
-    verificationMap,
 } from "../consts/IncidentActionConstants";
 import { RTSL_ZEBRA_ORG_UNIT_ID, RTSL_ZEBRA_PROGRAM_ID } from "../consts/DiseaseOutbreakConstants";
-import { ResponseAction } from "../../../domain/entities/incident-action-plan/ResponseAction";
+import {
+    ResponseAction,
+    Status,
+    Verification,
+} from "../../../domain/entities/incident-action-plan/ResponseAction";
 
 export function mapDataElementsToIncidentActionPlan(
     id: Id,
@@ -64,43 +65,37 @@ export function mapDataElementsToIncidentActionPlan(
 }
 
 export function mapDataElementsToIncidentResponseActions(
-    id: Id,
-    dataValues: DataValue[]
-): IncidentResponseActionsDataValues {
-    const fromMap = (key: keyof typeof responseActionConstants) => getValueFromMap(key, dataValues);
-
-    const mainTask = getValueById(dataValues, incidentResponseActionsIds.mainTask);
-    const subActivities = getValueById(dataValues, incidentResponseActionsIds.subActivities);
-    const subPillar = getValueById(dataValues, incidentResponseActionsIds.subPillar);
-    const searchAssignRO = getValueById(dataValues, incidentResponseActionsIds.searchAssignRO);
-    const dueDate = getValueById(dataValues, incidentResponseActionsIds.dueDate);
-    const timeLine = getValueById(dataValues, incidentResponseActionsIds.timeLine);
-
-    const status = statusMap[fromMap("status")];
-    const verification = verificationMap[fromMap("verification")];
-
-    const incidentActionPlan: IncidentResponseActionsDataValues = {
-        id: id,
-        mainTask: mainTask,
-        subActivities: subActivities,
-        subPillar: subPillar,
-        searchAssignRO: searchAssignRO,
-        dueDate: dueDate,
-        timeLine: timeLine,
-        status: status,
-        verification: verification,
-    };
+    instances: D2TrackerEvent[]
+): IncidentResponseActionDataValues[] {
+    const incidentResponseActions: IncidentResponseActionDataValues[] = instances.map(instance => {
+        const { event, dataValues } = instance;
+
+        const mainTask = getValueById(dataValues, incidentResponseActionsIds.mainTask);
+        const subActivities = getValueById(dataValues, incidentResponseActionsIds.subActivities);
+        const subPillar = getValueById(dataValues, incidentResponseActionsIds.subPillar);
+        const searchAssignRO = getValueById(dataValues, incidentResponseActionsIds.searchAssignRO);
+        const dueDate = getValueById(dataValues, incidentResponseActionsIds.dueDate);
+        const timeLine = getValueById(dataValues, incidentResponseActionsIds.timeLine);
+        const status = getValueById(dataValues, incidentResponseActionsIds.status) as Status;
+        const verification = getValueById(
+            dataValues,
+            incidentResponseActionsIds.verification
+        ) as Verification;
+
+        return {
+            id: event,
+            mainTask,
+            subActivities,
+            subPillar,
+            searchAssignRO,
+            dueDate,
+            timeLine,
+            status,
+            verification,
+        };
+    });
 
-    return incidentActionPlan;
-}
-
-function getValueFromMap(
-    key: keyof typeof responseActionConstants,
-    dataValues: DataValue[]
-): string {
-    return (
-        dataValues.find(dataValue => dataValue.value === responseActionConstants[key])?.value ?? ""
-    );
+    return incidentResponseActions;
 }
 
 export function mapIncidentActionToDataElements(
@@ -167,30 +162,35 @@ function mapIncidentResponseActionToDataElements(
     programStageId: Id,
     teiId: Id,
     enrollmentId: Id,
-    incidentResponseAction: ResponseAction,
+    incidentResponseActions: ResponseAction[],
     programStageDataElementsMetadata: D2ProgramStageDataElementsMetadata[]
-): D2TrackerEvent {
-    const dataElementValues: Record<ResponseActionCodes, string> =
-        getValueFromIncidentResponseAction(incidentResponseAction);
-
-    const dataValues: DataValue[] = programStageDataElementsMetadata.map(programStage => {
-        if (!isStringInIncidentResponseActionCodes(programStage.dataElement.code)) {
-            throw new Error(
-                `DataElement code ${programStage.dataElement.code} not found in Incident Action Plan Codes`
+): D2TrackerEvent[] {
+    return incidentResponseActions.map(incidentResponseAction => {
+        const dataElementValues: Record<ResponseActionCodes, string> =
+            getValueFromIncidentResponseAction(incidentResponseAction);
+
+        const dataValues: DataValue[] = programStageDataElementsMetadata.map(programStage => {
+            if (!isStringInIncidentResponseActionCodes(programStage.dataElement.code)) {
+                throw new Error(
+                    `DataElement code ${programStage.dataElement.code} not found in Incident Action Plan Codes`
+                );
+            }
+            const typedCode: IncidentResponseActionKeyCode = programStage.dataElement.code;
+
+            return getPopulatedDataElement(
+                programStage.dataElement.id,
+                dataElementValues[typedCode]
             );
-        }
-        const typedCode: IncidentResponseActionKeyCode = programStage.dataElement.code;
-
-        return getPopulatedDataElement(programStage.dataElement.id, dataElementValues[typedCode]);
+        });
+
+        return getIncidentActionTrackerEvent(
+            programStageId,
+            incidentResponseAction.id,
+            enrollmentId,
+            dataValues,
+            teiId
+        );
     });
-
-    return getIncidentActionTrackerEvent(
-        programStageId,
-        incidentResponseAction.id,
-        enrollmentId,
-        dataValues,
-        teiId
-    );
 }
 
 function getPopulatedDataElement(dataElement: Id, value: Maybe<string>): DataValue {
diff --git a/src/domain/entities/ConfigurableForm.ts b/src/domain/entities/ConfigurableForm.ts
index 84d5d9f3..884ce812 100644
--- a/src/domain/entities/ConfigurableForm.ts
+++ b/src/domain/entities/ConfigurableForm.ts
@@ -107,7 +107,7 @@ export type ActionPlanFormData = BaseFormData & {
 export type ResponseActionFormData = BaseFormData & {
     type: "incident-response-action";
     eventTrackerDetails: DiseaseOutbreakEvent;
-    entity: Maybe<ResponseAction>;
+    entity: ResponseAction[];
     options: IncidentResponseActionOptions;
 };
 
diff --git a/src/domain/entities/incident-action-plan/ActionPlan.ts b/src/domain/entities/incident-action-plan/ActionPlan.ts
index b5f2b84a..64e8fffe 100644
--- a/src/domain/entities/incident-action-plan/ActionPlan.ts
+++ b/src/domain/entities/incident-action-plan/ActionPlan.ts
@@ -1,6 +1,9 @@
 import { Struct } from "../generic/Struct";
 import { Id } from "../Ref";
 
+export type ActionPlanIAPType = "Initial" | "Update" | "Final";
+export type ActionPlanPhoecLevel = "Response" | "Watch" | "Alert";
+
 export type ActionPlanAttrs = {
     id: Id;
     iapType: string;
diff --git a/src/domain/repositories/IncidentActionRepository.ts b/src/domain/repositories/IncidentActionRepository.ts
index 22fd46c0..9840854a 100644
--- a/src/domain/repositories/IncidentActionRepository.ts
+++ b/src/domain/repositories/IncidentActionRepository.ts
@@ -1,7 +1,7 @@
 import { FutureData } from "../../data/api-futures";
 import {
     IncidentActionPlanDataValues,
-    IncidentResponseActionsDataValues,
+    IncidentResponseActionDataValues,
 } from "../../data/repositories/IncidentActionD2Repository";
 import { Maybe } from "../../utils/ts-utils";
 import { ActionPlanFormData, ResponseActionFormData } from "../entities/ConfigurableForm";
@@ -11,7 +11,7 @@ export interface IncidentActionRepository {
     getIncidentActionPlan(diseaseOutbreakId: Id): FutureData<Maybe<IncidentActionPlanDataValues>>;
     getIncidentResponseActions(
         diseaseOutbreakId: Id
-    ): FutureData<Maybe<IncidentResponseActionsDataValues>>;
+    ): FutureData<Maybe<IncidentResponseActionDataValues[]>>;
     saveIncidentAction(
         formData: ActionPlanFormData | ResponseActionFormData,
         diseaseOutbreakId: Id
diff --git a/src/domain/usecases/utils/incident-action/GetIncidentActionById.ts b/src/domain/usecases/utils/incident-action/GetIncidentActionById.ts
index 9ee4930d..a149411d 100644
--- a/src/domain/usecases/utils/incident-action/GetIncidentActionById.ts
+++ b/src/domain/usecases/utils/incident-action/GetIncidentActionById.ts
@@ -1,5 +1,5 @@
 import { FutureData } from "../../../../data/api-futures";
-import { IncidentResponseActionsDataValues } from "../../../../data/repositories/IncidentActionD2Repository";
+import { IncidentResponseActionDataValues } from "../../../../data/repositories/IncidentActionD2Repository";
 import { Maybe } from "../../../../utils/ts-utils";
 import _c from "../../../entities/generic/Collection";
 import { Future } from "../../../entities/generic/Future";
@@ -25,7 +25,7 @@ export function getIncidentAction(
         .getIncidentActionPlan(diseaseOutbreakId)
         .flatMap(incidentActionPlan => {
             const actionPlan = new ActionPlan({
-                id: diseaseOutbreakId,
+                id: incidentActionPlan?.id ?? "",
                 iapType: incidentActionPlan?.iapType ?? "",
                 phoecLevel: incidentActionPlan?.phoecLevel ?? "",
                 criticalInfoRequirements: incidentActionPlan?.criticalInfoRequirements ?? "",
@@ -47,27 +47,29 @@ export function getIncidentAction(
                             teamMemberRepository
                         )
                     ).flatMap(responseActionOptions => {
-                        const searchAssignRO = responseActionOptions.searchAssignRO;
-
-                        const responseActions = new ResponseAction({
-                            id: diseaseOutbreakId,
-                            mainTask: responseActionDataValues?.mainTask ?? "",
-                            subActivities: responseActionDataValues?.subActivities ?? "",
-                            subPillar: responseActionDataValues?.subPillar ?? "",
-                            searchAssignRO: searchAssignRO,
-                            dueDate: responseActionDataValues?.dueDate
-                                ? new Date(responseActionDataValues.dueDate)
-                                : new Date(),
-                            timeLine: responseActionDataValues?.timeLine ?? "",
-                            status: responseActionOptions.status?.name as Status,
-                            verification: responseActionOptions.verification?.name as Verification,
-                        });
+                        const responseActions =
+                            responseActionDataValues?.map(responseActionDataValue => {
+                                return new ResponseAction({
+                                    id: responseActionDataValue?.id ?? "",
+                                    mainTask: responseActionDataValue?.mainTask ?? "",
+                                    subActivities: responseActionDataValue?.subActivities ?? "",
+                                    subPillar: responseActionDataValue?.subPillar ?? "",
+                                    searchAssignRO: responseActionOptions.searchAssignRO,
+                                    dueDate: responseActionDataValue?.dueDate
+                                        ? new Date(responseActionDataValue.dueDate)
+                                        : new Date(),
+                                    timeLine: responseActionDataValue?.timeLine ?? "",
+                                    status: responseActionOptions.status?.id as Status,
+                                    verification: responseActionOptions.verification
+                                        ?.id as Verification,
+                                });
+                            }) ?? [];
 
                         const incidentAction = new IncidentActionPlan({
                             id: diseaseOutbreakId,
                             lastUpdated: new Date(),
                             actionPlan: actionPlan,
-                            responseActions: [responseActions],
+                            responseActions: responseActions,
                         });
 
                         return Future.success(incidentAction);
@@ -77,19 +79,21 @@ export function getIncidentAction(
 }
 
 function getIncidentResponseActionOptionFutures(
-    responseActionsBase: Maybe<IncidentResponseActionsDataValues>,
+    responseActionsBase: Maybe<IncidentResponseActionDataValues[]>,
     optionsRepository: OptionsRepository,
     teamMemberRepository: TeamMemberRepository
 ) {
+    const responseActionBase = responseActionsBase ? responseActionsBase[0] : undefined;
+
     return {
-        searchAssignRO: responseActionsBase?.searchAssignRO
-            ? teamMemberRepository.get(responseActionsBase.searchAssignRO)
+        searchAssignRO: responseActionBase?.searchAssignRO
+            ? teamMemberRepository.get(responseActionBase.searchAssignRO)
             : Future.success(undefined),
-        status: responseActionsBase?.status
-            ? optionsRepository.getStatusOption(responseActionsBase.status)
+        status: responseActionBase?.status
+            ? optionsRepository.getStatusOption(responseActionBase.status)
             : Future.success(undefined),
-        verification: responseActionsBase?.verification
-            ? optionsRepository.getVerificationOption(responseActionsBase.verification)
+        verification: responseActionBase?.verification
+            ? optionsRepository.getVerificationOption(responseActionBase.verification)
             : Future.success(undefined),
     };
 }
diff --git a/src/domain/usecases/utils/incident-action/GetIncidentActionPlanWithOptions.ts b/src/domain/usecases/utils/incident-action/GetIncidentActionPlanWithOptions.ts
index 4c12b379..2485af32 100644
--- a/src/domain/usecases/utils/incident-action/GetIncidentActionPlanWithOptions.ts
+++ b/src/domain/usecases/utils/incident-action/GetIncidentActionPlanWithOptions.ts
@@ -47,7 +47,7 @@ export function getIncidentResponseActionWithOptions(
         const incidentResponseActionData: ResponseActionFormData = {
             type: "incident-response-action",
             eventTrackerDetails: eventTrackerDetails,
-            entity: eventTrackerDetails.incidentActionPlan?.responseActions[0],
+            entity: eventTrackerDetails.incidentActionPlan?.responseActions ?? [],
             options: {
                 searchAssignRO: responsibleOfficers,
                 status: statusOptions,
diff --git a/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts b/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
index 996d5ed3..d19f4495 100644
--- a/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
+++ b/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
@@ -6,10 +6,13 @@ import {
     ActionPlanFormData,
     ResponseActionFormData,
 } from "../../../../domain/entities/ConfigurableForm";
+import { ResponseAction } from "../../../../domain/entities/incident-action-plan/ResponseAction";
+import { Maybe } from "../../../../utils/ts-utils";
 import { FormSectionState } from "../../../components/form/FormSectionsState";
 import { FormState } from "../../../components/form/FormState";
 import { Option as UIOption } from "../../../components/utils/option";
 import { mapToPresentationOptions } from "../mapEntityToFormState";
+import { getAnotherOptionSection } from "../risk-assessment/mapRiskAssessmentToInitialFormState";
 
 type ActionPlanSectionKeys =
     | "iapType"
@@ -196,8 +199,7 @@ export function mapIncidentActionPlanToInitialFormState(
         titleDescripton: "Step 1:",
         subtitleDescripton: "Define the action plan",
         saveButtonLabel: "Save & Continue",
-        // isValid: incidentActionPlan ? true : false,
-        isValid: true,
+        isValid: incidentActionPlan ? true : false,
         sections: [
             mainSections.iapType,
             mainSections.phoecLevel,
@@ -221,15 +223,57 @@ export function mapIncidentResponseActionToInitialFormState(
     } = incidentResponseActionFormData;
 
     const { searchAssignRO, status, verification } = options;
-
     const searchAssignROOptions: UIOption[] = mapToPresentationOptions(searchAssignRO);
     const statusOptions: UIOption[] = mapToPresentationOptions(status);
     const verificationOptions: UIOption[] = mapToPresentationOptions(verification);
 
+    const sectionOptions = {
+        searchAssignROOptions: searchAssignROOptions,
+        statusOptions: statusOptions,
+        verificationOptions: verificationOptions,
+    };
+
+    const responseActionSections =
+        incidentResponseActions.flatMap((incidentResponseAction, index) => {
+            return getIncidentResponseActionFormSections(
+                {
+                    ...sectionOptions,
+                    incidentResponseAction,
+                },
+                index
+            );
+        }) ?? [];
+
+    const addNewOptionSection: FormSectionState = getAnotherOptionSection();
+
+    return {
+        id: eventTrackerDetails.id ?? "",
+        title: "Incident Action Plan",
+        subtitle: eventTrackerDetails.name,
+        titleDescripton: "Step 2:",
+        subtitleDescripton: "Assign response actions",
+        saveButtonLabel: "Save plan",
+        isValid: incidentResponseActions ? true : false,
+        sections: [...responseActionSections, addNewOptionSection],
+    };
+}
+
+function getIncidentResponseActionFormSections(
+    options: {
+        incidentResponseAction: Maybe<ResponseAction>;
+        searchAssignROOptions: UIOption[];
+        statusOptions: UIOption[];
+        verificationOptions: UIOption[];
+    },
+    index: number
+): FormSectionState[] {
+    const { incidentResponseAction, searchAssignROOptions, statusOptions, verificationOptions } =
+        options;
+
     const mainSections: Record<ResponseActionSectionKeys, FormSectionState> = {
         mainTask: {
             title: "Main task",
-            id: "main_task_section",
+            id: `main_task_section${index}`,
             isVisible: true,
             required: true,
             fields: [
@@ -238,7 +282,7 @@ export function mapIncidentResponseActionToInitialFormState(
                     placeholder: "Select..",
                     isVisible: true,
                     errors: [],
-                    value: incidentResponseActions?.mainTask || "",
+                    value: incidentResponseAction?.mainTask || "",
                     type: "text",
                     required: true,
                 },
@@ -246,7 +290,7 @@ export function mapIncidentResponseActionToInitialFormState(
         },
         subActivities: {
             title: "Sub activities",
-            id: "sub_activities_section",
+            id: `sub_activities_section${index}`,
             isVisible: true,
             required: true,
             fields: [
@@ -255,7 +299,7 @@ export function mapIncidentResponseActionToInitialFormState(
                     placeholder: "Select..",
                     isVisible: true,
                     errors: [],
-                    value: incidentResponseActions?.subActivities || "",
+                    value: incidentResponseAction?.subActivities || "",
                     type: "text",
                     required: true,
                 },
@@ -263,7 +307,7 @@ export function mapIncidentResponseActionToInitialFormState(
         },
         subPillar: {
             title: "Sub pilar",
-            id: "sub_pillar_section",
+            id: `sub_pillar_section${index}`,
             isVisible: true,
             required: true,
             fields: [
@@ -272,7 +316,7 @@ export function mapIncidentResponseActionToInitialFormState(
                     placeholder: "Select..",
                     isVisible: true,
                     errors: [],
-                    value: incidentResponseActions?.subPillar || "",
+                    value: incidentResponseAction?.subPillar || "",
                     type: "text",
                     required: true,
                 },
@@ -280,7 +324,7 @@ export function mapIncidentResponseActionToInitialFormState(
         },
         searchAssignRO: {
             title: "Responsible officer",
-            id: "responsible_officer_section",
+            id: `responsible_officer_section${index}`,
             isVisible: true,
             required: true,
             fields: [
@@ -289,7 +333,7 @@ export function mapIncidentResponseActionToInitialFormState(
                     placeholder: "Select..",
                     isVisible: true,
                     errors: [],
-                    value: incidentResponseActions?.searchAssignRO?.name || "",
+                    value: incidentResponseAction?.searchAssignRO?.id || "",
                     type: "select",
                     multiple: false,
                     options: searchAssignROOptions,
@@ -299,7 +343,7 @@ export function mapIncidentResponseActionToInitialFormState(
         },
         dueDate: {
             title: "Due date",
-            id: "due_date_section",
+            id: `due_date_section${index}`,
             isVisible: true,
             required: true,
             fields: [
@@ -310,14 +354,14 @@ export function mapIncidentResponseActionToInitialFormState(
                     errors: [],
                     type: "date",
                     required: true,
-                    value: incidentResponseActions?.dueDate || new Date(),
+                    value: incidentResponseAction?.dueDate || new Date(),
                     width: "200px",
                 },
             ],
         },
         timeline: {
             title: "Time line",
-            id: "time_line_section",
+            id: `time_line_section${index}`,
             isVisible: true,
             required: true,
             fields: [
@@ -326,7 +370,7 @@ export function mapIncidentResponseActionToInitialFormState(
                     placeholder: "Select..",
                     isVisible: true,
                     errors: [],
-                    value: incidentResponseActions?.timeLine || "",
+                    value: incidentResponseAction?.timeLine || "",
                     type: "text",
                     required: true,
                 },
@@ -334,7 +378,7 @@ export function mapIncidentResponseActionToInitialFormState(
         },
         status: {
             title: "Status",
-            id: "status_section",
+            id: `status_section${index}`,
             isVisible: true,
             required: true,
             fields: [
@@ -343,7 +387,7 @@ export function mapIncidentResponseActionToInitialFormState(
                     placeholder: "Select..",
                     isVisible: true,
                     errors: [],
-                    value: incidentResponseActions?.status || "",
+                    value: incidentResponseAction?.status || "",
                     type: "select",
                     multiple: false,
                     options: statusOptions,
@@ -353,7 +397,7 @@ export function mapIncidentResponseActionToInitialFormState(
         },
         verification: {
             title: "Verification",
-            id: "verification_section",
+            id: `verification_section${index}`,
             isVisible: true,
             required: true,
             fields: [
@@ -362,7 +406,7 @@ export function mapIncidentResponseActionToInitialFormState(
                     placeholder: "Select..",
                     isVisible: true,
                     errors: [],
-                    value: incidentResponseActions?.verification || "",
+                    value: incidentResponseAction?.verification || "",
                     type: "select",
                     multiple: false,
                     options: verificationOptions,
@@ -372,24 +416,31 @@ export function mapIncidentResponseActionToInitialFormState(
         },
     };
 
-    return {
-        id: eventTrackerDetails.id ?? "",
-        title: "Incident Action Plan",
-        subtitle: eventTrackerDetails.name,
-        titleDescripton: "Step 2:",
-        subtitleDescripton: "Assign response actions",
-        saveButtonLabel: "Save plan",
-        // isValid: incidentResponseActions ? true : false,
-        isValid: true,
-        sections: [
-            mainSections.mainTask,
-            mainSections.subActivities,
-            mainSections.subPillar,
-            mainSections.searchAssignRO,
-            mainSections.dueDate,
-            mainSections.timeline,
-            mainSections.status,
-            mainSections.verification,
-        ],
-    };
+    return [
+        mainSections.mainTask,
+        mainSections.subActivities,
+        mainSections.subPillar,
+        mainSections.searchAssignRO,
+        mainSections.dueDate,
+        mainSections.timeline,
+        mainSections.status,
+        mainSections.verification,
+    ];
+}
+
+export function addNewResponseActionSection(sections: FormSectionState[]): FormSectionState[] {
+    const newResponseActionSection = getIncidentResponseActionFormSections(
+        {
+            incidentResponseAction: undefined,
+            searchAssignROOptions:
+                sections[0]?.fields[0]?.type === "select" ? sections[0].fields[0].options : [],
+            statusOptions:
+                sections[0]?.fields[1]?.type === "select" ? sections[0].fields[1].options : [],
+            verificationOptions:
+                sections[0]?.fields[2]?.type === "select" ? sections[0].fields[2].options : [],
+        },
+        sections.length % 8 // not absolutely correct
+    );
+
+    return newResponseActionSection;
 }
diff --git a/src/webapp/pages/form-page/mapFormStateToEntityData.ts b/src/webapp/pages/form-page/mapFormStateToEntityData.ts
index 336f39e7..86422864 100644
--- a/src/webapp/pages/form-page/mapFormStateToEntityData.ts
+++ b/src/webapp/pages/form-page/mapFormStateToEntityData.ts
@@ -103,10 +103,10 @@ export function mapFormStateToEntityData(
             return actionPlanForm;
         }
         case "incident-response-action": {
-            const responseAction = mapFormStateToIncidentResponseAction(formState, formData);
+            const responseActions = mapFormStateToIncidentResponseAction(formState, formData);
             const responseActionForm: ResponseActionFormData = {
                 ...formData,
-                entity: responseAction,
+                entity: responseActions,
             };
 
             return responseActionForm;
@@ -525,7 +525,7 @@ function mapFormStateToIncidentActionPlan(
 function mapFormStateToIncidentResponseAction(
     formState: FormState,
     formData: ResponseActionFormData
-): ResponseAction {
+): ResponseAction[] {
     const allFields: FormFieldState[] = getAllFieldsFromSections(formState.sections);
 
     const mainTask = allFields.find(field => field.id.includes(responseActionConstants.mainTask))
@@ -564,19 +564,21 @@ function mapFormStateToIncidentResponseAction(
     );
     if (!verification) throw new Error("Verification not found");
 
-    const incidentResponseAction: ResponseAction = new ResponseAction({
-        id: formData.entity?.id ?? "",
-        mainTask: mainTask,
-        subActivities: subActivities,
-        subPillar: subPillar,
-        searchAssignRO: searchAssignRO,
-        dueDate: dueDate,
-        timeLine: timeLine,
-        status: Status.RTSL_ZEB_OS_STATUS_COMPLETE,
-        verification: Verification.RTSL_ZEB_OS_VERIFICATION_VERIFIED,
+    const incidentResponseActions: ResponseAction[] = formData.entity?.map(responseAction => {
+        return new ResponseAction({
+            id: responseAction.id ?? "",
+            mainTask: mainTask,
+            subActivities: subActivities,
+            subPillar: subPillar,
+            searchAssignRO: searchAssignRO,
+            dueDate: dueDate,
+            timeLine: timeLine,
+            status: status.id as Status,
+            verification: verification.id as Verification,
+        });
     });
 
-    return incidentResponseAction;
+    return incidentResponseActions;
 }
 
 function getRiskAssessmentQuestionsWithOption(
diff --git a/src/webapp/pages/form-page/useForm.ts b/src/webapp/pages/form-page/useForm.ts
index ee36446a..fa5928bc 100644
--- a/src/webapp/pages/form-page/useForm.ts
+++ b/src/webapp/pages/form-page/useForm.ts
@@ -16,6 +16,7 @@ import {
     addNewCustomQuestionSection,
     getAnotherOptionSection,
 } from "./risk-assessment/mapRiskAssessmentToInitialFormState";
+import { addNewResponseActionSection } from "./incident-action/mapIncidentActionToInitialFormState";
 
 export type GlobalMessage = {
     text: string;
@@ -133,10 +134,54 @@ export function useForm(formType: FormType, id?: Id): State {
                 });
                 break;
             }
+            case "incident-response-action":
+                setFormState(prevState => {
+                    if (prevState.kind === "loaded") {
+                        const otherSections = prevState.data.sections.filter(
+                            section => section.id !== "addNewOptionSection"
+                        );
+                        const addAnotherSection = getAnotherOptionSection();
+                        const newResponseActionSection = addNewResponseActionSection(
+                            prevState.data.sections
+                        );
+
+                        const updatedData = {
+                            ...prevState.data,
+                            sections: [
+                                ...otherSections,
+                                ...newResponseActionSection,
+                                addAnotherSection,
+                            ],
+                        };
+
+                        const allNewFields = newResponseActionSection.flatMap(
+                            section => section.fields
+                        );
+
+                        const updatedAndValidatedData = allNewFields.reduce(
+                            (acc, updatedFields) => {
+                                return updateAndValidateFormState(
+                                    acc,
+                                    updatedFields,
+                                    configurableForm
+                                );
+                            },
+                            updatedData
+                        );
+
+                        return {
+                            kind: "loaded",
+                            data: updatedAndValidatedData,
+                        };
+                    } else {
+                        return prevState;
+                    }
+                });
+                break;
             default:
                 break;
         }
-    }, [configurableForm, formState.kind]);
+    }, [configurableForm, formState]);
 
     const handleFormChange = useCallback(
         (updatedField: FormFieldState) => {
diff --git a/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx b/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
index 32808bc3..4412486a 100644
--- a/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
+++ b/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
@@ -55,30 +55,22 @@ export const IncidentActionPlanPage: React.FC = React.memo(() => {
         );
     }, []);
 
-    console.log({
-        actionPlanSummary,
-        incidentActionFormSummary,
-        summaryError,
-        id,
-        eventTrackerDetails,
-        responseActionRows,
-    });
+    const incidentActionExists = eventTrackerDetails?.incidentActionPlan?.actionPlan?.id;
 
     return (
         <Layout
             title={i18n.t("Incident Action Plan")}
             subtitle={i18n.t(incidentActionFormSummary?.subTitle || "")}
         >
-            {!incidentActionFormSummary?.summary.every(
-                summaryLabel => summaryLabel.value !== undefined
-            ) ? (
+            {!actionPlanSummary && responseActionRows.length === 0 && !summaryError && <Loader />}
+            {!incidentActionExists ? (
                 <IncidentActionNotice />
-            ) : incidentActionFormSummary ? (
+            ) : (
                 <>
                     <Section>
                         <SummaryContainer>
                             <SummaryColumn>
-                                {incidentActionFormSummary.summary.map((labelWithValue, index) =>
+                                {incidentActionFormSummary?.summary.map((labelWithValue, index) =>
                                     getSummaryColumn(
                                         index,
                                         labelWithValue.label,
@@ -119,8 +111,6 @@ export const IncidentActionPlanPage: React.FC = React.memo(() => {
                         id={id}
                     />
                 </>
-            ) : (
-                <Loader />
             )}
         </Layout>
     );
diff --git a/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts b/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts
index c26ab1e1..7aa4794f 100644
--- a/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts
+++ b/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts
@@ -9,6 +9,8 @@ import { TableRowType } from "../../components/table/BasicTable";
 import {
     getIAPTypeByCode,
     getPhoecLevelByCode,
+    getStatusTypeByCode,
+    getVerificationTypeByCode,
 } from "../../../data/repositories/consts/IncidentActionConstants";
 
 type LabelWithValue = {
@@ -130,8 +132,8 @@ const mapIncidentResponseActionToFormSummary = (diseaseOutbreakEvent: DiseaseOut
             subActivities: responseAction.subActivities,
             subPillar: responseAction.subPillar,
             searchAssignRO: responseAction.searchAssignRO?.username ?? "",
-            status: responseAction.status,
-            verification: responseAction.verification,
+            status: getStatusTypeByCode(responseAction.status) ?? "",
+            verification: getVerificationTypeByCode(responseAction.verification) ?? "",
             timeLine: responseAction.timeLine,
             dueDate: responseAction.dueDate.toISOString(),
         }));

From 44b13518d5d75d0317f40833b97b8e65dacbbee0 Mon Sep 17 00:00:00 2001
From: Chukwudumebi Onwuli <37223065+deeonwuli@users.noreply.github.com>
Date: Mon, 14 Oct 2024 04:47:42 -0700
Subject: [PATCH 06/14] fix: handle add new response action bugs

---
 .../incident-action/GetIncidentActionById.ts  |  39 +-
 .../mapIncidentActionToInitialFormState.ts    | 339 ++++++++----------
 .../form-page/mapFormStateToEntityData.ts     | 129 ++++---
 src/webapp/pages/form-page/useForm.ts         |   8 +-
 4 files changed, 250 insertions(+), 265 deletions(-)

diff --git a/src/domain/usecases/utils/incident-action/GetIncidentActionById.ts b/src/domain/usecases/utils/incident-action/GetIncidentActionById.ts
index a149411d..cf3e3c53 100644
--- a/src/domain/usecases/utils/incident-action/GetIncidentActionById.ts
+++ b/src/domain/usecases/utils/incident-action/GetIncidentActionById.ts
@@ -1,7 +1,5 @@
 import { FutureData } from "../../../../data/api-futures";
-import { IncidentResponseActionDataValues } from "../../../../data/repositories/IncidentActionD2Repository";
 import { Maybe } from "../../../../utils/ts-utils";
-import _c from "../../../entities/generic/Collection";
 import { Future } from "../../../entities/generic/Future";
 import { ActionPlan } from "../../../entities/incident-action-plan/ActionPlan";
 import { IncidentActionPlan } from "../../../entities/incident-action-plan/IncidentActionPlan";
@@ -42,26 +40,38 @@ export function getIncidentAction(
                 .flatMap(responseActionDataValues => {
                     return Future.joinObj(
                         getIncidentResponseActionOptionFutures(
-                            responseActionDataValues,
                             optionsRepository,
                             teamMemberRepository
                         )
                     ).flatMap(responseActionOptions => {
+                        const { searchAssignROOptions, statusOptions, verificationOptions } =
+                            responseActionOptions;
+
                         const responseActions =
                             responseActionDataValues?.map(responseActionDataValue => {
+                                const searchAssignRO = searchAssignROOptions.find(
+                                    option =>
+                                        option.username === responseActionDataValue?.searchAssignRO
+                                );
+                                const status = statusOptions.find(
+                                    option => option.id === responseActionDataValue?.status
+                                )?.id as Status;
+                                const verification = verificationOptions.find(
+                                    option => option.id === responseActionDataValue?.verification
+                                )?.id as Verification;
+
                                 return new ResponseAction({
                                     id: responseActionDataValue?.id ?? "",
                                     mainTask: responseActionDataValue?.mainTask ?? "",
                                     subActivities: responseActionDataValue?.subActivities ?? "",
                                     subPillar: responseActionDataValue?.subPillar ?? "",
-                                    searchAssignRO: responseActionOptions.searchAssignRO,
+                                    searchAssignRO: searchAssignRO,
                                     dueDate: responseActionDataValue?.dueDate
                                         ? new Date(responseActionDataValue.dueDate)
                                         : new Date(),
                                     timeLine: responseActionDataValue?.timeLine ?? "",
-                                    status: responseActionOptions.status?.id as Status,
-                                    verification: responseActionOptions.verification
-                                        ?.id as Verification,
+                                    status: status,
+                                    verification: verification,
                                 });
                             }) ?? [];
 
@@ -79,21 +89,12 @@ export function getIncidentAction(
 }
 
 function getIncidentResponseActionOptionFutures(
-    responseActionsBase: Maybe<IncidentResponseActionDataValues[]>,
     optionsRepository: OptionsRepository,
     teamMemberRepository: TeamMemberRepository
 ) {
-    const responseActionBase = responseActionsBase ? responseActionsBase[0] : undefined;
-
     return {
-        searchAssignRO: responseActionBase?.searchAssignRO
-            ? teamMemberRepository.get(responseActionBase.searchAssignRO)
-            : Future.success(undefined),
-        status: responseActionBase?.status
-            ? optionsRepository.getStatusOption(responseActionBase.status)
-            : Future.success(undefined),
-        verification: responseActionBase?.verification
-            ? optionsRepository.getVerificationOption(responseActionBase.verification)
-            : Future.success(undefined),
+        searchAssignROOptions: teamMemberRepository.getAll(),
+        statusOptions: optionsRepository.getStatusOptions(),
+        verificationOptions: optionsRepository.getVerificationOptions(),
     };
 }
diff --git a/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts b/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
index d19f4495..e5645c30 100644
--- a/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
+++ b/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
@@ -24,16 +24,6 @@ type ActionPlanSectionKeys =
     | "expectedResults"
     | "responseActivitiesNarrative";
 
-type ResponseActionSectionKeys =
-    | "mainTask"
-    | "subActivities"
-    | "subPillar"
-    | "searchAssignRO"
-    | "dueDate"
-    | "timeline"
-    | "status"
-    | "verification";
-
 export function mapIncidentActionPlanToInitialFormState(
     incidentActionPlanFormData: ActionPlanFormData
 ): FormState {
@@ -227,22 +217,30 @@ export function mapIncidentResponseActionToInitialFormState(
     const statusOptions: UIOption[] = mapToPresentationOptions(status);
     const verificationOptions: UIOption[] = mapToPresentationOptions(verification);
 
-    const sectionOptions = {
-        searchAssignROOptions: searchAssignROOptions,
-        statusOptions: statusOptions,
-        verificationOptions: verificationOptions,
-    };
+    const initialResponseActionSection = getResponseActionSection({
+        incidentResponseAction: undefined,
+        options: {
+            searchAssignROOptions: searchAssignROOptions,
+            statusOptions: statusOptions,
+            verificationOptions: verificationOptions,
+        },
+        index: 0,
+    });
 
     const responseActionSections =
-        incidentResponseActions.flatMap((incidentResponseAction, index) => {
-            return getIncidentResponseActionFormSections(
-                {
-                    ...sectionOptions,
-                    incidentResponseAction,
-                },
-                index
-            );
-        }) ?? [];
+        incidentResponseActions.length !== 0
+            ? incidentResponseActions.map((incidentResponseAction, index) => {
+                  return getResponseActionSection({
+                      incidentResponseAction: incidentResponseAction,
+                      options: {
+                          searchAssignROOptions: searchAssignROOptions,
+                          statusOptions: statusOptions,
+                          verificationOptions: verificationOptions,
+                      },
+                      index: index,
+                  });
+              })
+            : [initialResponseActionSection];
 
     const addNewOptionSection: FormSectionState = getAnotherOptionSection();
 
@@ -258,189 +256,142 @@ export function mapIncidentResponseActionToInitialFormState(
     };
 }
 
-function getIncidentResponseActionFormSections(
+function getResponseActionSection(options: {
+    incidentResponseAction: Maybe<ResponseAction>;
     options: {
-        incidentResponseAction: Maybe<ResponseAction>;
         searchAssignROOptions: UIOption[];
         statusOptions: UIOption[];
         verificationOptions: UIOption[];
-    },
-    index: number
-): FormSectionState[] {
-    const { incidentResponseAction, searchAssignROOptions, statusOptions, verificationOptions } =
-        options;
+    };
+    index: number;
+}) {
+    const { incidentResponseAction, options: formOptions, index } = options;
+    const { searchAssignROOptions, statusOptions, verificationOptions } = formOptions;
 
-    const mainSections: Record<ResponseActionSectionKeys, FormSectionState> = {
-        mainTask: {
-            title: "Main task",
-            id: `main_task_section${index}`,
-            isVisible: true,
-            required: true,
-            fields: [
-                {
-                    id: `${responseActionConstants.mainTask}-section`,
-                    placeholder: "Select..",
-                    isVisible: true,
-                    errors: [],
-                    value: incidentResponseAction?.mainTask || "",
-                    type: "text",
-                    required: true,
-                },
-            ],
-        },
-        subActivities: {
-            title: "Sub activities",
-            id: `sub_activities_section${index}`,
-            isVisible: true,
-            required: true,
-            fields: [
-                {
-                    id: `${responseActionConstants.subActivities}-section`,
-                    placeholder: "Select..",
-                    isVisible: true,
-                    errors: [],
-                    value: incidentResponseAction?.subActivities || "",
-                    type: "text",
-                    required: true,
-                },
-            ],
-        },
-        subPillar: {
-            title: "Sub pilar",
-            id: `sub_pillar_section${index}`,
-            isVisible: true,
-            required: true,
-            fields: [
-                {
-                    id: `${responseActionConstants.subPillar}-section`,
-                    placeholder: "Select..",
-                    isVisible: true,
-                    errors: [],
-                    value: incidentResponseAction?.subPillar || "",
-                    type: "text",
-                    required: true,
-                },
-            ],
-        },
-        searchAssignRO: {
-            title: "Responsible officer",
-            id: `responsible_officer_section${index}`,
-            isVisible: true,
-            required: true,
-            fields: [
-                {
-                    id: `${responseActionConstants.searchAssignRO}-section`,
-                    placeholder: "Select..",
-                    isVisible: true,
-                    errors: [],
-                    value: incidentResponseAction?.searchAssignRO?.id || "",
-                    type: "select",
-                    multiple: false,
-                    options: searchAssignROOptions,
-                    required: true,
-                },
-            ],
-        },
-        dueDate: {
-            title: "Due date",
-            id: `due_date_section${index}`,
-            isVisible: true,
-            required: true,
-            fields: [
-                {
-                    id: `${responseActionConstants.dueDate}-section`,
-                    placeholder: "Select..",
-                    isVisible: true,
-                    errors: [],
-                    type: "date",
-                    required: true,
-                    value: incidentResponseAction?.dueDate || new Date(),
-                    width: "200px",
-                },
-            ],
-        },
-        timeline: {
-            title: "Time line",
-            id: `time_line_section${index}`,
-            isVisible: true,
-            required: true,
-            fields: [
-                {
-                    id: `${responseActionConstants.timeLine}-section`,
-                    placeholder: "Select..",
-                    isVisible: true,
-                    errors: [],
-                    value: incidentResponseAction?.timeLine || "",
-                    type: "text",
-                    required: true,
-                },
-            ],
-        },
-        status: {
-            title: "Status",
-            id: `status_section${index}`,
-            isVisible: true,
-            required: true,
-            fields: [
-                {
-                    id: `${responseActionConstants.status}-section`,
-                    placeholder: "Select..",
-                    isVisible: true,
-                    errors: [],
-                    value: incidentResponseAction?.status || "",
-                    type: "select",
-                    multiple: false,
-                    options: statusOptions,
-                    required: true,
-                },
-            ],
-        },
-        verification: {
-            title: "Verification",
-            id: `verification_section${index}`,
-            isVisible: true,
-            required: true,
-            fields: [
-                {
-                    id: `${responseActionConstants.verification}-section`,
-                    placeholder: "Select..",
-                    isVisible: true,
-                    errors: [],
-                    value: incidentResponseAction?.verification || "",
-                    type: "select",
-                    multiple: false,
-                    options: verificationOptions,
-                    required: true,
-                },
-            ],
-        },
+    const responseActionSection: FormSectionState = {
+        title: "",
+        id: `response_action_section`,
+        isVisible: true,
+        direction: "row",
+        fields: [
+            {
+                id: `${responseActionConstants.mainTask}_${index}`,
+                label: "Main task",
+                isVisible: true,
+                errors: [],
+                value: incidentResponseAction?.mainTask || "",
+                type: "text",
+                required: true,
+                showIsRequired: true,
+                disabled: false,
+            },
+            {
+                id: `${responseActionConstants.subActivities}_${index}`,
+                label: "Sub activities",
+                isVisible: true,
+                errors: [],
+                value: incidentResponseAction?.subActivities || "",
+                type: "text",
+                required: true,
+                showIsRequired: true,
+                disabled: false,
+            },
+            {
+                id: `${responseActionConstants.subPillar}_${index}`,
+                label: "Sub pilar",
+                isVisible: true,
+                errors: [],
+                value: incidentResponseAction?.subPillar || "",
+                type: "text",
+                required: true,
+                showIsRequired: true,
+                disabled: false,
+            },
+            {
+                id: `${responseActionConstants.searchAssignRO}_${index}`,
+                label: "Responsible officer",
+                isVisible: true,
+                errors: [],
+                value: incidentResponseAction?.searchAssignRO?.id || "",
+                type: "select",
+                multiple: false,
+                options: searchAssignROOptions,
+                required: true,
+                showIsRequired: true,
+                disabled: false,
+            },
+            {
+                id: `${responseActionConstants.dueDate}_${index}`,
+                label: "Due date",
+                isVisible: true,
+                errors: [],
+                value: incidentResponseAction?.dueDate || new Date(),
+                type: "date",
+                width: "200px",
+                required: true,
+                showIsRequired: true,
+                disabled: false,
+            },
+            {
+                id: `${responseActionConstants.timeLine}_${index}`,
+                label: "Time line",
+                isVisible: true,
+                errors: [],
+                value: incidentResponseAction?.timeLine || "",
+                type: "text",
+                required: true,
+                showIsRequired: true,
+                disabled: false,
+            },
+            {
+                id: `${responseActionConstants.status}_${index}`,
+                label: "Status",
+                isVisible: true,
+                errors: [],
+                value: incidentResponseAction?.status || "",
+                type: "select",
+                multiple: false,
+                options: statusOptions,
+                required: true,
+                showIsRequired: true,
+                disabled: false,
+            },
+            {
+                id: `${responseActionConstants.verification}_${index}`,
+                label: "Verification",
+                isVisible: true,
+                errors: [],
+                value: incidentResponseAction?.verification || "",
+                type: "select",
+                multiple: false,
+                options: verificationOptions,
+                required: true,
+                showIsRequired: true,
+                disabled: false,
+            },
+        ],
     };
 
-    return [
-        mainSections.mainTask,
-        mainSections.subActivities,
-        mainSections.subPillar,
-        mainSections.searchAssignRO,
-        mainSections.dueDate,
-        mainSections.timeline,
-        mainSections.status,
-        mainSections.verification,
-    ];
+    return responseActionSection;
 }
 
-export function addNewResponseActionSection(sections: FormSectionState[]): FormSectionState[] {
-    const newResponseActionSection = getIncidentResponseActionFormSections(
-        {
-            incidentResponseAction: undefined,
+export function addNewResponseActionSection(sections: FormSectionState[]): FormSectionState {
+    const responseActionSections = sections.filter(
+        section => !section.id.startsWith("addNewOptionSection")
+    );
+
+    const newResponseActionSection = getResponseActionSection({
+        incidentResponseAction: undefined,
+        options: {
             searchAssignROOptions:
-                sections[0]?.fields[0]?.type === "select" ? sections[0].fields[0].options : [],
+                sections[0]?.fields[3]?.type === "select" ? sections[0].fields[3].options : [],
             statusOptions:
-                sections[0]?.fields[1]?.type === "select" ? sections[0].fields[1].options : [],
+                sections[0]?.fields[6]?.type === "select" ? sections[0].fields[6].options : [],
             verificationOptions:
-                sections[0]?.fields[2]?.type === "select" ? sections[0].fields[2].options : [],
+                sections[0]?.fields[7]?.type === "select" ? sections[0].fields[7].options : [],
         },
-        sections.length % 8 // not absolutely correct
-    );
+        index: responseActionSections.length,
+    });
 
     return newResponseActionSection;
 }
diff --git a/src/webapp/pages/form-page/mapFormStateToEntityData.ts b/src/webapp/pages/form-page/mapFormStateToEntityData.ts
index 86422864..311bd867 100644
--- a/src/webapp/pages/form-page/mapFormStateToEntityData.ts
+++ b/src/webapp/pages/form-page/mapFormStateToEntityData.ts
@@ -528,55 +528,61 @@ function mapFormStateToIncidentResponseAction(
 ): ResponseAction[] {
     const allFields: FormFieldState[] = getAllFieldsFromSections(formState.sections);
 
-    const mainTask = allFields.find(field => field.id.includes(responseActionConstants.mainTask))
-        ?.value as string;
-    const subActivities = allFields.find(field =>
-        field.id.includes(responseActionConstants.subActivities)
-    )?.value as string;
-    const subPillar = allFields.find(field => field.id.includes(responseActionConstants.subPillar))
-        ?.value as string;
-    const dueDate = getDateFieldValue(
-        `${responseActionConstants.dueDate}-section`,
-        allFields
-    ) as Date;
-
-    const timeLine = allFields.find(field => field.id.includes(responseActionConstants.timeLine))
-        ?.value as string;
-
-    const searchAssignROValue = allFields.find(field =>
-        field.id.includes(responseActionConstants.searchAssignRO)
-    )?.value as string;
-    const searchAssignRO = formData.options.searchAssignRO.find(
-        option => option.id === searchAssignROValue
-    );
-    if (!searchAssignRO) throw new Error("Responsible officer not found");
-
-    const statusValue = allFields.find(field => field.id.includes(responseActionConstants.status))
-        ?.value as string;
-    const status = formData.options.status.find(option => option.id === statusValue);
-    if (!status) throw new Error("Status not found");
-
-    const verificationValue = allFields.find(field =>
-        field.id.includes(responseActionConstants.verification)
-    )?.value as string;
-    const verification = formData.options.verification.find(
-        option => option.id === verificationValue
-    );
-    if (!verification) throw new Error("Verification not found");
-
-    const incidentResponseActions: ResponseAction[] = formData.entity?.map(responseAction => {
-        return new ResponseAction({
-            id: responseAction.id ?? "",
-            mainTask: mainTask,
-            subActivities: subActivities,
-            subPillar: subPillar,
-            searchAssignRO: searchAssignRO,
-            dueDate: dueDate,
-            timeLine: timeLine,
-            status: status.id as Status,
-            verification: verification.id as Verification,
+    const incidentResponseActions: ResponseAction[] = formState.sections
+        .filter(section => !section.id.includes("addNewOptionSection"))
+        .map((_, index): ResponseAction => {
+            const mainTask = allFields.find(field =>
+                field.id.includes(`${responseActionConstants.mainTask}_${index}`)
+            )?.value as string;
+            const subActivities = allFields.find(field =>
+                field.id.includes(`${responseActionConstants.subActivities}_${index}`)
+            )?.value as string;
+            const subPillar = allFields.find(field =>
+                field.id.includes(`${responseActionConstants.subPillar}_${index}`)
+            )?.value as string;
+            const dueDate = allFields.find(field =>
+                field.id.includes(`${responseActionConstants.dueDate}_${index}`)
+            )?.value as Date;
+            const timeLine = allFields.find(field =>
+                field.id.includes(`${responseActionConstants.timeLine}_${index}`)
+            )?.value as string;
+
+            const searchAssignROValue = allFields.find(field =>
+                field.id.includes(`${responseActionConstants.searchAssignRO}_${index}`)
+            )?.value as string;
+            const searchAssignRO = formData.options.searchAssignRO.find(
+                option => option.id === searchAssignROValue
+            );
+            if (!searchAssignRO) throw new Error("Responsible officer not found");
+
+            const statusValue = allFields.find(field =>
+                field.id.includes(`${responseActionConstants.status}_${index}`)
+            )?.value as string;
+            const status = formData.options.status.find(option => option.id === statusValue);
+            if (!status) throw new Error("Status not found");
+
+            const verificationValue = allFields.find(field =>
+                field.id.includes(`${responseActionConstants.verification}_${index}`)
+            )?.value as string;
+            const verification = formData.options.verification.find(
+                option => option.id === verificationValue
+            );
+            if (!verification) throw new Error("Verification not found");
+
+            const responseAction = new ResponseAction({
+                id: formData.entity?.[index]?.id ?? "",
+                mainTask: mainTask,
+                subActivities: subActivities,
+                subPillar: subPillar,
+                dueDate: dueDate,
+                timeLine: timeLine,
+                searchAssignRO: searchAssignRO,
+                status: status.id as Status,
+                verification: verification.id as Verification,
+            });
+
+            return responseAction;
         });
-    });
 
     return incidentResponseActions;
 }
@@ -606,3 +612,30 @@ function getRiskAssessmentQuestionsWithOption(
 
     return { likelihoodOption, consequencesOption, riskOption };
 }
+
+// function getIncidentResponseActions(
+//     allFields: FormFieldState[],
+//     options: IncidentResponseActionOptions,
+//     index: string
+// ) {
+//     const likelihood = allFields.find(field =>
+//         field.id.includes(`${questionType}-likelihood${index}`)
+//     )?.value as string;
+//     const likelihoodOption = options.likelihood.find(option => option.id === likelihood);
+//     if (!likelihoodOption) throw new Error("Likelihood not found");
+
+//     const searchAssignRO = allFields.find(field => field.id.includes());
+
+//     const consequences = allFields.find(field =>
+//         field.id.includes(`${questionType}-consequences${index}`)
+//     )?.value as string;
+//     const consequencesOption = options.consequences.find(option => option.id === consequences);
+//     if (!consequencesOption) throw new Error("Consequences not found");
+
+//     const risk = allFields.find(field => field.id.includes(`${questionType}-risk${index}`))
+//         ?.value as string;
+//     const riskOption = options.risk.find(option => option.id === risk);
+//     if (!riskOption) throw new Error("Risk  not found");
+
+//     return { likelihoodOption, consequencesOption, riskOption };
+// }
diff --git a/src/webapp/pages/form-page/useForm.ts b/src/webapp/pages/form-page/useForm.ts
index fa5928bc..81452be8 100644
--- a/src/webapp/pages/form-page/useForm.ts
+++ b/src/webapp/pages/form-page/useForm.ts
@@ -89,6 +89,7 @@ export function useForm(formType: FormType, id?: Id): State {
 
     const handleAddNew = useCallback(() => {
         if (formState.kind !== "loaded" || !configurableForm) return;
+
         switch (configurableForm.type) {
             case "risk-assessment-questionnaire": {
                 setFormState(prevState => {
@@ -149,14 +150,12 @@ export function useForm(formType: FormType, id?: Id): State {
                             ...prevState.data,
                             sections: [
                                 ...otherSections,
-                                ...newResponseActionSection,
+                                newResponseActionSection,
                                 addAnotherSection,
                             ],
                         };
 
-                        const allNewFields = newResponseActionSection.flatMap(
-                            section => section.fields
-                        );
+                        const allNewFields = newResponseActionSection.fields;
 
                         const updatedAndValidatedData = allNewFields.reduce(
                             (acc, updatedFields) => {
@@ -214,6 +213,7 @@ export function useForm(formType: FormType, id?: Id): State {
             currentUser.username,
             configurableForm
         );
+
         compositionRoot.save.execute(formData).run(
             diseaseOutbreakEventId => {
                 setIsLoading(false);

From 6973c6e5c471686942d07645ac30bbc4f55d40d5 Mon Sep 17 00:00:00 2001
From: Chukwudumebi Onwuli <37223065+deeonwuli@users.noreply.github.com>
Date: Mon, 14 Oct 2024 05:36:48 -0700
Subject: [PATCH 07/14] fix: reduce api calls on incident action plan page load

this also fixes the failing test
---
 src/CompositionRoot.ts                        |  4 +
 .../usecases/GetIncidentActionByIdUseCase.ts  | 27 ++++++
 .../form-summary/ActionPlanFormSummary.tsx    | 14 ++-
 .../layout/side-bar/SideBarContent.tsx        | 23 ++---
 .../IncidentActionPlanPage.tsx                | 16 ++--
 .../useIncidentActionPlan.ts                  | 95 +++++++++----------
 6 files changed, 107 insertions(+), 72 deletions(-)
 create mode 100644 src/domain/usecases/GetIncidentActionByIdUseCase.ts

diff --git a/src/CompositionRoot.ts b/src/CompositionRoot.ts
index 3a795e3b..32a7d4e7 100644
--- a/src/CompositionRoot.ts
+++ b/src/CompositionRoot.ts
@@ -44,6 +44,7 @@ import { AlertSyncDataStoreTestRepository } from "./data/repositories/test/Alert
 import { AlertSyncRepository } from "./domain/repositories/AlertSyncRepository";
 import { DataStoreClient } from "./data/DataStoreClient";
 import { GetTotalCardCountsUseCase } from "./domain/usecases/GetTotalCardCountsUseCase";
+import { GetIncidentActionByIdUseCase } from "./domain/usecases/GetIncidentActionByIdUseCase";
 
 export type CompositionRoot = ReturnType<typeof getCompositionRoot>;
 
@@ -81,6 +82,9 @@ function getCompositionRoot(repositories: Repositories) {
                 repositories.optionsRepository
             ),
         },
+        incidentActionPlan: {
+            get: new GetIncidentActionByIdUseCase(repositories),
+        },
         performanceOverview: {
             getPerformanceOverviewMetrics: new GetAllPerformanceOverviewMetricsUseCase(
                 repositories
diff --git a/src/domain/usecases/GetIncidentActionByIdUseCase.ts b/src/domain/usecases/GetIncidentActionByIdUseCase.ts
new file mode 100644
index 00000000..06f9ba0b
--- /dev/null
+++ b/src/domain/usecases/GetIncidentActionByIdUseCase.ts
@@ -0,0 +1,27 @@
+import { FutureData } from "../../data/api-futures";
+import { Maybe } from "../../utils/ts-utils";
+import { IncidentActionPlan } from "../entities/incident-action-plan/IncidentActionPlan";
+import { Id } from "../entities/Ref";
+import { IncidentActionRepository } from "../repositories/IncidentActionRepository";
+import { OptionsRepository } from "../repositories/OptionsRepository";
+import { TeamMemberRepository } from "../repositories/TeamMemberRepository";
+import { getIncidentAction } from "./utils/incident-action/GetIncidentActionById";
+
+export class GetIncidentActionByIdUseCase {
+    constructor(
+        private options: {
+            incidentActionRepository: IncidentActionRepository;
+            optionsRepository: OptionsRepository;
+            teamMemberRepository: TeamMemberRepository;
+        }
+    ) {}
+
+    public execute(diseaseOutbreakEventId: Id): FutureData<Maybe<IncidentActionPlan>> {
+        return getIncidentAction(
+            diseaseOutbreakEventId,
+            this.options.incidentActionRepository,
+            this.options.optionsRepository,
+            this.options.teamMemberRepository
+        );
+    }
+}
diff --git a/src/webapp/components/form/form-summary/ActionPlanFormSummary.tsx b/src/webapp/components/form/form-summary/ActionPlanFormSummary.tsx
index 0d53f75d..e2cf5fae 100644
--- a/src/webapp/components/form/form-summary/ActionPlanFormSummary.tsx
+++ b/src/webapp/components/form/form-summary/ActionPlanFormSummary.tsx
@@ -7,9 +7,19 @@ import { RouteName, useRoutes } from "../../../hooks/useRoutes";
 import { EditOutlined } from "@material-ui/icons";
 import { Loader } from "../../loader/Loader";
 import { useSnackbar } from "@eyeseetea/d2-ui-components";
-import { FormSummaryProps } from "./FormSummary";
+import { Id } from "../../../../domain/entities/Ref";
+import { FormType } from "../../../pages/form-page/FormPage";
+import { IncidentActionFormSummaryData } from "../../../pages/incident-action-plan/useIncidentActionPlan";
+import { Maybe } from "../../../../utils/ts-utils";
 
-export const ActionPlanFormSummary: React.FC<FormSummaryProps> = React.memo(props => {
+type ActionPlanFormSummaryProps = {
+    id: Id;
+    formType: FormType;
+    formSummary: Maybe<IncidentActionFormSummaryData>;
+    summaryError: Maybe<string>;
+};
+
+export const ActionPlanFormSummary: React.FC<ActionPlanFormSummaryProps> = React.memo(props => {
     const { id, formType, formSummary, summaryError } = props;
     const { goTo } = useRoutes();
     const snackbar = useSnackbar();
diff --git a/src/webapp/components/layout/side-bar/SideBarContent.tsx b/src/webapp/components/layout/side-bar/SideBarContent.tsx
index 243a16fa..ece2a1fd 100644
--- a/src/webapp/components/layout/side-bar/SideBarContent.tsx
+++ b/src/webapp/components/layout/side-bar/SideBarContent.tsx
@@ -1,12 +1,12 @@
 import { List, ListItem, ListItemText } from "@material-ui/core";
 import React, { useCallback } from "react";
 import styled from "styled-components";
-import { NavLink, useParams } from "react-router-dom";
+import { NavLink } from "react-router-dom";
 import { AddCircleOutline } from "@material-ui/icons";
-
 import i18n from "../../../../utils/i18n";
 import { Button } from "../../button/Button";
 import { RouteName, routes, useRoutes } from "../../../hooks/useRoutes";
+import { useCurrentEventTracker } from "../../../contexts/current-event-tracker-context";
 
 type SideBarContentProps = {
     children?: React.ReactNode;
@@ -44,10 +44,8 @@ const DEFAULT_SIDEBAR_OPTIONS: SideBarOption[] = [
 
 export const SideBarContent: React.FC<SideBarContentProps> = React.memo(
     ({ children, hideOptions = false, showCreateEvent = false }) => {
-        const { id } = useParams<{
-            id: string;
-        }>();
         const { goTo } = useRoutes();
+        const { getCurrentEventTracker } = useCurrentEventTracker();
 
         const goToCreateEvent = useCallback(() => {
             goTo(RouteName.CREATE_FORM, { formType: "disease-outbreak-event" });
@@ -70,7 +68,15 @@ export const SideBarContent: React.FC<SideBarContentProps> = React.memo(
                                 button
                                 key={text}
                                 component={NavLink}
-                                to={getSideBarRoute(id, value)}
+                                to={
+                                    value === RouteName.EVENT_TRACKER ||
+                                    value === RouteName.INCIDENT_ACTION_PLAN
+                                        ? routes[value].replace(
+                                              ":id",
+                                              getCurrentEventTracker()?.id || ""
+                                          )
+                                        : routes[value]
+                                }
                             >
                                 <StyledText primary={i18n.t(text)} selected={false} />
                             </ListItem>
@@ -114,8 +120,3 @@ const CreateEventContainer = styled.div`
     margin-inline-start: 30px;
     width: 245px;
 `;
-
-function getSideBarRoute(id: string, value: RouteName) {
-    const route = routes[value];
-    return route.includes(":id") ? route.replace(":id", id) : route;
-}
diff --git a/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx b/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
index 4412486a..34b45b01 100644
--- a/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
+++ b/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
@@ -1,4 +1,4 @@
-import React, { useCallback, useEffect } from "react";
+import React, { useCallback } from "react";
 import i18n from "../../../utils/i18n";
 import { Layout } from "../../components/layout/Layout";
 import { useParams } from "react-router-dom";
@@ -30,19 +30,15 @@ export const IncidentActionPlanPage: React.FC = React.memo(() => {
         id: string;
     }>();
     const { goTo } = useRoutes();
+    const { getCurrentEventTracker } = useCurrentEventTracker();
+    const currentEventTracker = getCurrentEventTracker();
 
     const {
         actionPlanSummary,
         formSummary: incidentActionFormSummary,
         responseActionRows,
         summaryError,
-        eventTrackerDetails,
     } = useIncidentActionPlan(id);
-    const { changeCurrentEventTracker: changeCurrentEventTrackerId } = useCurrentEventTracker();
-
-    useEffect(() => {
-        if (eventTrackerDetails) changeCurrentEventTrackerId(eventTrackerDetails);
-    }, [changeCurrentEventTrackerId, eventTrackerDetails, id]);
 
     const getSummaryColumn = useCallback((index: number, label: string, value: string) => {
         return (
@@ -55,12 +51,12 @@ export const IncidentActionPlanPage: React.FC = React.memo(() => {
         );
     }, []);
 
-    const incidentActionExists = eventTrackerDetails?.incidentActionPlan?.actionPlan?.id;
+    const incidentActionExists = currentEventTracker?.incidentActionPlan?.actionPlan?.id;
 
     return (
         <Layout
             title={i18n.t("Incident Action Plan")}
-            subtitle={i18n.t(incidentActionFormSummary?.subTitle || "")}
+            subtitle={i18n.t(getCurrentEventTracker()?.name || "")}
         >
             {!actionPlanSummary && responseActionRows.length === 0 && !summaryError && <Loader />}
             {!incidentActionExists ? (
@@ -70,7 +66,7 @@ export const IncidentActionPlanPage: React.FC = React.memo(() => {
                     <Section>
                         <SummaryContainer>
                             <SummaryColumn>
-                                {incidentActionFormSummary?.summary.map((labelWithValue, index) =>
+                                {incidentActionFormSummary?.map((labelWithValue, index) =>
                                     getSummaryColumn(
                                         index,
                                         labelWithValue.label,
diff --git a/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts b/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts
index 7aa4794f..48d4b8a3 100644
--- a/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts
+++ b/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts
@@ -4,7 +4,6 @@ import { Maybe } from "../../../utils/ts-utils";
 import { useAppContext } from "../../contexts/app-context";
 import { DiseaseOutbreakEvent } from "../../../domain/entities/disease-outbreak-event/DiseaseOutbreakEvent";
 import { getDateAsLocaleDateTimeString } from "../../../data/repositories/utils/DateTimeHelper";
-import { User } from "../../components/user-selector/UserSelector";
 import { TableRowType } from "../../components/table/BasicTable";
 import {
     getIAPTypeByCode,
@@ -12,89 +11,89 @@ import {
     getStatusTypeByCode,
     getVerificationTypeByCode,
 } from "../../../data/repositories/consts/IncidentActionConstants";
+import { IncidentActionPlan } from "../../../domain/entities/incident-action-plan/IncidentActionPlan";
 
 type LabelWithValue = {
     label: string;
     value: string;
 };
 
-export type FormSummaryData = {
+export type IncidentActionFormSummaryData = {
     subTitle: string;
     summary: LabelWithValue[];
-    incidentManager: Maybe<User>;
-    notes: string;
 };
 
 export function useIncidentActionPlan(id: Id) {
     const { compositionRoot } = useAppContext();
-    const [formSummary, setFormSummary] = useState<FormSummaryData>();
-    const [actionPlanSummary, setActionPlanSummary] = useState<FormSummaryData>();
+
+    const [incidentAction, setIncidentAction] = useState<LabelWithValue[] | undefined>();
+    const [actionPlanSummary, setActionPlanSummary] = useState<IncidentActionFormSummaryData>();
     const [responseActionRows, setResponseActionRows] = useState<TableRowType[]>([]);
-    const [summaryError, setSummaryError] = useState<string>();
+    const [globalMessage, setGlobalMessage] = useState<string>();
     const [eventTrackerDetails, setEventTrackerDetails] = useState<DiseaseOutbreakEvent>();
 
     useEffect(() => {
+        compositionRoot.incidentActionPlan.get.execute(id).run(
+            incidentActionPlan => {
+                setIncidentAction(getIncidentActionFormSummary(incidentActionPlan));
+                setActionPlanSummary(mapIncidentActionPlanToFormSummary(incidentActionPlan));
+                setResponseActionRows(mapIncidentResponseActionToFormSummary(incidentActionPlan));
+            },
+            err => {
+                console.debug(err);
+                setGlobalMessage(`Event tracker with id: ${id} does not exist`);
+            }
+        );
         compositionRoot.diseaseOutbreakEvent.get.execute(id).run(
             diseaseOutbreakEvent => {
-                setFormSummary(mapIncidentActionToFormSummary(diseaseOutbreakEvent));
-                setActionPlanSummary(mapIncidentActionPlanToFormSummary(diseaseOutbreakEvent));
-                setResponseActionRows(mapIncidentResponseActionToFormSummary(diseaseOutbreakEvent));
                 setEventTrackerDetails(diseaseOutbreakEvent);
             },
             err => {
                 console.debug(err);
-                setSummaryError(`Event tracker with id: ${id} does not exist`);
+                setGlobalMessage(`Event tracker with id: ${id} does not exist`);
             }
         );
     }, [compositionRoot, id]);
 
     return {
         actionPlanSummary: actionPlanSummary,
-        formSummary: formSummary,
+        formSummary: incidentAction,
         responseActionRows: responseActionRows,
-        summaryError: summaryError,
+        summaryError: globalMessage,
         eventTrackerDetails: eventTrackerDetails,
     };
 }
 
-const mapIncidentActionToFormSummary = (
-    diseaseOutbreakEvent: DiseaseOutbreakEvent
-): FormSummaryData => {
-    const { incidentActionPlan, name, lastUpdated } = diseaseOutbreakEvent;
-
-    if (!incidentActionPlan)
-        return { subTitle: name, summary: [], incidentManager: undefined, notes: "" };
+const getIncidentActionFormSummary = (
+    incidentActionPlan: Maybe<IncidentActionPlan>
+): LabelWithValue[] => {
+    if (!incidentActionPlan) return [];
 
     const iapTypeCode = incidentActionPlan.actionPlan?.iapType ?? "";
     const phoecLevelCode = incidentActionPlan.actionPlan?.phoecLevel ?? "";
+    const lastUpdated = getDateAsLocaleDateTimeString(new Date()); //TO DO : Fetch sync time from datastore once implemented
 
-    return {
-        subTitle: name,
-        summary: [
-            {
-                label: "IAP last updated",
-                value: getDateAsLocaleDateTimeString(lastUpdated),
-            },
-            {
-                label: "IAP type",
-                value: getIAPTypeByCode(iapTypeCode) || "",
-            },
-            {
-                label: "PHOEC activation Level",
-                value: getPhoecLevelByCode(phoecLevelCode) || "",
-            },
-        ],
-        incidentManager: undefined,
-        notes: diseaseOutbreakEvent.notes || "",
-    };
+    return [
+        {
+            label: "IAP last updated",
+            value: lastUpdated,
+        },
+        {
+            label: "IAP type",
+            value: getIAPTypeByCode(iapTypeCode) || "",
+        },
+        {
+            label: "PHOEC activation Level",
+            value: getPhoecLevelByCode(phoecLevelCode) || "",
+        },
+    ];
 };
 
 const mapIncidentActionPlanToFormSummary = (
-    diseaseOutbreakEvent: DiseaseOutbreakEvent
-): FormSummaryData => {
-    const actionPlan = diseaseOutbreakEvent?.incidentActionPlan?.actionPlan;
-    if (!actionPlan)
-        return { subTitle: "Action Plan", summary: [], incidentManager: undefined, notes: "" };
+    incidentActionPlan: Maybe<IncidentActionPlan>
+): IncidentActionFormSummaryData => {
+    const actionPlan = incidentActionPlan?.actionPlan;
+    if (!actionPlan) return { subTitle: "Action Plan", summary: [] };
 
     return {
         subTitle: "Action Plan",
@@ -120,14 +119,12 @@ const mapIncidentActionPlanToFormSummary = (
                 value: actionPlan.responseActivitiesNarrative ?? "",
             },
         ],
-        incidentManager: undefined,
-        notes: diseaseOutbreakEvent.notes || "",
     };
 };
 
-const mapIncidentResponseActionToFormSummary = (diseaseOutbreakEvent: DiseaseOutbreakEvent) => {
-    if (diseaseOutbreakEvent.incidentActionPlan) {
-        return diseaseOutbreakEvent.incidentActionPlan.responseActions.map(responseAction => ({
+const mapIncidentResponseActionToFormSummary = (incidentActionPlan: Maybe<IncidentActionPlan>) => {
+    if (incidentActionPlan) {
+        return incidentActionPlan.responseActions.map(responseAction => ({
             mainTask: responseAction.mainTask,
             subActivities: responseAction.subActivities,
             subPillar: responseAction.subPillar,

From 7ab55a3705abfb632dc3f644b32b49b0d57b09a5 Mon Sep 17 00:00:00 2001
From: Chukwudumebi Onwuli <37223065+deeonwuli@users.noreply.github.com>
Date: Mon, 14 Oct 2024 05:50:13 -0700
Subject: [PATCH 08/14] fix: response action date field bug

---
 .../incident-action/mapIncidentActionToInitialFormState.ts  | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts b/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
index e5645c30..bfc2dcbb 100644
--- a/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
+++ b/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
@@ -251,7 +251,7 @@ export function mapIncidentResponseActionToInitialFormState(
         titleDescripton: "Step 2:",
         subtitleDescripton: "Assign response actions",
         saveButtonLabel: "Save plan",
-        isValid: incidentResponseActions ? true : false,
+        isValid: incidentResponseActions.length !== 0 ? true : false,
         sections: [...responseActionSections, addNewOptionSection],
     };
 }
@@ -325,7 +325,9 @@ function getResponseActionSection(options: {
                 label: "Due date",
                 isVisible: true,
                 errors: [],
-                value: incidentResponseAction?.dueDate || new Date(),
+                value: incidentResponseAction?.dueDate
+                    ? new Date(incidentResponseAction?.dueDate)
+                    : new Date(),
                 type: "date",
                 width: "200px",
                 required: true,

From 23d5bc7c6c03104006576caabfea16ec59c17dfe Mon Sep 17 00:00:00 2001
From: Chukwudumebi Onwuli <37223065+deeonwuli@users.noreply.github.com>
Date: Tue, 15 Oct 2024 06:42:38 -0700
Subject: [PATCH 09/14] feat: button label and icon for response action table

---
 .../IncidentActionNotice.tsx                  | 37 +++++++++++++
 .../IncidentActionPlanPage.tsx                | 54 ++++++-------------
 .../useIncidentActionPlan.ts                  | 17 ++----
 3 files changed, 58 insertions(+), 50 deletions(-)
 create mode 100644 src/webapp/pages/incident-action-plan/IncidentActionNotice.tsx

diff --git a/src/webapp/pages/incident-action-plan/IncidentActionNotice.tsx b/src/webapp/pages/incident-action-plan/IncidentActionNotice.tsx
new file mode 100644
index 00000000..49383337
--- /dev/null
+++ b/src/webapp/pages/incident-action-plan/IncidentActionNotice.tsx
@@ -0,0 +1,37 @@
+import React from "react";
+import { NoticeBox } from "../../components/notice-box/NoticeBox";
+import { RouteName, useRoutes } from "../../hooks/useRoutes";
+import i18n from "../../../utils/i18n";
+import { Button } from "@material-ui/core";
+import { EditOutlined } from "@material-ui/icons";
+
+export const IncidentActionNotice: React.FC = React.memo(() => {
+    const { goTo } = useRoutes();
+
+    return (
+        <NoticeBox title={i18n.t("Create an incident action plan")}>
+            <div
+                style={{
+                    display: "flex",
+                    justifyContent: "space-between",
+                    alignItems: "center",
+                }}
+            >
+                <p>{i18n.t("No plan has been created for this incident")}</p>
+
+                <Button
+                    variant="contained"
+                    color="primary"
+                    startIcon={<EditOutlined />}
+                    onClick={() => {
+                        goTo(RouteName.CREATE_FORM, {
+                            formType: "incident-action-plan",
+                        });
+                    }}
+                >
+                    {i18n.t("Create IAP")}
+                </Button>
+            </div>
+        </NoticeBox>
+    );
+});
diff --git a/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx b/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
index 34b45b01..ee3bd323 100644
--- a/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
+++ b/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
@@ -5,14 +5,14 @@ import { useParams } from "react-router-dom";
 import { RouteName, useRoutes } from "../../hooks/useRoutes";
 import { useCurrentEventTracker } from "../../contexts/current-event-tracker-context";
 import { useIncidentActionPlan } from "./useIncidentActionPlan";
-import { NoticeBox } from "../../components/notice-box/NoticeBox";
 import { Box, Button, Typography } from "@material-ui/core";
 import { AddCircleOutline, EditOutlined } from "@material-ui/icons";
 import { Section } from "../../components/section/Section";
-import { Loader } from "../../components/loader/Loader";
 import styled from "styled-components";
-import { BasicTable, TableColumn } from "../../components/table/BasicTable";
+import { BasicTable, TableColumn, TableRowType } from "../../components/table/BasicTable";
 import { ActionPlanFormSummary } from "../../components/form/form-summary/ActionPlanFormSummary";
+import { IncidentActionNotice } from "./IncidentActionNotice";
+import { Loader } from "../../components/loader/Loader";
 
 export const responseActionColumns: TableColumn[] = [
     { value: "mainTask", label: "Main task", type: "text" },
@@ -31,13 +31,13 @@ export const IncidentActionPlanPage: React.FC = React.memo(() => {
     }>();
     const { goTo } = useRoutes();
     const { getCurrentEventTracker } = useCurrentEventTracker();
-    const currentEventTracker = getCurrentEventTracker();
 
     const {
         actionPlanSummary,
         formSummary: incidentActionFormSummary,
         responseActionRows,
         summaryError,
+        incidentActionExists,
     } = useIncidentActionPlan(id);
 
     const getSummaryColumn = useCallback((index: number, label: string, value: string) => {
@@ -51,7 +51,8 @@ export const IncidentActionPlanPage: React.FC = React.memo(() => {
         );
     }, []);
 
-    const incidentActionExists = currentEventTracker?.incidentActionPlan?.actionPlan?.id;
+    const { icon: responseActionIcon, label: responseActionLabel } =
+        getResponseActionTableLabel(responseActionRows);
 
     return (
         <Layout
@@ -84,14 +85,14 @@ export const IncidentActionPlanPage: React.FC = React.memo(() => {
                             <Button
                                 variant="outlined"
                                 color="secondary"
-                                startIcon={<AddCircleOutline />}
+                                startIcon={responseActionIcon}
                                 onClick={() => {
                                     goTo(RouteName.CREATE_FORM, {
                                         formType: "incident-response-action",
                                     });
                                 }}
                             >
-                                {i18n.t("Edit Response Actions")}
+                                {i18n.t(responseActionLabel)}
                             </Button>
                         }
                         titleVariant="secondary"
@@ -112,6 +113,14 @@ export const IncidentActionPlanPage: React.FC = React.memo(() => {
     );
 });
 
+function getResponseActionTableLabel(responseActionRows: TableRowType[]) {
+    const label =
+        responseActionRows.length === 0 ? "Add new Response Action" : "Edit Response Actions";
+    const icon = responseActionRows.length === 0 ? <AddCircleOutline /> : <EditOutlined />;
+
+    return { icon: icon, label: label };
+}
+
 const SummaryContainer = styled.div`
     display: flex;
     width: max-content;
@@ -126,34 +135,3 @@ const SummaryColumn = styled.div`
     color: ${props => props.theme.palette.text.hint};
     min-width: fit-content;
 `;
-
-function IncidentActionNotice() {
-    const { goTo } = useRoutes();
-
-    return (
-        <NoticeBox title={i18n.t("Create an incident action plan")}>
-            <div
-                style={{
-                    display: "flex",
-                    justifyContent: "space-between",
-                    alignItems: "center",
-                }}
-            >
-                <p>{i18n.t("No plan has been created for this incident")}</p>
-
-                <Button
-                    variant="contained"
-                    color="primary"
-                    startIcon={<EditOutlined />}
-                    onClick={() => {
-                        goTo(RouteName.CREATE_FORM, {
-                            formType: "incident-action-plan",
-                        });
-                    }}
-                >
-                    {i18n.t("Create IAP")}
-                </Button>
-            </div>
-        </NoticeBox>
-    );
-}
diff --git a/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts b/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts
index 48d4b8a3..0c7056d1 100644
--- a/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts
+++ b/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts
@@ -2,7 +2,6 @@ import { useEffect, useState } from "react";
 import { Id } from "../../../domain/entities/Ref";
 import { Maybe } from "../../../utils/ts-utils";
 import { useAppContext } from "../../contexts/app-context";
-import { DiseaseOutbreakEvent } from "../../../domain/entities/disease-outbreak-event/DiseaseOutbreakEvent";
 import { getDateAsLocaleDateTimeString } from "../../../data/repositories/utils/DateTimeHelper";
 import { TableRowType } from "../../components/table/BasicTable";
 import {
@@ -30,11 +29,14 @@ export function useIncidentActionPlan(id: Id) {
     const [actionPlanSummary, setActionPlanSummary] = useState<IncidentActionFormSummaryData>();
     const [responseActionRows, setResponseActionRows] = useState<TableRowType[]>([]);
     const [globalMessage, setGlobalMessage] = useState<string>();
-    const [eventTrackerDetails, setEventTrackerDetails] = useState<DiseaseOutbreakEvent>();
+    const [incidentActionExists, setIncidentActionExists] = useState<boolean>(false);
 
     useEffect(() => {
         compositionRoot.incidentActionPlan.get.execute(id).run(
             incidentActionPlan => {
+                const incidentActionExists = !!incidentActionPlan?.actionPlan?.id;
+
+                setIncidentActionExists(incidentActionExists);
                 setIncidentAction(getIncidentActionFormSummary(incidentActionPlan));
                 setActionPlanSummary(mapIncidentActionPlanToFormSummary(incidentActionPlan));
                 setResponseActionRows(mapIncidentResponseActionToFormSummary(incidentActionPlan));
@@ -44,23 +46,14 @@ export function useIncidentActionPlan(id: Id) {
                 setGlobalMessage(`Event tracker with id: ${id} does not exist`);
             }
         );
-        compositionRoot.diseaseOutbreakEvent.get.execute(id).run(
-            diseaseOutbreakEvent => {
-                setEventTrackerDetails(diseaseOutbreakEvent);
-            },
-            err => {
-                console.debug(err);
-                setGlobalMessage(`Event tracker with id: ${id} does not exist`);
-            }
-        );
     }, [compositionRoot, id]);
 
     return {
+        incidentActionExists: incidentActionExists,
         actionPlanSummary: actionPlanSummary,
         formSummary: incidentAction,
         responseActionRows: responseActionRows,
         summaryError: globalMessage,
-        eventTrackerDetails: eventTrackerDetails,
     };
 }
 

From 859e137296de54fa391f835bdb2baaf35a9a3e0c Mon Sep 17 00:00:00 2001
From: Chukwudumebi Onwuli <37223065+deeonwuli@users.noreply.github.com>
Date: Tue, 15 Oct 2024 06:49:30 -0700
Subject: [PATCH 10/14] feat: change new response action button label

---
 src/webapp/components/form/FormSection.tsx    |  6 +++-
 .../mapIncidentActionToInitialFormState.ts    | 31 ++++++++++++++-----
 .../form-page/mapFormStateToEntityData.ts     | 29 +----------------
 src/webapp/pages/form-page/useForm.ts         |  2 +-
 4 files changed, 30 insertions(+), 38 deletions(-)

diff --git a/src/webapp/components/form/FormSection.tsx b/src/webapp/components/form/FormSection.tsx
index 2ddc013e..5e0380ef 100644
--- a/src/webapp/components/form/FormSection.tsx
+++ b/src/webapp/components/form/FormSection.tsx
@@ -61,7 +61,11 @@ export const FormSection: React.FC<FormSectionProps> = React.memo(
                     )}
 
                     {addNewField && handleAddNew && (
-                        <AddNewOption id="" onAddNewOption={handleAddNew} />
+                        <AddNewOption
+                            id=""
+                            label={addNewField.label}
+                            onAddNewOption={handleAddNew}
+                        />
                     )}
 
                     {fields.length && fields.some(f => f.isVisible) ? (
diff --git a/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts b/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
index bfc2dcbb..17d5ed16 100644
--- a/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
+++ b/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
@@ -12,7 +12,6 @@ import { FormSectionState } from "../../../components/form/FormSectionsState";
 import { FormState } from "../../../components/form/FormState";
 import { Option as UIOption } from "../../../components/utils/option";
 import { mapToPresentationOptions } from "../mapEntityToFormState";
-import { getAnotherOptionSection } from "../risk-assessment/mapRiskAssessmentToInitialFormState";
 
 type ActionPlanSectionKeys =
     | "iapType"
@@ -24,6 +23,22 @@ type ActionPlanSectionKeys =
     | "expectedResults"
     | "responseActivitiesNarrative";
 
+function getAnotherResponseActionSection(): FormSectionState {
+    return {
+        id: "addNewResponseActionSection",
+        isVisible: true,
+        fields: [],
+        addNewField: {
+            id: "addNewResponseAction",
+            isVisible: true,
+            errors: [],
+            type: "addNew",
+            value: null,
+            label: "Add new response action",
+        },
+    };
+}
+
 export function mapIncidentActionPlanToInitialFormState(
     incidentActionPlanFormData: ActionPlanFormData
 ): FormState {
@@ -31,7 +46,7 @@ export function mapIncidentActionPlanToInitialFormState(
     const { iapType, phoecLevel } = options;
 
     const iapTypeOptions: UIOption[] = mapToPresentationOptions(iapType);
-    const phoexLevelOptions: UIOption[] = mapToPresentationOptions(phoecLevel);
+    const phoecLevelOptions: UIOption[] = mapToPresentationOptions(phoecLevel);
 
     const mainSections: Record<ActionPlanSectionKeys, FormSectionState> = {
         iapType: {
@@ -66,7 +81,7 @@ export function mapIncidentActionPlanToInitialFormState(
                     errors: [],
                     type: "select",
                     multiple: false,
-                    options: phoexLevelOptions,
+                    options: phoecLevelOptions,
                     value: incidentActionPlan?.phoecLevel || "",
                     required: true,
                 },
@@ -148,7 +163,7 @@ export function mapIncidentActionPlanToInitialFormState(
             ],
         },
         expectedResults: {
-            title: "Expected results",
+            title: "Sections, functional area objectives, expected results",
             id: "expected_results_section",
             isVisible: true,
             direction: "column",
@@ -242,7 +257,7 @@ export function mapIncidentResponseActionToInitialFormState(
               })
             : [initialResponseActionSection];
 
-    const addNewOptionSection: FormSectionState = getAnotherOptionSection();
+    const addNewResponseActionSection: FormSectionState = getAnotherResponseActionSection();
 
     return {
         id: eventTrackerDetails.id ?? "",
@@ -252,7 +267,7 @@ export function mapIncidentResponseActionToInitialFormState(
         subtitleDescripton: "Assign response actions",
         saveButtonLabel: "Save plan",
         isValid: incidentResponseActions.length !== 0 ? true : false,
-        sections: [...responseActionSections, addNewOptionSection],
+        sections: [...responseActionSections, addNewResponseActionSection],
     };
 }
 
@@ -270,7 +285,7 @@ function getResponseActionSection(options: {
 
     const responseActionSection: FormSectionState = {
         title: "",
-        id: `response_action_section`,
+        id: `response_action_section_${index}`,
         isVisible: true,
         direction: "row",
         fields: [
@@ -379,7 +394,7 @@ function getResponseActionSection(options: {
 
 export function addNewResponseActionSection(sections: FormSectionState[]): FormSectionState {
     const responseActionSections = sections.filter(
-        section => !section.id.startsWith("addNewOptionSection")
+        section => !section.id.startsWith("addNewResponseActionSection")
     );
 
     const newResponseActionSection = getResponseActionSection({
diff --git a/src/webapp/pages/form-page/mapFormStateToEntityData.ts b/src/webapp/pages/form-page/mapFormStateToEntityData.ts
index 311bd867..4844d513 100644
--- a/src/webapp/pages/form-page/mapFormStateToEntityData.ts
+++ b/src/webapp/pages/form-page/mapFormStateToEntityData.ts
@@ -529,7 +529,7 @@ function mapFormStateToIncidentResponseAction(
     const allFields: FormFieldState[] = getAllFieldsFromSections(formState.sections);
 
     const incidentResponseActions: ResponseAction[] = formState.sections
-        .filter(section => !section.id.includes("addNewOptionSection"))
+        .filter(section => !section.id.includes("addNewResponseActionSection"))
         .map((_, index): ResponseAction => {
             const mainTask = allFields.find(field =>
                 field.id.includes(`${responseActionConstants.mainTask}_${index}`)
@@ -612,30 +612,3 @@ function getRiskAssessmentQuestionsWithOption(
 
     return { likelihoodOption, consequencesOption, riskOption };
 }
-
-// function getIncidentResponseActions(
-//     allFields: FormFieldState[],
-//     options: IncidentResponseActionOptions,
-//     index: string
-// ) {
-//     const likelihood = allFields.find(field =>
-//         field.id.includes(`${questionType}-likelihood${index}`)
-//     )?.value as string;
-//     const likelihoodOption = options.likelihood.find(option => option.id === likelihood);
-//     if (!likelihoodOption) throw new Error("Likelihood not found");
-
-//     const searchAssignRO = allFields.find(field => field.id.includes());
-
-//     const consequences = allFields.find(field =>
-//         field.id.includes(`${questionType}-consequences${index}`)
-//     )?.value as string;
-//     const consequencesOption = options.consequences.find(option => option.id === consequences);
-//     if (!consequencesOption) throw new Error("Consequences not found");
-
-//     const risk = allFields.find(field => field.id.includes(`${questionType}-risk${index}`))
-//         ?.value as string;
-//     const riskOption = options.risk.find(option => option.id === risk);
-//     if (!riskOption) throw new Error("Risk  not found");
-
-//     return { likelihoodOption, consequencesOption, riskOption };
-// }
diff --git a/src/webapp/pages/form-page/useForm.ts b/src/webapp/pages/form-page/useForm.ts
index 81452be8..ad97f81f 100644
--- a/src/webapp/pages/form-page/useForm.ts
+++ b/src/webapp/pages/form-page/useForm.ts
@@ -139,7 +139,7 @@ export function useForm(formType: FormType, id?: Id): State {
                 setFormState(prevState => {
                     if (prevState.kind === "loaded") {
                         const otherSections = prevState.data.sections.filter(
-                            section => section.id !== "addNewOptionSection"
+                            section => section.id !== "addNewResponseActionSection"
                         );
                         const addAnotherSection = getAnotherOptionSection();
                         const newResponseActionSection = addNewResponseActionSection(

From ae609d69ac926e5ac5985f218a1087e7c72cfa12 Mon Sep 17 00:00:00 2001
From: Chukwudumebi Onwuli <37223065+deeonwuli@users.noreply.github.com>
Date: Wed, 16 Oct 2024 04:26:20 -0700
Subject: [PATCH 11/14] feat: use options parameter for save entity usecase

---
 i18n/en.pot                              | 13 +++++--------
 i18n/es.po                               | 11 ++++-------
 src/CompositionRoot.ts                   |  6 +-----
 src/domain/usecases/SaveEntityUseCase.ts | 17 +++++++++++------
 4 files changed, 21 insertions(+), 26 deletions(-)

diff --git a/i18n/en.pot b/i18n/en.pot
index 63c23d2a..7532a51f 100644
--- a/i18n/en.pot
+++ b/i18n/en.pot
@@ -5,8 +5,8 @@ msgstr ""
 "Content-Type: text/plain; charset=utf-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=2; plural=(n != 1)\n"
-"POT-Creation-Date: 2024-10-09T10:40:30.273Z\n"
-"PO-Revision-Date: 2024-10-09T10:40:30.273Z\n"
+"POT-Creation-Date: 2024-10-15T13:56:24.806Z\n"
+"PO-Revision-Date: 2024-10-15T13:56:24.806Z\n"
 
 msgid "Low"
 msgstr ""
@@ -180,12 +180,6 @@ msgstr ""
 msgid "Incident Response Actions saved successfully"
 msgstr ""
 
-msgid "Incident Action Plan"
-msgstr ""
-
-msgid "Edit Response Actions"
-msgstr ""
-
 msgid "Create an incident action plan"
 msgstr ""
 
@@ -195,6 +189,9 @@ msgstr ""
 msgid "Create IAP"
 msgstr ""
 
+msgid "Incident Action Plan"
+msgstr ""
+
 msgid "Incident Management Team Builder"
 msgstr ""
 
diff --git a/i18n/es.po b/i18n/es.po
index 06a480cf..9dcc64a0 100644
--- a/i18n/es.po
+++ b/i18n/es.po
@@ -1,7 +1,7 @@
 msgid ""
 msgstr ""
 "Project-Id-Version: i18next-conv\n"
-"POT-Creation-Date: 2024-10-09T10:40:30.273Z\n"
+"POT-Creation-Date: 2024-10-15T13:56:24.806Z\n"
 "PO-Revision-Date: 2018-10-25T09:02:35.143Z\n"
 "MIME-Version: 1.0\n"
 "Content-Type: text/plain; charset=UTF-8\n"
@@ -179,12 +179,6 @@ msgstr ""
 msgid "Incident Response Actions saved successfully"
 msgstr ""
 
-msgid "Incident Action Plan"
-msgstr ""
-
-msgid "Edit Response Actions"
-msgstr ""
-
 msgid "Create an incident action plan"
 msgstr ""
 
@@ -194,6 +188,9 @@ msgstr ""
 msgid "Create IAP"
 msgstr ""
 
+msgid "Incident Action Plan"
+msgstr ""
+
 msgid "Incident Management Team Builder"
 msgstr ""
 
diff --git a/src/CompositionRoot.ts b/src/CompositionRoot.ts
index 32a7d4e7..c637080f 100644
--- a/src/CompositionRoot.ts
+++ b/src/CompositionRoot.ts
@@ -65,11 +65,7 @@ type Repositories = {
 function getCompositionRoot(repositories: Repositories) {
     return {
         getWithOptions: new GetEntityWithOptionsUseCase(repositories),
-        save: new SaveEntityUseCase(
-            repositories.diseaseOutbreakEventRepository,
-            repositories.riskAssessmentRepository,
-            repositories.incidentActionRepository
-        ),
+        save: new SaveEntityUseCase(repositories),
         users: {
             getCurrent: new GetCurrentUserUseCase(repositories.usersRepository),
         },
diff --git a/src/domain/usecases/SaveEntityUseCase.ts b/src/domain/usecases/SaveEntityUseCase.ts
index d66457bf..6c661236 100644
--- a/src/domain/usecases/SaveEntityUseCase.ts
+++ b/src/domain/usecases/SaveEntityUseCase.ts
@@ -9,26 +9,31 @@ import { saveDiseaseOutbreak } from "./utils/disease-outbreak/SaveDiseaseOutbrea
 
 export class SaveEntityUseCase {
     constructor(
-        private diseaseOutbreakEventRepository: DiseaseOutbreakEventRepository,
-        private riskAssessmentRepository: RiskAssessmentRepository,
-        private incidentActionRepository: IncidentActionRepository
+        private options: {
+            diseaseOutbreakEventRepository: DiseaseOutbreakEventRepository;
+            riskAssessmentRepository: RiskAssessmentRepository;
+            incidentActionRepository: IncidentActionRepository;
+        }
     ) {}
 
     public execute(formData: ConfigurableForm): FutureData<void | Id> {
         if (!formData || !formData.entity) return Future.error(new Error("No form data found"));
         switch (formData.type) {
             case "disease-outbreak-event":
-                return saveDiseaseOutbreak(this.diseaseOutbreakEventRepository, formData.entity);
+                return saveDiseaseOutbreak(
+                    this.options.diseaseOutbreakEventRepository,
+                    formData.entity
+                );
             case "risk-assessment-grading":
             case "risk-assessment-summary":
             case "risk-assessment-questionnaire":
-                return this.riskAssessmentRepository.saveRiskAssessment(
+                return this.options.riskAssessmentRepository.saveRiskAssessment(
                     formData,
                     formData.eventTrackerDetails.id
                 );
             case "incident-action-plan":
             case "incident-response-action":
-                return this.incidentActionRepository.saveIncidentAction(
+                return this.options.incidentActionRepository.saveIncidentAction(
                     formData,
                     formData.eventTrackerDetails.id
                 );

From c120b7c207dc317dec62cd3db916e8f2aa38a7d2 Mon Sep 17 00:00:00 2001
From: Chukwudumebi Onwuli <37223065+deeonwuli@users.noreply.github.com>
Date: Wed, 16 Oct 2024 07:10:05 -0700
Subject: [PATCH 12/14] feat: update status and verification option from table

---
 src/CompositionRoot.ts                        |   2 +
 .../IncidentActionD2Repository.ts             |  78 +++++++++++--
 .../consts/IncidentActionConstants.ts         |   4 +-
 .../test/IncidentActionTestRepository.ts      |   9 +-
 .../utils/IncidentActionMapper.ts             |   2 +-
 .../IncidentActionPlan.ts                     |   8 +-
 .../repositories/IncidentActionRepository.ts  |  10 ++
 .../UpdateIncidentResponseActionUseCase.ts    |  13 +++
 .../incident-action/GetIncidentActionById.ts  |   4 +
 .../mapIncidentActionToInitialFormState.ts    |   2 +-
 src/webapp/pages/form-page/useForm.ts         |   7 +-
 .../IncidentActionPlanPage.tsx                |  58 ++--------
 .../ResponseActionTable.tsx                   |  62 +++++++++++
 .../useIncidentActionPlan.ts                  | 104 +++++++++++++++---
 14 files changed, 284 insertions(+), 79 deletions(-)
 create mode 100644 src/domain/usecases/UpdateIncidentResponseActionUseCase.ts
 create mode 100644 src/webapp/pages/incident-action-plan/ResponseActionTable.tsx

diff --git a/src/CompositionRoot.ts b/src/CompositionRoot.ts
index c637080f..319333de 100644
--- a/src/CompositionRoot.ts
+++ b/src/CompositionRoot.ts
@@ -45,6 +45,7 @@ import { AlertSyncRepository } from "./domain/repositories/AlertSyncRepository";
 import { DataStoreClient } from "./data/DataStoreClient";
 import { GetTotalCardCountsUseCase } from "./domain/usecases/GetTotalCardCountsUseCase";
 import { GetIncidentActionByIdUseCase } from "./domain/usecases/GetIncidentActionByIdUseCase";
+import { UpdateIncidentResponseActionUseCase } from "./domain/usecases/UpdateIncidentResponseActionUseCase";
 
 export type CompositionRoot = ReturnType<typeof getCompositionRoot>;
 
@@ -80,6 +81,7 @@ function getCompositionRoot(repositories: Repositories) {
         },
         incidentActionPlan: {
             get: new GetIncidentActionByIdUseCase(repositories),
+            updateResponseAction: new UpdateIncidentResponseActionUseCase(repositories),
         },
         performanceOverview: {
             getPerformanceOverviewMetrics: new GetAllPerformanceOverviewMetricsUseCase(
diff --git a/src/data/repositories/IncidentActionD2Repository.ts b/src/data/repositories/IncidentActionD2Repository.ts
index 8b989b68..701edb59 100644
--- a/src/data/repositories/IncidentActionD2Repository.ts
+++ b/src/data/repositories/IncidentActionD2Repository.ts
@@ -8,7 +8,10 @@ import {
     RTSL_ZEBRA_ORG_UNIT_ID,
     RTSL_ZEBRA_PROGRAM_ID,
 } from "./consts/DiseaseOutbreakConstants";
-import { IncidentActionRepository } from "../../domain/repositories/IncidentActionRepository";
+import {
+    IncidentActionRepository,
+    UpdateIncidentResponseActionOptions,
+} from "../../domain/repositories/IncidentActionRepository";
 import {
     mapDataElementsToIncidentActionPlan,
     mapDataElementsToIncidentResponseActions,
@@ -18,6 +21,9 @@ import { ActionPlanFormData, ResponseActionFormData } from "../../domain/entitie
 import { getProgramStage } from "./utils/MetadataHelper";
 import { Future } from "../../domain/entities/generic/Future";
 import { Status, Verification } from "../../domain/entities/incident-action-plan/ResponseAction";
+import { assertOrError } from "./utils/AssertOrError";
+import { D2TrackerEvent } from "@eyeseetea/d2-api/api/trackerEvents";
+import { statusCodeMap, verificationCodeMap } from "./consts/IncidentActionConstants";
 
 export const incidentActionPlanIds = {
     iapType: "wr1I51WTHhl",
@@ -129,9 +135,7 @@ export class IncidentActionD2Repository implements IncidentActionRepository {
             const incidentDataElements = incidentResponse.objects[0]?.programStageDataElements;
 
             if (!incidentDataElements)
-                return Future.error(
-                    new Error(` ${formData.type} Program Stage metadata not found`)
-                );
+                return Future.error(new Error(`${formData.type} Program Stage metadata not found`));
 
             //Get the enrollment Id for the disease outbreak
             return apiToFuture(
@@ -165,9 +169,7 @@ export class IncidentActionD2Repository implements IncidentActionRepository {
                     )
                 ).flatMap(saveResponse => {
                     if (saveResponse.status === "ERROR" || !diseaseOutbreakId) {
-                        return Future.error(
-                            new Error(`Error saving Incident Action Plan Risk Assessment Grading`)
-                        );
+                        return Future.error(new Error(`Error saving Incident Action`));
                     } else {
                         return Future.success(undefined);
                     }
@@ -176,6 +178,68 @@ export class IncidentActionD2Repository implements IncidentActionRepository {
         });
     }
 
+    updateIncidentResponseAction(options: UpdateIncidentResponseActionOptions): FutureData<void> {
+        const { diseaseOutbreakId, eventId, responseAction } = options;
+
+        return apiToFuture(
+            this.api.tracker.events.get({
+                program: RTSL_ZEBRA_PROGRAM_ID,
+                orgUnit: RTSL_ZEBRA_ORG_UNIT_ID,
+                trackedEntity: diseaseOutbreakId,
+                programStage: RTSL_ZEBRA_INCIDENT_RESPONSE_ACTION_PROGRAM_STAGE_ID,
+                event: eventId,
+                fields: {
+                    enrollment: true,
+                    dataValues: {
+                        dataElement: true,
+                        value: true,
+                    },
+                },
+            })
+        )
+            .flatMap(response => assertOrError(response.instances[0], "Event"))
+            .flatMap(event => {
+                const enrollmentId = event.enrollment;
+                if (!enrollmentId) {
+                    return Future.error(new Error(`Enrollment not found for response action`));
+                }
+
+                const valueCodeMaps = { ...statusCodeMap, ...verificationCodeMap };
+
+                const eventToPost: D2TrackerEvent = {
+                    event: eventId,
+                    program: RTSL_ZEBRA_PROGRAM_ID,
+                    programStage: RTSL_ZEBRA_INCIDENT_RESPONSE_ACTION_PROGRAM_STAGE_ID,
+                    orgUnit: RTSL_ZEBRA_ORG_UNIT_ID,
+                    enrollment: enrollmentId,
+                    occurredAt: new Date().toISOString(),
+                    trackedEntity: diseaseOutbreakId,
+                    status: "ACTIVE",
+                    dataValues: [
+                        {
+                            dataElement:
+                                incidentResponseActionsIds[
+                                    responseAction.type as keyof typeof incidentResponseActionsIds
+                                ],
+                            value: valueCodeMaps[
+                                responseAction.value as keyof typeof valueCodeMaps
+                            ],
+                        },
+                    ],
+                };
+
+                return apiToFuture(
+                    this.api.tracker.post({ importStrategy: "UPDATE" }, { events: [eventToPost] })
+                ).flatMap(saveResponse => {
+                    if (saveResponse.status === "ERROR") {
+                        return Future.error(new Error(`Error saving Incident Response Action`));
+                    } else {
+                        return Future.success(undefined);
+                    }
+                });
+            });
+    }
+
     private getProgramStageByFormType(formType: string) {
         switch (formType) {
             case "incident-action-plan":
diff --git a/src/data/repositories/consts/IncidentActionConstants.ts b/src/data/repositories/consts/IncidentActionConstants.ts
index 403ca38c..8f7927b4 100644
--- a/src/data/repositories/consts/IncidentActionConstants.ts
+++ b/src/data/repositories/consts/IncidentActionConstants.ts
@@ -76,7 +76,7 @@ export function isStringInIncidentResponseActionCodes(
     return (Object.values(responseActionConstants) as string[]).includes(code);
 }
 
-const statusCodeMap: Record<ResponseActionStatusType, string> = {
+export const statusCodeMap: Record<ResponseActionStatusType, string> = {
     "Not done": "RTSL_ZEB_OS_STATUS_NOT_DONE",
     Pending: "RTSL_ZEB_OS_STATUS_PENDING",
     "In Progress": "RTSL_ZEB_OS_STATUS_IN_PROGRESS",
@@ -89,7 +89,7 @@ export function getStatusTypeByCode(iapTypeCode: string): Maybe<ResponseActionSt
     );
 }
 
-const verificationCodeMap: Record<ResponseActionVerificationType, string> = {
+export const verificationCodeMap: Record<ResponseActionVerificationType, string> = {
     Verified: "RTSL_ZEB_OS_VERIFICATION_VERIFIED",
     Unverified: "RTSL_ZEB_OS_VERIFICATION_UNVERIFIED",
 };
diff --git a/src/data/repositories/test/IncidentActionTestRepository.ts b/src/data/repositories/test/IncidentActionTestRepository.ts
index 2b82fccb..77cab7f7 100644
--- a/src/data/repositories/test/IncidentActionTestRepository.ts
+++ b/src/data/repositories/test/IncidentActionTestRepository.ts
@@ -1,5 +1,8 @@
 import { Id } from "../../../domain/entities/Ref";
-import { IncidentActionRepository } from "../../../domain/repositories/IncidentActionRepository";
+import {
+    IncidentActionRepository,
+    UpdateIncidentResponseActionOptions,
+} from "../../../domain/repositories/IncidentActionRepository";
 import { Maybe } from "../../../utils/ts-utils";
 import { FutureData } from "../../api-futures";
 import {
@@ -21,4 +24,8 @@ export class IncidentActionTestRepository implements IncidentActionRepository {
     saveIncidentAction(_formData: any, _diseaseOutbreakId: Id): FutureData<void> {
         throw new Error("Method not implemented.");
     }
+
+    updateIncidentResponseAction(_options: UpdateIncidentResponseActionOptions): FutureData<void> {
+        throw new Error("Method not implemented.");
+    }
 }
diff --git a/src/data/repositories/utils/IncidentActionMapper.ts b/src/data/repositories/utils/IncidentActionMapper.ts
index e7e0e6b7..6da7f536 100644
--- a/src/data/repositories/utils/IncidentActionMapper.ts
+++ b/src/data/repositories/utils/IncidentActionMapper.ts
@@ -158,7 +158,7 @@ function mapIncidentActionPlanToDataElements(
     );
 }
 
-function mapIncidentResponseActionToDataElements(
+export function mapIncidentResponseActionToDataElements(
     programStageId: Id,
     teiId: Id,
     enrollmentId: Id,
diff --git a/src/domain/entities/incident-action-plan/IncidentActionPlan.ts b/src/domain/entities/incident-action-plan/IncidentActionPlan.ts
index 8654dd1d..735c0f88 100644
--- a/src/domain/entities/incident-action-plan/IncidentActionPlan.ts
+++ b/src/domain/entities/incident-action-plan/IncidentActionPlan.ts
@@ -1,13 +1,19 @@
 import { ActionPlan } from "./ActionPlan";
-import { Ref } from "../Ref";
+import { Option, Ref } from "../Ref";
 import { Struct } from "../generic/Struct";
 import { ResponseAction } from "./ResponseAction";
 import { Maybe } from "../../../utils/ts-utils";
 
+export type IncidentActionOptions = {
+    status: Option[];
+    verification: Option[];
+};
+
 interface IncidentActionPlanAttrs extends Ref {
     lastUpdated: Date;
     actionPlan: Maybe<ActionPlan>;
     responseActions: ResponseAction[];
+    incidentActionOptions: IncidentActionOptions;
 }
 
 export class IncidentActionPlan extends Struct<IncidentActionPlanAttrs>() {}
diff --git a/src/domain/repositories/IncidentActionRepository.ts b/src/domain/repositories/IncidentActionRepository.ts
index 9840854a..dce5bc93 100644
--- a/src/domain/repositories/IncidentActionRepository.ts
+++ b/src/domain/repositories/IncidentActionRepository.ts
@@ -16,4 +16,14 @@ export interface IncidentActionRepository {
         formData: ActionPlanFormData | ResponseActionFormData,
         diseaseOutbreakId: Id
     ): FutureData<void>;
+    updateIncidentResponseAction(options: UpdateIncidentResponseActionOptions): FutureData<void>;
 }
+
+export type UpdateIncidentResponseActionOptions = {
+    diseaseOutbreakId: Id;
+    eventId: Id;
+    responseAction: {
+        value: string;
+        type: string;
+    };
+};
diff --git a/src/domain/usecases/UpdateIncidentResponseActionUseCase.ts b/src/domain/usecases/UpdateIncidentResponseActionUseCase.ts
new file mode 100644
index 00000000..663d94cb
--- /dev/null
+++ b/src/domain/usecases/UpdateIncidentResponseActionUseCase.ts
@@ -0,0 +1,13 @@
+import { FutureData } from "../../data/api-futures";
+import {
+    IncidentActionRepository,
+    UpdateIncidentResponseActionOptions,
+} from "../repositories/IncidentActionRepository";
+
+export class UpdateIncidentResponseActionUseCase {
+    constructor(private options: { incidentActionRepository: IncidentActionRepository }) {}
+
+    public execute(options: UpdateIncidentResponseActionOptions): FutureData<void> {
+        return this.options.incidentActionRepository.updateIncidentResponseAction(options);
+    }
+}
diff --git a/src/domain/usecases/utils/incident-action/GetIncidentActionById.ts b/src/domain/usecases/utils/incident-action/GetIncidentActionById.ts
index cf3e3c53..dff75442 100644
--- a/src/domain/usecases/utils/incident-action/GetIncidentActionById.ts
+++ b/src/domain/usecases/utils/incident-action/GetIncidentActionById.ts
@@ -80,6 +80,10 @@ export function getIncidentAction(
                             lastUpdated: new Date(),
                             actionPlan: actionPlan,
                             responseActions: responseActions,
+                            incidentActionOptions: {
+                                status: statusOptions,
+                                verification: verificationOptions,
+                            },
                         });
 
                         return Future.success(incidentAction);
diff --git a/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts b/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
index 17d5ed16..8166e870 100644
--- a/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
+++ b/src/webapp/pages/form-page/incident-action/mapIncidentActionToInitialFormState.ts
@@ -23,7 +23,7 @@ type ActionPlanSectionKeys =
     | "expectedResults"
     | "responseActivitiesNarrative";
 
-function getAnotherResponseActionSection(): FormSectionState {
+export function getAnotherResponseActionSection(): FormSectionState {
     return {
         id: "addNewResponseActionSection",
         isVisible: true,
diff --git a/src/webapp/pages/form-page/useForm.ts b/src/webapp/pages/form-page/useForm.ts
index ad97f81f..661b45d2 100644
--- a/src/webapp/pages/form-page/useForm.ts
+++ b/src/webapp/pages/form-page/useForm.ts
@@ -16,7 +16,10 @@ import {
     addNewCustomQuestionSection,
     getAnotherOptionSection,
 } from "./risk-assessment/mapRiskAssessmentToInitialFormState";
-import { addNewResponseActionSection } from "./incident-action/mapIncidentActionToInitialFormState";
+import {
+    addNewResponseActionSection,
+    getAnotherResponseActionSection,
+} from "./incident-action/mapIncidentActionToInitialFormState";
 
 export type GlobalMessage = {
     text: string;
@@ -141,7 +144,7 @@ export function useForm(formType: FormType, id?: Id): State {
                         const otherSections = prevState.data.sections.filter(
                             section => section.id !== "addNewResponseActionSection"
                         );
-                        const addAnotherSection = getAnotherOptionSection();
+                        const addAnotherSection = getAnotherResponseActionSection();
                         const newResponseActionSection = addNewResponseActionSection(
                             prevState.data.sections
                         );
diff --git a/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx b/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
index ee3bd323..3c997277 100644
--- a/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
+++ b/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
@@ -2,34 +2,20 @@ import React, { useCallback } from "react";
 import i18n from "../../../utils/i18n";
 import { Layout } from "../../components/layout/Layout";
 import { useParams } from "react-router-dom";
-import { RouteName, useRoutes } from "../../hooks/useRoutes";
 import { useCurrentEventTracker } from "../../contexts/current-event-tracker-context";
 import { useIncidentActionPlan } from "./useIncidentActionPlan";
-import { Box, Button, Typography } from "@material-ui/core";
-import { AddCircleOutline, EditOutlined } from "@material-ui/icons";
+import { Box, Typography } from "@material-ui/core";
 import { Section } from "../../components/section/Section";
 import styled from "styled-components";
-import { BasicTable, TableColumn, TableRowType } from "../../components/table/BasicTable";
 import { ActionPlanFormSummary } from "../../components/form/form-summary/ActionPlanFormSummary";
 import { IncidentActionNotice } from "./IncidentActionNotice";
 import { Loader } from "../../components/loader/Loader";
-
-export const responseActionColumns: TableColumn[] = [
-    { value: "mainTask", label: "Main task", type: "text" },
-    { value: "subActivities", label: "Sub Activities", type: "text" },
-    { value: "subPillar", label: "Sub Pillar", type: "text" },
-    { value: "searchAssignRO", label: "Responsible officer", type: "text" },
-    { value: "status", label: "Status", type: "text" },
-    { value: "verification", label: "Verification", type: "text" },
-    { value: "timeLine", label: "Timeline", type: "text" },
-    { value: "dueDate", label: "Due date", type: "text" },
-];
+import { ResponseActionTable } from "./ResponseActionTable";
 
 export const IncidentActionPlanPage: React.FC = React.memo(() => {
     const { id } = useParams<{
         id: string;
     }>();
-    const { goTo } = useRoutes();
     const { getCurrentEventTracker } = useCurrentEventTracker();
 
     const {
@@ -38,6 +24,8 @@ export const IncidentActionPlanPage: React.FC = React.memo(() => {
         responseActionRows,
         summaryError,
         incidentActionExists,
+        responseActionColumns,
+        saveTableOption,
     } = useIncidentActionPlan(id);
 
     const getSummaryColumn = useCallback((index: number, label: string, value: string) => {
@@ -51,9 +39,6 @@ export const IncidentActionPlanPage: React.FC = React.memo(() => {
         );
     }, []);
 
-    const { icon: responseActionIcon, label: responseActionLabel } =
-        getResponseActionTableLabel(responseActionRows);
-
     return (
         <Layout
             title={i18n.t("Incident Action Plan")}
@@ -78,28 +63,11 @@ export const IncidentActionPlanPage: React.FC = React.memo(() => {
                         </SummaryContainer>
                     </Section>
 
-                    <Section
-                        title="Response Actions"
-                        hasSeparator={true}
-                        headerButton={
-                            <Button
-                                variant="outlined"
-                                color="secondary"
-                                startIcon={responseActionIcon}
-                                onClick={() => {
-                                    goTo(RouteName.CREATE_FORM, {
-                                        formType: "incident-response-action",
-                                    });
-                                }}
-                            >
-                                {i18n.t(responseActionLabel)}
-                            </Button>
-                        }
-                        titleVariant="secondary"
-                    >
-                        <BasicTable columns={responseActionColumns} rows={responseActionRows} />
-                        <Box sx={{ m: 5 }} />
-                    </Section>
+                    <ResponseActionTable
+                        responseActionColumns={responseActionColumns}
+                        responseActionRows={responseActionRows}
+                        onChange={saveTableOption}
+                    />
 
                     <ActionPlanFormSummary
                         formType="incident-action-plan"
@@ -113,14 +81,6 @@ export const IncidentActionPlanPage: React.FC = React.memo(() => {
     );
 });
 
-function getResponseActionTableLabel(responseActionRows: TableRowType[]) {
-    const label =
-        responseActionRows.length === 0 ? "Add new Response Action" : "Edit Response Actions";
-    const icon = responseActionRows.length === 0 ? <AddCircleOutline /> : <EditOutlined />;
-
-    return { icon: icon, label: label };
-}
-
 const SummaryContainer = styled.div`
     display: flex;
     width: max-content;
diff --git a/src/webapp/pages/incident-action-plan/ResponseActionTable.tsx b/src/webapp/pages/incident-action-plan/ResponseActionTable.tsx
new file mode 100644
index 00000000..3162255a
--- /dev/null
+++ b/src/webapp/pages/incident-action-plan/ResponseActionTable.tsx
@@ -0,0 +1,62 @@
+import React from "react";
+import i18n from "../../../utils/i18n";
+import { RouteName, useRoutes } from "../../hooks/useRoutes";
+import { Section } from "../../components/section/Section";
+import { BasicTable, TableColumn, TableRowType } from "../../components/table/BasicTable";
+import { Box, Button } from "@material-ui/core";
+import { AddCircleOutline, EditOutlined } from "@material-ui/icons";
+import { Maybe } from "../../../utils/ts-utils";
+
+type ResponseActionTableProps = {
+    onChange: (value: Maybe<string>, rowIndex: number, column: TableColumn["value"]) => void;
+    responseActionColumns: TableColumn[];
+    responseActionRows: {
+        [key: TableColumn["value"]]: string;
+    }[];
+};
+
+export const ResponseActionTable: React.FC<ResponseActionTableProps> = React.memo(
+    ({ onChange, responseActionColumns, responseActionRows }) => {
+        const { goTo } = useRoutes();
+
+        const { icon: responseActionIcon, label: responseActionLabel } =
+            getResponseActionTableLabel(responseActionRows);
+
+        return (
+            <Section
+                title="Response Actions"
+                hasSeparator={true}
+                headerButton={
+                    <Button
+                        variant="outlined"
+                        color="secondary"
+                        startIcon={responseActionIcon}
+                        onClick={() => {
+                            goTo(RouteName.CREATE_FORM, {
+                                formType: "incident-response-action",
+                            });
+                        }}
+                    >
+                        {i18n.t(responseActionLabel)}
+                    </Button>
+                }
+                titleVariant="secondary"
+            >
+                <BasicTable
+                    onChange={onChange}
+                    columns={responseActionColumns}
+                    rows={responseActionRows}
+                />
+                <Box sx={{ m: 5 }} />
+            </Section>
+        );
+    }
+);
+
+function getResponseActionTableLabel(responseActionRows: TableRowType[]) {
+    const label =
+        responseActionRows.length === 0 ? "Add new Response Action" : "Edit Response Actions";
+    const icon = responseActionRows.length === 0 ? <AddCircleOutline /> : <EditOutlined />;
+
+    return { icon: icon, label: label };
+}
diff --git a/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts b/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts
index 0c7056d1..0674fed2 100644
--- a/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts
+++ b/src/webapp/pages/incident-action-plan/useIncidentActionPlan.ts
@@ -1,45 +1,98 @@
-import { useEffect, useState } from "react";
+import { useCallback, useEffect, useMemo, useState } from "react";
 import { Id } from "../../../domain/entities/Ref";
 import { Maybe } from "../../../utils/ts-utils";
 import { useAppContext } from "../../contexts/app-context";
 import { getDateAsLocaleDateTimeString } from "../../../data/repositories/utils/DateTimeHelper";
-import { TableRowType } from "../../components/table/BasicTable";
+import { TableColumn, TableRowType } from "../../components/table/BasicTable";
 import {
     getIAPTypeByCode,
     getPhoecLevelByCode,
     getStatusTypeByCode,
     getVerificationTypeByCode,
 } from "../../../data/repositories/consts/IncidentActionConstants";
-import { IncidentActionPlan } from "../../../domain/entities/incident-action-plan/IncidentActionPlan";
-
-type LabelWithValue = {
-    label: string;
-    value: string;
-};
+import {
+    IncidentActionOptions,
+    IncidentActionPlan,
+} from "../../../domain/entities/incident-action-plan/IncidentActionPlan";
+import { Option } from "../../components/utils/option";
 
 export type IncidentActionFormSummaryData = {
     subTitle: string;
-    summary: LabelWithValue[];
+    summary: Option[];
+};
+
+export type UIIncidentActionOptions = {
+    status: Option[];
+    verification: Option[];
 };
 
 export function useIncidentActionPlan(id: Id) {
     const { compositionRoot } = useAppContext();
 
-    const [incidentAction, setIncidentAction] = useState<LabelWithValue[] | undefined>();
+    const [incidentAction, setIncidentAction] = useState<Option[] | undefined>();
     const [actionPlanSummary, setActionPlanSummary] = useState<IncidentActionFormSummaryData>();
     const [responseActionRows, setResponseActionRows] = useState<TableRowType[]>([]);
     const [globalMessage, setGlobalMessage] = useState<string>();
     const [incidentActionExists, setIncidentActionExists] = useState<boolean>(false);
+    const [incidentActionOptions, setIncidentActionOptions] = useState<UIIncidentActionOptions>();
+
+    const saveTableOption = useCallback(
+        (value: Maybe<string>, rowIndex: number, column: TableColumn["value"]) => {
+            const eventId = responseActionRows[rowIndex]?.id ?? "";
+            compositionRoot.incidentActionPlan.updateResponseAction
+                .execute({
+                    diseaseOutbreakId: id,
+                    eventId: eventId,
+                    responseAction: { value: value ?? "", type: column },
+                })
+                .run(
+                    () => console.debug(`${column} table option saved successfully`),
+                    err => setGlobalMessage(`Error saving table option: ${err}`)
+                );
+        },
+        [compositionRoot, id, responseActionRows]
+    );
+
+    const responseActionColumns: TableColumn[] = useMemo(() => {
+        return [
+            { value: "mainTask", label: "Main task", type: "text" },
+            { value: "subActivities", label: "Sub Activities", type: "text" },
+            { value: "subPillar", label: "Sub Pillar", type: "text" },
+            {
+                value: "searchAssignRO",
+                label: "Responsible officer",
+                type: "text",
+            },
+            {
+                value: "status",
+                label: "Status",
+                type: "selector",
+                options: incidentActionOptions?.status ?? [],
+                onChange: saveTableOption,
+            },
+            {
+                value: "verification",
+                label: "Verification",
+                type: "selector",
+                options: incidentActionOptions?.verification ?? [],
+                onChange: saveTableOption,
+            },
+            { value: "timeLine", label: "Timeline", type: "text" },
+            { value: "dueDate", label: "Due date", type: "text" },
+        ];
+    }, [incidentActionOptions, saveTableOption]);
 
     useEffect(() => {
         compositionRoot.incidentActionPlan.get.execute(id).run(
             incidentActionPlan => {
                 const incidentActionExists = !!incidentActionPlan?.actionPlan?.id;
+                const incidentActionOptions = incidentActionPlan?.incidentActionOptions;
 
                 setIncidentActionExists(incidentActionExists);
+                setIncidentActionOptions(mapIncidentActionOptionsToTable(incidentActionOptions));
                 setIncidentAction(getIncidentActionFormSummary(incidentActionPlan));
                 setActionPlanSummary(mapIncidentActionPlanToFormSummary(incidentActionPlan));
-                setResponseActionRows(mapIncidentResponseActionToFormSummary(incidentActionPlan));
+                setResponseActionRows(mapIncidentResponseActionToTableRows(incidentActionPlan));
             },
             err => {
                 console.debug(err);
@@ -50,6 +103,8 @@ export function useIncidentActionPlan(id: Id) {
 
     return {
         incidentActionExists: incidentActionExists,
+        saveTableOption: saveTableOption,
+        responseActionColumns: responseActionColumns,
         actionPlanSummary: actionPlanSummary,
         formSummary: incidentAction,
         responseActionRows: responseActionRows,
@@ -57,9 +112,7 @@ export function useIncidentActionPlan(id: Id) {
     };
 }
 
-const getIncidentActionFormSummary = (
-    incidentActionPlan: Maybe<IncidentActionPlan>
-): LabelWithValue[] => {
+const getIncidentActionFormSummary = (incidentActionPlan: Maybe<IncidentActionPlan>): Option[] => {
     if (!incidentActionPlan) return [];
 
     const iapTypeCode = incidentActionPlan.actionPlan?.iapType ?? "";
@@ -115,9 +168,12 @@ const mapIncidentActionPlanToFormSummary = (
     };
 };
 
-const mapIncidentResponseActionToFormSummary = (incidentActionPlan: Maybe<IncidentActionPlan>) => {
+const mapIncidentResponseActionToTableRows = (
+    incidentActionPlan: Maybe<IncidentActionPlan>
+): TableRowType[] => {
     if (incidentActionPlan) {
         return incidentActionPlan.responseActions.map(responseAction => ({
+            id: responseAction.id,
             mainTask: responseAction.mainTask,
             subActivities: responseAction.subActivities,
             subPillar: responseAction.subPillar,
@@ -131,3 +187,21 @@ const mapIncidentResponseActionToFormSummary = (incidentActionPlan: Maybe<Incide
         return [];
     }
 };
+
+const mapIncidentActionOptionsToTable = (
+    incidentActionOptions: Maybe<IncidentActionOptions>
+): UIIncidentActionOptions => {
+    return {
+        status:
+            incidentActionOptions?.status.map(option => ({
+                value: getStatusTypeByCode(option.id) ?? "",
+                label: option.name,
+            })) ?? [],
+
+        verification:
+            incidentActionOptions?.verification.map(option => ({
+                value: getVerificationTypeByCode(option.id) ?? "",
+                label: option.name,
+            })) ?? [],
+    };
+};

From 0d1453c9d6ffc1ec0708400f9a4d9a97242c955b Mon Sep 17 00:00:00 2001
From: Chukwudumebi Onwuli <37223065+deeonwuli@users.noreply.github.com>
Date: Wed, 16 Oct 2024 13:21:11 -0700
Subject: [PATCH 13/14] feat: upddate translation file

---
 i18n/en.pot | 19 ++++++++-----------
 1 file changed, 8 insertions(+), 11 deletions(-)

diff --git a/i18n/en.pot b/i18n/en.pot
index ee2b2eef..4d53e015 100644
--- a/i18n/en.pot
+++ b/i18n/en.pot
@@ -5,8 +5,8 @@ msgstr ""
 "Content-Type: text/plain; charset=utf-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=2; plural=(n != 1)\n"
-"POT-Creation-Date: 2024-10-15T13:56:24.806Z\n"
-"PO-Revision-Date: 2024-10-15T13:56:24.806Z\n"
+"POT-Creation-Date: 2024-10-16T14:36:22.158Z\n"
+"PO-Revision-Date: 2024-10-16T14:36:22.158Z\n"
 
 msgid "Low"
 msgstr ""
@@ -93,6 +93,9 @@ msgstr ""
 msgid "Notes"
 msgstr ""
 
+msgid "Edit Profile"
+msgstr ""
+
 msgid "Currently assigned:"
 msgstr ""
 
@@ -192,6 +195,9 @@ msgstr ""
 msgid "Incident Response Actions saved successfully"
 msgstr ""
 
+msgid "Incident Management Team Member saved successfully"
+msgstr ""
+
 msgid "Create an incident action plan"
 msgstr ""
 
@@ -201,21 +207,12 @@ msgstr ""
 msgid "Create IAP"
 msgstr ""
 
-msgid "Incident Management Team Member saved successfully"
-msgstr ""
-
 msgid "Incident Action Plan"
 msgstr ""
 
 msgid "Incident Management Team Builder"
 msgstr ""
 
-msgid "Cholera in NW Province, June 2023"
-msgstr ""
-
-msgid "Incident Management Team Builder"
-msgstr ""
-
 msgid "Edit Role"
 msgstr ""
 

From ad88b6723dcde96904ac218cd22bc834368a2ab8 Mon Sep 17 00:00:00 2001
From: Chukwudumebi Onwuli <37223065+deeonwuli@users.noreply.github.com>
Date: Thu, 17 Oct 2024 13:26:49 -0700
Subject: [PATCH 14/14] feat: use current event tracker to get iap page

---
 .../layout/side-bar/SideBarContent.tsx        |  3 +--
 src/webapp/hooks/useRoutes.ts                 |  4 +--
 src/webapp/pages/form-page/useForm.ts         | 26 +++++++------------
 .../IncidentActionPlanPage.tsx                |  8 +++---
 4 files changed, 15 insertions(+), 26 deletions(-)

diff --git a/src/webapp/components/layout/side-bar/SideBarContent.tsx b/src/webapp/components/layout/side-bar/SideBarContent.tsx
index 6b57a6d2..2bc100eb 100644
--- a/src/webapp/components/layout/side-bar/SideBarContent.tsx
+++ b/src/webapp/components/layout/side-bar/SideBarContent.tsx
@@ -70,8 +70,7 @@ export const SideBarContent: React.FC<SideBarContentProps> = React.memo(
                                 component={NavLink}
                                 to={
                                     value === RouteName.EVENT_TRACKER ||
-                                    value === RouteName.IM_TEAM_BUILDER ||
-                                    value === RouteName.INCIDENT_ACTION_PLAN
+                                    value === RouteName.IM_TEAM_BUILDER
                                         ? routes[value].replace(
                                               ":id",
                                               getCurrentEventTracker()?.id || ""
diff --git a/src/webapp/hooks/useRoutes.ts b/src/webapp/hooks/useRoutes.ts
index a51604cc..4f92a630 100644
--- a/src/webapp/hooks/useRoutes.ts
+++ b/src/webapp/hooks/useRoutes.ts
@@ -31,7 +31,7 @@ export const routes: Record<RouteName, string> = {
     [RouteName.EDIT_FORM]: `/edit/${formType}/:id`,
     [RouteName.EVENT_TRACKER]: "/event-tracker/:id",
     [RouteName.IM_TEAM_BUILDER]: "/incident-management-team-builder/:id",
-    [RouteName.INCIDENT_ACTION_PLAN]: "/incident-action-plan/:id",
+    [RouteName.INCIDENT_ACTION_PLAN]: "/incident-action-plan",
     [RouteName.RESOURCES]: "/resources",
     [RouteName.DASHBOARD]: "/",
 } as const;
@@ -41,7 +41,7 @@ type RouteParams = {
     [RouteName.EDIT_FORM]: { formType: FormType; id: string };
     [RouteName.EVENT_TRACKER]: { id: string };
     [RouteName.IM_TEAM_BUILDER]: { id: string };
-    [RouteName.INCIDENT_ACTION_PLAN]: { id: string };
+    [RouteName.INCIDENT_ACTION_PLAN]: undefined;
     [RouteName.RESOURCES]: undefined;
     [RouteName.DASHBOARD]: undefined;
 };
diff --git a/src/webapp/pages/form-page/useForm.ts b/src/webapp/pages/form-page/useForm.ts
index 09c89371..4de97494 100644
--- a/src/webapp/pages/form-page/useForm.ts
+++ b/src/webapp/pages/form-page/useForm.ts
@@ -291,10 +291,7 @@ export function useForm(formType: FormType, id?: Id): State {
                         });
                         break;
                     case "incident-response-action":
-                        if (currentEventTracker?.id)
-                            goTo(RouteName.INCIDENT_ACTION_PLAN, {
-                                id: currentEventTracker.id,
-                            });
+                        if (currentEventTracker?.id) goTo(RouteName.INCIDENT_ACTION_PLAN);
                         setGlobalMessage({
                             text: i18n.t(`Incident Response Actions saved successfully`),
                             type: "success",
@@ -337,20 +334,15 @@ export function useForm(formType: FormType, id?: Id): State {
                         id: currentEventTracker.id,
                     });
                     break;
+                case "incident-action-plan":
+                case "incident-response-action":
+                    goTo(RouteName.INCIDENT_ACTION_PLAN);
+                    break;
                 default:
-                    switch (formType) {
-                        case "incident-action-plan":
-                        case "incident-response-action":
-                            goTo(RouteName.INCIDENT_ACTION_PLAN, {
-                                id: currentEventTracker.id,
-                            });
-                            break;
-                        default:
-                            goTo(RouteName.EVENT_TRACKER, {
-                                id: currentEventTracker.id,
-                            });
-                            break;
-                    }
+                    goTo(RouteName.EVENT_TRACKER, {
+                        id: currentEventTracker.id,
+                    });
+                    break;
             }
         } else {
             goTo(RouteName.DASHBOARD);
diff --git a/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx b/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
index 3c997277..8e5f6b19 100644
--- a/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
+++ b/src/webapp/pages/incident-action-plan/IncidentActionPlanPage.tsx
@@ -1,7 +1,6 @@
 import React, { useCallback } from "react";
 import i18n from "../../../utils/i18n";
 import { Layout } from "../../components/layout/Layout";
-import { useParams } from "react-router-dom";
 import { useCurrentEventTracker } from "../../contexts/current-event-tracker-context";
 import { useIncidentActionPlan } from "./useIncidentActionPlan";
 import { Box, Typography } from "@material-ui/core";
@@ -13,10 +12,9 @@ import { Loader } from "../../components/loader/Loader";
 import { ResponseActionTable } from "./ResponseActionTable";
 
 export const IncidentActionPlanPage: React.FC = React.memo(() => {
-    const { id } = useParams<{
-        id: string;
-    }>();
     const { getCurrentEventTracker } = useCurrentEventTracker();
+    const currentEventTracker = getCurrentEventTracker();
+    const id = currentEventTracker?.id || "";
 
     const {
         actionPlanSummary,
@@ -42,7 +40,7 @@ export const IncidentActionPlanPage: React.FC = React.memo(() => {
     return (
         <Layout
             title={i18n.t("Incident Action Plan")}
-            subtitle={i18n.t(getCurrentEventTracker()?.name || "")}
+            subtitle={i18n.t(currentEventTracker?.name || "")}
         >
             {!actionPlanSummary && responseActionRows.length === 0 && !summaryError && <Loader />}
             {!incidentActionExists ? (