web: People: Added opportunity to Enable/Disable group of users
This commit is contained in:
parent
6b773c6821
commit
efa7dbd1d4
@ -1,75 +1,33 @@
|
||||
import React from 'react';
|
||||
import React, { useCallback } from 'react';
|
||||
import { GroupButtonsMenu, DropDownItem, Text, toastr, ContextMenuButton } from 'asc-web-components';
|
||||
import { connect } from 'react-redux';
|
||||
import { getSelectedGroup } from '../../../../../store/people/selectors';
|
||||
import { getSelectedGroup, getSelectionIds } from '../../../../../store/people/selectors';
|
||||
import { isAdmin } from '../../../../../store/auth/selectors';
|
||||
import { withTranslation } from 'react-i18next';
|
||||
import { updateUserStatus } from '../../../../../store/people/actions';
|
||||
import { EmployeeStatus } from '../../../../../helpers/constants';
|
||||
|
||||
const getPeopleItems = (onSelect, t) => [
|
||||
const contextOptions = () => {
|
||||
return [
|
||||
{
|
||||
label: "Select",
|
||||
isDropdown: true,
|
||||
isSeparator: true,
|
||||
isSelect: true,
|
||||
fontWeight: "bold",
|
||||
children: [
|
||||
<DropDownItem key="active" label="Active" />,
|
||||
<DropDownItem key="disabled" label="Disabled" />,
|
||||
<DropDownItem key="invited" label="Invited" />
|
||||
],
|
||||
onSelect: (item) => onSelect(item.key)
|
||||
key: "edit-group",
|
||||
label: "Edit",
|
||||
onClick: toastr.success.bind(this, "Edit group action")
|
||||
},
|
||||
{
|
||||
label: "Make employee",
|
||||
onClick: toastr.success.bind(this, "Make employee action")
|
||||
},
|
||||
{
|
||||
label: "Make guest",
|
||||
onClick: toastr.success.bind(this, "Make guest action")
|
||||
},
|
||||
{
|
||||
label: "Set active",
|
||||
onClick: toastr.success.bind(this, "Set active action")
|
||||
},
|
||||
{
|
||||
label: "Set disabled",
|
||||
onClick: toastr.success.bind(this, "Set disabled action")
|
||||
},
|
||||
{
|
||||
label: "Invite again",
|
||||
onClick: toastr.success.bind(this, "Invite again action")
|
||||
},
|
||||
{
|
||||
label: "Send e-mail",
|
||||
onClick: toastr.success.bind(this, "Send e-mail action")
|
||||
},
|
||||
{
|
||||
label: t('PeopleResource:DeleteButton'),
|
||||
onClick: toastr.success.bind(this, "Delete action")
|
||||
key: "delete-group",
|
||||
label: "Delete",
|
||||
onClick: toastr.success.bind(this, "Delete group action")
|
||||
}
|
||||
];
|
||||
};
|
||||
|
||||
const contextOptions = () => {
|
||||
return [
|
||||
{
|
||||
key: "edit-group",
|
||||
label: "Edit",
|
||||
onClick: toastr.success.bind(this, "Edit group action")
|
||||
},
|
||||
{
|
||||
key: "delete-group",
|
||||
label: "Delete",
|
||||
onClick: toastr.success.bind(this, "Delete group action")
|
||||
}
|
||||
];
|
||||
};
|
||||
const wrapperStyle = {
|
||||
display: "flex",
|
||||
alignItems: "center"
|
||||
};
|
||||
|
||||
const wrapperStyle = {
|
||||
display: "flex",
|
||||
alignItems: "center"
|
||||
};
|
||||
|
||||
const SectionHeaderContent = React.memo(({
|
||||
const SectionHeaderContent = ({
|
||||
isHeaderVisible,
|
||||
isHeaderIndeterminate,
|
||||
isHeaderChecked,
|
||||
@ -78,10 +36,74 @@ const SectionHeaderContent = React.memo(({
|
||||
onClose,
|
||||
group,
|
||||
isAdmin,
|
||||
t
|
||||
t,
|
||||
selection,
|
||||
updateUserStatus
|
||||
}) => {
|
||||
console.log("SectionHeaderContent render");
|
||||
const menuItems = getPeopleItems(onSelect, t);
|
||||
const selectedUserIds = getSelectionIds(selection);
|
||||
console.log("SectionHeaderContent render", selection, selectedUserIds);
|
||||
|
||||
const onSetActive = useCallback(() => {
|
||||
updateUserStatus(EmployeeStatus.Active, selectedUserIds);
|
||||
toastr.success("Set active action");
|
||||
}, [selectedUserIds, updateUserStatus]);
|
||||
|
||||
const onSetDisabled = useCallback(() => {
|
||||
updateUserStatus(EmployeeStatus.Disabled, selectedUserIds);
|
||||
toastr.success("Set disabled action");
|
||||
}, [selectedUserIds, updateUserStatus]);
|
||||
|
||||
const menuItems = [
|
||||
{
|
||||
label: "Select",
|
||||
isDropdown: true,
|
||||
isSeparator: true,
|
||||
isSelect: true,
|
||||
fontWeight: "bold",
|
||||
children: [
|
||||
<DropDownItem key="active" label="Active" />,
|
||||
<DropDownItem key="disabled" label="Disabled" />,
|
||||
<DropDownItem key="invited" label="Invited" />
|
||||
],
|
||||
onSelect: (item) => onSelect(item.key)
|
||||
},
|
||||
{
|
||||
label: "Make employee",
|
||||
disabled: !selection.length,
|
||||
onClick: toastr.success.bind(this, "Make employee action")
|
||||
},
|
||||
{
|
||||
label: "Make guest",
|
||||
disabled: !selection.length,
|
||||
onClick: toastr.success.bind(this, "Make guest action")
|
||||
},
|
||||
{
|
||||
label: "Set active",
|
||||
disabled: !selection.length,
|
||||
onClick: onSetActive
|
||||
},
|
||||
{
|
||||
label: "Set disabled",
|
||||
disabled: !selection.length,
|
||||
onClick: onSetDisabled
|
||||
},
|
||||
{
|
||||
label: "Invite again",
|
||||
disabled: !selection.length,
|
||||
onClick: toastr.success.bind(this, "Invite again action")
|
||||
},
|
||||
{
|
||||
label: "Send e-mail",
|
||||
disabled: !selection.length,
|
||||
onClick: toastr.success.bind(this, "Send e-mail action")
|
||||
},
|
||||
{
|
||||
label: t('PeopleResource:DeleteButton'),
|
||||
disabled: !selection.length,
|
||||
onClick: toastr.success.bind(this, "Delete action")
|
||||
}
|
||||
];
|
||||
|
||||
return (
|
||||
isHeaderVisible ? (
|
||||
<div style={{ margin: "0 -16px" }}>
|
||||
@ -94,7 +116,7 @@ const SectionHeaderContent = React.memo(({
|
||||
moreLabel="More"
|
||||
closeTitle="Close"
|
||||
onClose={onClose}
|
||||
selected={getPeopleItems(onSelect, t)[0].label}
|
||||
selected={menuItems[0].label}
|
||||
/>
|
||||
</div>
|
||||
) : (
|
||||
@ -115,13 +137,14 @@ const SectionHeaderContent = React.memo(({
|
||||
: <Text.ContentHeader>People</Text.ContentHeader>
|
||||
)
|
||||
);
|
||||
});
|
||||
};
|
||||
|
||||
const mapStateToProps = (state) => {
|
||||
return {
|
||||
group: getSelectedGroup(state.people.groups, state.people.selectedGroup),
|
||||
selection: state.people.selection,
|
||||
isAdmin: isAdmin(state.auth.user)
|
||||
}
|
||||
}
|
||||
|
||||
export default connect(mapStateToProps)(withTranslation()(SectionHeaderContent));
|
||||
export default connect(mapStateToProps, { updateUserStatus })(withTranslation()(SectionHeaderContent));
|
@ -115,4 +115,8 @@ export function isUserDisabled(user) {
|
||||
|
||||
export function getSelectedGroup(groups, selectedGroupId) {
|
||||
return find(groups, (group) => group.id === selectedGroupId);
|
||||
}
|
||||
|
||||
export function getSelectionIds(selections) {
|
||||
return selections.map((user) => { return user.id });
|
||||
}
|
Loading…
Reference in New Issue
Block a user