From 1e4350ba3c314903ddfc802c0fbf04028712cf11 Mon Sep 17 00:00:00 2001
From: Brianna Cerkiewicz <brianna@button.is>
Date: Fri, 9 Jun 2023 15:52:40 -0700
Subject: [PATCH] feat: add db schema to the EI form

---
 .../ProjectEmissionIntensityReportForm.tsx    | 241 +++++++-----------
 ...jectEmissionIntensityReportFormSummary.tsx | 240 ++++++-----------
 2 files changed, 175 insertions(+), 306 deletions(-)

diff --git a/app/components/Form/ProjectEmissionIntensityReportForm.tsx b/app/components/Form/ProjectEmissionIntensityReportForm.tsx
index 8c2517a35f..b2dc4fb330 100644
--- a/app/components/Form/ProjectEmissionIntensityReportForm.tsx
+++ b/app/components/Form/ProjectEmissionIntensityReportForm.tsx
@@ -1,26 +1,22 @@
+import { Button } from "@button-inc/bcgov-theme";
 import {
-  emissionIntensityReportSchema,
-  emissionIntensityReportingRequirementSchema,
-  emissionIntensityReportUiSchema,
+  emissionIntensityReportingRequirementGroupSchema,
   emissionIntensityReportingRequirementUiSchema,
-} from "data/jsonSchemaForm/projectEmissionIntensitySchema";
+} from "data/jsonSchemaForm/emissionIntensityUiSchema";
 import { JSONSchema7 } from "json-schema";
-import { graphql, useFragment } from "react-relay";
-import FormBase from "./FormBase";
-import { ProjectEmissionIntensityReportForm_projectRevision$key } from "__generated__/ProjectEmissionIntensityReportForm_projectRevision.graphql";
-import { Button } from "@button-inc/bcgov-theme";
-import { useCreateProjectEmissionIntensityFormChange } from "mutations/ProjectEmissionIntensity/addEmissionIntensityReportToRevision";
+import getDurationFromDates from "lib/helpers/getDurationFromDates";
+import GroupedObjectFieldTemplateWrapper from "lib/theme/GroupedObjectFieldTemplateWrapper";
+import { useCreateEmissionIntensityReport } from "mutations/ProjectEmissionIntensity/createEmissionIntensityReport";
 import { useUpdateEmissionIntensityReportFormChange } from "mutations/ProjectEmissionIntensity/updateEmissionIntensityReportFormChange";
-import UndoChangesButton from "./UndoChangesButton";
-import SavingIndicator from "./SavingIndicator";
-import { MutableRefObject, useRef } from "react";
-import { stageReportFormChanges } from "./Functions/reportingRequirementFormChangeFunctions";
 import { useStageReportingRequirementFormChange } from "mutations/ProjectReportingRequirement/stageReportingRequirementFormChange";
-import { useStageEmissionIntensityFormChange } from "mutations/ProjectEmissionIntensity/stageEmissionIntensityFormChange";
+import { MutableRefObject, useRef } from "react";
+import { graphql, useFragment } from "react-relay";
+import { ProjectEmissionIntensityReportForm_projectRevision$key } from "__generated__/ProjectEmissionIntensityReportForm_projectRevision.graphql";
 import { EmissionIntensityReportStatus } from "./EmissionIntensityReportStatus";
