diff --git a/packages/client/src/components/Article/MainButton/index.js b/packages/client/src/components/Article/MainButton/index.js index c17ccad13e..ae99b0bd12 100644 --- a/packages/client/src/components/Article/MainButton/index.js +++ b/packages/client/src/components/Article/MainButton/index.js @@ -11,7 +11,7 @@ import { encryptionUploadDialog } from "../../../helpers/desktop"; import { withRouter } from "react-router"; import MobileView from "./MobileView"; -import { combineUrl } from "@docspace/common/utils"; +import { combineUrl, isAdmin } from "@docspace/common/utils"; import config from "PACKAGE_FILE"; import withLoader from "../../../HOCs/withLoader"; import { Events } from "@docspace/common/constants"; @@ -87,6 +87,9 @@ const ArticleMainButtonContent = (props) => { enablePlugins, currentColorScheme, + + isOwner, + isAdmin, } = props; const isAccountsPage = selectedTreeNode[0] === "accounts"; @@ -177,6 +180,8 @@ const ArticleMainButtonContent = (props) => { React.useEffect(() => { if (isRoomsFolder) return; + console.log(isOwner, isAdmin); + const folderUpload = !isMobile ? [ { @@ -228,7 +233,7 @@ const ArticleMainButtonContent = (props) => { const actions = isAccountsPage ? [ - { + isOwner && { id: "main-button_administrator", className: "main-button_drop-down", icon: "/static/images/person.admin.react.svg", @@ -237,7 +242,7 @@ const ArticleMainButtonContent = (props) => { action: "administrator", key: "administrator", }, - { + isAdmin && { id: "main-button_manager", className: "main-button_drop-down", icon: "/static/images/person.manager.react.svg", @@ -351,6 +356,8 @@ const ArticleMainButtonContent = (props) => { isAccountsPage, enablePlugins, isRoomsFolder, + isOwner, + isAdmin, onCreate, onCreateRoom, onInvite, @@ -465,6 +472,8 @@ export default inject( const currentFolderId = selectedFolderStore.id; + const { isOwner, isAdmin } = auth.userStore.user; + return { showText: auth.settingsStore.showText, isMobileArticle: auth.settingsStore.isMobileArticle, @@ -493,6 +502,9 @@ export default inject( enablePlugins, currentColorScheme, + + isOwner, + isAdmin, }; } )( diff --git a/packages/client/src/pages/AccountsHome/InfoPanel/Body/SingleItem.js b/packages/client/src/pages/AccountsHome/InfoPanel/Body/SingleItem.js index 2546285e20..4bf54333ab 100644 --- a/packages/client/src/pages/AccountsHome/InfoPanel/Body/SingleItem.js +++ b/packages/client/src/pages/AccountsHome/InfoPanel/Body/SingleItem.js @@ -24,7 +24,7 @@ const SingleItem = ({ const [statusLabel, setStatusLabel] = React.useState(""); const user = selection[0]; - const { role, statusType, options } = user; + const { role, statusType, options, id } = user; React.useEffect(() => { getStatusLabel(); @@ -45,7 +45,7 @@ const SingleItem = ({ const isPending = statusType === "pending"; - const getRoomTypeLabel = React.useCallback((role) => { + const getUserTypeLabel = React.useCallback((role) => { switch (role) { case "owner": return t("Common:Owner"); @@ -84,6 +84,7 @@ const SingleItem = ({ isAdmin && options.push(managerOption); + // TODO: add check on manager type options.push(userOption); return options; @@ -96,7 +97,7 @@ const SingleItem = ({ [user, changeUserType, t] ); - const typeLabel = getRoomTypeLabel(role); + const typeLabel = getUserTypeLabel(role); const getData = () => { const newOptions = options.filter((option) => option !== "details"); @@ -104,6 +105,67 @@ const SingleItem = ({ return getUserContextOptions(t, newOptions, user); }; + const renderTypeData = () => { + const typesOptions = getTypesOptions(); + + const combobox = ( + option.key === role) || {} + } + options={typesOptions} + onSelect={onTypeChange} + scaled={false} + size="content" + displaySelectedOption + modernView + /> + ); + + const text = ( + + {typeLabel} + + ); + + if (userId === id) return text; + + console.log(userId, id); + + switch (role) { + case "owner": + return text; + + case "admin": + case "manager": + if (isOwner) { + return combobox; + } else { + return text; + } + + case "user": + if (isOwner || isAdmin) { + return combobox; + } else { + return text; + } + + default: + return text; + } + }; + + const typeData = renderTypeData(); + return ( <> @@ -150,34 +212,7 @@ const SingleItem = ({ {t("Common:Type")} - {((isOwner && role !== "owner") || - (isAdmin && !isOwner && role !== "admin")) && - statusType !== "disabled" && - userId !== user.id ? ( - option.key === role - )} - options={getTypesOptions()} - onSelect={onTypeChange} - scaled={false} - size="content" - displaySelectedOption - modernView - /> - ) : ( - - {typeLabel} - - )} + {typeData} {t("UserStatus")} diff --git a/packages/client/src/pages/AccountsHome/Section/Body/TableView/TableRow.js b/packages/client/src/pages/AccountsHome/Section/Body/TableView/TableRow.js index 576b142b84..8d2c333dd1 100644 --- a/packages/client/src/pages/AccountsHome/Section/Body/TableView/TableRow.js +++ b/packages/client/src/pages/AccountsHome/Section/Body/TableView/TableRow.js @@ -148,6 +148,7 @@ const PeopleTableRow = (props) => { position, role, rooms, + id, } = item; const isPending = statusType === "pending" || statusType === "disabled"; @@ -187,6 +188,7 @@ const PeopleTableRow = (props) => { isAdmin && options.push(managerOption); + // TODO: add check on manager type options.push(userOption); return options; @@ -217,7 +219,7 @@ const PeopleTableRow = (props) => { return <>{options.map((option) => option)}; }, []); - const getRoomTypeLabel = React.useCallback((role) => { + const getUserTypeLabel = React.useCallback((role) => { switch (role) { case "owner": return t("Common:Owner"); @@ -230,7 +232,7 @@ const PeopleTableRow = (props) => { } }, []); - const typeLabel = getRoomTypeLabel(role); + const typeLabel = getUserTypeLabel(role); const isChecked = checkedProps.checked; @@ -242,6 +244,67 @@ const PeopleTableRow = (props) => { setBufferSelection(item); }, [isSeveralSelection, isChecked, item, setBufferSelection]); + const renderTypeCell = () => { + const typesOptions = getTypesOptions(); + + const combobox = ( + option.key === role) || {} + } + options={typesOptions} + onSelect={onTypeChange} + scaled={false} + size="content" + displaySelectedOption + modernView + /> + ); + + const text = ( + + {typeLabel} + + ); + + if (userId === id) return text; + + switch (role) { + case "owner": + return text; + + case "admin": + case "manager": + if (isOwner) { + return combobox; + } else { + return text; + } + + case "user": + if (isOwner || isAdmin) { + return combobox; + } else { + return text; + } + + default: + return text; + } + }; + + const typeCell = renderTypeCell(); + return ( { - - {((isOwner && role !== "owner") || - (isAdmin && !isOwner && role !== "admin")) && - statusType !== "disabled" && - userId !== item.id ? ( - option.key === role - )} - options={getTypesOptions()} - onSelect={onTypeChange} - scaled={false} - size="content" - displaySelectedOption - modernView - /> - ) : ( - - {typeLabel} - - )} - + {typeCell} {!rooms?.length ? ( { getCheckboxItemLabel, setInfoPanelVisible, isInfoPanelVisible, + isOwner, + isAdmin, } = props; //console.log("SectionHeaderContent render"); @@ -208,7 +210,7 @@ const SectionHeaderContent = (props) => { const getContextOptions = () => { return [ - { + isOwner && { id: "main-button_administrator", className: "main-button_drop-down", icon: "/static/images/person.admin.react.svg", @@ -217,7 +219,7 @@ const SectionHeaderContent = (props) => { "data-action": "administrator", key: "administrator", }, - { + isAdmin && { id: "main-button_manager", className: "main-button_drop-down", icon: "/static/images/person.manager.react.svg", @@ -317,6 +319,8 @@ export default withRouter( isVisible: isInfoPanelVisible, } = auth.infoPanelStore; + const { isOwner, isAdmin } = auth.userStore.user; + const { selectionStore, headerMenuStore, getHeaderMenu } = peopleStore; const { @@ -339,6 +343,8 @@ export default withRouter( getCheckboxItemLabel, setInfoPanelVisible, isInfoPanelVisible, + isOwner, + isAdmin, }; })( withTranslation([ diff --git a/packages/client/src/store/PeopleStore.js b/packages/client/src/store/PeopleStore.js index 9ec5097828..1b03ae9f0a 100644 --- a/packages/client/src/store/PeopleStore.js +++ b/packages/client/src/store/PeopleStore.js @@ -141,8 +141,6 @@ class PeopleStore { hasUsersToDisable, hasUsersToInvite, hasUsersToRemove, - getUsersToRemoveIds, - selection, } = this.selectionStore; const { setActiveDialogVisible, diff --git a/packages/client/src/store/SelectionPeopleStore.js b/packages/client/src/store/SelectionPeopleStore.js index b18e54da94..cb0968c3b4 100644 --- a/packages/client/src/store/SelectionPeopleStore.js +++ b/packages/client/src/store/SelectionPeopleStore.js @@ -126,34 +126,60 @@ class SelectionStore { } get hasUsersToMakeEmployees() { - const isOwner = this.peopleStore.authStore.userStore.user.isOwner; - const users = this.selection.filter((x) => { - return ( - (!x.isOwner && - !x.isAdmin && - x.status !== EmployeeStatus.Disabled && - x.id !== this.peopleStore.authStore.userStore.user.id) || - (x.isAdmin && - isOwner && - x.status !== EmployeeStatus.Disabled && - x.id !== this.peopleStore.authStore.userStore.user.id) - ); - }); + const { id, isOwner, isAdmin } = this.peopleStore.authStore.userStore.user; - return users.length > 0; + if (isOwner) { + const users = this.selection.filter( + (x) => x.status !== EmployeeStatus.Disabled && x.id !== id + ); + + return users.length > 0; + } + + // TODO: add check on manager type + if (isAdmin && !isOwner) { + const users = this.selection.filter( + (x) => + x.status !== EmployeeStatus.Disabled && + x.id !== id && + !x.isAdmin && + !x.isOwner + ); + + return users.length > 0; + } + + return false; } get getUsersToMakeEmployeesIds() { - const users = this.selection.filter((x) => { - return ( - !x.isOwner && - x.status !== EmployeeStatus.Disabled && - x.id !== this.peopleStore.authStore.userStore.user.id + const { id, isOwner, isAdmin } = this.peopleStore.authStore.userStore.user; + + if (isOwner) { + const users = this.selection.filter( + (x) => x.status !== EmployeeStatus.Disabled && x.id !== id ); - }); - return users.map((u) => u.id); + + return users.map((u) => u.id); + } + + // TODO: add check on manager type + if (isAdmin && !isOwner) { + const users = this.selection.filter( + (x) => + x.status !== EmployeeStatus.Disabled && + x.id !== id && + !x.isAdmin && + !x.isOwner + ); + + return users.map((u) => u.id); + } + + return false; } + //TODO: delete this get hasUsersToMakeGuests() { const users = this.selection.filter((x) => { return ( @@ -166,7 +192,7 @@ class SelectionStore { }); return !!users.length; } - + //TODO: delete this get getUsersToMakeGuestsIds() { const users = this.selection.filter((x) => { return ( @@ -181,74 +207,292 @@ class SelectionStore { } get hasUsersToActivate() { + const { id, isOwner, isAdmin } = this.peopleStore.authStore.userStore.user; + + if (isOwner) { + const users = this.selection.filter( + (x) => x.status !== EmployeeStatus.Active && x.id !== id + ); + + return users.length > 0; + } + + if (isAdmin && !isOwner) { + const users = this.selection.filter( + (x) => + x.status !== EmployeeStatus.Active && + x.id !== id && + !x.isAdmin && + !x.isOwner + ); + + return users.length > 0; + } + + // TODO: add check on manager type const users = this.selection.filter( (x) => - !x.isOwner && x.status !== EmployeeStatus.Active && - x.id !== this.peopleStore.authStore.userStore.user.id + x.id !== id && + !x.isAdmin && + !x.isOwner ); - return !!users.length; + + return users.length > 0; } get getUsersToActivateIds() { + const { id, isOwner, isAdmin } = this.peopleStore.authStore.userStore.user; + + if (isOwner) { + const users = this.selection.filter( + (x) => x.status !== EmployeeStatus.Active && x.id !== id + ); + + return users.map((u) => u.id); + } + + if (isAdmin && !isOwner) { + const users = this.selection.filter( + (x) => + x.status !== EmployeeStatus.Active && + x.id !== id && + !x.isAdmin && + !x.isOwner + ); + + return users.map((u) => u.id); + } + + // TODO: add check on manager type const users = this.selection.filter( (x) => - !x.isOwner && x.status !== EmployeeStatus.Active && - x.id !== this.peopleStore.authStore.userStore.user.id + x.id !== id && + !x.isAdmin && + !x.isOwner ); + return users.map((u) => u.id); } get hasUsersToDisable() { + const { id, isOwner, isAdmin } = this.peopleStore.authStore.userStore.user; + + if (isOwner) { + const users = this.selection.filter( + (x) => x.status !== EmployeeStatus.Disabled && x.id !== id + ); + + return users.length > 0; + } + + if (isAdmin && !isOwner) { + const users = this.selection.filter( + (x) => + x.status !== EmployeeStatus.Disabled && + x.id !== id && + !x.isAdmin && + !x.isOwner + ); + + return users.length > 0; + } + + // TODO: add check on manager type const users = this.selection.filter( (x) => - !x.isOwner && x.status !== EmployeeStatus.Disabled && - x.id !== this.peopleStore.authStore.userStore.user.id + x.id !== id && + !x.isAdmin && + !x.isOwner ); - return !!users.length; + + return users.length > 0; } get getUsersToDisableIds() { + const { id, isOwner, isAdmin } = this.peopleStore.authStore.userStore.user; + + if (isOwner) { + const users = this.selection.filter( + (x) => x.status !== EmployeeStatus.Active && x.id !== id + ); + + return users.map((u) => u.id); + } + + if (isAdmin && !isOwner) { + const users = this.selection.filter( + (x) => + x.status !== EmployeeStatus.Active && + x.id !== id && + !x.isAdmin && + !x.isOwner + ); + + return users.map((u) => u.id); + } + + // TODO: add check on manager type const users = this.selection.filter( (x) => - !x.isOwner && - x.status !== EmployeeStatus.Disabled && - x.id !== this.peopleStore.authStore.userStore.user.id + x.status !== EmployeeStatus.Active && + x.id !== id && + !x.isAdmin && + !x.isOwner ); + return users.map((u) => u.id); } get hasUsersToInvite() { + const { id, isOwner, isAdmin } = this.peopleStore.authStore.userStore.user; + + if (isOwner) { + const users = this.selection.filter( + (x) => + x.activationStatus === EmployeeActivationStatus.Pending && + x.status === EmployeeStatus.Active && + x.id !== id + ); + + return users.length > 0; + } + + if (isAdmin && !isOwner) { + const users = this.selection.filter( + (x) => + x.activationStatus === EmployeeActivationStatus.Pending && + x.status === EmployeeStatus.Active && + x.id !== id && + !x.isAdmin && + !x.isOwner + ); + + return users.length > 0; + } + + // TODO: add check on manager type const users = this.selection.filter( (x) => x.activationStatus === EmployeeActivationStatus.Pending && - x.status === EmployeeStatus.Active + x.status === EmployeeStatus.Active && + x.id !== id && + !x.isAdmin && + !x.isOwner ); - return !!users.length; + + return users.length > 0; } get getUsersToInviteIds() { + const { id, isOwner, isAdmin } = this.peopleStore.authStore.userStore.user; + + if (isOwner) { + const users = this.selection.filter( + (x) => + x.activationStatus === EmployeeActivationStatus.Pending && + x.status === EmployeeStatus.Active && + x.id !== id + ); + + return users.map((u) => u.id); + } + + if (isAdmin && !isOwner) { + const users = this.selection.filter( + (x) => + x.activationStatus === EmployeeActivationStatus.Pending && + x.status === EmployeeStatus.Active && + x.id !== id && + !x.isAdmin && + !x.isOwner + ); + + return users.map((u) => u.id); + } + + // TODO: add check on manager type const users = this.selection.filter( (x) => x.activationStatus === EmployeeActivationStatus.Pending && - x.status === EmployeeStatus.Active + x.status === EmployeeStatus.Active && + x.id !== id && + !x.isAdmin && + !x.isOwner ); + return users.map((u) => u.id); } get hasUsersToRemove() { + const { id, isOwner, isAdmin } = this.peopleStore.authStore.userStore.user; + + if (isOwner) { + const users = this.selection.filter( + (x) => x.status === EmployeeStatus.Disabled && x.id !== id + ); + + return users.length > 0; + } + + if (isAdmin && !isOwner) { + const users = this.selection.filter( + (x) => + x.status === EmployeeStatus.Disabled && + x.id !== id && + !x.isAdmin && + !x.isOwner + ); + + return users.length > 0; + } + + // TODO: add check on manager type const users = this.selection.filter( - (x) => x.status === EmployeeStatus.Disabled + (x) => + x.status === EmployeeStatus.Disabled && + x.id !== id && + !x.isAdmin && + !x.isOwner ); - return !!users.length; + + return users.length > 0; } get getUsersToRemoveIds() { + const { id, isOwner, isAdmin } = this.peopleStore.authStore.userStore.user; + + if (isOwner) { + const users = this.selection.filter( + (x) => x.status === EmployeeStatus.Disabled && x.id !== id + ); + + return users.map((u) => u.id); + } + + if (isAdmin && !isOwner) { + const users = this.selection.filter( + (x) => + x.status === EmployeeStatus.Disabled && + x.id !== id && + !x.isAdmin && + !x.isOwner + ); + + return users.map((u) => u.id); + } + + // TODO: add check on manager type const users = this.selection.filter( - (x) => x.status === EmployeeStatus.Disabled + (x) => + x.status === EmployeeStatus.Disabled && + x.id !== id && + !x.isAdmin && + !x.isOwner ); + return users.map((u) => u.id); } }