update UI bug when org admin add/delete/update user (#5286)

Co-authored-by: lian <lian@seafile.com>

frontend/src/pages/org-admin/org-user-item.js

@@ -76,28 +76,12 @@ class UserItem extends React.Component {
     this.props.toggleRevokeAdmin(email);
   }
 
-  changeStatus = (st) => {
-    let isActive;
-    if (st == 'active') {
-      isActive = 'true';
-    } else {
-      isActive = 'false';
+  changeStatus = (value) => {
+    const isActive = value == 'active';
+    if (isActive) {
+      toaster.notify(gettext('It may take some time, please wait.'));
     }
-
-    seafileAPI.orgAdminChangeOrgUserStatus(orgID, this.props.user.email, isActive).then(res => {
-      this.setState({
-        currentStatus: isActive == 'true' ? 'active' : 'inactive',
-        highlight: false,
-        showMenu: false,
-      });
-      toaster.success(gettext('Edit succeeded.'));
-    }).catch(error => {
-      let errMessage = Utils.getErrorMsg(error);
-      if (errMessage === gettext('Error')) {
-        errMessage = gettext('Edit failed.');
-      }
-      toaster.danger(errMessage);
-    });
+    this.props.changeStatus(this.props.user.email, isActive);
   }
 
   onDropdownToggleClick = (e) => {
@@ -147,7 +131,7 @@ class UserItem extends React.Component {
           <UserStatusEditor
             isTextMode={true}
             isEditIconShow={isEditIconShow}
-            currentStatus={this.state.currentStatus}
+            currentStatus={user.is_active ? 'active' : 'inactive'}
             statusArray={this.statusArray}
             onStatusChanged={this.changeStatus}
           />

frontend/src/pages/org-admin/org-users-list.js

@@ -6,6 +6,7 @@ import UserItem from './org-user-item';
 const propTypes = {
   initOrgUsersData: PropTypes.func.isRequired,
   toggleDelete: PropTypes.func.isRequired,
+  changeStatus: PropTypes.func.isRequired,
   orgUsers: PropTypes.array.isRequired,
   page: PropTypes.number.isRequired,
   pageNext: PropTypes.bool.isRequired,
@@ -79,6 +80,7 @@ class OrgUsersList extends React.Component {
                   currentTab="users"
                   isItemFreezed={this.state.isItemFreezed}
                   toggleDelete={this.props.toggleDelete}
+                  changeStatus={this.props.changeStatus}
                   onFreezedItem={this.onFreezedItem}
                   onUnfreezedItem={this.onUnfreezedItem}
                 />

frontend/src/pages/org-admin/org-users-users.js

@@ -166,6 +166,22 @@ class OrgUsers extends Component {
     });
   }
 
+  changeStatus= (email, isActive) => {
+    seafileAPI.orgAdminChangeOrgUserStatus(orgID, email, isActive).then(res => {
+      let users = this.state.orgUsers.map(item => {
+        if (item.email == email) {
+          item['is_active']= res.data['is_active'];
+        }
+        return item;
+      });
+      this.setState({orgUsers: users});
+      toaster.success(gettext('Edit succeeded.'));
+    }).catch(error => {
+      let errMessage = Utils.getErrorMsg(error);
+      toaster.danger(errMessage);
+    });
+  }
+
   searchItems = (keyword) => {
     navigate(`${siteRoot}org/useradmin/search-users/?query=${encodeURIComponent(keyword)}`);
   }
@@ -210,6 +226,7 @@ class OrgUsers extends Component {
             <OrgUsersList
               initOrgUsersData={this.initOrgUsersData}
               toggleDelete={this.toggleOrgUsersDelete}
+              changeStatus={this.changeStatus}
               orgUsers={this.state.orgUsers}
               page={this.state.page}
               pageNext={this.state.pageNext}

seahub/organizations/api/admin/users.py

@@ -289,6 +289,9 @@ class OrgAdminUsers(APIView):
             logger.error(e)
             user_info['quota'] = -1
 
+        user_info['quota_usage'] = user_info['self_usage']
+        user_info['quota_total'] = user_info['quota']
+
         return Response(user_info)