-import getDurationFromDates from "lib/helpers/getDurationFromDates";
-import EmptyObjectFieldTemplate from "lib/theme/EmptyObjectFieldTemplate";
-import ReadOnlyEmptyFieldTempalte from "lib/theme/ReadOnlyEmptyFieldTemplate";
+import FormBase from "./FormBase";
+import { stageReportFormChanges } from "./Functions/reportingRequirementFormChangeFunctions";
+import SavingIndicator from "./SavingIndicator";
+import UndoChangesButton from "./UndoChangesButton";
 interface Props {
   projectRevision: ProjectEmissionIntensityReportForm_projectRevision$key;
   viewOnly?: boolean;
@@ -37,7 +33,7 @@ export const createEmissionIntensityReportUiSchema = (
 ) => {
   // setting a deep copy of the ui schema to avoid mutating the original
   const uiSchemaCopy = JSON.parse(
-    JSON.stringify(emissionIntensityReportUiSchema)
+    JSON.stringify(emissionIntensityReportingRequirementUiSchema)
   );
 
   // Example: tCO2e/GJ if we have emissionFunctionalUnit
@@ -70,6 +66,7 @@ export const createEmissionIntensityReportUiSchema = (
     measurementPeriodStartDate,
     measurementPeriodEndDate
   );
+
   const reportDurationSuffix = reportDuration && (
     <b className="contentSuffix">
       Duration: {reportDuration}
@@ -82,55 +79,44 @@ export const createEmissionIntensityReportUiSchema = (
   );
 
   // We only show the label of this field on view mode and summary page
-  if (viewOnly)
-    uiSchemaCopy.teimpReporting.productionFunctionalUnit["ui:label"] = "";
+  if (viewOnly) uiSchemaCopy.productionFunctionalUnit["ui:label"] = "";
 
-  uiSchemaCopy.teimpReporting.baselineEmissionIntensity["ui:options"] = {
-    ...uiSchemaCopy.teimpReporting.baselineEmissionIntensity["ui:options"],
+  uiSchemaCopy.baselineEmissionIntensity["ui:options"] = {
+    ...uiSchemaCopy.baselineEmissionIntensity["ui:options"],
     contentSuffix: contentSuffix(
       emissionFunctionalUnit,
       productionFunctionalUnit
     ),
   };
-  uiSchemaCopy.teimpReporting.targetEmissionIntensity["ui:options"] = {
-    ...uiSchemaCopy.teimpReporting.targetEmissionIntensity["ui:options"],
+  uiSchemaCopy.targetEmissionIntensity["ui:options"] = {
+    ...uiSchemaCopy.targetEmissionIntensity["ui:options"],
     contentSuffix: contentSuffix(
       emissionFunctionalUnit,
       productionFunctionalUnit
     ),
   };
-  uiSchemaCopy.teimpReporting.postProjectEmissionIntensity["ui:options"] = {
-    ...uiSchemaCopy.teimpReporting.postProjectEmissionIntensity["ui:options"],
+  uiSchemaCopy.postProjectEmissionIntensity["ui:options"] = {
+    ...uiSchemaCopy.postProjectEmissionIntensity["ui:options"],
     contentSuffix: contentSuffix(
       emissionFunctionalUnit,
       productionFunctionalUnit
     ),
   };
-  uiSchemaCopy.teimpReporting.totalLifetimeEmissionReduction["ui:options"] = {
-    ...uiSchemaCopy.teimpReporting.totalLifetimeEmissionReduction["ui:options"],
+  uiSchemaCopy.totalLifetimeEmissionReduction["ui:options"] = {
+    ...uiSchemaCopy.totalLifetimeEmissionReduction["ui:options"],
     contentSuffix: contentSuffix(emissionFunctionalUnit),
   };
 
-  uiSchemaCopy.teimpReporting.measurementPeriodEndDate["ui:options"] = {
-    ...uiSchemaCopy.teimpReporting.measurementPeriodEndDate["ui:options"],
+  uiSchemaCopy.measurementPeriodEndDate["ui:options"] = {
+    ...uiSchemaCopy.measurementPeriodEndDate["ui:options"],
     contentSuffix: reportDurationSuffix,
   };
 
-  uiSchemaCopy.teimpReporting.emissionFunctionalUnit["ui:options"] = {
-    ...uiSchemaCopy.teimpReporting.emissionFunctionalUnit["ui:options"],
+  uiSchemaCopy.emissionFunctionalUnit["ui:options"] = {
+    ...uiSchemaCopy.emissionFunctionalUnit["ui:options"],
     contentSuffix: emissionFunctionalUnitSuffix(),
   };
 
-  /**
-   * We need to set the ui:FieldTemplate to the EmptyFieldTemplate
-   * and ui:ObjectFieldTemplate to the EmptyObjectFieldTemplate
-   * to avoid showing field labels and outlines on parent object.
-   * There is room for improvement on how this is done
-   * but for now it is the best solution.
-   */
-  uiSchemaCopy["ui:FieldTemplate"] = ReadOnlyEmptyFieldTempalte;
-  uiSchemaCopy["ui:ObjectFieldTemplate"] = EmptyObjectFieldTemplate;
-
   return uiSchemaCopy;
 };
 
@@ -157,24 +143,13 @@ const ProjectEmissionsIntensityReport: React.FC<Props> = (props) => {
               rowId
               newFormData
               changeStatus
-            }
-          }
-        }
-        emissionIntensityReportFormChange: formChangesFor(
-          first: 1
-          formDataTableName: "emission_intensity_report"
-          filter: { operation: { notEqualTo: ARCHIVE } }
-        ) @connection(key: "connection_emissionIntensityReportFormChange") {
-          edges {
-            node {
               calculatedEiPerformance
-              id
-              rowId
-              newFormData
-              changeStatus
               paymentPercentage
               holdbackAmountToDate
               actualPerformanceMilestoneAmount
+              formByJsonSchemaName {
+                jsonSchema
+              }
             }
           }
         }
@@ -182,30 +157,23 @@ const ProjectEmissionsIntensityReport: React.FC<Props> = (props) => {
     `,
     props.projectRevision
   );
-  const emissionIntensityReportFormChange =
-    projectRevision.emissionIntensityReportFormChange.edges[0]?.node;
 
-  const reportingRequirementFormChange =
+  const emissionIntensityReportingRequirementFormChange =
     projectRevision.emissionIntensityReportingRequirementFormChange.edges[0]
       ?.node;
 
   const calculatedEiPerformance =
-    projectRevision.emissionIntensityReportFormChange.edges[0]?.node
-      .calculatedEiPerformance;
+    emissionIntensityReportingRequirementFormChange?.calculatedEiPerformance;
 
   const holdbackAmountToDate =
-    projectRevision.emissionIntensityReportFormChange.edges[0]?.node
-      .holdbackAmountToDate;
+    emissionIntensityReportingRequirementFormChange?.holdbackAmountToDate;
 
   const paymentPercentageOfPerformanceMilestoneAmount =
-    projectRevision.emissionIntensityReportFormChange.edges[0]?.node
-      .paymentPercentage;
+    emissionIntensityReportingRequirementFormChange?.paymentPercentage;
 
   // Mutations
-  const [
-    addProjectEmissionsIntensityReport,
-    isAddingEmissionsIntensityReportFormChange,
-  ] = useCreateProjectEmissionIntensityFormChange();
+  const [createEmissionsIntensityReport, isCreatingEmissionsIntensityReport] =
+    useCreateEmissionIntensityReport();
   const [
     updateEmissionsIntensityReportFormChange,
     isUpdatingEmissionsIntensityReportFormChange,
@@ -216,46 +184,13 @@ const ProjectEmissionsIntensityReport: React.FC<Props> = (props) => {
     isStagingReportingRequirement,
   ] = useStageReportingRequirementFormChange();
 
-  const [
-    applyStageEmissionIntensityFormChangeMutation,
-    isStagingEmissionIntensity,
-  ] = useStageEmissionIntensityFormChange();
-
-  const formData = emissionIntensityReportFormChange?.newFormData;
-
-  // Restructure form data to be in the same format as the schema
-  const formattedFormData = {
-    teimpReporting: {},
-    uponCompletion: {},
-  };
-
-  /* We should ideally offload the parsing of this data to a custom commit handler on the database.
-   * Opportunity for future tech debt work captured in ZenHub.
-   */
-  Object.keys(emissionIntensityReportSchema.properties).forEach(
-    (schemaProperty) =>
-      Object.keys(
-        emissionIntensityReportSchema.properties[schemaProperty].properties
-      ).forEach(
-        (key) =>
-          formData?.[key] !== null &&
-          formData?.[key] !== undefined &&
-          Object.assign(formattedFormData[schemaProperty], {
-            [key]: formData[key],
-          })
-      )
-  );
-
   const handleChange = (formChangeObject, changeData) => {
     // don't trigger a change if the form data is an empty object
     if (changeData && Object.keys(changeData).length === 0) return;
 
-    // Expand TEIMP reporting and Upon Completion data to the top level of the form data
     const updatedFormData = {
       ...formChangeObject.newFormData,
       ...changeData,
-      ...changeData.teimpReporting,
-      ...changeData.uponCompletion,
     };
 
     updateEmissionsIntensityReportFormChange({
@@ -263,7 +198,10 @@ const ProjectEmissionsIntensityReport: React.FC<Props> = (props) => {
         input: {
           rowId: formChangeObject.rowId,
           formChangePatch: {
-            newFormData: updatedFormData,
+            newFormData: {
+              ...formChangeObject.newFormData,
+              ...changeData,
+            },
           },
         },
       },
@@ -282,14 +220,24 @@ const ProjectEmissionsIntensityReport: React.FC<Props> = (props) => {
 
   return (
     <>
-      {projectRevision.emissionIntensityReportFormChange.edges.length === 0 && (
+      {projectRevision.emissionIntensityReportingRequirementFormChange.edges
+        .length === 0 && (
         <Button
-          disabled={isAddingEmissionsIntensityReportFormChange}
+          disabled={isCreatingEmissionsIntensityReport}
           onClick={() =>
-            addProjectEmissionsIntensityReport({
+            createEmissionsIntensityReport({
               variables: {
                 input: {
-                  revisionId: projectRevision.rowId,
+                  operation: "CREATE",
+                  formDataSchemaName: "cif",
+                  formDataTableName: "reporting_requirement",
+                  jsonSchemaName: "emission_intensity",
+                  newFormData: {
+                    reportType: "TEIMP",
+                    reportingRequirementIndex: 1,
+                    emissionFunctionalUnit: "tCO2e",
+                  },
+                  projectRevisionId: projectRevision.rowId,
                 },
               },
             })
@@ -299,90 +247,86 @@ const ProjectEmissionsIntensityReport: React.FC<Props> = (props) => {
           Add Emissions Intensity Report
         </Button>
       )}
-      {projectRevision.emissionIntensityReportFormChange.edges.length > 0 && (
+      {projectRevision.emissionIntensityReportingRequirementFormChange.edges
+        .length > 0 && (
         <>
           <header>
             <h3>Emission Intensity Report</h3>
             <UndoChangesButton
               formChangeIds={[
-                emissionIntensityReportFormChange.rowId,
-                reportingRequirementFormChange.rowId,
+                emissionIntensityReportingRequirementFormChange.rowId,
               ]}
               formRefs={formRefs}
             />
             <SavingIndicator
               isSaved={
                 !isUpdatingEmissionsIntensityReportFormChange &&
-                !isAddingEmissionsIntensityReportFormChange
+                !isCreatingEmissionsIntensityReport
               }
             />
           </header>
           <EmissionIntensityReportStatus
             reportDueDateString={
-              reportingRequirementFormChange?.newFormData.reportDueDate
+              emissionIntensityReportingRequirementFormChange?.newFormData
+                .reportDueDate
             }
             submittedDateString={
-              reportingRequirementFormChange?.newFormData.submittedDate
+              emissionIntensityReportingRequirementFormChange?.newFormData
+                .submittedDate
             }
             emissionIntensityEndDateString={
-              emissionIntensityReportFormChange?.newFormData
+              emissionIntensityReportingRequirementFormChange?.newFormData
                 .measurementPeriodEndDate
             }
           />
           <FormBase
             id="TEIMP_ReportingRequirementForm"
             ref={(el) =>
-              el && (formRefs.current[reportingRequirementFormChange.id] = el)
+              el &&
+              (formRefs.current[
+                emissionIntensityReportingRequirementFormChange.id
+              ] = el)
             }
             validateOnMount={
-              reportingRequirementFormChange?.changeStatus === "staged"
+              emissionIntensityReportingRequirementFormChange?.changeStatus ===
+              "staged"
             }
             idPrefix="TEIMP_ReportingRequirementForm"
-            schema={emissionIntensityReportingRequirementSchema as JSONSchema7}
-            formData={reportingRequirementFormChange?.newFormData}
-            formContext={{
-              form: reportingRequirementFormChange?.newFormData,
-            }}
-            uiSchema={emissionIntensityReportingRequirementUiSchema}
-            onChange={(change) =>
-              handleChange(reportingRequirementFormChange, change.formData)
+            schema={
+              emissionIntensityReportingRequirementFormChange
+                .formByJsonSchemaName.jsonSchema.schema as JSONSchema7
             }
-          />
-          <FormBase
-            id="TEIMP_EmissionIntensityReportForm"
-            ref={(el) =>
-              el &&
-              (formRefs.current[emissionIntensityReportFormChange.id] = el)
-            }
-            validateOnMount={
-              emissionIntensityReportFormChange?.changeStatus === "staged"
+            formData={
+              emissionIntensityReportingRequirementFormChange?.newFormData
             }
-            idPrefix="TEIMP_EmissionIntensityReportForm"
-            schema={emissionIntensityReportSchema as JSONSchema7}
-            formData={formattedFormData}
             formContext={{
-              form: emissionIntensityReportFormChange?.newFormData,
+              form: emissionIntensityReportingRequirementFormChange?.newFormData,
               calculatedEiPerformance: calculatedEiPerformance ?? null,
               paymentPercentageOfPerformanceMilestoneAmount:
                 paymentPercentageOfPerformanceMilestoneAmount ?? null,
               holdbackAmountToDate: holdbackAmountToDate ?? null,
               actualPerformanceMilestoneAmount:
-                projectRevision.emissionIntensityReportFormChange.edges[0]?.node
-                  .actualPerformanceMilestoneAmount,
+                projectRevision.emissionIntensityReportingRequirementFormChange
+                  .edges[0]?.node.actualPerformanceMilestoneAmount,
+              groupSchema: emissionIntensityReportingRequirementGroupSchema,
             }}
             uiSchema={createEmissionIntensityReportUiSchema(
-              emissionIntensityReportFormChange?.newFormData
+              emissionIntensityReportingRequirementFormChange?.newFormData
                 ?.emissionFunctionalUnit,
-              emissionIntensityReportFormChange?.newFormData
+              emissionIntensityReportingRequirementFormChange?.newFormData
                 ?.productionFunctionalUnit,
-              emissionIntensityReportFormChange?.newFormData
+              emissionIntensityReportingRequirementFormChange?.newFormData
                 ?.measurementPeriodStartDate,
-              emissionIntensityReportFormChange?.newFormData
+              emissionIntensityReportingRequirementFormChange?.newFormData
                 ?.measurementPeriodEndDate,
               true
             )}
+            ObjectFieldTemplate={GroupedObjectFieldTemplateWrapper}
             onChange={(change) =>
-              handleChange(emissionIntensityReportFormChange, change.formData)
+              handleChange(
+                emissionIntensityReportingRequirementFormChange,
+                change.formData
+              )
             }
           />
           <Button
@@ -396,17 +340,14 @@ const ProjectEmissionsIntensityReport: React.FC<Props> = (props) => {
                 [
                   ...projectRevision
                     .emissionIntensityReportingRequirementFormChange.edges,
-                  ...projectRevision.emissionIntensityReportFormChange.edges,
                 ],
-                "TEIMP",
-                applyStageEmissionIntensityFormChangeMutation
+                "TEIMP"
               );
             }}
             disabled={
-              isAddingEmissionsIntensityReportFormChange ||
+              isCreatingEmissionsIntensityReport ||
               isUpdatingEmissionsIntensityReportFormChange ||
-              isStagingReportingRequirement ||
-              isStagingEmissionIntensity
+              isStagingReportingRequirement
             }
           >
             Submit Emissions Intensity Report
diff --git a/app/components/Form/ProjectEmissionIntensityReportFormSummary.tsx b/app/components/Form/ProjectEmissionIntensityReportFormSummary.tsx
index 273e6e86ea..6cd0ffeb42 100644
--- a/app/components/Form/ProjectEmissionIntensityReportFormSummary.tsx
+++ b/app/components/Form/ProjectEmissionIntensityReportFormSummary.tsx
@@ -4,12 +4,7 @@ import { graphql, useFragment } from "react-relay";
 import FormBase from "./FormBase";
 import CUSTOM_DIFF_FIELDS from "lib/theme/CustomDiffFields";
 import { utils } from "@rjsf/core";
-import { getFilteredSchema } from "lib/theme/getFilteredSchema";
-import {
-  emissionIntensityReportSchema,
-  emissionIntensityReportingRequirementSchema,
-  emissionIntensityReportingRequirementUiSchema,
-} from "data/jsonSchemaForm/projectEmissionIntensitySchema";
+import { getSchemaAndDataIncludingCalculatedValues } from "lib/theme/schemaFilteringHelpers";
 import { ProjectEmissionIntensityReportFormSummary_projectRevision$key } from "__generated__/ProjectEmissionIntensityReportFormSummary_projectRevision.graphql";
 import { createEmissionIntensityReportUiSchema } from "./ProjectEmissionIntensityReportForm";
 import { SummaryFormProps } from "data/formPages/types";
@@ -18,7 +13,6 @@ import {
   FormNotAddedOrUpdated,
   FormRemoved,
 } from "./SummaryFormCommonComponents";
-import { getFilteredEmissionIntensitySchema } from "lib/theme/getFilteredEmissionIntensitySchema";
 const { fields } = utils.getDefaultRegistry();
 
 interface Props
@@ -31,10 +25,8 @@ const ProjectEmissionsIntensityReportFormSummary: React.FC<Props> = ({
   setHasDiff,
 }) => {
   const {
-    summaryEmissionIntensityReportFormChange,
     summaryEmissionIntensityReportingRequirementFormChange,
     isFirstRevision,
-    latestCommittedEmissionIntensityReportingRequirementFormChange,
     latestCommittedEmissionIntensityReportFormChange,
   } = useFragment(
     graphql`
@@ -43,20 +35,6 @@ const ProjectEmissionsIntensityReportFormSummary: React.FC<Props> = ({
         summaryEmissionIntensityReportingRequirementFormChange: formChangesFor(
           formDataTableName: "reporting_requirement"
           reportType: "TEIMP"
-        ) {
-          edges {
-            node {
-              newFormData
-              operation
-              isPristine
-              formChangeByPreviousFormChangeId {
-                newFormData
-              }
-            }
-          }
-        }
-        summaryEmissionIntensityReportFormChange: formChangesFor(
-          formDataTableName: "emission_intensity_report"
         ) {
           edges {
             node {
@@ -67,6 +45,9 @@ const ProjectEmissionsIntensityReportFormSummary: React.FC<Props> = ({
               newFormData
               operation
               isPristine
+              formByJsonSchemaName {
+                jsonSchema
+              }
               formChangeByPreviousFormChangeId {
                 newFormData
                 calculatedEiPerformance
@@ -77,16 +58,6 @@ const ProjectEmissionsIntensityReportFormSummary: React.FC<Props> = ({
             }
           }
         }
-        latestCommittedEmissionIntensityReportingRequirementFormChange: latestCommittedFormChangesFor(
-          formDataTableName: "reporting_requirement"
-          reportType: "TEIMP"
-        ) {
-          edges {
-            node {
-              newFormData
-            }
-          }
-        }
         latestCommittedEmissionIntensityReportFormChange: latestCommittedFormChangesFor(
           formDataTableName: "emission_intensity_report"
         ) {
@@ -111,24 +82,32 @@ const ProjectEmissionsIntensityReportFormSummary: React.FC<Props> = ({
   const summaryReportingRequirement =
     summaryEmissionIntensityReportingRequirementFormChange?.edges[0]?.node;
 
-  const summaryEmissionIntensityReport =
-    summaryEmissionIntensityReportFormChange?.edges[0]?.node;
+  const newData = {
+    ...summaryReportingRequirement?.newFormData,
+    //calculated values
+    calculatedEiPerformance:
+      summaryReportingRequirement?.calculatedEiPerformance,
+    paymentPercentage: summaryReportingRequirement?.paymentPercentage,
+    holdbackAmountToDate: summaryReportingRequirement?.holdbackAmountToDate,
+    actualPerformanceMilestoneAmount:
+      summaryReportingRequirement?.actualPerformanceMilestoneAmount,
+  };
 
   const oldData = {
-    ...summaryEmissionIntensityReport?.formChangeByPreviousFormChangeId
+    ...summaryReportingRequirement?.formChangeByPreviousFormChangeId
       ?.newFormData,
     //calculated values
     calculatedEiPerformance:
-      summaryEmissionIntensityReport?.formChangeByPreviousFormChangeId
+      summaryReportingRequirement?.formChangeByPreviousFormChangeId
         ?.calculatedEiPerformance,
     paymentPercentage:
-      summaryEmissionIntensityReport?.formChangeByPreviousFormChangeId
+      summaryReportingRequirement?.formChangeByPreviousFormChangeId
         ?.paymentPercentage,
     holdbackAmountToDate:
-      summaryEmissionIntensityReport?.formChangeByPreviousFormChangeId
+      summaryReportingRequirement?.formChangeByPreviousFormChangeId
         ?.holdbackAmountToDate,
     actualPerformanceMilestoneAmount:
-      summaryEmissionIntensityReport?.formChangeByPreviousFormChangeId
+      summaryReportingRequirement?.formChangeByPreviousFormChangeId
         ?.actualPerformanceMilestoneAmount,
   };
 
@@ -150,69 +129,14 @@ const ProjectEmissionsIntensityReportFormSummary: React.FC<Props> = ({
         ?.actualPerformanceMilestoneAmount,
   };
 
-  // Set the formSchema and formData based on showing the diff or not
-  const reportingRequirementDiffObject = !renderDiff
-    ? {
-        formSchema: emissionIntensityReportingRequirementSchema,
-        formData: summaryReportingRequirement?.newFormData,
-      }
-    : getFilteredSchema(
-        emissionIntensityReportingRequirementSchema as JSONSchema7,
-        summaryReportingRequirement || {}
-      );
-
-  const emissionIntensityReportDiffObject = !renderDiff
-    ? {
-        formSchema: emissionIntensityReportSchema,
-        formData: summaryEmissionIntensityReport?.newFormData,
-      }
-    : getFilteredEmissionIntensitySchema(
-        {
-          ...emissionIntensityReportSchema,
-          properties: {
-            ...emissionIntensityReportSchema.properties,
-            // This is only to add the (Adjusted) to the title of the field to differentiate it from the calculated field
-            uponCompletion: {
-              ...emissionIntensityReportSchema.properties.uponCompletion,
-              properties: {
-                ...emissionIntensityReportSchema.properties.uponCompletion
-                  .properties,
-                adjustedEmissionsIntensityPerformance: {
-                  title: "GHG Emission Intensity Performance (Adjusted)",
-                  type: "number",
-                },
-              },
-            },
-            // Add calculatedEiPerformance to the schema since this field is using `AdjustableCalculatedValueWidget` and is not directly in the schema
-            calculatedValues: {
-              properties: {
-                calculatedEiPerformance: {
-                  type: "number",
-                  title: "GHG Emission Intensity Performance",
-                },
-              },
-            },
-          },
-        } as JSONSchema7,
-        summaryEmissionIntensityReport || {}
-      );
-
-  // Set custom rjsf fields to display diffs
-  const customFields = { ...fields, ...CUSTOM_DIFF_FIELDS };
-
   const allFormChangesPristine = useMemo(() => {
     if (
-      summaryEmissionIntensityReport?.isPristine === false ||
       summaryReportingRequirement?.isPristine === false ||
-      summaryEmissionIntensityReport?.isPristine === null ||
       summaryReportingRequirement?.isPristine === null
     )
       return false;
     return true;
-  }, [
-    summaryEmissionIntensityReport?.isPristine,
-    summaryReportingRequirement?.isPristine,
-  ]);
+  }, [summaryReportingRequirement?.isPristine]);
 
   // Update the hasDiff state in the CollapsibleFormWidget to define if the form has diffs to show
   useEffect(
@@ -220,20 +144,63 @@ const ProjectEmissionsIntensityReportFormSummary: React.FC<Props> = ({
     [allFormChangesPristine, setHasDiff]
   );
 
+  if (isOnAmendmentsAndOtherRevisionsPage && allFormChangesPristine)
+    return null;
+
+  if ((allFormChangesPristine && !viewOnly) || !summaryReportingRequirement)
+    return (
+      <>
+        {!isOnAmendmentsAndOtherRevisionsPage && (
+          <h3>Emission Intensity Report</h3>
+        )}
+        <FormNotAddedOrUpdated
+          isFirstRevision={isFirstRevision}
+          formTitle="Emission Intensity Report"
+        />
+      </>
+    );
+
+  // Set the formSchema and formData based on showing the diff or not
+  const reportingRequirementDiffObject = !renderDiff
+    ? {
+        formSchema: summaryReportingRequirement.formByJsonSchemaName.jsonSchema
+          .schema as JSONSchema7,
+        formData: summaryReportingRequirement?.newFormData,
+      }
+    : getSchemaAndDataIncludingCalculatedValues(
+        summaryReportingRequirement.formByJsonSchemaName.jsonSchema
+          ?.schema as JSONSchema7,
+        newData,
+        oldData,
+        {
+          // This is only to add the (Adjusted) to the title of the field to differentiate it from the calculated field
+          adjustedEmissionsIntensityPerformance: {
+            title: "GHG Emission Intensity Performance (Adjusted)",
+            type: "number",
+          },
+          // Add calculatedEiPerformance to the schema since this field is using `AdjustableCalculatedValueWidget` and is not directly in the schema
+          calculatedEiPerformance: {
+            type: "number",
+            title: "GHG Emission Intensity Performance",
+          },
+        }
+      );
+
+  // Set custom rjsf fields to display diffs
+  const customFields = { ...fields, ...CUSTOM_DIFF_FIELDS };
+
   let modifiedEmissionIntensityReportUiSchema =
     createEmissionIntensityReportUiSchema(
-      summaryEmissionIntensityReport?.newFormData?.emissionFunctionalUnit,
-      summaryEmissionIntensityReport?.newFormData?.productionFunctionalUnit,
-      summaryEmissionIntensityReport?.newFormData?.measurementPeriodStartDate,
-      summaryEmissionIntensityReport?.newFormData?.measurementPeriodEndDate,
+      summaryReportingRequirement?.newFormData?.emissionFunctionalUnit,
+      summaryReportingRequirement?.newFormData?.productionFunctionalUnit,
+      summaryReportingRequirement?.newFormData?.measurementPeriodStartDate,
+      summaryReportingRequirement?.newFormData?.measurementPeriodEndDate,
       false
     );
 
   // To show the calculatedEiPerformance field in the diff view with proper formatting
   if (renderDiff)
     modifiedEmissionIntensityReportUiSchema = {
-      // this is to keep th fields in the same order as form when showing the diffs
-      "ui:order": ["teimpReporting", "calculatedValues", "uponCompletion"],
       ...modifiedEmissionIntensityReportUiSchema,
       calculatedValues: {
         calculatedEiPerformance: {
@@ -245,25 +212,6 @@ const ProjectEmissionsIntensityReportFormSummary: React.FC<Props> = ({
       },
     };
 
-  if (isOnAmendmentsAndOtherRevisionsPage && allFormChangesPristine)
-    return null;
-
-  if (
-    (allFormChangesPristine && !viewOnly) ||
-    (!summaryReportingRequirement && !summaryEmissionIntensityReport)
-  )
-    return (
-      <>
-        {!isOnAmendmentsAndOtherRevisionsPage && (
-          <h3>Emission Intensity Report</h3>
-        )}
-        <FormNotAddedOrUpdated
-          isFirstRevision={isFirstRevision}
-          formTitle="Emission Intensity Report"
-        />
-      </>
-    );
-
   return (
     <>
       {!isOnAmendmentsAndOtherRevisionsPage && (
@@ -272,59 +220,39 @@ const ProjectEmissionsIntensityReportFormSummary: React.FC<Props> = ({
       {/* Show this part if none of the emission intensity report form properties have been updated */}
       {allFormChangesPristine &&
         !viewOnly &&
-        summaryEmissionIntensityReport?.operation !== "ARCHIVE" && (
+        summaryReportingRequirement?.operation !== "ARCHIVE" && (
           <FormNotAddedOrUpdated
             isFirstRevision={isFirstRevision}
             formTitle="Emission Intensity Report"
           />
         )}
       {/* Show this part if the whole emission intensity report has been removed */}
-      {renderDiff &&
-        summaryEmissionIntensityReport?.operation === "ARCHIVE" && (
-          <FormRemoved
-            isOnAmendmentsAndOtherRevisionsPage={
-              isOnAmendmentsAndOtherRevisionsPage
-            }
-            formTitle="Emission Intensity Report"
-          />
-        )}
+      {renderDiff && summaryReportingRequirement?.operation === "ARCHIVE" && (
+        <FormRemoved
+          isOnAmendmentsAndOtherRevisionsPage={
+            isOnAmendmentsAndOtherRevisionsPage
+          }
+          formTitle="Emission Intensity Report"
+        />
+      )}
 
       <FormBase
         tagName={"dl"}
         theme={readOnlyTheme}
         fields={renderDiff ? customFields : fields}
         schema={reportingRequirementDiffObject.formSchema as JSONSchema7}
-        uiSchema={emissionIntensityReportingRequirementUiSchema}
-        formData={reportingRequirementDiffObject.formData}
-        formContext={{
-          operation: summaryReportingRequirement?.operation,
-          oldData:
-            summaryReportingRequirement?.formChangeByPreviousFormChangeId
-              ?.newFormData,
-          latestCommittedData:
-            latestCommittedEmissionIntensityReportingRequirementFormChange
-              ?.edges[0]?.node?.newFormData,
-          isAmendmentsAndOtherRevisionsSpecific:
-            isOnAmendmentsAndOtherRevisionsPage,
-        }}
-      />
-      <FormBase
-        tagName={"dl"}
-        theme={readOnlyTheme}
-        fields={renderDiff ? customFields : fields}
-        schema={emissionIntensityReportDiffObject.formSchema as JSONSchema7}
         uiSchema={modifiedEmissionIntensityReportUiSchema}
-        formData={emissionIntensityReportDiffObject.formData}
+        formData={reportingRequirementDiffObject.formData}
         formContext={{
           calculatedEiPerformance:
-            summaryEmissionIntensityReport?.calculatedEiPerformance ?? 0,
+            summaryReportingRequirement?.calculatedEiPerformance ?? 0,
           paymentPercentageOfPerformanceMilestoneAmount:
-            summaryEmissionIntensityReport?.paymentPercentage,
+            summaryReportingRequirement?.paymentPercentage,
           holdbackAmountToDate:
-            summaryEmissionIntensityReport?.holdbackAmountToDate,
+            summaryReportingRequirement?.holdbackAmountToDate,
           actualPerformanceMilestoneAmount:
-            summaryEmissionIntensityReport?.actualPerformanceMilestoneAmount,
-          operation: summaryEmissionIntensityReport?.operation,
+            summaryReportingRequirement?.actualPerformanceMilestoneAmount,
+          operation: summaryReportingRequirement?.operation,
           oldData,
           latestCommittedData,
           isAmendmentsAndOtherRevisionsSpecific: