[MDS-5049] TSF view and edit by roles (#2830)

* setting up role access for tsf view and edit * change to use renderActionColumns and adjusted minespace to match changes * changes to fix redux common error * adjustment to make user that can edit can also view tsf * fix redux common error * small refactor * small refactor * addressing pr comments on icons and others * addressing more pr comments * fixing redux common error * address unit test error * adjustments to text * fixing redux common error * change to dam routes
bcgov · Dec 7, 2023 · c33a8ca · c33a8ca
1 parent a4be935
commit c33a8ca
Show file tree

Hide file tree

Showing 31 changed files with 1,276 additions and 865 deletions.
diff --git a/services/common/src/redux/customAxios.js b/services/common/src/redux/customAxios.js
@@ -26,10 +26,11 @@ const notifymAdmin = (error) => {
   const detailed_error = error?.response?.data?.detailed_error;
 
   const payload = {
-    "business_error" : business_message,
+    "business_error": business_message,
     "detailed_error": detailed_error
   };
 
+  // @ts-ignore
   CustomAxios().post(ENVIRONMENT.apiUrl + API.REPORT_ERROR, payload, createRequestHeader())
     .then((response) => {
       notification.success({
@@ -64,7 +65,7 @@ const CustomAxios = ({ errorToastMessage, suppressErrorNotification = false } =
       ) {
         console.error('Detailed Error: ', error?.response?.data?.detailed_error)
         const notificationKey = 'errorNotification';
-        
+
         if (isFeatureEnabled(Feature.REPORT_ERROR)) {
           notification.error({
             key: notificationKey,
@@ -74,9 +75,9 @@ const CustomAxios = ({ errorToastMessage, suppressErrorNotification = false } =
             btn: (
               <Button type="primary" size="small"
                 onClick={() => {
-                    notifymAdmin(error);
-                    notification.close(notificationKey);
-                  }}>
+                  notifymAdmin(error);
+                  notification.close(notificationKey);
+                }}>
                 Tell Admin
               </Button>
             ),

diff --git a/services/core-web/common/components/PartyAppointmentTable.js b/services/core-web/common/components/PartyAppointmentTable.js
@@ -18,14 +18,16 @@ const propTypes = {
   updatePartyRelationship: PropTypes.func.isRequired,
   fetchPartyRelationships: PropTypes.func.isRequired,
   change: PropTypes.func.isRequired,
+  canEditTSF: PropTypes.bool,
 };
 
 const defaultProps = {
   columns: [],
+  canEditTSF: true,
 };
 
 const PartyAppointmentTable = (props) => {
-  const { columns } = props;
+  const { columns, canEditTSF } = props;
 
   const { renderConfig, isCore, tsfFormName, mineGuid, tsfGuid } = useContext(TailingsContext);
 
@@ -92,6 +94,7 @@ const PartyAppointmentTable = (props) => {
               data={statusColumns}
               loading={loadingField[`${record.rowName}.status`]}
               onChange={(val) => partyAppointmentChanged(record.rowName, record.key, "status", val)}
+              disabled={!canEditTSF}
             />
           );
         }

diff --git a/services/core-web/common/components/tailings/AssociatedDams.tsx b/services/core-web/common/components/tailings/AssociatedDams.tsx
@@ -1,4 +1,4 @@
-import { Button, Col, Row, Space, Typography } from "antd";
+import { Button, Col, Row, Typography } from "antd";
 import {
   CONSEQUENCE_CLASSIFICATION_CODE_HASH,
   DAM_OPERATING_STATUS_HASH,
@@ -12,30 +12,35 @@ import { getTsf } from "@mds/common/redux/reducers/tailingsReducer";
 import moment from "moment";
 import { storeDam } from "@mds/common/redux/actions/damActions";
 import { useHistory } from "react-router-dom";
-import { EditIcon } from "@/assets/icons";
 import { ADD_DAM, EDIT_DAM } from "@/constants/routes";
-import { IDam, INoticeOfDeparture, ITailingsStorageFacility } from "@mds/common";
+import { IDam, ITailingsStorageFacility } from "@mds/common";
 import { RootState } from "@/App";
 import { ColumnsType } from "antd/lib/table";
 import CoreTable from "@mds/common/components/common/CoreTable";
+import { renderActionsColumn } from "@mds/common/components/common/CoreTableCommonColumns";
+import { EditOutlined, EyeOutlined } from "@ant-design/icons";
 
 interface AssociatedDamsProps {
   tsf: ITailingsStorageFacility;
   storeDam: typeof storeDam;
   isCore?: boolean;
+  canEditTSF: boolean;
+  isEditMode: boolean;
 }
 
 const AssociatedDams: FC<AssociatedDamsProps> = (props) => {
   const history = useHistory();
-  const { tsf, isCore } = props;
+  const { tsf, isCore, isEditMode, canEditTSF } = props;
 
-  const handleNavigateToEdit = (event, dam) => {
+  const handleNavigateToEdit = (event, dam, canEditDam) => {
     event.preventDefault();
     props.storeDam(dam);
     const url = EDIT_DAM.dynamicRoute(
       tsf.mine_guid,
       dam.mine_tailings_storage_facility_guid,
-      dam.dam_guid
+      dam.dam_guid,
+      isEditMode,
+      canEditDam
     );
     history.push(url);
   };
@@ -46,6 +51,33 @@ const AssociatedDams: FC<AssociatedDamsProps> = (props) => {
     history.push(url);
   };
 
+  const renderDamActions = () => {
+    let actions = [
+      {
+        key: "view",
+        label: "View Dam",
+        icon: <EyeOutlined />,
+        clickFunction: (_event, record) => {
+          handleNavigateToEdit(event, record, false);
+        },
+      },
+      {
+        key: "edit",
+        label: "Edit Dam",
+        icon: <EditOutlined />,
+        clickFunction: (_event, record) => {
+          handleNavigateToEdit(event, record, true);
+        },
+      },
+    ];
+
+    if (!isEditMode) {
+      actions = actions.filter((a) => a.key !== "edit");
+    }
+
+    return renderActionsColumn(actions);
+  };
+
   const columns: ColumnsType<IDam> = [
     {
       title: "Name",
@@ -86,22 +118,7 @@ const AssociatedDams: FC<AssociatedDamsProps> = (props) => {
       dataIndex: "max_pond_elevation",
       key: "max_pond_elevation",
     },
-    {
-      title: "Actions",
-      key: "actions",
-      render: (record) => (
-        <Space size="middle">
-          <div className="inline-flex">
-            <Button type="primary" size="small" ghost>
-              <EditIcon
-                onClick={(event) => handleNavigateToEdit(event, record)}
-                className="icon-xs--darkestgrey"
-              />
-            </Button>
-          </div>
-        </Space>
-      ),
-    },
+    ...[renderDamActions()],
   ];
 
   const mostRecentUpdatedDate = moment(
@@ -131,10 +148,13 @@ const AssociatedDams: FC<AssociatedDamsProps> = (props) => {
               <Typography.Paragraph>{mostRecentUpdatedDate}</Typography.Paragraph>
             </div>
           ) : (
-            <Button type="primary" onClick={handleNavigateToCreate}>
-              <PlusCircleFilled />
-              Create a new dam
-            </Button>
+            canEditTSF &&
+            isEditMode && (
+              <Button type="primary" onClick={handleNavigateToCreate}>
+                <PlusCircleFilled />
+                Create a new dam
+              </Button>
+            )
           )}
         </Col>
       </Row>

diff --git a/services/core-web/common/components/tailings/BasicInformation.tsx b/services/core-web/common/components/tailings/BasicInformation.tsx
@@ -32,13 +32,16 @@ interface BasicInformationProps {
   showUpdateTimestamp: boolean;
   renderConfig: any;
   tsf: ITailingsStorageFacility;
-  viewOnly?: boolean;
+  canEditTSF?: boolean;
+  isEditMode: boolean;
 }
 
 export const BasicInformation: FC<BasicInformationProps> = (props) => {
-  const { permits, renderConfig, viewOnly = false, tsf } = props;
+  const { permits, renderConfig, canEditTSF = false, tsf, isEditMode } = props;
   const [permitOptions, setPermitOptions] = useState([]);
 
+  const canEditTSFAndEditMode = canEditTSF && isEditMode;
+
   const statusCodeOptions =
     tsf?.tsf_operating_status_code === "CLO"
       ? [...TSF_OPERATING_STATUS_CODE, { value: "CLO", label: "Closed" }]
@@ -71,7 +74,7 @@ export const BasicInformation: FC<BasicInformationProps> = (props) => {
         name="facility_type"
         label="Facility Type *"
         component={renderConfig.SELECT}
-        disabled={viewOnly}
+        disabled={!canEditTSFAndEditMode}
         data={FACILITY_TYPES}
         validate={[requiredList, validateSelectOptions(FACILITY_TYPES)]}
       />
@@ -80,7 +83,7 @@ export const BasicInformation: FC<BasicInformationProps> = (props) => {
         id="mines_act_permit_no"
         name="mines_act_permit_no"
         component={renderConfig.SELECT}
-        disabled={viewOnly}
+        disabled={!canEditTSFAndEditMode}
         validate={[requiredList, validateSelectOptions(permitOptions)]}
         data={permitOptions}
       />
@@ -89,7 +92,7 @@ export const BasicInformation: FC<BasicInformationProps> = (props) => {
         name="tailings_storage_facility_type"
         label="Tailings Storage Facility Type *"
         component={renderConfig.SELECT}
-        disabled={viewOnly}
+        disabled={!canEditTSFAndEditMode}
         validate={[requiredList, validateSelectOptions(TSF_TYPES)]}
         data={TSF_TYPES}
       />
@@ -98,7 +101,7 @@ export const BasicInformation: FC<BasicInformationProps> = (props) => {
         name="storage_location"
         label="Underground or Above Ground? *"
         component={renderConfig.SELECT}
-        disabled={viewOnly}
+        disabled={!canEditTSFAndEditMode}
         data={STORAGE_LOCATION}
         validate={[requiredList, validateSelectOptions(STORAGE_LOCATION)]}
       />
@@ -107,7 +110,7 @@ export const BasicInformation: FC<BasicInformationProps> = (props) => {
         name="mine_tailings_storage_facility_name"
         label="Facility Name *"
         component={renderConfig.FIELD}
-        disabled={viewOnly}
+        disabled={!canEditTSFAndEditMode}
         validate={[maxLength(60), required]}
       />
       <Row gutter={16}>
@@ -117,7 +120,7 @@ export const BasicInformation: FC<BasicInformationProps> = (props) => {
             name="latitude"
             label="Latitude *"
             component={renderConfig.FIELD}
-            disabled={viewOnly}
+            disabled={!canEditTSFAndEditMode}
             validate={[lat, required]}
           />
         </Col>
@@ -127,7 +130,7 @@ export const BasicInformation: FC<BasicInformationProps> = (props) => {
             name="longitude"
             label="Longitude *"
             component={renderConfig.FIELD}
-            disabled={viewOnly}
+            disabled={!canEditTSFAndEditMode}
             validate={[lonNegative, lon, required]}
           />
         </Col>
@@ -137,7 +140,7 @@ export const BasicInformation: FC<BasicInformationProps> = (props) => {
         name="consequence_classification_status_code"
         label="Consequence Classification *"
         component={renderConfig.SELECT}
-        disabled={viewOnly}
+        disabled={!canEditTSFAndEditMode}
         data={CONSEQUENCE_CLASSIFICATION_STATUS_CODE}
         validate={[requiredList, validateSelectOptions(CONSEQUENCE_CLASSIFICATION_STATUS_CODE)]}
       />
@@ -147,15 +150,15 @@ export const BasicInformation: FC<BasicInformationProps> = (props) => {
         label="Operating Status *"
         data={statusCodeOptions}
         component={renderConfig.SELECT}
-        disabled={viewOnly}
+        disabled={!canEditTSFAndEditMode}
         validate={[requiredList, validateSelectOptions(statusCodeOptions)]}
       />
       <Field
         id="itrb_exemption_status_code"
         name="itrb_exemption_status_code"
         label="Independent Tailings Review Board Member *"
         component={renderConfig.SELECT}
-        disabled={viewOnly}
+        disabled={!canEditTSFAndEditMode}
         data={TSF_INDEPENDENT_TAILINGS_REVIEW_BOARD}
         validate={[maxLength(300), required]}
       />