Add relay settings fetch

Backend.connect() won’t accept connection info anymore.
Use Backend.updateRelaySettings() to set the constraints to be able to connect the tunnel.

5 files changed, 71 insertions, 79 deletions

diff --git a/app/app.js b/app/app.js
index 656e7dd5c0..a10d0da07c 100644
--- a/app/app.js
+++ b/app/app.js
@@ -9,7 +9,7 @@ import { webFrame, ipcRenderer } from 'electron';
 import log from 'electron-log';
 import makeRoutes from './routes';
 import configureStore from './redux/store';
-import { Backend } from './lib/backend';
+import { Backend, BackendError } from './lib/backend';
 
 import type { ConnectionState } from './redux/connection/reducers';
 import type { TrayIconType } from './lib/tray-icon-manager';
@@ -22,25 +22,23 @@ const store = configureStore(initialState, memoryHistory);
 // Backend
 //////////////////////////////////////////////////////////////////////////
 const backend = new Backend(store);
-ipcRenderer.on('backend-info', (_event, args) => {
+ipcRenderer.on('backend-info', async (_event, args) => {
   backend.setCredentials(args.credentials);
   backend.sync();
-  backend.autologin()
-    .then( () => {
-      return backend.syncRelaySettings();
-    })
-    .then( () => {
-      const { settings: { relaySettings: { host, protocol, port } } } = store.getState();
-
-      return backend.connect(host, protocol, port);
-    })
-    .catch( e => {
-      if (e.type === 'NO_ACCOUNT') {
+  try {
+    await backend.autologin();
+    await backend.fetchRelaySettings();
+    await backend.connect();
+  } catch (e) {
+    if(e instanceof BackendError) {
+      if(e.type === 'NO_ACCOUNT') {
         log.debug('No user set in the backend, showing window');
         ipcRenderer.send('show-window');
       }
-    });
+    }
+  }
 });
+
 ipcRenderer.on('shutdown', () => {
   log.info('Been told by the node process to shutdown');
   backend.shutdown()
diff --git a/app/components/Connect.js b/app/components/Connect.js
index 2569e4b4b3..c33f17425b 100644
--- a/app/components/Connect.js
+++ b/app/components/Connect.js
@@ -18,7 +18,7 @@ export type ConnectProps = {
   settings: SettingsReduxState,
   onSettings: () => void,
   onSelectLocation: () => void,
-  onConnect: (host: string) => void,
+  onConnect: () => void,
   onCopyIP: () => void,
   onDisconnect: () => void,
   onExternalLink: (type: string) => void,
@@ -119,15 +119,13 @@ export default class Connect extends Component {
     case 'disconnected': isDisconnected = true; break;
     }
 
-    const { city, country } = serverInfo && (isConnecting || isConnected)
-      ? serverInfo
-      : { city: '\u2003', country: '\u2002' };
-    const ip = serverInfo && isConnected
-      ? serverInfo.address
-      : '\u2003'; //this.props.connection.clientIp;
+    const { city, country } = (isConnecting || isConnected)
+      ? { city: 'Unknown', country: 'Unknown' }
+      : { city: this.props.connection.city, country: this.props.connection.country };
+
     const serverName = serverInfo
       ? serverInfo.name
-      : '\u2003';
+      : 'Unknown';
 
     // We decided to not include the map in the first beta release to customers
     // but it MUST be included in the following releases. Therefore we choose
@@ -149,7 +147,7 @@ export default class Connect extends Component {
       if (this.state.showCopyIPMessage) {
         ipComponent = <span>{ 'IP copied to clipboard!' }</span>;
       } else {
-        ipComponent = <span>{ ip }</span>;
+        ipComponent = <span>{ this.props.connection.clientIp }</span>;
       }
     }
     return (
@@ -235,7 +233,7 @@ export default class Connect extends Component {
                 </div>
 
                 <div className="connect__row">
-                  <button className="button button--positive" onClick={ this.onConnect.bind(this) }>Secure my connection</button>
+                  <button className="button button--positive" onClick={ this.props.onConnect }>Secure my connection</button>
                 </div>
               </div>
             </Then>
@@ -284,15 +282,6 @@ export default class Connect extends Component {
 
   // Handlers
 
-  onConnect() {
-    const serverInfo = this._getServerInfo();
-    if(!serverInfo) {
-      return;
-    }
-
-    this.props.onConnect(serverInfo.address);
-  }
-
   onExternalLink(type: string) {
     this.props.onExternalLink(type);
   }
diff --git a/app/containers/ConnectPage.js b/app/containers/ConnectPage.js
index 5c6dc1fa60..c1587e9202 100644
--- a/app/containers/ConnectPage.js
+++ b/app/containers/ConnectPage.js
@@ -21,7 +21,7 @@ const mapDispatchToProps = (dispatch, props) => {
   return {
     onSettings: () => dispatch(push('/settings')),
     onSelectLocation: () => dispatch(push('/select-location')),
-    onConnect: (relayEndpoint) => connect(backend, relayEndpoint),
+    onConnect: () => connect(backend),
     onCopyIP: () => copyIPAddress(),
     onDisconnect: () => disconnect(backend),
     onExternalLink: (type) => shell.openExternal(links[type]),
diff --git a/app/lib/backend.js b/app/lib/backend.js
index fac9e25438..ef8c826158 100644
--- a/app/lib/backend.js
+++ b/app/lib/backend.js
@@ -10,7 +10,7 @@ import settingsActions from '../redux/settings/actions';
 import { push } from 'react-router-redux';
 
 import type { ReduxStore } from '../redux/store';
-import type { AccountToken, BackendState, RelaySettingsUpdate, RelayProtocol } from './ipc-facade';
+import type { AccountToken, BackendState, RelayLocation, RelaySettingsUpdate } from './ipc-facade';
 import type { ConnectionState } from '../redux/connection/reducers';
 
 export type ErrorType = 'NO_CREDIT' | 'NO_INTERNET' | 'INVALID_ACCOUNT' | 'NO_ACCOUNT';
@@ -186,18 +186,15 @@ export class Backend {
             log.info('Log in complete');
 
             this._store.dispatch(accountActions.loginSuccessful(accountData.expiry));
-            return this.syncRelaySettings();
+            return this.fetchRelaySettings();
           })
           .then( () => {
             // Redirect the user after some time to allow for
             // the 'Login Successful' screen to be visible
             setTimeout(() => {
-              const { settings: { relaySettings: { host, protocol, port } } } = this._store.getState();
-
-              log.debug(`Autoconnecting to ${host}`);
-
               this._store.dispatch(push('/connect'));
-              this.connect(host, protocol, port);
+              log.debug('Autoconnecting...');
+              this.connect();
             }, 1000);
           }).catch(e => {
             log.error('Failed to log in,', e.message);
@@ -263,20 +260,9 @@ export class Backend {
       });
   }
 
-  connect(host: string, protocol: RelayProtocol, port: number): Promise<void> {
-    const newRelaySettings = {
-      custom_tunnel_endpoint: {
-        host: host,
-        tunnel: {
-          openvpn: { protocol, port }
-        },
-      },
-    };
-
+  connect(): Promise<void> {
     this._store.dispatch(connectionActions.connecting());
-
     return this._ensureAuthenticated()
-      .then(() => this._ipc.updateRelaySettings(newRelaySettings))
       .then(() => this._ipc.connect())
       .catch((e) => {
         log.error('Backend.connect failed because: ', e.message);
@@ -304,29 +290,53 @@ export class Backend {
 
   updateRelaySettings(relaySettings: RelaySettingsUpdate): Promise<void> {
     return this._ensureAuthenticated()
-      .then( () => {
-        return this._ipc.updateRelaySettings(relaySettings);
-      });
+      .then(() => this._ipc.updateRelaySettings(relaySettings));
   }
 
-  syncRelaySettings(): Promise<void> {
-    return this._ensureAuthenticated()
-      .then(() => this._ipc.getRelaySettings())
-      .then((constraints) => {
-        log.debug('Got constraints from backend', constraints);
+  async fetchRelaySettings(): Promise<void> {
+    await this._ensureAuthenticated();
 
-        if(constraints.normal) {
-          // TODO: handle normal constraints
-          log.warn('syncRelaySettings: Normal constraints are not implemented yet.');
-        } else if(constraints.custom_tunnel_endpoint) {
-          const custom_tunnel_endpoint = constraints.custom_tunnel_endpoint;
-          const { host, tunnel: { openvpn: { port, protocol } } } = custom_tunnel_endpoint;
-          this._store.dispatch(settingsActions.updateRelay({ host, port, protocol }));
-        }
-      })
-      .catch(e => {
-        log.error('Failed getting relay constraints', e);
-      });
+    const relaySettings = await this._ipc.getRelaySettings();
+    log.debug('Got relay settings from backend', relaySettings);
+
+    if(relaySettings.normal) {
+      const payload = {};
+      const normal = relaySettings.normal;
+      const tunnel = normal.tunnel;
+      const location = normal.location;
+
+      if(location === 'any') {
+        payload.location = 'any';
+      } else {
+        payload.location = location.only;
+      }
+
+      if(tunnel === 'any') {
+        payload.port = 'any';
+        payload.protocol = 'any';
+      } else {
+        const { port, protocol } = tunnel.only.openvpn;
+        payload.port = port === 'any' ? port : port.only;
+        payload.protocol = protocol === 'any' ? protocol : protocol.only;
+      }
+
+      this._store.dispatch(
+        settingsActions.updateRelay({
+          normal: payload
+        })
+      );
+    } else if(relaySettings.custom_tunnel_endpoint) {
+      const custom_tunnel_endpoint = relaySettings.custom_tunnel_endpoint;
+      const { host, tunnel: { openvpn: { port, protocol } } } = custom_tunnel_endpoint;
+
+      this._store.dispatch(
+        settingsActions.updateRelay({
+          custom_tunnel_endpoint: {
+            host, port, protocol
+          }
+        })
+      );
+    }
   }
 
   removeAccountFromHistory(accountToken: AccountToken): Promise<void> {
diff --git a/app/redux/connection/actions.js b/app/redux/connection/actions.js
index 023c7fc24c..f2ebf2c7ba 100644
--- a/app/redux/connection/actions.js
+++ b/app/redux/connection/actions.js
@@ -6,12 +6,7 @@ import type { Backend } from '../../lib/backend';
 import type { ReduxThunk } from '../store';
 import type { Coordinate2d } from '../../types';
 
-const connect = (backend: Backend, relay: string): ReduxThunk => {
-  return (_, getState) => {
-    const { settings: { relaySettings: { protocol, port } } } = getState();
-    backend.connect(relay, protocol, port);
-  };
-};
+const connect = (backend: Backend): ReduxThunk => () => backend.connect();
 const disconnect = (backend: Backend) => () => backend.disconnect();
 const copyIPAddress = (): ReduxThunk => {
   return (_, getState) => {