11 files changed, 158 insertions, 89 deletions

diff --git a/src/stores/AppStore.js b/src/stores/AppStore.js
index dd4642d70..72c4b4d0b 100644
--- a/src/stores/AppStore.js
+++ b/src/stores/AppStore.js
@@ -1,21 +1,25 @@
 import { remote, ipcRenderer, shell } from 'electron';
-import { action, computed, observable } from 'mobx';
+import {
+  action, computed, observable, reaction,
+} from 'mobx';
 import moment from 'moment';
-import key from 'keymaster';
 import { getDoNotDisturb } from '@meetfranz/electron-notification-state';
 import AutoLaunch from 'auto-launch';
 import prettyBytes from 'pretty-bytes';
+import ms from 'ms';
+import { URL } from 'url';
 
 import Store from './lib/Store';
 import Request from './lib/Request';
 import { CHECK_INTERVAL, DEFAULT_APP_SETTINGS } from '../config';
-import { isMac, isLinux, isWindows } from '../environment';
+import { isMac } from '../environment';
 import locales from '../i18n/translations';
-import { gaEvent } from '../lib/analytics';
+import { gaEvent, gaPage, statsEvent } from '../lib/analytics';
 import { onVisibilityChange } from '../helpers/visibility-helper';
 import { getLocale } from '../helpers/i18n-helpers';
 
 import { getServiceIdsFromPartitions, removeServicePartitionDirectory } from '../helpers/service-helpers.js';
+import { isValidExternalURL } from '../helpers/url-helpers';
 
 const debug = require('debug')('Franz:AppStore');
 
