feat: invites (#967)

* stub invite endpoint

* feat: First pass invite UI

* feat: allow removing invite rows

* First pass: sending logic

* fix: label accessibility

* fix: add button submits
incorrect permissions
middleware flow error

* 💚

* Error handling, email filtering, tests

* Flow

* Add Invite to people page
Remove old Tip

* Add copy link to subdomain

app/components/Sidebar/Main.js

@@ -7,9 +7,12 @@ import {
   EditIcon,
   SearchIcon,
   StarredIcon,
+  PlusIcon,
 } from 'outline-icons';
 
 import Flex from 'shared/components/Flex';
+import Modal from 'components/Modal';
+import Invite from 'scenes/Invite';
 import AccountMenu from 'menus/AccountMenu';
 import Sidebar from './Sidebar';
 import Scrollable from 'components/Scrollable';
@@ -22,6 +25,7 @@ import Bubble from './components/Bubble';
 import AuthStore from 'stores/AuthStore';
 import DocumentsStore from 'stores/DocumentsStore';
 import UiStore from 'stores/UiStore';
+import { observable } from 'mobx';
 
 type Props = {
   auth: AuthStore,
@@ -31,6 +35,8 @@ type Props = {
 
 @observer
 class MainSidebar extends React.Component<Props> {
+  @observable inviteModalOpen: boolean = false;
+
   componentDidMount() {
     this.props.documents.fetchDrafts();
   }
@@ -39,6 +45,14 @@ class MainSidebar extends React.Component<Props> {
     this.props.ui.setActiveModal('collection-new');
   };
 
+  handleInviteModalOpen = () => {
+    this.inviteModalOpen = true;
+  };
+
+  handleInviteModalClose = () => {
+    this.inviteModalOpen = false;
+  };
+
   render() {
     const { auth, documents } = this.props;
     const { user, team } = auth;
@@ -110,9 +124,23 @@ class MainSidebar extends React.Component<Props> {
                   documents.active ? documents.active.isArchived : undefined
                 }
               />
+              {user.isAdmin && (
+                <SidebarLink
+                  onClick={this.handleInviteModalOpen}
+                  icon={<PlusIcon />}
+                  label="Invite people…"
+                />
+              )}
             </Section>
           </Scrollable>
         </Flex>
+        <Modal
+          title="Invite people"
+          onRequestClose={this.handleInviteModalClose}
+          isOpen={this.inviteModalOpen}
+        >
+          <Invite onSubmit={this.handleInviteModalClose} />
+        </Modal>
       </Sidebar>
     );
   }