admin page now works as intended

bcgov · May 21, 2024 · b9ad9c9 · b9ad9c9
1 parent 8d3d9e9
commit b9ad9c9
Show file tree

Hide file tree

Showing 8 changed files with 89 additions and 97 deletions.
diff --git a/backend/src/admin/admin.controller.ts b/backend/src/admin/admin.controller.ts
@@ -194,7 +194,7 @@ export class AdminController {
   }
 
   @Post('remove-admin')
-  removeAdmin(@Body() input: { idirUsername: string }): Promise<{ message: string }> {
+  removeAdmin(@Body() input: { idirUsername: string }): Promise<{ error: string | null }> {
     return this.adminService.removeAdmin(input.idirUsername);
   }
 

diff --git a/backend/src/admin/admin.service.ts b/backend/src/admin/admin.service.ts
@@ -40,7 +40,12 @@ export class AdminService {
     return this.documentTemplateService.remove(document_type_id, id);
   }
 
-  updateTemplate(data: { id: number; documentNo: number; documentName: string; document_type_id: number }): Promise<any> {
+  updateTemplate(data: {
+    id: number;
+    documentNo: number;
+    documentName: string;
+    document_type_id: number;
+  }): Promise<any> {
     return this.documentTemplateService.updateTemplate(data);
   }
 
@@ -248,22 +253,26 @@ export class AdminService {
    * @param username
    * @returns null
    */
-  async removeAdmin(username: string) {
+  async removeAdmin(username: string): Promise<{ error: string | null }> {
     const ticdiAdminRole = 'ticdi_admin';
     const bearerToken = await this.getToken();
     const url = `${process.env.users_api_base_url}/integrations/${process.env.integration_id}/${process.env.css_environment}/users/${username}@idir/roles/${ticdiAdminRole}`;
-    const res = await axios
-      .delete(url, {
-        headers: { Authorization: 'Bearer ' + bearerToken },
-      })
-      .then((res) => {
-        return res;
-      })
-      .catch((err) => {
-        console.log(err.response.data);
-        return { message: 'Failed to remove admin privileges' };
-      });
-    return { message: 'error' };
+    try {
+      await axios
+        .delete(url, {
+          headers: { Authorization: 'Bearer ' + bearerToken },
+        })
+        .then((res) => {
+          return res;
+        })
+        .catch((err) => {
+          throw err;
+        });
+    } catch (err) {
+      console.log(err.response.data);
+      return { error: 'Failed to remove admin privileges' };
+    }
+    return { error: null };
   }
 
   async getDocumentTemplates(document_type_id: number): Promise<any> {

diff --git a/frontend/src/app/common/manage-admins.ts b/frontend/src/app/common/manage-admins.ts
@@ -1,6 +1,7 @@
 import config from '../../config';
 import { IdirUserObject } from '../components/modal/manage-admins/AddAdmin';
 import { AdminData } from '../components/table/manage-admins/AdminDataTable';
+import { UserObject } from '../types/types';
 import * as api from './api';
 
 /**
@@ -48,14 +49,16 @@ export const findIdirUser = async (
   return { foundUserObject: response.userObject || null, error: response.error || null };
 };
 
-export const addAdmin = async (idirUsername: string): Promise<void> => {
+export const addAdmin = async (idirUsername: string): Promise<{ userObject: UserObject; error: string }> => {
   const url = `${config.API_BASE_URL}/admin/add-admin`;
   const data = { idirUsername };
   const postParameters = api.generateApiParameters(url, data);
-  await api.post(postParameters);
+  console.log('addAdmin posting');
+  const response: { userObject: UserObject; error: string } = await api.post(postParameters);
+  return response;
 };
 
-export const removeAdmin = async (idirUsername: string): Promise<{ message: string }> => {
+export const removeAdmin = async (idirUsername: string): Promise<{ error: string | null }> => {
   const url = `${config.API_BASE_URL}/admin/remove-admin`;
   const data = { idirUsername };
   const postParameters = api.generateApiParameters(url, data);

diff --git a/frontend/src/app/components/modal/manage-admins/AddAdmin.tsx b/frontend/src/app/components/modal/manage-admins/AddAdmin.tsx
@@ -3,11 +3,12 @@ import Modal from 'react-bootstrap/Modal';
 import Button from 'react-bootstrap/Button';
 import Form from 'react-bootstrap/Form';
 import { Col, Row, Spinner } from 'react-bootstrap';
-import { findIdirUser } from '../../../common/manage-admins';
+import { addAdmin, findIdirUser } from '../../../common/manage-admins';
 
 type AddAdminProps = {
   show: boolean;
   onHide: () => void;
+  refreshTable: () => void;
 };
 
 export type IdirUserObject = {
@@ -17,14 +18,15 @@ export type IdirUserObject = {
   idirUsername: string;
 };
 
-const AddAdmin: FC<AddAdminProps> = ({ show, onHide }) => {
+const AddAdmin: FC<AddAdminProps> = ({ show, onHide, refreshTable }) => {
   const [email, setEmail] = useState('');
   const [loading, setLoading] = useState(false);
   const [userObject, setUserObject] = useState<IdirUserObject | null>(null);
   const [error, setError] = useState('');
   const [showError, setShowError] = useState(false);
 
   const searchUsers = async () => {
+    setShowError(false);
     setLoading(true);
     try {
       const { foundUserObject, error } = await findIdirUser(email);
@@ -43,28 +45,24 @@ const AddAdmin: FC<AddAdminProps> = ({ show, onHide }) => {
     }
   };
 
-  const addAdmin = async () => {
-    setLoading(true);
-    const addParams = {
-      idirUsername: userObject?.idirUsername,
-    };
-    try {
-      const response = await fetch(`/admin/add-admin`, {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify(addParams),
-      });
-      const resJson = await response.json();
-      if (!resJson.error) {
-        onHide();
-      } else {
-        setError(resJson.error);
+  const addAdminHandler = async () => {
+    if (userObject) {
+      setShowError(false);
+      setLoading(true);
+      try {
+        const response = await addAdmin(userObject.idirUsername);
+        if (!response.error || response.error === '') {
+          refreshTable();
+          onHide();
+        } else {
+          setError(response.error);
+        }
+      } catch (err) {
+        console.log(err);
+        setError('An error occurred while adding an administrator.');
+      } finally {
+        setLoading(false);
       }
-    } catch (err) {
-      console.log(err);
-      setError('An error occurred while adding an administrator.');
-    } finally {
-      setLoading(false);
     }
   };
 
@@ -152,7 +150,7 @@ const AddAdmin: FC<AddAdminProps> = ({ show, onHide }) => {
           Cancel
         </Button>
 
-        <Button variant="primary" onClick={addAdmin} disabled={loading || !userObject}>
+        <Button variant="primary" onClick={addAdminHandler} disabled={loading || !userObject}>
           {loading ? (
             <Spinner as="span" animation="border" size="sm" role="status" aria-hidden="true" />
           ) : (

diff --git a/frontend/src/app/components/modal/manage-admins/RemoveAdmin.tsx b/frontend/src/app/components/modal/manage-admins/RemoveAdmin.tsx
@@ -10,21 +10,23 @@ type RemoveAdminProps = {
   admin: AdminData;
   show: boolean;
   onHide: () => void;
+  refreshTable: () => void;
 };
 
-const RemoveAdmin: FC<RemoveAdminProps> = ({ admin, show, onHide }) => {
+const RemoveAdmin: FC<RemoveAdminProps> = ({ admin, show, onHide, refreshTable }) => {
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState('');
   const [showError, setShowError] = useState(false);
 
   const removeHandler = async () => {
     setLoading(true);
     try {
-      const { message } = await removeAdmin(admin.idirUsername);
-      if (message === 'success') {
+      const response = await removeAdmin(admin.idirUsername);
+      if (!response.error) {
+        refreshTable();
         onHide();
       } else {
-        setError(message);
+        setError(response.error);
         setShowError(true);
       }
     } catch (error) {

diff --git a/frontend/src/app/components/table/manage-admins/AdminDataTable.tsx b/frontend/src/app/components/table/manage-admins/AdminDataTable.tsx
@@ -14,9 +14,10 @@ export type AdminData = {
 interface AdminDataTableProps {
   searchTerm: string;
   removeAdminModalHandler: (admin: AdminData) => void;
+  refreshTable: number;
 }
 
-const AdminDataTable: React.FC<AdminDataTableProps> = ({ searchTerm, removeAdminModalHandler }) => {
+const AdminDataTable: React.FC<AdminDataTableProps> = ({ searchTerm, removeAdminModalHandler, refreshTable }) => {
   const [adminData, setAdminData] = useState<AdminData[]>([]);
   const [filteredAdminData, setFilteredAdminData] = useState<AdminData[]>([]);
 
@@ -31,7 +32,7 @@ const AdminDataTable: React.FC<AdminDataTableProps> = ({ searchTerm, removeAdmin
     };
 
     fetchData();
-  }, []);
+  }, [refreshTable]);
 
   useEffect(() => {
     const filterData = () => {

diff --git a/frontend/src/app/content/pages/AdminPage.tsx b/frontend/src/app/content/pages/AdminPage.tsx
@@ -1,18 +1,15 @@
 import { FC, useState } from 'react';
-// import { REPORT_TYPES } from '../../util/constants';
 import AddAdmin from '../../components/modal/manage-admins/AddAdmin';
 import RemoveAdmin from '../../components/modal/manage-admins/RemoveAdmin';
-// import { useNavigate } from 'react-router-dom';
 import { exportUsers } from '../../common/manage-admins';
 import AdminDataTable, { AdminData } from '../../components/table/manage-admins/AdminDataTable';
 
 const AdminPage: FC = () => {
-  // const navigate = useNavigate();
   const [selectedAdmin, setSelectedAdmin] = useState<AdminData | null>(null);
   const [showAddAdminModal, setShowAddAdminModal] = useState(false);
   const [showRemoveAdminModal, setShowRemoveAdminModal] = useState(false);
-  // const [selectedReport, setSelectedReport] = useState('0');
   const [searchTerm, setSearchTerm] = useState('');
+  const [refreshTable, setRefreshTable] = useState(0);
 
   const showAddAdminModalHandler = (e: React.MouseEvent<HTMLButtonElement>) => {
     e.preventDefault();
@@ -29,23 +26,19 @@ const AdminPage: FC = () => {
     setShowRemoveAdminModal(false);
   };
 
-  // const selectedReportHandler = (event: React.ChangeEvent<HTMLSelectElement>) => {
-  //   setSelectedReport(event.target.value);
-  // };
-
   const exportUserListHandler = async (event: React.MouseEvent<HTMLButtonElement>) => {
     event.preventDefault();
     await exportUsers();
   };
 
-  // const manageReportsHandler = () => {
-  //   navigate(`/manage-templates/${selectedReport}`);
-  // };
-
   const handleSearchChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     setSearchTerm(e.target.value);
   };
 
+  const refreshTableHandler = () => {
+    setRefreshTable((prev) => prev + 1);
+  };
+
   return (
     <>
       <h1>Manage Administrators</h1>
@@ -64,7 +57,11 @@ const AdminPage: FC = () => {
 
       <div className="form-group row">
         <div className="col-md-12">
-          <AdminDataTable searchTerm={searchTerm} removeAdminModalHandler={showRemoveAdminModalHandler} />
+          <AdminDataTable
+            searchTerm={searchTerm}
+            removeAdminModalHandler={showRemoveAdminModalHandler}
+            refreshTable={refreshTable}
+          />
         </div>
       </div>
       <div className="form-group row">
@@ -85,43 +82,17 @@ const AdminPage: FC = () => {
           </button>
         </div>
       </div>
-      {/* <hr />
-      <div className="col-md-3">
-        <h3>Manage Templates</h3>
-      </div>
-      <div className="col-md-3">
-        <h4>Select a Template:</h4>
-      </div>
-      <div className="form-group row">
-        <div className="col-md-4">
-          <select
-            id="reportTypes"
-            style={{ minWidth: '200px' }}
-            className="border border-1 rounded pl-2 ml-4"
-            value={selectedReport}
-            onChange={selectedReportHandler}
-          >
-            {REPORT_TYPES.map((report) => (
-              <option key={report.reportIndex} value={report.reportIndex}>
-                {report.reportType}
-              </option>
-            ))}
-          </select>
-        </div>
-        <div className="col-md-3">
-          <button
-            id="manageButton"
-            className="btn"
-            onClick={manageReportsHandler}
-            style={{ backgroundColor: 'purple', color: 'white' }}
-          >
-            Manage
-          </button>
-        </div>
-      </div> */}
-      {showAddAdminModal && <AddAdmin show={showAddAdminModal} onHide={closeAddAdminModalHandler} />}
+
+      {showAddAdminModal && (
+        <AddAdmin show={showAddAdminModal} onHide={closeAddAdminModalHandler} refreshTable={refreshTableHandler} />
+      )}
       {selectedAdmin && showRemoveAdminModal && (
-        <RemoveAdmin admin={selectedAdmin} show={showRemoveAdminModal} onHide={closeRemoveAdminModalHandler} />
+        <RemoveAdmin
+          admin={selectedAdmin}
+          show={showRemoveAdminModal}
+          onHide={closeRemoveAdminModalHandler}
+          refreshTable={refreshTableHandler}
+        />
       )}
     </>
   );

diff --git a/frontend/src/app/types/types.ts b/frontend/src/app/types/types.ts
@@ -373,3 +373,11 @@ export type VariableData = {
   update_timestamp: string;
   provision: Provision;
 };
+
+export type UserObject = {
+  name: string;
+  username: string;
+  email: string;
+  remove: string;
+  idirUsername: string;
+};