@@ -63,6 +67,8 @@ export default class AppStore extends Store {
 
   @observable isFocused = true;
 
+  @observable nextAppReleaseVersion = null;
+
   dictionaries = [];
 
   constructor(...args) {
@@ -110,16 +116,16 @@ export default class AppStore extends Store {
     // Check if system is muted
     // There are no events to subscribe so we need to poll everey 5s
     this._systemDND();
-    setInterval(() => this._systemDND(), 5000);
+    setInterval(() => this._systemDND(), ms('5s'));
 
     // Check for updates once every 4 hours
     setInterval(() => this._checkForUpdates(), CHECK_INTERVAL);
     // Check for an update in 30s (need a delay to prevent Squirrel Installer lock file issues)
-    setTimeout(() => this._checkForUpdates(), 30000);
+    setTimeout(() => this._checkForUpdates(), ms('30s'));
     ipcRenderer.on('autoUpdate', (event, data) => {
       if (data.available) {
         this.updateStatus = this.updateStatusTypes.AVAILABLE;
-
+        this.nextAppReleaseVersion = data.version;
         if (isMac) {
           app.dock.bounce();
         }
@@ -143,32 +149,14 @@ export default class AppStore extends Store {
 
     // Handle deep linking (franz://)
     ipcRenderer.on('navigateFromDeepLink', (event, data) => {
-      const { url } = data;
+      debug('Navigate from deep link', data);
+      let { url } = data;
       if (!url) return;
 
-      this.stores.router.push(data.url);
-    });
-
-    // Set active the next service
-    key(
-      '⌘+pagedown, ctrl+pagedown, ⌘+alt+right, ctrl+tab', () => {
-        this.actions.service.setActiveNext();
-      },
-    );
+      url = url.replace(/\/$/, '');
 
-    // Set active the prev service
-    key(
-      '⌘+pageup, ctrl+pageup, ⌘+alt+left, ctrl+shift+tab', () => {
-        this.actions.service.setActivePrev();
-      },
-    );
-
-    // Global Mute
-    key(
-      '⌘+shift+m ctrl+shift+m', () => {
-        this.actions.app.toggleMuteApp();
-      },
-    );
+      this.stores.router.push(url);
+    });
 
     this.locale = this._getDefaultLocale();
 
@@ -181,6 +169,13 @@ export default class AppStore extends Store {
 
       debug('Window is visible/focused', isVisible);
     });
+
+    // analytics autorun
+    reaction(() => this.stores.router.location.pathname, (pathname) => {
+      gaPage(pathname);
+    });
+
+    statsEvent('app-start');
   }
 
   @computed get cacheSize() {
@@ -193,7 +188,15 @@ export default class AppStore extends Store {
   }) {
     if (this.stores.settings.all.app.isAppMuted) return;
 
+    // TODO: is there a simple way to use blobs for notifications without storing them on disk?
+    if (options.icon.startsWith('blob:')) {
+      delete options.icon;
+    }
+
     const notification = new window.Notification(title, options);
+
+    debug('New notification', title, options);
+
     notification.onclick = (e) => {
       if (serviceId) {
         this.actions.service.sendIPCMessage({
@@ -203,12 +206,13 @@ export default class AppStore extends Store {
         });
 
         this.actions.service.setActive({ serviceId });
-
-        if (isWindows) {
+        mainWindow.show();
+        if (app.mainWindow.isMinimized()) {
           mainWindow.restore();
-        } else if (isLinux) {
-          mainWindow.show();
         }
+        mainWindow.focus();
+
+        debug('Notification click handler');
       }
     };
   }
@@ -244,7 +248,14 @@ export default class AppStore extends Store {
   }
 
   @action _openExternalUrl({ url }) {
-    shell.openExternal(url);
+    const parsedUrl = new URL(url);
+    debug('open external url', parsedUrl);
+
+    if (isValidExternalURL(url)) {
+      shell.openExternal(url);
+    }
+
+    gaEvent('External URL', 'open', parsedUrl.host);
   }
 
   @action _checkForUpdates() {
@@ -268,7 +279,6 @@ export default class AppStore extends Store {
 
   @action _muteApp({ isMuted, overrideSystemMute = true }) {
     this.isSystemMuteOverridden = overrideSystemMute;
-
     this.actions.settings.update({
       type: 'app',
       data: {
@@ -305,7 +315,7 @@ export default class AppStore extends Store {
     } else {
       const deltaTime = moment().diff(this.timeOfflineStart);
 
-      if (deltaTime > 30 * 60 * 1000) {
+      if (deltaTime > ms('30m')) {
         this.actions.service.reloadAll();
       }
     }
diff --git a/src/stores/FeaturesStore.js b/src/stores/FeaturesStore.js
index 0adee6adf..e7832088b 100644
--- a/src/stores/FeaturesStore.js
+++ b/src/stores/FeaturesStore.js
@@ -1,4 +1,9 @@
-import { computed, observable, reaction } from 'mobx';
+import {
+  computed,
+  observable,
+  reaction,
+  runInAction,
+} from 'mobx';
 
 import Store from './lib/Store';
 import CachedRequest from './lib/CachedRequest';
@@ -7,6 +12,10 @@ import delayApp from '../features/delayApp';
 import spellchecker from '../features/spellchecker';
 import serviceProxy from '../features/serviceProxy';
 import basicAuth from '../features/basicAuth';
+import workspaces from '../features/workspaces';
+import shareFranz from '../features/shareFranz';
+import announcements from '../features/announcements';
+import settingsWS from '../features/settingsWS';
 
 import { DEFAULT_FEATURES_CONFIG } from '../config';
 
@@ -15,13 +24,16 @@ export default class FeaturesStore extends Store {
 
   @observable featuresRequest = new CachedRequest(this.api.features, 'features');
 
+  @observable features = Object.assign({}, DEFAULT_FEATURES_CONFIG);
+
   async setup() {
     this.registerReactions([
+      this._updateFeatures,
       this._monitorLoginStatus.bind(this),
     ]);
 
     await this.featuresRequest._promise;
-    setTimeout(this._enableFeatures.bind(this), 1);
+    setTimeout(this._setupFeatures.bind(this), 1);
 
     // single key reaction
     reaction(() => this.stores.user.data.isPremium, () => {
@@ -35,13 +47,16 @@ export default class FeaturesStore extends Store {
     return this.defaultFeaturesRequest.execute().result || DEFAULT_FEATURES_CONFIG;
   }
 
-  @computed get features() {
+  _updateFeatures = () => {
+    const features = Object.assign({}, DEFAULT_FEATURES_CONFIG);
     if (this.stores.user.isLoggedIn) {
-      return this.featuresRequest.execute().result || DEFAULT_FEATURES_CONFIG;
+      const requestResult = this.featuresRequest.execute().result;
+      Object.assign(features, requestResult);
     }
-
-    return DEFAULT_FEATURES_CONFIG;
-  }
+    runInAction('FeaturesStore::_updateFeatures', () => {
+      this.features = features;
+    });
+  };
 
   _monitorLoginStatus() {
     if (this.stores.user.isLoggedIn) {
@@ -51,10 +66,14 @@ export default class FeaturesStore extends Store {
     }
   }
 
-  _enableFeatures() {
+  _setupFeatures() {
     delayApp(this.stores, this.actions);
     spellchecker(this.stores, this.actions);
     serviceProxy(this.stores, this.actions);
     basicAuth(this.stores, this.actions);
+    workspaces(this.stores, this.actions);
+    shareFranz(this.stores, this.actions);
+    announcements(this.stores, this.actions);
+    settingsWS(this.stores, this.actions);
   }
 }
diff --git a/src/stores/PaymentStore.js b/src/stores/PaymentStore.js
index 4cabee194..d4de476c8 100644
--- a/src/stores/PaymentStore.js
+++ b/src/stores/PaymentStore.js
@@ -10,15 +10,10 @@ export default class PaymentStore extends Store {
 
   @observable createHostedPageRequest = new Request(this.api.payment, 'getHostedPage');
 
-  @observable createDashboardUrlRequest = new Request(this.api.payment, 'getDashboardUrl');
-
-  @observable ordersDataRequest = new CachedRequest(this.api.payment, 'getOrders');
-
   constructor(...args) {
     super(...args);
 
     this.actions.payment.createHostedPage.listen(this._createHostedPage.bind(this));
-    this.actions.payment.createDashboardUrl.listen(this._createDashboardUrl.bind(this));
   }
 
   @computed get plan() {
@@ -28,10 +23,6 @@ export default class PaymentStore extends Store {
     return this.plansRequest.execute().result || {};
   }
 
-  @computed get orders() {
-    return this.ordersDataRequest.execute().result || [];
-  }
-
   @action _createHostedPage({ planId }) {
     const request = this.createHostedPageRequest.execute(planId);
 
@@ -39,12 +30,4 @@ export default class PaymentStore extends Store {
 
     return request;
   }
-
-  @action _createDashboardUrl() {
-    const request = this.createDashboardUrlRequest.execute();
-
-    gaEvent('Payment', 'createDashboardUrl');
-
-    return request;
-  }
 }
diff --git a/src/stores/RecipePreviewsStore.js b/src/stores/RecipePreviewsStore.js
index 10b2928e3..382820d58 100644
--- a/src/stores/RecipePreviewsStore.js
+++ b/src/stores/RecipePreviewsStore.js
@@ -1,5 +1,6 @@
 import { action, computed, observable } from 'mobx';
 import { debounce } from 'lodash';
+import ms from 'ms';
 
 import Store from './lib/Store';
 import CachedRequest from './lib/CachedRequest';
@@ -48,5 +49,5 @@ export default class RecipePreviewsStore extends Store {
   // Helper
   _analyticsSearch = debounce((needle) => {
     gaEvent('Recipe', 'search', needle);
-  }, 3000);
+  }, ms('3s'));
 }
diff --git a/src/stores/RequestStore.js b/src/stores/RequestStore.js
index 2629e0a38..9254e3223 100644
--- a/src/stores/RequestStore.js
+++ b/src/stores/RequestStore.js
@@ -1,4 +1,5 @@
 import { action, computed, observable } from 'mobx';
+import ms from 'ms';
 
 import Store from './lib/Store';
 
@@ -13,7 +14,7 @@ export default class RequestStore extends Store {
 
   retries = 0;
 
-  retryDelay = 2000;
+  retryDelay = ms('2s');
 
   constructor(...args) {
     super(...args);
diff --git a/src/stores/ServicesStore.js b/src/stores/ServicesStore.js
index efd57a09d..13f929c2f 100644
--- a/src/stores/ServicesStore.js
+++ b/src/stores/ServicesStore.js
@@ -5,12 +5,14 @@ import {
   observable,
 } from 'mobx';
 import { debounce, remove } from 'lodash';
+import ms from 'ms';
 
 import Store from './lib/Store';
 import Request from './lib/Request';
 import CachedRequest from './lib/CachedRequest';
 import { matchRoute } from '../helpers/routing-helpers';
-import { gaEvent } from '../lib/analytics';
+import { gaEvent, statsEvent } from '../lib/analytics';
+import { workspaceStore } from '../features/workspaces';
 
 const debug = require('debug')('Franz:ServiceStore');
 
@@ -34,6 +36,7 @@ export default class ServicesStore extends Store {
 
     // Register action handlers
     this.actions.service.setActive.listen(this._setActive.bind(this));
+    this.actions.service.blurActive.listen(this._blurActive.bind(this));
     this.actions.service.setActiveNext.listen(this._setActiveNext.bind(this));
     this.actions.service.setActivePrev.listen(this._setActivePrev.bind(this));
     this.actions.service.showAddServiceInterface.listen(this._showAddServiceInterface.bind(this));
@@ -43,6 +46,7 @@ export default class ServicesStore extends Store {
     this.actions.service.deleteService.listen(this._deleteService.bind(this));
     this.actions.service.clearCache.listen(this._clearCache.bind(this));
     this.actions.service.setWebviewReference.listen(this._setWebviewReference.bind(this));
+    this.actions.service.detachService.listen(this._detachService.bind(this));
     this.actions.service.focusService.listen(this._focusService.bind(this));
     this.actions.service.focusActiveService.listen(this._focusActiveService.bind(this));
     this.actions.service.toggleService.listen(this._toggleService.bind(this));
@@ -97,7 +101,6 @@ export default class ServicesStore extends Store {
         return observable(services.slice().slice().sort((a, b) => a.order - b.order));
       }
     }
-
     return [];
   }
 
@@ -106,13 +109,16 @@ export default class ServicesStore extends Store {
   }
 
   @computed get allDisplayed() {
-    return this.stores.settings.all.app.showDisabledServices ? this.all : this.enabled;
+    const services = this.stores.settings.all.app.showDisabledServices ? this.all : this.enabled;
+    return workspaceStore.filterServicesByActiveWorkspace(services);
   }
 
   // This is just used to avoid unnecessary rerendering of resource-heavy webviews
   @computed get allDisplayedUnordered() {
+    const { showDisabledServices } = this.stores.settings.all.app;
     const services = this.allServicesRequest.execute().result || [];
-    return this.stores.settings.all.app.showDisabledServices ? services : services.filter(service => service.isEnabled);
+    const filteredServices = showDisabledServices ? services : services.filter(service => service.isEnabled);
+    return workspaceStore.filterServicesByActiveWorkspace(filteredServices);
   }
 
   @computed get filtered() {
@@ -293,9 +299,16 @@ export default class ServicesStore extends Store {
     });
     service.isActive = true;
 
+    statsEvent('activate-service', service.recipe.id);
+
     this._focusActiveService();
   }
 
+  @action _blurActive() {
+    if (!this.active) return;
+    this.active.isActive = false;
+  }
+
   @action _setActiveNext() {
     const nextIndex = this._wrapIndex(this.allDisplayed.findIndex(service => service.isActive), 1, this.allDisplayed.length);
 
@@ -340,6 +353,11 @@ export default class ServicesStore extends Store {
     service.isAttached = true;
   }
 
+  @action _detachService({ service }) {
+    service.webview = null;
+    service.isAttached = false;
+  }
+
   @action _focusService({ serviceId }) {
     const service = this.one(serviceId);
 
@@ -679,7 +697,7 @@ export default class ServicesStore extends Store {
   _initRecipePolling(serviceId) {
     const service = this.one(serviceId);
 
-    const delay = 2000;
+    const delay = ms('2s');
 
     if (service) {
       if (service.timer !== null) {
@@ -700,7 +718,7 @@ export default class ServicesStore extends Store {
 
   _reorderAnalytics = debounce(() => {
     gaEvent('Service', 'order');
-  }, 5000);
+  }, ms('5s'));
 
   _wrapIndex(index, delta, size) {
     return (((index + delta) % size) + size) % size;
diff --git a/src/stores/UIStore.js b/src/stores/UIStore.js
index d37ebe4c7..a95a8e1e0 100644
--- a/src/stores/UIStore.js
+++ b/src/stores/UIStore.js
@@ -1,8 +1,7 @@
 import { action, observable, computed } from 'mobx';
+import { theme } from '@meetfranz/theme';
 
 import Store from './lib/Store';
-import * as themeDefault from '../theme/default';
-import * as themeDark from '../theme/dark';
 
 export default class UIStore extends Store {
   @observable showServicesUpdatedInfoBar = false;
@@ -22,12 +21,13 @@ export default class UIStore extends Store {
     return (settings.app.isAppMuted && settings.app.showMessageBadgeWhenMuted) || !settings.isAppMuted;
   }
 
-  @computed get theme() {
-    if (this.stores.settings.all.app.darkMode) {
-      return Object.assign({}, themeDefault, themeDark);
-    }
+  @computed get isDarkThemeActive() {
+    return this.stores.settings.all.app.darkMode;
+  }
 
-    return themeDefault;
+  @computed get theme() {
+    if (this.isDarkThemeActive) return theme('dark');
+    return theme('default');
   }
 
   // Actions
diff --git a/src/stores/UserStore.js b/src/stores/UserStore.js
index 7addb5760..31555dd5c 100644
--- a/src/stores/UserStore.js
+++ b/src/stores/UserStore.js
@@ -129,10 +129,6 @@ export default class UserStore extends Store {
     return Boolean(localStorage.getItem('authToken'));
   }
 
-  // @computed get isTokenValid() {
-  //   return this.authToken !== null && moment(this.tokenExpiry).isAfter(moment());
-  // }
-
   @computed get isTokenExpired() {
     if (!this.authToken) return false;
 
@@ -146,6 +142,10 @@ export default class UserStore extends Store {
     return this.getUserInfoRequest.execute().result || {};
   }
 
+  @computed get isPremium() {
+    return !!this.data.isPremium;
+  }
+
   @computed get legacyServices() {
     return this.getLegacyServicesRequest.execute() || {};
   }
@@ -160,6 +160,14 @@ export default class UserStore extends Store {
     gaEvent('User', 'login');
   }
 
+  @action _tokenLogin(authToken) {
+    this._setUserData(authToken);
+
+    this.stores.router.push('/');
+
+    gaEvent('User', 'tokenLogin');
+  }
+
   @action async _signup({
     firstname, lastname, email, password, accountType, company,
   }) {
@@ -170,6 +178,7 @@ export default class UserStore extends Store {
       password,
       accountType,
       company,
+      locale: this.stores.app.locale,
     });
 
     this.hasCompletedSignup = false;
@@ -206,6 +215,8 @@ export default class UserStore extends Store {
   }
 
   @action async _update({ userData }) {
+    if (!this.isLoggedIn) return;
+
     const response = await this.updateUserInfoRequest.execute(userData)._promise;
 
     this.getUserInfoRequest.patch(() => response.data);
@@ -222,6 +233,7 @@ export default class UserStore extends Store {
     // workaround mobx issue
     localStorage.removeItem('authToken');
     window.localStorage.removeItem('authToken');
+
     this.getUserInfoRequest.invalidate().reset();
     this.authToken = null;
   }
@@ -262,6 +274,18 @@ export default class UserStore extends Store {
     const { router } = this.stores;
     const currentRoute = router.location.pathname;
     if (!this.isLoggedIn
+      && currentRoute.includes('token=')) {
+      router.push(this.WELCOME_ROUTE);
+      const token = currentRoute.split('=')[1];
+
+      const data = this._parseToken(token);
+      if (data) {
+        // Give this some time to sink
+        setTimeout(() => {
+          this._tokenLogin(token);
+        }, 1000);
+      }
+    } else if (!this.isLoggedIn
       && !currentRoute.includes(this.BASE_ROUTE)) {
       router.push(this.WELCOME_ROUTE);
     } else if (this.isLoggedIn
diff --git a/src/stores/index.js b/src/stores/index.js
index 96b844c95..1912418a2 100644
--- a/src/stores/index.js
+++ b/src/stores/index.js
@@ -10,6 +10,8 @@ import PaymentStore from './PaymentStore';
 import NewsStore from './NewsStore';
 import RequestStore from './RequestStore';
 import GlobalErrorStore from './GlobalErrorStore';
+import { workspaceStore } from '../features/workspaces';
+import { announcementsStore } from '../features/announcements';
 
 export default (api, actions, router) => {
   const stores = {};
@@ -27,6 +29,8 @@ export default (api, actions, router) => {
     news: new NewsStore(stores, api, actions),
     requests: new RequestStore(stores, api, actions),
     globalError: new GlobalErrorStore(stores, api, actions),
+    workspaces: workspaceStore,
+    announcements: announcementsStore,
   });
   // Initialize all stores
   Object.keys(stores).forEach((name) => {
diff --git a/src/stores/lib/Reaction.js b/src/stores/lib/Reaction.js
index 46aa4dae6..f2642908f 100644
--- a/src/stores/lib/Reaction.js
+++ b/src/stores/lib/Reaction.js
@@ -1,24 +1,31 @@
-// @flow
 import { autorun } from 'mobx';
 
 export default class Reaction {
   reaction;
 
-  hasBeenStarted;
+  isRunning = false;
 
   dispose;
 
   constructor(reaction) {
     this.reaction = reaction;
-    this.hasBeenStarted = false;
   }
 
   start() {
-    this.dispose = autorun(() => this.reaction());
-    this.hasBeenStarted = true;
+    if (!this.isRunning) {
+      this.dispose = autorun(() => this.reaction());
+      this.isActive = true;
+    }
   }
 
   stop() {
-    if (this.hasBeenStarted) this.dispose();
+    if (this.isRunning) {
+      this.dispose();
+      this.isActive = false;
+    }
   }
 }
+
+export const createReactions = reactions => (
+  reactions.map(r => new Reaction(r))
+);
diff --git a/src/stores/lib/Request.js b/src/stores/lib/Request.js
index 04f528156..486de8a49 100644
--- a/src/stores/lib/Request.js
+++ b/src/stores/lib/Request.js
@@ -85,6 +85,8 @@ export default class Request {
     return this.execute(...this._currentApiCall.args);
   }
 
+  retry = () => this.reload();
+
   isExecutingWithArgs(...args) {
     return this.isExecuting && this._currentApiCall && isEqual(this._currentApiCall.args, args);
   }
@@ -107,7 +109,7 @@ export default class Request {
     Request._hooks.forEach(hook => hook(this));
   }
 
-  reset() {
+  reset = () => {
     this.result = null;
     this.isExecuting = false;
     this.isError = false;
@@ -116,5 +118,5 @@ export default class Request {
     this._promise = Promise;
 
     return this;
-  }
+  };
 }