[MDS-6255] view mine report definitions

services/common/src/components/reports/ReportDefinitionFieldSelect.tsx

@@ -1,10 +1,8 @@
 import { formatComplianceCodeReportName } from "@mds/common/redux/utils/helpers";
 import React, { useEffect, useState } from "react";
-import { useSelector } from "react-redux";
-import { Field } from "@mds/common/components/forms/form";
-
-import { getMineReportDefinitionOptions } from "@mds/common/redux/selectors/staticContentSelectors";
-
+import { useAppDispatch as useDispatch, useAppSelector as useSelector } from "@mds/common/redux/rootState";
+import { Field } from "redux-form";
+import { fetchComplianceReports, getMineReportDefinitionOptions, getReportDefinitionsLoaded, reportParamsGetAll } from "@mds/common/redux/slices/complianceReportsSlice";
 import RenderSelect from "../forms/RenderSelect";
 import { uniqBy } from "lodash";
 import moment from "moment";
@@ -20,9 +18,10 @@ export interface ReportDefinitionFieldSelectProps {
 }
 
 export const ReportDefinitionFieldSelect = (props: ReportDefinitionFieldSelectProps) => {
+  const dispatch = useDispatch();
   const mineReportDefinitionOptions = useSelector(getMineReportDefinitionOptions);
-
-  const [formattedMineReportDefinitionOptions, setFormatMineReportDefinitionOptions] = useState([]);
+  const [formattedMineReportDefinitionOptions, setFormattedMineReportDefinitionOptions] = useState([]);
+  const reportDefinitionsLoaded = useSelector(getReportDefinitionsLoaded(reportParamsGetAll));
 
   useEffect(() => {
     // Format the mine report definition options for the search bar
@@ -39,9 +38,15 @@ export const ReportDefinitionFieldSelect = (props: ReportDefinitionFieldSelectPr
         };
       })
       .sort((a, b) => a.label.localeCompare(b.label));
-    setFormatMineReportDefinitionOptions(uniqBy(newFormattedMineReportDefinitionOptions, "value"));
+    setFormattedMineReportDefinitionOptions(uniqBy(newFormattedMineReportDefinitionOptions, "value"));
   }, [mineReportDefinitionOptions]);
 
