[MDS-6306] Fix minespace user mine management

services/common/src/components/forms/RenderRadioButtons.tsx

@@ -1,7 +1,7 @@
 import React, { FC, useContext } from "react";
 import { Form, Radio } from "antd";
 import { BaseInputProps, BaseViewInput, getFormItemLabel } from "@mds/common/components/forms/BaseInput";
-import { IOption } from "@mds/common/interfaces";
+import { IRadioOption } from "@mds/common/interfaces";
 import { FormContext } from "./FormWrapper";
 
 /**
@@ -10,7 +10,7 @@ import { FormContext } from "./FormWrapper";
 
 interface RenderRadioButtonsProps extends BaseInputProps {
   label: string;
-  customOptions?: IOption[];
+  customOptions?: IRadioOption[];
   optionType?: "default" | "button";
   isVertical?: boolean;
 }

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

@@ -1,9 +1,14 @@
 export interface IOption {
   label: string;
-  value: string | number | boolean;
+  value: string | number;
   tooltip?: string;
 }
 
+export interface IRadioOption {
+  label: string;
+  value: boolean | string;
+}
+
 export interface IGroupedDropdownList {
   groupName: string | number;
   opt: IOption[];

services/common/src/interfaces/index.ts

@@ -44,3 +44,4 @@ export * from "./emli_contact.interface";
 export * from "./mineStatus.interface";
 export * from "./mineCommodityOption.interface";
 export * from "./mineDisturbanceOption.interface";
+export * from "./mineSearch.interface"

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

@@ -0,0 +1,10 @@
+export interface IMineSearch {
+  mine_guid: string;
+  mine_no: string;
+  mine_name: string;
+  major_mine_ind: boolean;
+  mine_location_description: string;
+  latitude: number;
+  longitude: number;
+  deleted_ind: boolean;
+}

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

@@ -2,15 +2,15 @@ import { RootState } from "@mds/common/redux/rootState";
 import * as actionTypes from "@mds/common/constants/actionTypes";
 import { MINES } from "@mds/common/constants/reducerTypes";
 import { createItemMap, createItemIdsArray } from "../utils/helpers";
-import { IMine, IMineComment, IMineDocument, ItemMap } from "@mds/common/interfaces";
+import { IMine, IMineComment, IMineDocument, IMineSearch, ItemMap } from "@mds/common/interfaces";
 /**
  * @file mineReducer.js
  * all data associated with new mine/existing mine records is handled witnin this reducer.
  */
 interface MineState {
   mines: ItemMap<IMine>;
   mineIds: string[];
-  mineNameList: IMine[];
+  mineNameList: IMineSearch[];
   minesPageData: IMine;
   mineGuid: string;
   mineBasicInfoList: IMine[];
@@ -98,7 +98,7 @@ export const getMines = (state: RootState): ItemMap<IMine> => state[MINES].mines
 export const getMineById = (state: RootState, mineGuid: string): IMine =>
   state[MINES]?.mines[mineGuid] as IMine;
 export const getMineIds = (state: RootState): string[] => state[MINES].mineIds;
-export const getMineNames = (state: RootState): IMine[] => state[MINES].mineNameList;
+export const getMineNames = (state: RootState): IMineSearch[] => state[MINES].mineNameList;
 export const getMinesPageData = (state: RootState): IMine => state[MINES].minesPageData;
 export const getMineGuid = (state: RootState): any => state[MINES].mineGuid;
 export const getMineBasicInfoList = (state: RootState): IMine[] => state[MINES].mineBasicInfoList;

services/core-web/src/components/Forms/EditMinespaceUser.js → services/core-web/src/components/Forms/EditMinespaceUser.tsx

@@ -1,6 +1,5 @@
-import React from "react";
-import PropTypes from "prop-types";
-import { Field, reduxForm } from "redux-form";
+import React, { FC } from "react";
+import { Field, InjectedFormProps, reduxForm } from "redux-form";
 import { Form } from "@ant-design/compatible";
 import "@ant-design/compatible/assets/index.css";
 import { Button, Col, Row } from "antd";
@@ -9,18 +8,22 @@ import { nullableStringSorter, resetForm } from "@common/utils/helpers";
 import RenderField from "@/components/common/RenderField";
 import * as FORM from "@/constants/forms";
 import { renderConfig } from "@/components/common/config";
-import CustomPropTypes from "@/customPropTypes";
+import { IMine } from "@mds/common/interfaces";
 
-const propTypes = {
-  mines: CustomPropTypes.options.isRequired,
+interface EditMinespaceUserProps{
+  mines: IMine[];
   // eslint-disable-next-line react/no-unused-prop-types
-  handleSubmit: PropTypes.func.isRequired,
-  handleChange: PropTypes.func.isRequired,
-  handleSearch: PropTypes.func.isRequired,
+  handleSubmit: () => void;
+  handleChange: () => void;
+  handleSearch: (name: any) => void;
 };
 
-export const EditMinespaceUser = (props) => {
-  const { mines, handleSubmit, handleChange, handleSearch } = props;
+export const EditMinespaceUser: FC<EditMinespaceUserProps & InjectedFormProps> = ({
+  mines,
+  handleSubmit,
+  handleChange,
+  handleSearch
+}) => {
   const isModal = true; // currently no instance where it's not in a modal
   return (
     <Form layout="vertical" onSubmit={handleSubmit}>
@@ -65,11 +68,8 @@ export const EditMinespaceUser = (props) => {
   );
 };
 
-EditMinespaceUser.propTypes = propTypes;
-
 export default reduxForm({
   form: FORM.EDIT_MINESPACE_USER,
-  initialValues: { proponent_mine_access: [] },
   touchOnBlur: false,
   onSubmitSuccess: resetForm(FORM.EDIT_MINESPACE_USER),
 })(EditMinespaceUser);

services/core-web/src/components/admin/MinespaceUserList.js

@@ -18,7 +18,7 @@ const propTypes = {
 const defaultProps = {
   minespaceUsers: [],
   minespaceUserMines: [],
-  handleDelete: () => {},
+  handleDelete: () => { },
 };
 
 const columns = [
@@ -75,7 +75,7 @@ const lookupMineName = (mine_guids, mines) =>
       mine_guid,
       mine_name: mine_record ? `${mine_record.mine_name}-${mine_record.mine_no}` : "",
     };
-  });
+  }).sort((a, b) => a.mine_name.localeCompare(b.mine_name));
 
 const transformRowData = (minespaceUsers, mines, deleteFunc, handleOpenModal) =>
   minespaceUsers.map((user) => ({

services/core-web/src/components/admin/MinespaceUserManagement.js

@@ -75,10 +75,7 @@ export const MinespaceUserManagement = (props) => {
   };
 
   const refreshUserData = () => {
-    props.fetchMinespaceUsers().then(() => {
-      const mine_guids = flatMap(minespaceUsers, (user) => user.mines);
-      props.fetchMinespaceUserMines(uniq(mine_guids));
-    });
+    props.fetchMinespaceUsers();
   };
 
   const handleUpdate = (record) => {
@@ -102,7 +99,7 @@ export const MinespaceUserManagement = (props) => {
         initialValues: record,
         handleSubmit: handleUpdate,
         refreshData: refreshUserData,
-        afterClose: () => {},
+        afterClose: () => { },
       },
       content: modalConfig.UPDATE_MINESPACE_USERS,
       width: "75vw",

services/core-web/src/components/admin/UpdateMinespaceUser.tsx

@@ -0,0 +1,104 @@
+import React, { FC, useState } from "react";
+import { ActionCreator, bindActionCreators } from "redux";
+import { connect } from "react-redux";
+import { getMineNames } from "@mds/common/redux/selectors/mineSelectors";
+import { fetchMineNameList } from "@mds/common/redux/actionCreators/mineActionCreator";
+
+import { getMinespaceUserMines } from "@mds/common/redux/reducers/minespaceReducer";
+import EditMinespaceUser from "@/components/Forms/EditMinespaceUser";
+import { IMine, IMineSearch } from "@mds/common/interfaces";
+
+interface UpdateMinespaceUserProps {
+  fetchMineNameList?: ActionCreator<typeof fetchMineNameList>,
+  mines: IMineSearch[],
+  minespaceUserEmailHash?: any,
+  handleSubmit?: () => void,
+  initialValues?: any,
+  minespaceUserMines?: IMine[]
+};
+
+export const UpdateMinespaceUser: FC<UpdateMinespaceUserProps> = ({
+  mines = [],
+  minespaceUserEmailHash = {},
+  minespaceUserMines = [],
+  fetchMineNameList,
+  handleSubmit = () => { },
+  initialValues
+}) => {
+
+  const [searching, setSearching] = useState(false);
+
+  const handleSearch = (name) => {
+    setSearching(true);
+    if (name.length > 0) {
+      fetchMineNameList({ name });
+    } else {
+      handleChange();
+    }
+  };
+
+  const handleChange = () => {
+    setSearching(false)
+    fetchMineNameList();
+  };
+
+  const parseMinesAsOptions = (mines) => {
+    return mines.map((mine) => ({
+      value: mine.mine_guid,
+      label: `${mine.mine_name} - ${mine.mine_no}`,
+    }));
+  };
+
+  const dedupe = (mines, userMines) => {
+    const mineGuids = new Set(mines.map(m => m.mine_guid));
+    let uniqueMines = mines;
+    for (const mine of userMines) {
+      if (!mineGuids.has(mine.mine_guid)) {
+        uniqueMines.push(mine);
+      }
+    }
+    return uniqueMines;
+  }
+
+  const getMines = () => {
+    return searching ? [...mines] : [...dedupe(mines, minespaceUserMines)];
+  }
+
+  const EditMinespaceUserProps = {
+    mines: parseMinesAsOptions(getMines()),
+    initialValueOptions: initialValues.mineNames,
+    initialValues:{
+      ...initialValues,
+      mine_guids: initialValues.mineNames.map((mn) => mn.mine_guid),
+    },
+    onSubmit: handleSubmit,
+    handleChange: handleChange,
+    handleSearch: handleSearch,
+  }
+
+  return (
+    <div>
+      <h3>Edit Proponent</h3>
+      {mines && (
+        <EditMinespaceUser
+          {...EditMinespaceUserProps}
+        />
+      )}
+    </div>
+  );
+}
+
+const mapStateToProps = (state) => ({
+  mines: getMineNames(state),
+  minespaceUserMines: getMinespaceUserMines(state),
+});
+
+const mapDispatchToProps = (dispatch) =>
+  bindActionCreators(
+    {
+      fetchMineNameList,
+    },
+    dispatch
+  );
+
+export default connect(mapStateToProps, mapDispatchToProps)(UpdateMinespaceUser);