Merge pull request #10 from UPHRH-platform/delete-user

Delete user feature for super admin

public/css/new.css

@@ -596,3 +596,7 @@ input[type="date"]::-webkit-calendar-picker-indicator {
 .item-container > hr {
     margin-top: 6px;
 }
+
+.modal-title {
+    color: black;
+}

src/components/modal/ConfirmModal.tsx

+
+
+interface ConfirmModalProps {
+    title: string;
+    children: any;
+    onConfirm: () => void;
+    onCancel: () => void;
+}
+
+export const ConfirmModal = ({title, children, onConfirm, onCancel}: ConfirmModalProps) => {
+    return (
+        <>
+        <div className="modal fade show" id="staticBackdrop" data-backdrop="static" data-keyboard="false" aria-labelledby="staticBackdropLabel" style={{display: 'block'}}>
+            <div className="modal-dialog">
+                <div className="modal-content">
+                <div className="modal-header">
+                    <h5 className="modal-title" id="staticBackdropLabel">{title}</h5>
+                </div>
+                <div className="modal-body">
+                    {children}
+                </div>
+                <div className="modal-footer">
+                    <button type="button" className="btn btn-secondary" onClick={onCancel}>No</button>
+                    <button type="button" className="btn btn-primary" onClick={onConfirm}>Yes</button>
+                </div>
+                </div>
+            </div>
+        </div>
+        <div className="modal-backdrop fade show"></div>
+        </>
+    )
+    
+}
+

src/components/modal/index.ts

 export { ModalOne } from "./ModalOne";
 export { ModalTwo } from "./ModalTwo";
 export { InspectionScheduleModal } from "./InspectionScheduleModal";
+export { ConfirmModal } from './ConfirmModal';

src/constants/ApiConstants.ts

@@ -32,6 +32,7 @@ export const APIS = {
     CREATE_OR_UPDATE_USER: "user/createOrUpdate",
     GET_USER_BY_ID: "user/getUserById",
     GET_ALL_USERS: "user/v1/getAllUser",
+    DELETE_USER: "user/admin/deleteUser"
   },
   DASHBOARD: {
     GET_DASHBOARD_CONFIG: "dashboard/getDashboardConfig/SMF/home",

src/helpers/auth.js

+import { APP } from "../constants";
 const Auth = {
   get(item) {
     const user = JSON.parse(localStorage.getItem("user"));
@@ -21,6 +22,15 @@ const Auth = {
       return ''
     }
     return user.roles[0].name;
+  },
+
+  isSuperAdmin() {
+    const userRole = this.getUserRole();
+    if(userRole === APP.ROLE.SUPER_ADMIN) {
+      return true;
+    } else {
+      return false;
+    }
   }
 };
 

src/layouts/reviewer/Users.tsx

@@ -4,9 +4,11 @@ import { Fragment, useEffect, useState } from "react";
 // import { useHistory } from "react-router"
 import { Link } from "react-router-dom";
 import { BtnTwo } from "../../components/buttons";
+import {ConfirmModal } from "../../components/modal";
 import { APP } from "../../constants";
 import Notify from "../../helpers/notify";
 import Util from "../../helpers/util";
+import Helper from "../../helpers/auth";
 import { UserService } from "../../services/user.service";
 
 interface userProps {
@@ -64,6 +66,10 @@ export const Users = ({ data }: userProps) => {
   // let history = useHistory();
   let [users, setUsers] = useState<Iuser[]>([]);
   let [filteredUsers, setFilteredUsers] = useState<Iuser[]>([]);
+  const isSuperAdmin = Helper.isSuperAdmin();
+  let [showConfirmModal, setShowConfirmModal] = useState<boolean>(false);
+  let [userToDelete, setUserToDelete] = useState<Iuser>();
+
 
   const handleSearch = (event: any) => {
     let value = event.target.value.toLowerCase();
@@ -83,7 +89,28 @@ export const Users = ({ data }: userProps) => {
     setFilteredUsers(result);
   };
 
-  useEffect(() => {
+  const deleteUser = () => {
+    UserService.deleteUser(userToDelete?.id).then(
+      (response) => {
+          if (response.statusInfo && response.statusInfo.statusCode === APP.CODE.SUCCESS) {
+              console.log(response.responseData);
+              Notify.success('User deleted successfully!');
+              getAllUsers();
+          } else {
+              Notify.error(response.statusInfo.errorMessage);
+          }
+          setShowConfirmModal(false);
+      },
+      (error) => {
+          error.statusInfo
+              ? Notify.error(error.statusInfo.errorMessage)
+              : Notify.error(error.message);
+          setShowConfirmModal(false);
+      }
+    );
+  }
+
+  const getAllUsers = () => {
     // get users
     UserService.getAllUsers().then(
       (response2) => {
@@ -103,6 +130,10 @@ export const Users = ({ data }: userProps) => {
           : Notify.error(error.message);
       }
     );
+  }
+
+  useEffect(() => {
+    getAllUsers();
      // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
@@ -171,6 +202,16 @@ export const Users = ({ data }: userProps) => {
                     >
                       Edit
                     </Link>
+                    {isSuperAdmin && (
+                     <span 
+                      className="ml-3 text-danger  pointer"  
+                      onClick={
+                        () => {
+                          setUserToDelete(user);
+                          setShowConfirmModal(true);
+                        }
+                      }>Delete</span>
+                    )}
                   </td>
                 </tr>
               ))}
@@ -178,6 +219,16 @@ export const Users = ({ data }: userProps) => {
           </table>
         </div>
       </div>
+      {showConfirmModal && (
+        <ConfirmModal
+          title="Delete User"
+          onConfirm={deleteUser}
+          onCancel={() => {
+            setUserToDelete(undefined);
+            setShowConfirmModal(false)}
+          }
+        > Do you want to delete {userToDelete?.firstName} ?</ConfirmModal>
+      )}
     </Fragment>
   );
 };

src/services/user.service.js

@@ -10,6 +10,7 @@ export const UserService = {
   createOrUpdateUser,
   getUserByID,
   getAllUsers,
+  deleteUser,
 };
 
 function login(username, otp) {
@@ -64,6 +65,17 @@ function createOrUpdateUser(user) {
   );
 }
 
+function deleteUser(userId) {
+  const requestOptions = {
+    method: APP.REQUEST.POST,
+    headers: authHeader(),
+    body: JSON.stringify({id: userId})
+  };
+  return fetch(APIS.BASE_URL + APIS.USER.DELETE_USER, requestOptions).then(
+    handleResponse
+  );
+}
+
 function getUserByID(id) {
   const requestOptions = {
     method: APP.REQUEST.GET,