Merge branch 'master' of github.com:ONLYOFFICE/CommunityServer-AspNetCore

products/ASC.People/Client/src/components/pages/Home/Section/Body/index.js

@@ -9,7 +9,12 @@ import {
   EmptyScreenContainer,
   Icons,
   Link,
-  RowContainer
+  RowContainer,
+  ModalDialog,
+  Button,
+  Text,
+  Label,
+  TextInput
 } from "asc-web-components";
 import UserContent from "./userContent";
 import {
@@ -28,8 +33,22 @@ import { isAdmin, isMe } from "../../../../../store/auth/selectors";
 import { EmployeeStatus } from "../../../../../helpers/constants";
 
 class SectionBodyContent extends React.PureComponent {
-  onEmailSentClick = () => {
-    toastr.success("Context action: Send e-mail");
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      newEmail: null,
+      dialog: {
+        visible: false,
+        header: "",
+        body: "",
+        buttons: []
+      }
+    };
+  }
+
+  onEmailSentClick = email => {
+    window.open("mailto:" + email);
   };
 
   onSendMessageClick = () => {
@@ -41,12 +60,89 @@ class SectionBodyContent extends React.PureComponent {
     history.push(`${settings.homepage}/edit/${user.userName}`);
   };
 
-  onChangePasswordClick = () => {
-    toastr.success("Context action: Change password");
+  onChangePasswordClick = email => {
+    this.setState({
+      dialog: {
+        visible: true,
+        header: "Password change",
+        body: (
+          <Text.Body>
+            Send the password change instructions to the{" "}
+            <Link type="page" href={`mailto:${email}`} isHovered title={email}>
+              {email}
+            </Link>{" "}
+            email address
+          </Text.Body>
+        ),
+        buttons: [
+          <Button
+            key="OkBtn"
+            label="Send"
+            primary={true}
+            onClick={() => {
+              toastr.success("Context action: Delete profile");
+              this.onDialogClose();
+            }}
+          />,
+          <Button
+            key="CancelBtn"
+            label="Cancel"
+            primary={false}
+            onClick={this.onDialogClose}
+            style={{ marginLeft: "8px" }}
+          />
+        ]
+      }
+    });
   };
 
-  onChangeEmailClick = () => {
-    toastr.success("Context action: Change e-mail");
+  onChangeEmailClick = email => {
+    this.setState({
+      newEmail: email
+    });
+    this.setState({
+      dialog: {
+        visible: true,
+        header: "Email change",
+        body: (
+          <>
+            <Label htmlFor="new-email" text="Enter a new email address" />
+            <TextInput
+              id="new-email"
+              scale={true}
+              isAutoFocussed={true}
+              value={this.state.newEmail}
+              onChange={e => {
+                this.setState({ newEmail: e.target.value });
+              }}
+            />
+            <Text.Body style={{ marginTop: "16px" }}>
+              The activation instructions will be sent to the entered email
+            </Text.Body>
+          </>
+        ),
+        buttons: [
+          <Button
+            key="OkBtn"
+            label="Send"
+            primary={true}
+            onClick={() => {
+              toastr.success(
+                `Context action: Change e-mail from ${email} to ${this.state.newEmail}`
+              );
+              this.onDialogClose();
+            }}
+          />,
+          <Button
+            key="CancelBtn"
+            label="Cancel"
+            primary={false}
+            onClick={this.onDialogClose}
+            style={{ marginLeft: "8px" }}
+          />
+        ]
+      }
+    });
   };
 
   onDisableClick = user => {
@@ -55,7 +151,7 @@ class SectionBodyContent extends React.PureComponent {
     onLoading(true);
     updateUserStatus(EmployeeStatus.Disabled, [user.id])
       .then(() => toastr.success("SUCCESS Context action: Disable"))
-      .catch((e) => toastr.error("FAILED Context action: Disable", e))
+      .catch(e => toastr.error("FAILED Context action: Disable", e))
       .finally(() => onLoading(false));
   };
 
@@ -65,7 +161,7 @@ class SectionBodyContent extends React.PureComponent {
     onLoading(true);
     updateUserStatus(EmployeeStatus.Active, [user.id])
       .then(() => toastr.success("SUCCESS Context action: Enable"))
-      .catch((e) => toastr.error("FAILED Context action: Enable", e))
+      .catch(e => toastr.error("FAILED Context action: Enable", e))
       .finally(() => onLoading(false));
   };
 
@@ -77,8 +173,94 @@ class SectionBodyContent extends React.PureComponent {
     toastr.success("Context action: Delete personal data");
   };
 
-  onDeleteProfileClick = () => {
-    toastr.success("Context action: Delete profile");
+  onDeleteProfileEverClick = user => {
+    this.setState({
+      dialog: {
+        visible: true,
+        header: "Confirmation",
+        body: (
+          <>
+            <Text.Body>
+              User <b>{user.displayName}</b> will be deleted.
+            </Text.Body>
+            <Text.Body>Note: this action cannot be undone.</Text.Body>
+            <Text.Body color="#c30" fontSize="18" style={{ margin: "20px 0" }}>
+              Warning!
+            </Text.Body>
+            <Text.Body>
+              User personal documents which are available to others will be
+              deleted. To avoid this, you must start the data reassign process
+              before deleting.
+            </Text.Body>
+          </>
+        ),
+        buttons: [
+          <Button
+            key="OkBtn"
+            label="OK"
+            primary={true}
+            onClick={() => {
+              toastr.success("Context action: Delete profile");
+              this.onDialogClose();
+            }}
+          />,
+          <Button
+            key="ReassignBtn"
+            label="Reassign data"
+            primary={true}
+            onClick={() => {
+              toastr.success("Context action: Reassign profile");
+              this.onDialogClose();
+            }}
+            style={{ marginLeft: "8px" }}
+          />,
+          <Button
+            key="CancelBtn"
+            label="Cancel"
+            primary={false}
+            onClick={this.onDialogClose}
+            style={{ marginLeft: "8px" }}
+          />
+        ]
+      }
+    });
+
+    toastr.success("Context action: Delete profile data");
+  };
+
+  onDeleteProfileClick = email => {
+    this.setState({
+      dialog: {
+        visible: true,
+        header: "Delete profile dialog",
+        body: (
+          <Text.Body>
+            Send the profile deletion instructions to the email address{" "}
+            <Link type="page" href={`mailto:${email}`} isHovered title={email}>
+              {email}
+            </Link>
+          </Text.Body>
+        ),
+        buttons: [
+          <Button
+            key="OkBtn"
+            label="Send"
+            primary={true}
+            onClick={() => {
+              toastr.success("Context action: Delete profile");
+              this.onDialogClose();
+            }}
+          />,
+          <Button
+            key="CancelBtn"
+            label="Cancel"
+            primary={false}
+            onClick={this.onDialogClose}
+            style={{ marginLeft: "8px" }}
+          />
+        ]
+      }
+    });
   };
 
   onInviteAgainClick = () => {
@@ -88,7 +270,10 @@ class SectionBodyContent extends React.PureComponent {
     let status = "";
     const { t } = this.props;
 
-    if (isAdmin(viewer) || (!isAdmin(viewer) && isMe(user, viewer.userName))) {
+    const isViewerAdmin = isAdmin(viewer);
+    const isSelf = isMe(user, viewer.userName);
+
+    if (isViewerAdmin || (!isViewerAdmin && isSelf)) {
       status = getUserStatus(user);
     }
 
@@ -101,14 +286,14 @@ class SectionBodyContent extends React.PureComponent {
           {
             key: "send-email",
             label: t("LblSendEmail"),
-            onClick: this.onEmailSentClick
+            onClick: this.onEmailSentClick.bind(this, user.email)
           },
           {
             key: "send-message",
             label: t("LblSendMessage"),
             onClick: this.onSendMessageClick
           },
-          { key: "key3", isSeparator: true },
+          { key: "separator", isSeparator: true },
           {
             key: "edit",
             label: t("EditButton"),
@@ -117,18 +302,24 @@ class SectionBodyContent extends React.PureComponent {
           {
             key: "change-password",
             label: t("PasswordChangeButton"),
-            onClick: this.onChangePasswordClick
+            onClick: this.onChangePasswordClick.bind(this, user.email)
           },
           {
             key: "change-email",
             label: t("EmailChangeButton"),
-            onClick: this.onChangeEmailClick
+            onClick: this.onChangeEmailClick.bind(this, user.email)
           },
-          {
-            key: "disable",
-            label: t("DisableUserButton"),
-            onClick: this.onDisableClick.bind(this, user)
-          }
+          isSelf
+            ? {
+                key: "delete-profile",
+                label: t("PeopleResource:LblDeleteProfile"),
+                onClick: this.onDeleteProfileClick.bind(this, user.email)
+              }
+            : {
+                key: "disable",
+                label: t("DisableUserButton"),
+                onClick: this.onDisableClick.bind(this, user)
+              }
         ];
       case "disabled":
         return [
@@ -150,7 +341,7 @@ class SectionBodyContent extends React.PureComponent {
           {
             key: "delete-profile",
             label: t("DeleteSelfProfile"),
-            onClick: this.onDeleteProfileClick
+            onClick: this.onDeleteProfileEverClick.bind(this, user)
           }
         ];
       case "pending":
@@ -165,20 +356,22 @@ class SectionBodyContent extends React.PureComponent {
             label: t("LblInviteAgain"),
             onClick: this.onInviteAgainClick
           },
-          user.status === EmployeeStatus.Active 
-          ? {
-            key: "disable",
-            label: t("DisableUserButton"),
-            onClick: this.onDisableClick.bind(this, user)
-          } : {
-            key: "enable",
-            label: t("EnableUserButton"),
-            onClick: this.onEnableClick.bind(this, user)
-          },
-          {
+          !isSelf &&
+            (user.status === EmployeeStatus.Active
+              ? {
+                  key: "disable",
+                  label: t("DisableUserButton"),
+                  onClick: this.onDisableClick.bind(this, user)
+                }
+              : {
+                  key: "enable",
+                  label: t("EnableUserButton"),
+                  onClick: this.onEnableClick.bind(this, user)
+                }),
+          isSelf && {
             key: "delete-profile",
             label: t("DeleteSelfProfile"),
-            onClick: this.onDeleteProfileClick
+            onClick: this.onDeleteProfileClick.bind(this, user.email)
           }
         ];
       default:
@@ -201,36 +394,61 @@ class SectionBodyContent extends React.PureComponent {
     resetFilter().finally(() => onLoading(false));
   };
 
+  onDialogClose = () => {
+    this.setState({ dialog: { visible: false } });
+  };
+
   render() {
     console.log("Home SectionBodyContent render()");
     const { users, viewer, selection, history, settings, t } = this.props;
+    const { dialog } = this.state;
 
     return users.length > 0 ? (
-      <RowContainer>
-        {users.map(user => {
-          const contextOptions = this.getUserContextOptions(user, viewer);
-          const contextOptionsProps = !contextOptions.length
-            ? {}
-            : { contextOptions };
-          const checked = isUserSelected(selection, user.id);
-          const checkedProps = isAdmin(viewer) ? { checked } : {};
-          const element = <Avatar size='small' role={getUserRole(user)} userName={user.displayName} source={user.avatar} />;
-      
-          return (
-            <Row
-              key={user.id}
-              status={getUserStatus(user)}
-              data={user}
-              element={element}
-              onSelect={this.onContentRowSelect}
-              {...checkedProps}
-              {...contextOptionsProps}
-            >
-              <UserContent user={user} history={history} settings={settings} />
-            </Row>
-          );
-        })}
-      </RowContainer>
+      <>
+        <RowContainer>
+          {users.map(user => {
+            const contextOptions = this.getUserContextOptions(user, viewer);
+            const contextOptionsProps = !contextOptions.length
+              ? {}
+              : { contextOptions };
+            const checked = isUserSelected(selection, user.id);
+            const checkedProps = isAdmin(viewer) ? { checked } : {};
+            const element = (
+              <Avatar
+                size="small"
+                role={getUserRole(user)}
+                userName={user.displayName}
+                source={user.avatar}
+              />
+            );
+
+            return (
+              <Row
+                key={user.id}
+                status={getUserStatus(user)}
+                data={user}
+                element={element}
+                onSelect={this.onContentRowSelect}
+                {...checkedProps}
+                {...contextOptionsProps}
+              >
+                <UserContent
+                  user={user}
+                  history={history}
+                  settings={settings}
+                />
+              </Row>
+            );
+          })}
+        </RowContainer>
+        <ModalDialog
+          visible={dialog.visible}
+          headerContent={dialog.header}
+          bodyContent={dialog.body}
+          footerContent={dialog.buttons}
+          onClose={this.onDialogClose}
+        />
+      </>
     ) : (
       <EmptyScreenContainer
         imageSrc="images/empty_screen_filter.png"

products/ASC.People/Client/src/helpers/constants.js

@@ -21,7 +21,7 @@ export const EmployeeStatus = Object.freeze({
   });
 
 /**
- * Enum for employee status.
+ * Enum for employee type.
  * @readonly
  */
 export const EmployeeType = Object.freeze({