@@ -26,12 +28,12 @@ const ChangeRoomOwner = ({
size="base"
role={""}
isDefaultSource={roomOwner.hasAvatar}
- source={roomOwner.avatarSmall}
- userName={roomOwner.displayName}
+ source={roomOwner.avatarSmall ?? roomOwner.avatar}
+ userName={userName}
/>
- {roomOwner.displayName}
+ {userName}
{roomOwner.id === currentUserId && (
({t("Common:MeLabel")})
diff --git a/packages/client/src/components/dialogs/LeaveRoomDialog/index.js b/packages/client/src/components/dialogs/LeaveRoomDialog/index.js
index 12d1733f01..b963656014 100644
--- a/packages/client/src/components/dialogs/LeaveRoomDialog/index.js
+++ b/packages/client/src/components/dialogs/LeaveRoomDialog/index.js
@@ -1,13 +1,9 @@
-import React, { useEffect, useState } from "react";
-import { useNavigate } from "react-router-dom";
+import { useEffect, useState } from "react";
import ModalDialog from "@docspace/components/modal-dialog";
import Button from "@docspace/components/button";
import Text from "@docspace/components/text";
import { withTranslation } from "react-i18next";
import { inject, observer } from "mobx-react";
-import { ShareAccessRights } from "@docspace/common/constants";
-import toastr from "@docspace/components/toast/toastr";
-import RoomsFilter from "@docspace/common/api/rooms/filter";
const LeaveRoomDialog = (props) => {
const {
@@ -17,19 +13,9 @@ const LeaveRoomDialog = (props) => {
setIsVisible,
setChangeRoomOwnerIsVisible,
isOwner,
- updateRoomMemberRole,
- roomId,
- userId,
- removeFiles,
- isAdmin,
- setSelected,
- isRoot,
- folders,
- setFolders,
+ onLeaveRoomAction,
} = props;
- const navigate = useNavigate();
-
const [isLoading, setIsLoading] = useState(false);
useEffect(() => {
@@ -45,38 +31,15 @@ const LeaveRoomDialog = (props) => {
if (e.keyCode === 13 || e.which === 13) onLeaveRoom();
};
- const onLeaveRoom = () => {
+ const onLeaveRoom = async () => {
if (isOwner) {
setChangeRoomOwnerIsVisible(true);
onClose();
} else {
setIsLoading(true);
- updateRoomMemberRole(roomId, {
- invitations: [{ id: userId, access: ShareAccessRights.None }],
- })
- .then(() => {
- if (!isAdmin) {
- if (!isRoot) {
- const filter = RoomsFilter.getDefault();
- navigate(`rooms/shared/filter?${filter.toUrlParams()}`);
- } else {
- removeFiles(null, [roomId]);
- }
- } else {
- const newFolders = folders;
- const folderIndex = newFolders.findIndex((r) => r.id === roomId);
- newFolders[folderIndex].inRoom = false;
- setFolders(newFolders);
- }
-
- toastr.success(t("Files:YouLeftTheRoom"));
- })
-
- .finally(() => {
- onClose();
- setIsLoading(false);
- setSelected("none");
- });
+ await onLeaveRoomAction(t, isOwner);
+ setIsLoading(false);
+ onClose();
}
};
@@ -118,49 +81,32 @@ const LeaveRoomDialog = (props) => {
};
export default inject(
- ({ auth, dialogsStore, filesStore, selectedFolderStore }) => {
+ ({
+ auth,
+ dialogsStore,
+ filesStore,
+ selectedFolderStore,
+ filesActionsStore,
+ }) => {
const {
leaveRoomDialogVisible: visible,
setLeaveRoomDialogVisible: setIsVisible,
setChangeRoomOwnerIsVisible,
} = dialogsStore;
const { user } = auth.userStore;
- const {
- selection,
- bufferSelection,
- updateRoomMemberRole,
- removeFiles,
- setSelected,
- folders,
- setFolders,
- } = filesStore;
-
- const roomId = selection.length
- ? selection[0].id
- : bufferSelection
- ? bufferSelection.id
- : selectedFolderStore.id;
+ const { selection, bufferSelection } = filesStore;
const selections = selection.length ? selection : [bufferSelection];
const folderItem = selections[0] ? selections[0] : selectedFolderStore;
const isRoomOwner = folderItem?.createdBy?.id === user.id;
- const isRoot = selectedFolderStore.isRootFolder;
return {
visible,
setIsVisible,
setChangeRoomOwnerIsVisible,
isOwner: isRoomOwner,
- updateRoomMemberRole,
- roomId,
- userId: user.id,
- removeFiles,
- isAdmin: user.isOwner || user.isAdmin,
- setSelected,
- isRoot,
- folders,
- setFolders,
+ onLeaveRoomAction: filesActionsStore.onLeaveRoom,
};
}
)(observer(withTranslation(["Common", "Files"])(LeaveRoomDialog)));
diff --git a/packages/client/src/components/panels/ChangeRoomOwnerPanel/index.js b/packages/client/src/components/panels/ChangeRoomOwnerPanel/index.js
index 7bc5c1003a..22f003848e 100644
--- a/packages/client/src/components/panels/ChangeRoomOwnerPanel/index.js
+++ b/packages/client/src/components/panels/ChangeRoomOwnerPanel/index.js
@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from "react";
+import { useState, useEffect } from "react";
import { inject, observer } from "mobx-react";
import styled, { css } from "styled-components";
import Aside from "@docspace/components/aside";
@@ -6,8 +6,7 @@ import Backdrop from "@docspace/components/backdrop";
import PeopleSelector from "@docspace/client/src/components/PeopleSelector";
import { withTranslation } from "react-i18next";
import Filter from "@docspace/common/api/people/filter";
-import { EmployeeType, ShareAccessRights } from "@docspace/common/constants";
-import toastr from "@docspace/components/toast/toastr";
+import { EmployeeType } from "@docspace/common/constants";
import { DeviceType } from "@docspace/common/constants";
import Portal from "@docspace/components/portal";
@@ -43,23 +42,14 @@ const ChangeRoomOwner = (props) => {
visible,
setIsVisible,
showBackButton,
- setRoomOwner,
- roomId,
- setFolder,
- updateRoomMemberRole,
- userId,
- isAdmin,
setRoomParams,
- removeFiles,
- folders,
- setFolders,
currentDeviceType,
roomOwnerId,
- isRootFolder,
- setCreatedBy,
+ changeRoomOwner,
} = props;
const [isLoading, setIsLoading] = useState(false);
+ const [isChecked, setIsChecked] = useState(!showBackButton);
useEffect(() => {
document.addEventListener("keyup", onKeyUp, false);
@@ -74,47 +64,16 @@ const ChangeRoomOwner = (props) => {
if (e.keyCode === 13 || e.which === 13) onChangeRoomOwner();
};
- const onLeaveRoom = () => {
- setIsLoading(true);
- updateRoomMemberRole(roomId, {
- invitations: [{ id: userId, access: ShareAccessRights.None }],
- })
- .then(() => {
- if (!isAdmin) removeFiles(null, [roomId]);
- else {
- const newFolders = folders;
- const folderIndex = newFolders.findIndex((r) => r.id === roomId);
- newFolders[folderIndex].inRoom = false;
- setFolders(newFolders);
- }
- toastr.success(t("Files:LeftAndAppointNewOwner"));
- })
+ const onChangeRoomOwner = async (user) => {
+ if (showBackButton) {
+ setRoomParams && setRoomParams(user[0]);
+ } else {
+ setIsLoading(true);
- .finally(() => {
- onClose();
- setIsLoading(false);
- });
- };
-
- const onChangeRoomOwner = (user, isChecked) => {
- setIsLoading(true);
-
- setRoomOwner(user[0].id, [roomId])
- .then(async (res) => {
- if (isRootFolder) {
- setFolder(res[0]);
- } else {
- setCreatedBy(res[0].createdBy);
- }
-
- if (isChecked) await onLeaveRoom();
- else toastr.success(t("Files:AppointNewOwner"));
- setRoomParams && setRoomParams(res[0].createdBy);
- })
- .finally(() => {
- setIsLoading(false);
- onClose();
- });
+ await changeRoomOwner(t, user[0]?.id, isChecked);
+ setIsLoading(false);
+ }
+ onClose();
};
const onClose = () => {
@@ -150,13 +109,16 @@ const ChangeRoomOwner = (props) => {
{...backClickProp}
onAccept={onChangeRoomOwner}
onCancel={onClose}
- acceptButtonLabel={t("Files:AssignOwner")}
+ acceptButtonLabel={
+ showBackButton ? t("Common:SelectAction") : t("Files:AssignOwner")
+ }
headerLabel={t("Files:ChangeTheRoomOwner")}
filter={filter}
isLoading={isLoading}
withFooterCheckbox={!showBackButton}
footerCheckboxLabel={t("Files:LeaveTheRoom")}
- isChecked={!showBackButton}
+ isChecked={isChecked}
+ setIsChecked={setIsChecked}
withOutCurrentAuthorizedUser
filterUserId={roomOwnerId}
/>
@@ -172,7 +134,13 @@ const ChangeRoomOwner = (props) => {
};
export default inject(
- ({ auth, dialogsStore, filesStore, selectedFolderStore }) => {
+ ({
+ auth,
+ dialogsStore,
+ filesStore,
+ selectedFolderStore,
+ filesActionsStore,
+ }) => {
const {
changeRoomOwnerIsVisible,
setChangeRoomOwnerIsVisible,
@@ -180,17 +148,7 @@ export default inject(
} = dialogsStore;
const { settingsStore } = auth;
- const { user } = auth.userStore;
- const {
- setRoomOwner,
- selection,
- bufferSelection,
- setFolder,
- updateRoomMemberRole,
- removeFiles,
- folders,
- setFolders,
- } = filesStore;
+ const { selection, bufferSelection } = filesStore;
const room = selection.length
? selection[0]
@@ -205,19 +163,9 @@ export default inject(
setIsVisible: setChangeRoomOwnerIsVisible,
showBackButton: changeRoomOwnerData.showBackButton,
setRoomParams: changeRoomOwnerData.setRoomParams,
- setRoomOwner,
- userId: user.id,
- roomId: room.id,
roomOwnerId: room?.createdBy?.id,
- isRootFolder: selectedFolderStore.isRootFolder,
- setCreatedBy: selectedFolderStore.setCreatedBy,
- setFolder,
- updateRoomMemberRole,
- isAdmin: user.isOwner || user.isAdmin,
- removeFiles,
- folders,
- setFolders,
currentDeviceType,
+ changeRoomOwner: filesActionsStore.changeRoomOwner,
};
}
)(observer(withTranslation(["Files"])(ChangeRoomOwner)));
diff --git a/packages/client/src/store/FilesActionsStore.js b/packages/client/src/store/FilesActionsStore.js
index 98c41a550f..68e2c2ba7d 100644
--- a/packages/client/src/store/FilesActionsStore.js
+++ b/packages/client/src/store/FilesActionsStore.js
@@ -30,6 +30,7 @@ import {
FileStatus,
FolderType,
RoomsType,
+ ShareAccessRights,
} from "@docspace/common/constants";
import { makeAutoObservable } from "mobx";
@@ -2417,6 +2418,78 @@ class FilesActionStore {
this.uploadDataStore.itemOperationToFolder(operationData);
};
+
+ onLeaveRoom = (t, isOwner = false) => {
+ const {
+ updateRoomMemberRole,
+ removeFiles,
+ folders,
+ setFolders,
+ selection,
+ bufferSelection,
+ } = this.filesStore;
+ const { user } = this.authStore.userStore;
+
+ const roomId = selection.length
+ ? selection[0].id
+ : bufferSelection
+ ? bufferSelection.id
+ : this.selectedFolderStore.id;
+
+ const isAdmin = user.isOwner || user.isAdmin;
+ const isRoot = this.selectedFolderStore.isRootFolder;
+
+ return updateRoomMemberRole(roomId, {
+ invitations: [{ id: user?.id, access: ShareAccessRights.None }],
+ }).then(() => {
+ if (!isAdmin) {
+ if (!isRoot) {
+ const filter = RoomsFilter.getDefault();
+ window.DocSpace.navigate(
+ `rooms/shared/filter?${filter.toUrlParams()}`
+ );
+ } else {
+ removeFiles(null, [roomId]);
+ }
+ } else {
+ const newFolders = folders;
+ const folderIndex = newFolders.findIndex((r) => r.id === roomId);
+ newFolders[folderIndex].inRoom = false;
+ setFolders(newFolders);
+ }
+
+ isOwner
+ ? toastr.success(t("Files:LeftAndAppointNewOwner"))
+ : toastr.success(t("Files:YouLeftTheRoom"));
+ });
+ };
+
+ changeRoomOwner = (t, userId, isLeaveChecked = false) => {
+ const { setRoomOwner, setFolder, setSelected, selection, bufferSelection } =
+ this.filesStore;
+ const { isRootFolder, setCreatedBy, id } = this.selectedFolderStore;
+
+ const roomId = selection.length
+ ? selection[0].id
+ : bufferSelection
+ ? bufferSelection.id
+ : id;
+
+ return setRoomOwner(userId, [roomId])
+ .then(async (res) => {
+ if (isRootFolder) {
+ setFolder(res[0]);
+ } else {
+ setCreatedBy(res[0].createdBy);
+ }
+
+ if (isLeaveChecked) await this.onLeaveRoom(t);
+ else toastr.success(t("Files:AppointNewOwner"));
+ })
+ .finally(() => {
+ setSelected("none");
+ });
+ };
}
export default FilesActionStore;
diff --git a/packages/components/selector/Selector.types.ts b/packages/components/selector/Selector.types.ts
index 7e9c45e190..45f91ce67a 100644
--- a/packages/components/selector/Selector.types.ts
+++ b/packages/components/selector/Selector.types.ts
@@ -80,4 +80,5 @@ export type SelectorProps = {
acceptButtonId?: string;
cancelButtonId?: string;
isChecked?: boolean;
+ setIsChecked?: any;
};
diff --git a/packages/components/selector/index.tsx b/packages/components/selector/index.tsx
index d159d3f256..506272414b 100644
--- a/packages/components/selector/index.tsx
+++ b/packages/components/selector/index.tsx
@@ -84,6 +84,7 @@ const Selector = ({
acceptButtonId,
cancelButtonId,
isChecked,
+ setIsChecked,
}: SelectorProps) => {
const [footerVisible, setFooterVisible] = React.useState(false);
const [isSearch, setIsSearch] = React.useState(false);
@@ -375,6 +376,7 @@ const Selector = ({
setNewFooterInputValue={setNewFooterInputValue}
isFooterCheckboxChecked={isFooterCheckboxChecked}
setIsFooterCheckboxChecked={setIsFooterCheckboxChecked}
+ setIsChecked={setIsChecked}
disableAcceptButton={
withFooterInput
? disableAcceptButton
diff --git a/packages/components/selector/sub-components/Footer/Footer.types.ts b/packages/components/selector/sub-components/Footer/Footer.types.ts
index 4df785d600..78c529f289 100644
--- a/packages/components/selector/sub-components/Footer/Footer.types.ts
+++ b/packages/components/selector/sub-components/Footer/Footer.types.ts
@@ -22,6 +22,7 @@ export type FooterProps = {
setNewFooterInputValue?: (value: string) => void;
isFooterCheckboxChecked?: boolean;
setIsFooterCheckboxChecked?: any;
+ setIsChecked?: any;
acceptButtonId?: string;
cancelButtonId?: string;
diff --git a/packages/components/selector/sub-components/Footer/index.tsx b/packages/components/selector/sub-components/Footer/index.tsx
index 929ca0daf3..1ef480ef4f 100644
--- a/packages/components/selector/sub-components/Footer/index.tsx
+++ b/packages/components/selector/sub-components/Footer/index.tsx
@@ -36,6 +36,7 @@ const Footer = React.memo(
setNewFooterInputValue,
isFooterCheckboxChecked,
setIsFooterCheckboxChecked,
+ setIsChecked,
acceptButtonId,
cancelButtonId,
}: FooterProps) => {
@@ -50,6 +51,7 @@ const Footer = React.memo(
};
const onChangeCheckbox = () => {
+ setIsChecked && setIsChecked((value: boolean) => !value);
setIsFooterCheckboxChecked &&
setIsFooterCheckboxChecked((value: boolean) => !value);
};