Merge branch 'feature/new-user-type-change' of github.com:ONLYOFFICE/DocSpace into feature/new-user-type-change

packages/client/src/components/GlobalEvents/ChangeUserTypeEvent.js

@@ -12,8 +12,6 @@ const ChangeUserTypeEvent = ({
   peopleFilter,
   updateUserType,
   getUsersList,
-  setOperationRunning,
-  operationRunning,
 }) => {
   const { t } = useTranslation(["ChangeUserTypeDialog", "Common"]);
 
@@ -26,14 +24,11 @@ const ChangeUserTypeEvent = ({
   }, [peopleDialogData]);
 
   const onChangeUserType = async () => {
-    setOperationRunning(true);
+    onClose();
     updateUserType(toType, userIDs, peopleFilter, fromType)
       .then(() => toastr.success(t("SuccessChangeUserType")))
       .catch((err) => toastr.error(err))
-      .finally(() => {
-        setOperationRunning(false);
-        onClose();
-      });
+      .finally(() => callback && callback(false));
   };
 
   const onClose = () => {
@@ -41,10 +36,8 @@ const ChangeUserTypeEvent = ({
   };
 
   const onCloseAction = async () => {
-    if (!isRequestRunning) {
-      await getUsersList(peopleFilter);
-      onClose();
-    }
+    await getUsersList(peopleFilter);
+    onClose();
   };
 
   const getType = (type) => {
@@ -59,7 +52,7 @@ const ChangeUserTypeEvent = ({
     }
   };
 
-  const { toType, fromType, userIDs } = peopleDialogData;
+  const { toType, fromType, userIDs, callback } = peopleDialogData;
 
   const firstType =
     fromType.length === 1 && fromType[0] ? getType(fromType[0]) : null;
@@ -72,7 +65,6 @@ const ChangeUserTypeEvent = ({
       secondType={secondType}
       onCloseAction={onCloseAction}
       onChangeUserType={onChangeUserType}
-      isRequestRunning={operationRunning}
     />
   );
 };
@@ -87,12 +79,7 @@ export default inject(({ dialogsStore, peopleStore }) => {
 
   const { data: peopleDialogData } = dialogStore;
   const { filter: peopleFilter } = filterStore;
-  const {
-    updateUserType,
-    getUsersList,
-    operationRunning,
-    setOperationRunning,
-  } = usersStore;
+  const { updateUserType, getUsersList } = usersStore;
 
   return {
     visible,
@@ -101,7 +88,5 @@ export default inject(({ dialogsStore, peopleStore }) => {
     peopleFilter,
     updateUserType,
     getUsersList,
-    operationRunning,
-    setOperationRunning,
   };
 })(observer(ChangeUserTypeEvent));

packages/client/src/pages/Home/InfoPanel/Body/views/Accounts/index.js

@@ -18,9 +18,9 @@ const Accounts = ({
   isAdmin,
   changeUserType,
   canChangeUserType,
-  loading,
 }) => {
   const [statusLabel, setStatusLabel] = React.useState("");
+  const [isLoading, setIsLoading] = React.useState(false);
 
   const { role, id, isVisitor } = selection;
 
@@ -91,7 +91,8 @@ const Accounts = ({
 
   const onTypeChange = React.useCallback(
     ({ action }) => {
-      changeUserType(action, [selection], t, false);
+      setIsLoading(true);
+      changeUserType(action, [selection], setIsLoading);
     },
     [selection, changeUserType, t]
   );
@@ -115,7 +116,7 @@ const Accounts = ({
         displaySelectedOption
         modernView
         manualWidth={"fit-content"}
-        isLoading={loading}
+        isLoading={isLoading}
       />
     );
 

packages/client/src/pages/Home/InfoPanel/Body/views/Members/User.js

@@ -19,6 +19,7 @@ const User = ({
   if (!user.displayName && !user.email) return null;
 
   const [userIsRemoved, setUserIsRemoved] = useState(false);
+  const [isLoading, setIsLoading] = useState(false);
   if (userIsRemoved) return null;
 
   const canChangeUserRole = user.canEditAccess;
@@ -41,15 +42,15 @@ const User = ({
         ? "manager"
         : "user";
 
-    changeUserType(userType, [user]);
+    setIsLoading(true);
 
-    //TODO: add loader
+    changeUserType(userType, [user]);
 
     updateRoomMemberRole(selectionParentRoom.id, {
       invitations: [{ id: user.id, access: option.access }],
       notify: false,
       sharingMessage: "",
-    });
+    }).then(() => setIsLoading(false));
 
     const inRoomMembers = selectionParentRoom.members.inRoom;
     const expectedMembers = selectionParentRoom.members.expected;
@@ -110,6 +111,7 @@ const User = ({
               modernView
               title={t("Common:Role")}
               manualWidth={"fit-content"}
+              isLoading={isLoading}
             />
           ) : (
             <div className="disabled-role-combobox" title={t("Common:Role")}>

packages/client/src/store/PeopleStore.js

@@ -117,7 +117,7 @@ class PeopleStore {
     this.changeType(action, getUsersToMakeEmployees);
   };
 
-  changeType = (type, users) => {
+  changeType = (type, users, callback) => {
     const { setDialogData } = this.dialogStore;
     const event = new Event(Events.CHANGE_USER_TYPE);
 
@@ -140,7 +140,7 @@ class PeopleStore {
         return user?.id ? user.id : user;
       });
 
-    setDialogData({ toType: type, fromType, userIDs });
+    setDialogData({ toType: type, fromType, userIDs, callback });
 
     window.dispatchEvent(event);
   };