1 files changed, 116 insertions, 0 deletions

diff --git a/src/containers/auth/SetupAssistantScreen.tsx b/src/containers/auth/SetupAssistantScreen.tsx
new file mode 100644
index 000000000..44bd32772
--- /dev/null
+++ b/src/containers/auth/SetupAssistantScreen.tsx
@@ -0,0 +1,116 @@
+/* eslint-disable no-await-in-loop */
+import { Component } from 'react';
+import { inject, observer } from 'mobx-react';
+
+import { RouterStore } from 'mobx-react-router';
+import { sleep } from '../../helpers/async-helpers';
+import SetupAssistant from '../../components/auth/SetupAssistant';
+import ServicesStore from '../../stores/ServicesStore';
+import RecipesStore from '../../stores/RecipesStore';
+import UserStore from '../../stores/UserStore';
+
+interface IProps {
+  stores: {
+    services?: ServicesStore,
+    router: RouterStore,
+    recipes?: RecipesStore,
+    user?: UserStore,
+  },
+  actions: {
+    user: UserStore,
+    service: ServicesStore,
+    recipe: RecipesStore,
+  },
+};
+
+class SetupAssistantScreen extends Component<IProps> {
+  state = {
+    isSettingUpServices: false,
+  }
+
+  // TODO: Why are these hardcoded here? Do they need to conform to specific services in the packaged recipes? If so, its more important to fix this
+  services = {
+    whatsapp: {
+      name: 'WhatsApp',
+      hasTeamId: false,
+    },
+    messenger: {
+      name: 'Messenger',
+      hasTeamId: false,
+    },
+    gmail: {
+      name: 'Gmail',
+      hasTeamId: false,
+    },
+    skype: {
+      name: 'Skype',
+      hasTeamId: false,
+    },
+    telegram: {
+      name: 'Telegram',
+      hasTeamId: false,
+    },
+    instagram: {
+      name: 'Instagram',
+      hasTeamId: false,
+    },
+    slack: {
+      name: 'Slack',
+      hasTeamId: true,
+    },
+    hangouts: {
+      name: 'Hangouts',
+      hasTeamId: false,
+    },
+    linkedin: {
+      name: 'LinkedIn',
+      hasTeamId: false,
+    },
+  };
+
+  async setupServices(serviceConfig) {
+    const { stores: { services, router } } = this.props;
+
+    this.setState({
+      isSettingUpServices: true,
+    });
+
+    // The store requests are not build for parallel requests so we need to finish one request after another
+    for (const config of serviceConfig) {
+      const serviceData = {
+        name: this.services[config.id].name,
+        team: config.team
+      };
+
+      await services._createService({
+        recipeId: config.id,
+        serviceData,
+        redirect: false,
+        skipCleanup: true,
+      });
+
+      await sleep(100);
+    }
+
+    this.setState({
+      isSettingUpServices: false,
+    });
+
+    await sleep(100);
+
+    router.push('/');
+  }
+
+  render() {
+    return (
+      <SetupAssistant
+        onSubmit={config => this.setupServices(config)}
+        services={this.services}
+        embed={false}
+        isSettingUpServices={this.state.isSettingUpServices}
+      />
+    );
+  }
+}
+
+export default inject('stores', 'actions')(observer(SetupAssistantScreen));