Members -> Users

app/scenes/Settings/components/UserMenu.js

@@ -0,0 +1,93 @@
+// @flow
+import React, { Component } from 'react';
+import { inject, observer } from 'mobx-react';
+
+import UsersStore from 'stores/UsersStore';
+import MoreIcon from 'components/Icon/MoreIcon';
+import { DropdownMenu, DropdownMenuItem } from 'components/DropdownMenu';
+import type { User } from 'types';
+
+type Props = {
+  user: User,
+  users: UsersStore,
+};
+
+@observer
+class UserMenu extends Component {
+  props: Props;
+
+  handlePromote = (ev: SyntheticEvent) => {
+    ev.preventDefault();
+    const { user, users } = this.props;
+    if (
+      !window.confirm(
+        `Are you want to make ${
+          user.name
+        } an admin? Admins can modify team and billing information.`
+      )
+    ) {
+      return;
+    }
+    users.promote(user);
+  };
+
+  handleDemote = (ev: SyntheticEvent) => {
+    ev.preventDefault();
+    const { user, users } = this.props;
+    if (!window.confirm(`Are you want to make ${user.name} a member?`)) {
+      return;
+    }
+    users.demote(user);
+  };
+
+  handleSuspend = (ev: SyntheticEvent) => {
+    ev.preventDefault();
+    const { user, users } = this.props;
+    if (
+      !window.confirm(
+        "Are you want to suspend this account? Suspended users won't be able to access Outline."
+      )
+    ) {
+      return;
+    }
+    users.suspend(user);
+  };
+
+  handleActivate = (ev: SyntheticEvent) => {
+    ev.preventDefault();
+    const { user, users } = this.props;
+    users.activate(user);
+  };
+
+  render() {
+    const { user } = this.props;
+
+    return (
+      <span>
+        <DropdownMenu label={<MoreIcon />}>
+          {!user.isSuspended &&
+            (user.isAdmin ? (
+              <DropdownMenuItem onClick={this.handleDemote}>
+                Make {user.name} a member…
+              </DropdownMenuItem>
+            ) : (
+              <DropdownMenuItem onClick={this.handlePromote}>
+                Make {user.name} an admin…
+              </DropdownMenuItem>
+            ))}
+          {user.isSuspended ? (
+            <DropdownMenuItem onClick={this.handleActivate}>
+              Activate account
+            </DropdownMenuItem>
+          ) : (
+            <DropdownMenuItem onClick={this.handleSuspend}>
+              Suspend account…
+            </DropdownMenuItem>
+          )}
+        </DropdownMenu>
+      </span>
+    );
+  }
+}
+
+export default inject('users')(UserMenu);