user deactivation

src/Pages/AllUsers/CreateUserModal.js

@@ -8,7 +8,6 @@ import {
   isEmailValid,
 } from "../../utils";
 import { useContext, useState } from "react";
-import { LockOutlined, MailOutlined, UserOutlined } from "@ant-design/icons";
 
 export default function CreateUserModal({ isModalOpen, setIsModalOpen }) {
   const webSocketContext = useContext(WebSocketContext);

src/Pages/AllUsers/index.js

@@ -62,7 +62,8 @@ export default function AllUsers() {
       hasOnePermission(
         webSocketContext.User.Permissions,
         Constants.PERMISSIONS.ALL_USERS.ACTION.CHANGE_ROLE,
-        Constants.PERMISSIONS.ALL_USERS.ACTION.DELETE_USER
+        Constants.PERMISSIONS.ALL_USERS.ACTION.DELETE_USER,
+        Constants.PERMISSIONS.ALL_USERS.ACTION.DEACTIVATE_USER
       )
     ) {
       items.push({
@@ -161,9 +162,60 @@ export default function AllUsers() {
                   title="Are you sure you want to delete the user?"
                   onConfirm={() => onUserDeletionConfirm(record.key)}
                 >
-                  <Link to="#">Delete user</Link>
+                  <Link to="#">Delete</Link>
                 </Popconfirm>
               )}
+
+            {!webSocketContext.AllUsers.find((user) => user.Id === record.key)
+              .Deactivated
+              ? hasPermission(
+                  webSocketContext.User.Permissions,
+                  Constants.PERMISSIONS.ALL_USERS.ACTION.USER_DEACTIVATION
+                ) &&
+                (webSocketContext.AllRoles.find(
+                  (role) => role.Id === webSocketContext.User.RoleId
+                ).SortingOrder <
+                  webSocketContext.AllRoles.find(
+                    (role) => role.Id === record._roleId
+                  ).SortingOrder ||
+                  webSocketContext.AllRoles.find(
+                    (role) => role.Id === webSocketContext.User.RoleId
+                  ).Master) && (
+                  <Popconfirm
+                    placement="top"
+                    okText="Deactivate user"
+                    title="Are you sure you want to deactivate the user?"
+                    onConfirm={() =>
+                      onUserDeactivationConfirm(record.key, true)
+                    }
+                  >
+                    <Link to="#">Deactivate</Link>
+                  </Popconfirm>
+                )
+              : hasPermission(
+                  webSocketContext.User.Permissions,
+                  Constants.PERMISSIONS.ALL_USERS.ACTION.USER_DEACTIVATION
+                ) &&
+                (webSocketContext.AllRoles.find(
+                  (role) => role.Id === webSocketContext.User.RoleId
+                ).SortingOrder <
+                  webSocketContext.AllRoles.find(
+                    (role) => role.Id === record._roleId
+                  ).SortingOrder ||
+                  webSocketContext.AllRoles.find(
+                    (role) => role.Id === webSocketContext.User.RoleId
+                  ).Master) && (
+                  <Popconfirm
+                    placement="top"
+                    okText="Activate user"
+                    title="Are you sure you want to activate the user?"
+                    onConfirm={() =>
+                      onUserDeactivationConfirm(record.key, false)
+                    }
+                  >
+                    <Link to="#">Activate</Link>
+                  </Popconfirm>
+                )}
           </Space>
         ),
       });
@@ -172,16 +224,23 @@ export default function AllUsers() {
     return items;
   };
 