+  useEffect(() => {
+    if (!reportDefinitionsLoaded) {
+      dispatch(fetchComplianceReports(reportParamsGetAll));
+    }
+  }, []);
+
   return (
     <Field
       component={RenderSelect}

services/common/src/components/reports/ReportDetailsForm-view.spec.tsx

@@ -8,6 +8,7 @@ import * as MOCK from "@mds/common/tests/mocks/dataMocks";
 import { SystemFlagEnum } from "@mds/common/constants/enums";
 import { USER_ROLES } from "@mds/common/constants/environment";
 import { IMineReportSubmission } from "@mds/common/interfaces/reports/mineReportSubmission.interface";
+import { complianceReportReducerType, reportParamsGetAll } from "@mds/common/redux/slices/complianceReportsSlice";
 
 const mineReportSubmission = MOCK.MINE_REPORT_SUBMISSIONS[0];
 const initialState = {
@@ -16,10 +17,19 @@ const initialState = {
     mineReportGuid: mineReportSubmission.mine_report_guid,
   },
   [STATIC_CONTENT]: {
-    mineReportDefinitionOptions: MOCK.BULK_STATIC_CONTENT_RESPONSE.mineReportDefinitionOptions,
     permitConditionCategoryOptions:
       MOCK.BULK_STATIC_CONTENT_RESPONSE.permitConditionCategoryOptions,
   },
+  [complianceReportReducerType]: {
+    reportPageData: {
+      records: MOCK.MINE_REPORT_DEFINITION_OPTIONS,
+      current_page: 1,
+      items_per_page: MOCK.MINE_REPORT_DEFINITION_OPTIONS.length,
+      total: MOCK.MINE_REPORT_DEFINITION_OPTIONS.length,
+      total_pages: 1
+    },
+    params: reportParamsGetAll,
+  },
   [AUTHENTICATION]: {
     systemFlag: SystemFlagEnum.core,
     userAccessData: [USER_ROLES.role_edit_reports],

services/common/src/components/reports/ReportDetailsForm.tsx

@@ -1,16 +1,14 @@
 import { Alert, Button, Col, Row, Typography } from "antd";
 import React, { FC, ReactNode, useEffect, useState } from "react";
-import { useDispatch, useSelector } from "react-redux";
+import { useAppDispatch as useDispatch, useAppSelector as useSelector } from "@mds/common/redux/rootState";
 import { arrayPush, change, Field, FieldArray, getFormValues } from "@mds/common/components/forms/form";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faTrashAlt } from "@fortawesome/pro-light-svg-icons";
-
 import {
   getDropdownPermitConditionCategoryOptions,
-  getMineReportDefinitionOptions,
 } from "@mds/common/redux/selectors/staticContentSelectors";
+import { fetchComplianceReports, getMineReportDefinitionOptions, getReportDefinitionsLoaded, reportParamsGetAll } from "@mds/common/redux/slices/complianceReportsSlice";
 import ReportFileUpload from "@mds/common/components/reports/ReportFileUpload";
-
 import { FORM } from "@mds/common/constants/forms";
 import {
   email,
@@ -152,7 +150,7 @@ const ReportDetailsForm: FC<ReportDetailsFormProps> = ({
   } = formValues;
 
   const [selectedReportCode, setSelectedReportCode] = useState("");
-  const [formattedMineReportDefinitionOptions, setFormatMineReportDefinitionOptions] = useState([]);
+  const [formattedMineReportDefinitionOptions, setFormattedMineReportDefinitionOptions] = useState([]);
   const [isLoading, setIsLoading] = useState(false);
 
   const partyRelationships: IPartyAppt[] = useSelector((state) => getPartyRelationships(state));
@@ -165,6 +163,8 @@ const ReportDetailsForm: FC<ReportDetailsFormProps> = ({
   const MinistryContactsByRegion: IMinistryContact[] = useSelector(getMinistryContactsByRegion);
   const [contactEmail, setContactEmail] = useState<string>();
 
+  const reportDefinitionsLoaded = useSelector(getReportDefinitionsLoaded(reportParamsGetAll));
+
   // PRR
   const permit = useSelector(getPermitByGuid(permit_guid));
   const dropdownPermitConditionCategoryOptions = useSelector(
@@ -245,7 +245,7 @@ const ReportDetailsForm: FC<ReportDetailsFormProps> = ({
         };
       })
       .sort((a, b) => a.label.localeCompare(b.label));
-    setFormatMineReportDefinitionOptions(uniqBy(newFormattedMineReportDefinitionOptions, "value"));
+    setFormattedMineReportDefinitionOptions(uniqBy(newFormattedMineReportDefinitionOptions, "value"));
   }, [mineReportDefinitionOptions]);
 
   useEffect(() => {
@@ -287,6 +287,12 @@ const ReportDetailsForm: FC<ReportDetailsFormProps> = ({
     }
   }, [formValues.mine_report_guid, formValues.mine_report_submission_guid]);
 
+  useEffect(() => {
+    if (!reportDefinitionsLoaded) {
+      dispatch(fetchComplianceReports(reportParamsGetAll));
+    }
+  }, []);
+
   const handleAddComment = async (values) => {
     const formVals = {
       report_comment: values.comment,

services/common/src/components/reports/ReportGetStarted.tsx

@@ -2,7 +2,7 @@ import { Alert, Button, Col, Row, Typography } from "antd";
 import React, { FC, ReactNode, useEffect, useState } from "react";
 import { Field, getFormValues, change } from "@mds/common/components/forms/form";
 import ArrowRightOutlined from "@ant-design/icons/ArrowRightOutlined";
-import { useSelector, useDispatch } from "react-redux";
+import { useAppDispatch as useDispatch, useAppSelector as useSelector } from "@mds/common/redux/rootState";
 import { IMine, IMineReportDefinition, IMineReportSubmission } from "@mds/common/interfaces";
 import {
   createDropDownList,
@@ -15,9 +15,8 @@ import { required, requiredRadioButton } from "@mds/common/redux/utils/Validate"
 import RenderSelect from "../forms/RenderSelect";
 import {
   getDropdownPermitConditionCategoryOptions,
-  getFormattedMineReportDefinitionOptions,
-  getMineReportDefinitionByGuid,
 } from "@mds/common/redux/selectors/staticContentSelectors";
+import { fetchComplianceReports, getFormattedMineReportDefinitionOptions, getMineReportDefinitionByGuid, getReportDefinitionsLoaded, reportParamsGetAll } from "@mds/common/redux/slices/complianceReportsSlice";
 import { getPermits } from "@mds/common/redux/selectors/permitSelectors";
 import { fetchPermits } from "@mds/common/redux/actionCreators/permitActionCreator";
 import { getSystemFlag } from "@mds/common/redux/selectors/authenticationSelectors";
@@ -171,9 +170,16 @@ const ReportGetStarted: FC<ReportGetStartedProps> = ({
   const selectedReportDefinition: IMineReportDefinition = useSelector(
     getMineReportDefinitionByGuid(formValues?.mine_report_definition_guid)
   );
+  const reportDefinitionsLoaded = useSelector(getReportDefinitionsLoaded(reportParamsGetAll));
 
   useEffect(() => {
-    if (selectedReportDefinition && selectedReportDefinition.is_prr_only) {
+    if (!reportDefinitionsLoaded) {
+      dispatch(fetchComplianceReports(reportParamsGetAll));
+    }
+  }, []);
+
+  useEffect(() => {
+    if (selectedReportDefinition?.is_prr_only) {
       setDisableNextButton(true);
     } else {
       setDisableNextButton(false);

services/common/src/constants/API.ts

@@ -259,7 +259,7 @@ export const MINE_WORK_INFORMATION = (mineGuid, mineWorkInformationGuid) =>
 export const REPORTS = (params = {}) => `/mines/reports?${queryString.stringify(params)}`;
 export const REPORT_SUBMISSIONS = (params?) =>
   `/mines/reports/submissions?${queryString.stringify(params)}`;
-export const MINE_REPORT_DEFINITIONS = () => `/mines/reports/definitions`;
+export const MINE_REPORT_DEFINITIONS = (params = {}) => `/mines/reports/definitions?${queryString.stringify(params)}`;
 export const MINE_REPORTS = (mineGuid, params?) =>
   `/mines/${mineGuid}/reports?${queryString.stringify(params)}`;
 export const MINE_REPORT = (mineGuid, mineReportGuid) =>

services/common/src/constants/actionTypes.ts

@@ -34,7 +34,6 @@ export const STORE_MINE_DOCUMENTS = "STORE_MINE_DOCUMENTS";
 export const STORE_MINE_TSF_REQUIRED_DOCUMENTS = "STORE_MINE_TSF_REQUIRED_DOCUMENTS";
 export const STORE_MINE_COMPLIANCE_INFO = "STORE_MINE_COMPLIANCE_INFO";
 export const STORE_PROVINCE_OPTIONS = "STORE_PROVINCE_OPTIONS";
-export const STORE_MINE_REPORT_DEFINITION_OPTIONS = "STORE_MINE_REPORT_DEFINITION_OPTIONS";
 
 export const STORE_PARTY = "STORE_PARTY";
 export const STORE_PARTIES = "STORE_PARTIES";

services/common/src/constants/enums.ts

@@ -227,6 +227,8 @@ export enum REPORT_REGULATORY_AUTHORITY_CODES {
 export enum REPORT_REGULATORY_AUTHORITY_ENUM {
   CPO = "Chief Permitting Officer",
   CIM = "Chief Inspector of Mines",
+  Both = "Both",
+
 }
 
 export enum MineReportType {

services/common/src/interfaces/common/searchParams.interface.ts

@@ -0,0 +1,6 @@
+export interface ISearchParams {
+    page?: number;
+    per_page?: number;
+    sort_field?: string;
+    sort_dir?: string;
+};

services/common/src/interfaces/complianceArticle.interface.ts

@@ -11,8 +11,8 @@ export interface IComplianceArticle {
   sub_paragraph: string;
   description: string;
   long_description: string;
-  effective_date: Date;
-  expiry_date: Date;
+  effective_date: string;
+  expiry_date: string;
   help_reference_link: string;
   cim_or_cpo: string;
   reports: IMineReportDefinition[];

services/common/src/interfaces/reports/mineReportDefinition.interface.ts

@@ -10,7 +10,7 @@ export interface IMineReportDefinition {
   active_ind: boolean;
   categories: IMineReportDefinitionCategory[];
   compliance_articles: IComplianceArticle[];
-  default_due_date?: number;
+  default_due_date?: string;
   description: string;
   due_date_period_months?: number;
   is_common: boolean;

services/common/src/redux/reducers/rootReducerShared.ts

@@ -35,21 +35,22 @@ import verifiableCredentialsReducer from "@mds/common/redux/slices/verifiableCre
 
 import regionsReducer from "@mds/common/redux/slices/regionsSlice";
 import complianceCodeReducer, { complianceCodeReducerType } from "../slices/complianceCodesSlice";
+import complianceReportReducer, { complianceReportReducerType } from "../slices/complianceReportsSlice";
 import spatialDataReducer, { spatialDataReducerType } from "../slices/spatialDataSlice";
 import permitServiceReducer, { permitServiceReducerType } from "../slices/permitServiceSlice";
 import searchConditionCategoriesReducer, {
   searchConditionCategoriesType,
 } from "../slices/permitConditionCategorySlice";
 import helpReducer, { helpReducerType } from "../slices/helpSlice";
+import userReducer, { userReducerType } from "@mds/common/redux/slices/userSlice";
 import mineReportPermitRequirementReducer, { mineReportPermitRequirementReducerType } from "../slices/mineReportPermitRequirementSlice";
+import permitConditionDiffReducer, { permitConditionDiffReducerType } from "../slices/permitConditionDiffSlice";
+
 
 const networkReducers = Object.fromEntries(Object.entries(NetworkReducerTypes).map(([key, value]) =>
   [NetworkReducerTypes[key], createReducer(networkReducer, value)]
 ));
 
-import userReducer, { userReducerType } from "@mds/common/redux/slices/userSlice";
-import permitConditionDiffReducer, { permitConditionDiffReducerType } from "../slices/permitConditionDiffSlice";
-
 export const sharedReducer = {
   ...activityReducer,
   ...authenticationReducer,
@@ -83,6 +84,7 @@ export const sharedReducer = {
   regions: regionsReducer,
   [spatialDataReducerType]: spatialDataReducer,
   [complianceCodeReducerType]: complianceCodeReducer,
+  [complianceReportReducerType]: complianceReportReducer,
   [permitServiceReducerType]: permitServiceReducer,
   [helpReducerType]: helpReducer,
   [searchConditionCategoriesType]: searchConditionCategoriesReducer,

services/common/src/redux/reducers/staticContentReducer.js

@@ -27,7 +27,6 @@ const initialState = {
   informationRequirementsTableDocumentTypes: [],
   majorMineApplicationStatusCodes: [],
   majorMineApplicationDocumentTypes: [],
-  mineReportDefinitionOptions: [],
   mineReportStatusOptions: [],
   mineReportCategoryOptions: [],
   partyRelationshipTypes: [],
@@ -113,8 +112,6 @@ export const getMajorMinesApplicationStatusCodes = (state) =>
   state[STATIC_CONTENT].majorMineApplicationStatusCodes;
 export const getMajorMinesApplicationDocumentTypes = (state) =>
   state[STATIC_CONTENT].majorMineApplicationDocumentTypes;
-export const getMineReportDefinitionOptions = (state) =>
-  state[STATIC_CONTENT].mineReportDefinitionOptions;
 export const getMineReportStatusOptions = (state) => state[STATIC_CONTENT].mineReportStatusOptions;
 export const getMineReportCategoryOptions = (state) =>
   state[STATIC_CONTENT].mineReportCategoryOptions;

services/common/src/redux/selectors/staticContentSelectors.ts

@@ -5,11 +5,9 @@ import {
   createLabelHash,
   createDropDownList,
   compareCodes,
-  formatComplianceCodeReportName,
 } from "../utils/helpers";
 import { RootState } from "@mds/common/redux/rootState";
 import { getMunicipalityOptions } from "../reducers/staticContentReducer";
-import { IMineReportDefinition } from "@mds/common/interfaces/reports/mineReportDefinition.interface";
 
 export const {
   getStaticContentLoadingIsComplete,
@@ -18,7 +16,6 @@ export const {
   getMineTenureTypeOptions,
   getMineCommodityOptions,
   getMineDisturbanceOptions,
-  getMineReportDefinitionOptions,
   getMineReportStatusOptions,
   getMineReportCategoryOptions,
   getProvinceOptions,
@@ -80,7 +77,7 @@ const getOptions = (transformOptionsFunc, showActiveOnly) => {
     : options;
 };
 
-const createSelectorWrapper = (
+export const createSelectorWrapper = (
   getOptionsMethod,
   transformOptionsMethod,
   transformOptionsFuncArgs = []
@@ -460,46 +457,6 @@ export const getVarianceDocumentCategoryOptionsHash = createSelector(
   createLabelHash
 );
 
-export const getDropdownMineReportDefinitionOptions = createSelectorWrapper(
-  getMineReportDefinitionOptions,
-  createDropDownList,
-  ["report_name", "mine_report_definition_guid", "active_ind"]
-);
-
-export const getFormattedMineReportDefinitionOptions = createSelectorWrapper(
-  getMineReportDefinitionOptions,
-  (options: IMineReportDefinition[]) => {
-    return options
-      .map((item) => {
-        return {
-          label: formatComplianceCodeReportName(item),
-          value: item.mine_report_definition_guid,
-          isActive: item.active_ind,
-          is_common: item.is_common,
-          report_name: item.report_name,
-        };
-      })
-      .sort((a, b) => a.label.localeCompare(b.label));
-  }
-);
-
-export const getMineReportDefinitionByGuid = (mineReportDefinitionGuid: string) =>
-  createSelector([getMineReportDefinitionOptions], (reportDefs) => {
-    return reportDefs.find((r) => r.mine_report_definition_guid === mineReportDefinitionGuid);
-  });
-
-export const getMineReportDefinitionHash = createSelector(
-  getMineReportDefinitionOptions,
-  (options) =>
-    options.reduce(
-      (map, mine_report_definition) => ({
-        [mine_report_definition.mine_report_definition_guid]: mine_report_definition,
-        ...map,
-      }),
-      {}
-    )
-);
-
 export const getDropdownMineReportCategoryOptions = createSelectorWrapper(
   getMineReportCategoryOptions,
   createDropDownList,