From 629ddf78860ea929c9a3fc3bb56fa37114d7784e Mon Sep 17 00:00:00 2001
From: Jackie Luo <jackiehluo@gmail.com>
Date: Tue, 23 Aug 2016 10:46:27 -0700
Subject: [PATCH] feat(onboarding): Allow HTTPS in self-hosted sync engine
 onboarding

---
 .../lib/page-self-hosting-config.jsx          | 20 +++++++++++++++++--
 .../onboarding/stylesheets/onboarding.less    |  7 +++++++
 2 files changed, 25 insertions(+), 2 deletions(-)

diff --git a/internal_packages/onboarding/lib/page-self-hosting-config.jsx b/internal_packages/onboarding/lib/page-self-hosting-config.jsx
index 62eaab966..bc84e5928 100644
--- a/internal_packages/onboarding/lib/page-self-hosting-config.jsx
+++ b/internal_packages/onboarding/lib/page-self-hosting-config.jsx
@@ -14,6 +14,7 @@ class SelfHostingConfigPage extends React.Component {
   constructor(props) {
     super(props)
     this.state = {
+      usesHTTPS: false,
       url: "",
       port: "",
       error: null,
@@ -32,6 +33,12 @@ class SelfHostingConfigPage extends React.Component {
     })
   }
 
+  _onChangeProtocol = (event) => {
+    this.setState({
+      usesHTTPS: !this.state.usesHTTPS,
+    })
+  }
+
   _addAccountJSON = () => {
     // Connect to local sync engine's /accounts endpoint and add accounts to N1
     const xmlHttp = new XMLHttpRequest()
@@ -57,7 +64,7 @@ class SelfHostingConfigPage extends React.Component {
       return
     }
     NylasEnv.config.set('env', 'custom')
-    NylasEnv.config.set('syncEngine.APIRoot', `http://${this.state.url}:${this.state.port}`)
+    NylasEnv.config.set('syncEngine.APIRoot', `http${this.state.usesHTTPS ? "s" : ""}://${this.state.url}:${this.state.port}`)
     Actions.setNylasIdentity({
       token: "SELFHOSTEDSYNCENGINE",
       firstname: "",
@@ -116,7 +123,7 @@ class SelfHostingConfigPage extends React.Component {
         <div className="self-hosting-container">
           <Flexbox direction="horizontal">
             <div className="api-root">
-              <h4>{`http://`}</h4>
+              <h4>{`http${this.state.usesHTTPS ? "s" : ""}://`}</h4>
             </div>
             <div>
               <label>Sync Engine URL:</label>
@@ -142,6 +149,15 @@ class SelfHostingConfigPage extends React.Component {
               />
             </div>
           </Flexbox>
+          <div className="item">
+            <input
+              id="https"
+              type="checkbox"
+              onChange={this._onChangeProtocol}
+              checked={this.state.usesHTTPS}
+            />
+            <label htmlFor="https">Use HTTPS</label>
+          </div>
         </div>
         <button
           className="btn btn-large btn-gradient"
diff --git a/internal_packages/onboarding/stylesheets/onboarding.less b/internal_packages/onboarding/stylesheets/onboarding.less
index 08dc55f1e..b490fd626 100644
--- a/internal_packages/onboarding/stylesheets/onboarding.less
+++ b/internal_packages/onboarding/stylesheets/onboarding.less
@@ -575,6 +575,13 @@
     margin-top: 20px;
   }
 
+  .item {
+    input, label {
+      display: inline;
+      width: 10px;
+    }
+  }
+
   .self-hosting-container {
     width: 400px;
     display: block;