-  const getTableItems = () => {
+  const activatedUsers = webSocketContext.AllUsers.filter(
+    (user) => user.Deactivated === false
+  );
+  const deactivatedUsers = webSocketContext.AllUsers.filter(
+    (user) => user.Deactivated === true
+  );
+
+  const getTableItems = (users) => {
     let items = [];
 
-    webSocketContext.AllUsers.sort(
+    users.sort(
       (a, b) =>
         webSocketContext.AllRoles.find((r) => r.Id === a.RoleId).SortingOrder -
         webSocketContext.AllRoles.find((r) => r.Id === b.RoleId).SortingOrder
     );
 
-    webSocketContext.AllUsers.forEach((user) => {
+    users.forEach((user) => {
       items.push({
         key: user.Id,
         avatar: (
@@ -238,6 +297,16 @@ export default function AllUsers() {
     );
   };
 
+  const onUserDeactivationConfirm = (userId, deactivate) => {
+    webSocketContext.SendSocketMessage(
+      SentMessagesCommands.AllUsersUserDeactivation,
+      {
+        UserId: userId,
+        Deactivation: deactivate,
+      }
+    );
+  };
+
   return (
     <>
       {notificationContextHolder}
@@ -250,7 +319,7 @@ export default function AllUsers() {
         }}
       >
         <h1 style={{ fontWeight: "bold" }}>
-          All users ({webSocketContext.AllUsers.length})
+          All users ({activatedUsers.length})
         </h1>
         {hasPermission(
           webSocketContext.User.Permissions,
@@ -265,7 +334,26 @@ export default function AllUsers() {
         )}
       </div>
 
-      <Table columns={getTableContent()} dataSource={getTableItems()} />
+      <Table
+        columns={getTableContent()}
+        dataSource={getTableItems(activatedUsers)}
+      />
+
+      {hasPermission(
+        webSocketContext.User.Permissions,
+        Constants.PERMISSIONS.ALL_USERS.ACTION.USER_DEACTIVATION
+      ) &&
+        deactivatedUsers.length > 0 && (
+          <>
+            <h1 style={{ fontWeight: "bold" }}>
+              Deactivated users ({deactivatedUsers.length})
+            </h1>
+            <Table
+              columns={getTableContent()}
+              dataSource={getTableItems(deactivatedUsers)}
+            />
+          </>
+        )}
 
       <CreateUserModal
         isModalOpen={isCreateUserModalOpen}

src/Pages/Login/index.js

@@ -12,9 +12,17 @@ export default function Login() {
   const [password, setPassword] = useState("");
   const [api, contextHolder] = notification.useNotification();
 
-  const showErrorNotification = () => {
+  const showErrorNotification = (errStatus) => {
+    if (errStatus === 401) {
+      api["error"]({
+        message: "Account deactivated",
+        description: "Please contact an administrator",
+      });
+      return;
+    }
+
     api["error"]({
-      message: "Login Failed!",
+      message: "Login failed",
       description: "Please check your username and password!",
     });
   };
@@ -49,10 +57,7 @@ export default function Login() {
         setUserSessionToLocalStorage(data.Session);
         window.location.href = "/";
       })
-      .catch((err) => {
+      .catch((errStatus) => showErrorNotification(errStatus));
-        console.error(err);
-        showErrorNotification();
-      });
   };
 
   return (

src/utils.js

@@ -54,6 +54,7 @@ export const Constants = {
       ACTION: {
         CHANGE_ROLE: "all_users.action.change_role",
         DELETE_USER: "all_users.action.delete_user",
+        USER_DEACTIVATION: "all_users.action.user_deactivation",
       },
     },
     SCANNER: {
@@ -175,6 +176,7 @@ const ReceivedMessagesCommands = {
   ErrorNoPermissions: 25,
   AllUsersNewUserCreated: 26,
   AllUsersUserDeleted: 27,
+  AllUsersUserDeactivation: 28,
 };
 
 // commands sent to the backend server
@@ -192,6 +194,7 @@ export const SentMessagesCommands = {
   AllUsersUpdateUserRole: 11,
   AllUsersCreateNewUser: 12,
   AllUsersDeleteUser: 13,
+  AllUsersUserDeactivation: 14,
 };
 
 export function WebSocketProvider({
@@ -814,6 +817,17 @@ export function WebSocketProvider({
             });
           }
           break;
+        case ReceivedMessagesCommands.AllUsersUserDeactivation:
+          setAllUsers((arr) => {
+            let newArr = [...arr];
+
+            newArr[
+              newArr.findIndex((user) => user.Id === body.UserId)
+            ].Deactivated = body.Deactivated;
+
+            return newArr;
+          });
+          break;
 
         default:
           console.error("unknown command", cmd);