finish workspaces mvp

14 files changed, 193 insertions, 57 deletions

diff --git a/src/actions/index.js b/src/actions/index.js
index 45e6da515..00f843cd6 100644
--- a/src/actions/index.js
+++ b/src/actions/index.js
@@ -11,7 +11,7 @@ import payment from './payment';
 import news from './news';
 import settings from './settings';
 import requests from './requests';
-import workspace from '../features/workspaces/actions';
+import workspaces from '../features/workspaces/actions';
 
 const actions = Object.assign({}, {
   service,
@@ -24,7 +24,9 @@ const actions = Object.assign({}, {
   news,
   settings,
   requests,
-  workspace,
 });
 
-export default defineActions(actions, PropTypes.checkPropTypes);
+export default Object.assign(
+  defineActions(actions, PropTypes.checkPropTypes),
+  { workspaces },
+);
diff --git a/src/actions/lib/actions.js b/src/actions/lib/actions.js
index 499018d70..6571e9441 100644
--- a/src/actions/lib/actions.js
+++ b/src/actions/lib/actions.js
@@ -1,18 +1,23 @@
+export const createActionsFromDefinitions = (actionDefinitions, validate) => {
+  const actions = {};
+  Object.keys(actionDefinitions).forEach((actionName) => {
+    const action = (params) => {
+      const schema = actionDefinitions[actionName];
+      validate(schema, params, actionName);
+      action.notify(params);
+    };
+    actions[actionName] = action;
+    action.listeners = [];
+    action.listen = listener => action.listeners.push(listener);
+    action.notify = params => action.listeners.forEach(listener => listener(params));
+  });
+  return actions;
+};
+
 export default (definitions, validate) => {
   const newActions = {};
   Object.keys(definitions).forEach((scopeName) => {
-    newActions[scopeName] = {};
-    Object.keys(definitions[scopeName]).forEach((actionName) => {
-      const action = (params) => {
-        const schema = definitions[scopeName][actionName];
-        validate(schema, params, actionName);
-        action.notify(params);
-      };
-      newActions[scopeName][actionName] = action;
-      action.listeners = [];
-      action.listen = listener => action.listeners.push(listener);
-      action.notify = params => action.listeners.forEach(listener => listener(params));
-    });
+    newActions[scopeName] = createActionsFromDefinitions(definitions[scopeName], validate);
   });
   return newActions;
 };
diff --git a/src/components/layout/Sidebar.js b/src/components/layout/Sidebar.js
index 609a3b604..fcc5b0001 100644
--- a/src/components/layout/Sidebar.js
+++ b/src/components/layout/Sidebar.js
@@ -31,7 +31,7 @@ export default @observer class Sidebar extends Component {
     openSettings: PropTypes.func.isRequired,
     toggleMuteApp: PropTypes.func.isRequired,
     isAppMuted: PropTypes.bool.isRequired,
-  }
+  };
 
   static contextTypes = {
     intl: intlShape,
diff --git a/src/components/services/tabs/Tabbar.js b/src/components/services/tabs/Tabbar.js
index dd5c2140f..5e8260ad0 100644
--- a/src/components/services/tabs/Tabbar.js
+++ b/src/components/services/tabs/Tabbar.js
@@ -19,7 +19,7 @@ export default @observer class TabBar extends Component {
     updateService: PropTypes.func.isRequired,
     showMessageBadgeWhenMutedSetting: PropTypes.bool.isRequired,
     showMessageBadgesEvenWhenMuted: PropTypes.bool.isRequired,
-  }
+  };
 
   onSortEnd = ({ oldIndex, newIndex }) => {
     const {
@@ -45,7 +45,7 @@ export default @observer class TabBar extends Component {
         redirect: false,
       });
     }
-  }
+  };
 
   disableService({ serviceId }) {
     this.toggleService({ serviceId, isEnabled: false });
diff --git a/src/features/workspaces/actions.js b/src/features/workspaces/actions.js
index 84de2b011..25246de09 100644
--- a/src/features/workspaces/actions.js
+++ b/src/features/workspaces/actions.js
@@ -1,7 +1,8 @@
 import PropTypes from 'prop-types';
 import Workspace from './models/Workspace';
+import { createActionsFromDefinitions } from '../../actions/lib/actions';
 
-export default {
+export default createActionsFromDefinitions({
   edit: {
     workspace: PropTypes.instanceOf(Workspace).isRequired,
   },
@@ -14,4 +15,8 @@ export default {
   update: {
     workspace: PropTypes.instanceOf(Workspace).isRequired,
   },
-};
+  activate: {
+    workspace: PropTypes.instanceOf(Workspace).isRequired,
+  },
+  deactivate: {},
+}, PropTypes.checkPropTypes);
diff --git a/src/features/workspaces/containers/EditWorkspaceScreen.js b/src/features/workspaces/containers/EditWorkspaceScreen.js
index 790b8a0fe..1b13bc2d4 100644
--- a/src/features/workspaces/containers/EditWorkspaceScreen.js
+++ b/src/features/workspaces/containers/EditWorkspaceScreen.js
@@ -4,7 +4,7 @@ import PropTypes from 'prop-types';
 
 import ErrorBoundary from '../../../components/util/ErrorBoundary';
 import EditWorkspaceForm from '../components/EditWorkspaceForm';
-import { state } from '../state';
+import { workspacesState } from '../state';
 import ServicesStore from '../../../stores/ServicesStore';
 import Workspace from '../models/Workspace';
 
@@ -22,23 +22,23 @@ class EditWorkspaceScreen extends Component {
   };
 
   onDelete = () => {
-    const { workspaceBeingEdited } = state;
+    const { workspaceBeingEdited } = workspacesState;
     const { actions } = this.props;
     if (!workspaceBeingEdited) return null;
-    actions.workspace.delete({ workspace: workspaceBeingEdited });
+    actions.workspaces.delete({ workspace: workspaceBeingEdited });
   };
 
   onSave = (values) => {
-    const { workspaceBeingEdited } = state;
+    const { workspaceBeingEdited } = workspacesState;
     const { actions } = this.props;
     const workspace = new Workspace(
       Object.assign({}, workspaceBeingEdited, values),
     );
-    actions.workspace.update({ workspace });
+    actions.workspaces.update({ workspace });
   };
 
   render() {
-    const { workspaceBeingEdited } = state;
+    const { workspaceBeingEdited } = workspacesState;
     const { stores } = this.props;
     if (!workspaceBeingEdited) return null;
     return (
diff --git a/src/features/workspaces/containers/WorkspacesScreen.js b/src/features/workspaces/containers/WorkspacesScreen.js
index b89cbcf67..94e714255 100644
--- a/src/features/workspaces/containers/WorkspacesScreen.js
+++ b/src/features/workspaces/containers/WorkspacesScreen.js
@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
 import { inject, observer } from 'mobx-react';
 import PropTypes from 'prop-types';
-import { state } from '../state';
+import { workspacesState } from '../state';
 import WorkspacesDashboard from '../components/WorkspacesDashboard';
 import ErrorBoundary from '../../../components/util/ErrorBoundary';
 
@@ -20,10 +20,10 @@ class WorkspacesScreen extends Component {
     return (
       <ErrorBoundary>
         <WorkspacesDashboard
-          workspaces={state.workspaces}
-          isLoading={state.isLoading}
-          onCreateWorkspaceSubmit={data => actions.workspace.create(data)}
-          onWorkspaceClick={w => actions.workspace.edit({ workspace: w })}
+          workspaces={workspacesState.workspaces}
+          isLoading={workspacesState.isLoading}
+          onCreateWorkspaceSubmit={data => actions.workspaces.create(data)}
+          onWorkspaceClick={w => actions.workspaces.edit({ workspace: w })}
         />
       </ErrorBoundary>
     );
diff --git a/src/features/workspaces/index.js b/src/features/workspaces/index.js
index 50ac3b414..8091f49fc 100644
--- a/src/features/workspaces/index.js
+++ b/src/features/workspaces/index.js
@@ -1,14 +1,28 @@
-import { reaction } from 'mobx';
+import { reaction, runInAction } from 'mobx';
 import WorkspacesStore from './store';
 import api from './api';
-import { state, resetState } from './state';
+import { workspacesState, resetState } from './state';
 
 const debug = require('debug')('Franz:feature:workspaces');
 
 let store = null;
 
+export const filterServicesByActiveWorkspace = (services) => {
+  const { isFeatureActive, activeWorkspace } = workspacesState;
+  if (isFeatureActive && activeWorkspace) {
+    return services.filter(s => activeWorkspace.services.includes(s.id));
+  }
+  return services;
+};
+
+export const getActiveWorkspaceServices = (services) => {
+  return filterServicesByActiveWorkspace(services);
+};
+
 export default function initWorkspaces(stores, actions) {
   const { features, user } = stores;
+
+  // Toggle workspace feature
   reaction(
     () => (
       features.features.isWorkspaceEnabled && (
@@ -18,10 +32,12 @@ export default function initWorkspaces(stores, actions) {
     (isEnabled) => {
       if (isEnabled) {
         debug('Initializing `workspaces` feature');
-        store = new WorkspacesStore(stores, api, actions, state);
+        store = new WorkspacesStore(stores, api, actions, workspacesState);
         store.initialize();
+        runInAction(() => { workspacesState.isFeatureActive = true; });
       } else if (store) {
         debug('Disabling `workspaces` feature');
+        runInAction(() => { workspacesState.isFeatureActive = false; });
         store.teardown();
         store = null;
         resetState(); // Reset state to default
@@ -31,4 +47,22 @@ export default function initWorkspaces(stores, actions) {
       fireImmediately: true,
     },
   );
+
+  // Update active service on workspace switches
+  reaction(() => ({
+    isFeatureActive: workspacesState.isFeatureActive,
+    activeWorkspace: workspacesState.activeWorkspace,
+  }), ({ isFeatureActive, activeWorkspace }) => {
+    if (!isFeatureActive) return;
+    if (activeWorkspace) {
+      const services = stores.services.allDisplayed;
+      const activeService = services.find(s => s.isActive);
+      const workspaceServices = filterServicesByActiveWorkspace(services);
+      const isActiveServiceInWorkspace = workspaceServices.includes(activeService);
+      if (!isActiveServiceInWorkspace) {
+        console.log(workspaceServices[0].id);
+        actions.service.setActive({ serviceId: workspaceServices[0].id });
+      }
+    }
+  });
 }
diff --git a/src/features/workspaces/state.js b/src/features/workspaces/state.js
index f938c1470..963b96f81 100644
--- a/src/features/workspaces/state.js
+++ b/src/features/workspaces/state.js
@@ -1,13 +1,15 @@
 import { observable } from 'mobx';
 
 const defaultState = {
+  activeWorkspace: null,
   isLoading: false,
+  isFeatureActive: false,
   workspaces: [],
   workspaceBeingEdited: null,
 };
 
-export const state = observable(defaultState);
+export const workspacesState = observable(defaultState);
 
 export function resetState() {
-  Object.assign(state, defaultState);
+  Object.assign(workspacesState, defaultState);
 }
diff --git a/src/features/workspaces/store.js b/src/features/workspaces/store.js
index 5cccb2ab7..a2997a0d2 100644
--- a/src/features/workspaces/store.js
+++ b/src/features/workspaces/store.js
@@ -1,8 +1,9 @@
-import { observable, reaction } from 'mobx';
+import { observable, reaction, action } from 'mobx';
 import Store from '../../stores/lib/Store';
 import CachedRequest from '../../stores/lib/CachedRequest';
 import Workspace from './models/Workspace';
 import { matchRoute } from '../../helpers/routing-helpers';
+import workspaceActions from './actions';
 
 const debug = require('debug')('Franz:feature:workspaces');
 
@@ -48,28 +49,30 @@ export default class WorkspacesStore extends Store {
       },
     );
 
-    this.actions.workspace.edit.listen(this._edit);
-    this.actions.workspace.create.listen(this._create);
-    this.actions.workspace.delete.listen(this._delete);
-    this.actions.workspace.update.listen(this._update);
+    workspaceActions.edit.listen(this._edit);
+    workspaceActions.create.listen(this._create);
+    workspaceActions.delete.listen(this._delete);
+    workspaceActions.update.listen(this._update);
+    workspaceActions.activate.listen(this._setActiveWorkspace);
+    workspaceActions.deactivate.listen(this._deactivateActiveWorkspace);
   }
 
-  _setWorkspaces = (workspaces) => {
+  _getWorkspaceById = id => this.state.workspaces.find(w => w.id === id);
+
+  @action _setWorkspaces = (workspaces) => {
     debug('setting user workspaces', workspaces.slice());
     this.state.workspaces = workspaces.map(data => new Workspace(data));
   };
 
-  _setIsLoading = (isLoading) => {
+  @action _setIsLoading = (isLoading) => {
     this.state.isLoading = isLoading;
   };
 
-  _getWorkspaceById = id => this.state.workspaces.find(w => w.id === id);
-
-  _edit = ({ workspace }) => {
+  @action _edit = ({ workspace }) => {
     this.stores.router.push(`/settings/workspaces/edit/${workspace.id}`);
   };
 
-  _create = async ({ name }) => {
+  @action _create = async ({ name }) => {
     try {
       const result = await this.api.createWorkspace(name);
       const workspace = new Workspace(result);
@@ -80,7 +83,7 @@ export default class WorkspacesStore extends Store {
     }
   };
 
-  _delete = async ({ workspace }) => {
+  @action _delete = async ({ workspace }) => {
     try {
       await this.api.deleteWorkspace(workspace);
       this.state.workspaces.remove(workspace);
@@ -90,7 +93,7 @@ export default class WorkspacesStore extends Store {
     }
   };
 
-  _update = async ({ workspace }) => {
+  @action _update = async ({ workspace }) => {
     try {
       await this.api.updateWorkspace(workspace);
       const localWorkspace = this.state.workspaces.find(ws => ws.id === workspace.id);
@@ -100,4 +103,12 @@ export default class WorkspacesStore extends Store {
       throw error;
     }
   };
+
+  @action _setActiveWorkspace = ({ workspace }) => {
+    this.state.activeWorkspace = workspace;
+  };
+
+  @action _deactivateActiveWorkspace = () => {
+    this.state.activeWorkspace = null;
+  };
 }
diff --git a/src/i18n/locales/de.json b/src/i18n/locales/de.json
index 4906070a3..0c1fb8aa6 100644
--- a/src/i18n/locales/de.json
+++ b/src/i18n/locales/de.json
@@ -74,6 +74,9 @@
    "menu.window" : "Fenster",
    "menu.window.close" : "Schließen",
    "menu.window.minimize" : "Minimieren",
+   "menu.workspaces": "Workspaces",
+   "menu.workspaces.defaultWorkspace": "All services",
+   "menu.workspaces.addNewWorkspace": "Add New Workspace",
    "password.email.label" : "E-Mail Adresse",
    "password.headline" : "Passwort zurücksetzen",
    "password.link.login" : "An Deinem Konto anmelden",
@@ -224,7 +227,7 @@
    "settings.workspace.form.name": "Name",
    "settings.workspace.form.buttonDelete": "Workspace löschen",
    "settings.workspace.form.buttonSave": "Workspace speichern",
-  "settings.workspace.form.servicesInWorkspaceHeadline": "Services in diesem Workspace",
+   "settings.workspace.form.servicesInWorkspaceHeadline": "Services in diesem Workspace",
    "settings.user.form.accountType.company" : "Firma",
    "settings.user.form.accountType.individual" : "Einzelperson",
    "settings.user.form.accountType.label" : "Konto-Typ",
diff --git a/src/i18n/locales/en-US.json b/src/i18n/locales/en-US.json
index 988ac46f2..2a51662a2 100644
--- a/src/i18n/locales/en-US.json
+++ b/src/i18n/locales/en-US.json
@@ -276,7 +276,10 @@
   "menu.app.hideOthers": "Hide Others",
   "menu.app.unhide": "Unhide",
   "menu.app.quit": "Quit",
-  "menu.services.addNewService": "Add New Service...",
+  "menu.services.addNewService": "Add New Service",
+  "menu.workspaces": "Workspaces",
+  "menu.workspaces.defaultWorkspace": "All services",
+  "menu.workspaces.addNewWorkspace": "Add New Workspace",
   "validation.required": "{field} is required",
   "validation.email": "{field} is not valid",
   "validation.url": "{field} is not a valid URL",
diff --git a/src/lib/Menu.js b/src/lib/Menu.js
index c378619ad..1560dd285 100644
--- a/src/lib/Menu.js
+++ b/src/lib/Menu.js
@@ -3,6 +3,8 @@ import { observable, autorun, computed } from 'mobx';
 import { defineMessages } from 'react-intl';
 
 import { isMac, ctrlKey, cmdKey } from '../environment';
+import { workspacesState } from '../features/workspaces/state';
+import workspaceActions from '../features/workspaces/actions';
 
 const { app, Menu, dialog } = remote;
 
@@ -179,6 +181,18 @@ const menuItems = defineMessages({
     id: 'menu.services.addNewService',
     defaultMessage: '!!!Add New Service...',
   },
+  workspaces: {
+    id: 'menu.workspaces',
+    defaultMessage: '!!!Workspaces',
+  },
+  defaultWorkspace: {
+    id: 'menu.workspaces.defaultWorkspace',
+    defaultMessage: '!!!Default',
+  },
+  addNewWorkspace: {
+    id: 'menu.workspaces.addNewWorkspace',
+    defaultMessage: '!!!Add New Workspace...',
+  },
 });
 
 function getActiveWebview() {
@@ -266,6 +280,10 @@ const _templateFactory = intl => [
     submenu: [],
   },
   {
+    label: intl.formatMessage(menuItems.workspaces),
+    submenu: [],
+  },
+  {
     label: intl.formatMessage(menuItems.window),
     role: 'window',
     submenu: [
@@ -499,7 +517,9 @@ export default class FranzMenu {
   }
 
   _build() {
-    const serviceTpl = Object.assign([], this.serviceTpl); // need to clone object so we don't modify computed (cached) object
+    // need to clone object so we don't modify computed (cached) object
+    const serviceTpl = Object.assign([], this.serviceTpl);
+    const workspacesMenu = Object.assign([], this.workspacesMenu);
 
     if (window.franz === undefined) {
       return;
@@ -632,7 +652,7 @@ export default class FranzMenu {
         },
       );
 
-      tpl[4].submenu.unshift(about, {
+      tpl[5].submenu.unshift(about, {
         type: 'separator',
       });
     } else {
@@ -678,6 +698,8 @@ export default class FranzMenu {
       tpl[3].submenu = serviceTpl;
     }
 
+    tpl[4].submenu = workspacesMenu;
+
     this.currentTemplate = tpl;
     const menu = Menu.buildFromTemplate(tpl);
     Menu.setApplicationMenu(menu);
@@ -701,6 +723,51 @@ export default class FranzMenu {
     return [];
   }
 
+  @computed get workspacesMenu() {
+    const { workspaces, activeWorkspace } = workspacesState;
+    const { intl } = window.franz;
+    const menu = [];
+
+    // Add new workspace item:
+    menu.push({
+      label: intl.formatMessage(menuItems.addNewWorkspace),
+      accelerator: `${cmdKey}+Shift+N`,
+      click: () => {
+        this.actions.ui.openSettings({ path: 'workspaces' });
+      },
+      enabled: this.stores.user.isLoggedIn,
+    }, {
+      type: 'separator',
+    });
+
+    // Default workspace
+    menu.push({
+      label: intl.formatMessage(menuItems.defaultWorkspace),
+      accelerator: `${cmdKey}+Alt+1`,
+      type: 'radio',
+      checked: !activeWorkspace,
+      click: () => {
+        workspaceActions.deactivate();
+      },
+    });
+
+    // Workspace items
+    if (this.stores.user.isLoggedIn) {
+      workspaces.forEach((workspace, i) => menu.push({
+        label: workspace.name,
+        accelerator: i < 9 ? `${cmdKey}+Alt+${i + 2}` : null,
+        type: 'radio',
+        checked: activeWorkspace ? workspace.id === activeWorkspace.id : false,
+        click: () => {
+          workspaceActions.activate({ workspace });
+        },
+      }));
+    }
+
+    console.log(menu);
+    return menu;
+  }
+
   _getServiceName(service) {
     if (service.name) {
       return service.name;
diff --git a/src/stores/ServicesStore.js b/src/stores/ServicesStore.js
index c63bef196..a86db8103 100644
--- a/src/stores/ServicesStore.js
+++ b/src/stores/ServicesStore.js
@@ -2,7 +2,7 @@ import {
   action,
   reaction,
   computed,
-  observable,
+  observable, runInAction,
 } from 'mobx';
 import { debounce, remove } from 'lodash';
 import ms from 'ms';
@@ -12,6 +12,8 @@ import Request from './lib/Request';
 import CachedRequest from './lib/CachedRequest';
 import { matchRoute } from '../helpers/routing-helpers';
 import { gaEvent } from '../lib/analytics';
+import { workspacesState } from '../features/workspaces/state';
+import { filterServicesByActiveWorkspace, getActiveWorkspaceServices } from '../features/workspaces';
 
 const debug = require('debug')('Franz:ServiceStore');
 
@@ -98,7 +100,6 @@ export default class ServicesStore extends Store {
         return observable(services.slice().slice().sort((a, b) => a.order - b.order));
       }
     }
-
     return [];
   }
 
@@ -107,13 +108,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 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 getActiveWorkspaceServices(filteredServices);
   }
 
   @computed get filtered() {