Merge branch 'develop' into feature/features-api

19 files changed, 76 insertions, 80 deletions

diff --git a/src/containers/auth/AuthLayoutContainer.js b/src/containers/auth/AuthLayoutContainer.js
index f362b1800..b73598f3d 100644
--- a/src/containers/auth/AuthLayoutContainer.js
+++ b/src/containers/auth/AuthLayoutContainer.js
@@ -9,8 +9,7 @@ import AppLoader from '../../components/ui/AppLoader';
 
 import { oneOrManyChildElements } from '../../prop-types';
 
-@inject('stores', 'actions') @observer
-export default class AuthLayoutContainer extends Component {
+export default @inject('stores', 'actions') @observer class AuthLayoutContainer extends Component {
   static propTypes = {
     children: oneOrManyChildElements.isRequired,
     location: PropTypes.shape({
@@ -20,10 +19,10 @@ export default class AuthLayoutContainer extends Component {
 
   render() {
     const { stores, actions, children, location } = this.props;
-    const { features } = stores;
+    const { app, features, globalError } = stores;
 
-    const isLoadingBaseFeatures = features.baseFeaturesRequest.isExecuting
-      && !features.baseFeaturesRequest.wasExecuted;
+    const isLoadingBaseFeatures = features.defaultFeaturesRequest.isExecuting
+      && !features.defaultFeaturesRequest.wasExecuted;
 
     if (isLoadingBaseFeatures) {
       return (
@@ -33,12 +32,14 @@ export default class AuthLayoutContainer extends Component {
 
     return (
       <AuthLayout
-        error={stores.globalError.response}
+        error={globalError.response}
         pathname={location.pathname}
-        isOnline={stores.app.isOnline}
-        isAPIHealthy={!stores.app.healthCheckRequest.isError}
+        isOnline={app.isOnline}
+        isAPIHealthy={!app.healthCheckRequest.isError}
         retryHealthCheck={actions.app.healthCheck}
-        isHealthCheckLoading={stores.app.healthCheckRequest.isExecuting}
+        isHealthCheckLoading={app.healthCheckRequest.isExecuting}
+        isFullScreen={app.isFullScreen}
+        darkMode={app.isSystemDarkModeEnabled}
       >
         {children}
       </AuthLayout>
diff --git a/src/containers/auth/ImportScreen.js b/src/containers/auth/ImportScreen.js
index ddd56ffb6..fc46f8b54 100644
--- a/src/containers/auth/ImportScreen.js
+++ b/src/containers/auth/ImportScreen.js
@@ -5,8 +5,7 @@ import Import from '../../components/auth/Import';
 import UserStore from '../../stores/UserStore';
 import { gaPage } from '../../lib/analytics';
 
-@inject('stores', 'actions') @observer
-export default class ImportScreen extends Component {
+export default @inject('stores', 'actions') @observer class ImportScreen extends Component {
   componentDidMount() {
     gaPage('Auth/Import');
   }
diff --git a/src/containers/auth/InviteScreen.js b/src/containers/auth/InviteScreen.js
index 059888c99..26bf97038 100644
--- a/src/containers/auth/InviteScreen.js
+++ b/src/containers/auth/InviteScreen.js
@@ -4,8 +4,7 @@ import { inject, observer } from 'mobx-react';
 import Invite from '../../components/auth/Invite';
 import { gaPage } from '../../lib/analytics';
 
-@inject('stores', 'actions') @observer
-export default class InviteScreen extends Component {
+export default @inject('stores', 'actions') @observer class InviteScreen extends Component {
   componentDidMount() {
     gaPage('Auth/Invite');
   }
diff --git a/src/containers/auth/LoginScreen.js b/src/containers/auth/LoginScreen.js
index 9e22c5141..865bd38f8 100644
--- a/src/containers/auth/LoginScreen.js
+++ b/src/containers/auth/LoginScreen.js
@@ -7,8 +7,7 @@ import { gaPage } from '../../lib/analytics';
 
 import { globalError as globalErrorPropType } from '../../prop-types';
 
-@inject('stores', 'actions') @observer
-export default class LoginScreen extends Component {
+export default @inject('stores', 'actions') @observer class LoginScreen extends Component {
   static propTypes = {
     error: globalErrorPropType.isRequired,
   };
diff --git a/src/containers/auth/PasswordScreen.js b/src/containers/auth/PasswordScreen.js
index d88cb08e6..236fd2031 100644
--- a/src/containers/auth/PasswordScreen.js
+++ b/src/containers/auth/PasswordScreen.js
@@ -5,8 +5,7 @@ import Password from '../../components/auth/Password';
 import UserStore from '../../stores/UserStore';
 import { gaPage } from '../../lib/analytics';
 
-@inject('stores', 'actions') @observer
-export default class PasswordScreen extends Component {
+export default @inject('stores', 'actions') @observer class PasswordScreen extends Component {
   componentDidMount() {
     gaPage('Auth/Password Retrieve');
   }
diff --git a/src/containers/auth/PricingScreen.js b/src/containers/auth/PricingScreen.js
index 7e1586535..34b512e15 100644
--- a/src/containers/auth/PricingScreen.js
+++ b/src/containers/auth/PricingScreen.js
@@ -10,8 +10,7 @@ import { gaPage } from '../../lib/analytics';
 
 import { globalError as globalErrorPropType } from '../../prop-types';
 
-@inject('stores', 'actions') @observer
-export default class PricingScreen extends Component {
+export default @inject('stores', 'actions') @observer class PricingScreen extends Component {
   static propTypes = {
     error: globalErrorPropType.isRequired,
   };
diff --git a/src/containers/auth/SignupScreen.js b/src/containers/auth/SignupScreen.js
index 3b86ab138..caf75de90 100644
--- a/src/containers/auth/SignupScreen.js
+++ b/src/containers/auth/SignupScreen.js
@@ -8,8 +8,7 @@ import { gaPage } from '../../lib/analytics';
 
 import { globalError as globalErrorPropType } from '../../prop-types';
 
-@inject('stores', 'actions') @observer
-export default class SignupScreen extends Component {
+export default @inject('stores', 'actions') @observer class SignupScreen extends Component {
   static propTypes = {
     error: globalErrorPropType.isRequired,
   };
diff --git a/src/containers/auth/WelcomeScreen.js b/src/containers/auth/WelcomeScreen.js
index e413264a6..2c120f81c 100644
--- a/src/containers/auth/WelcomeScreen.js
+++ b/src/containers/auth/WelcomeScreen.js
@@ -7,8 +7,7 @@ import UserStore from '../../stores/UserStore';
 import RecipePreviewsStore from '../../stores/RecipePreviewsStore';
 import { gaPage } from '../../lib/analytics';
 
-@inject('stores', 'actions') @observer
-export default class LoginScreen extends Component {
+export default @inject('stores', 'actions') @observer class LoginScreen extends Component {
   componentDidMount() {
     gaPage('Auth/Welcome');
   }
diff --git a/src/containers/layout/AppLayoutContainer.js b/src/containers/layout/AppLayoutContainer.js
index 7a398ed2d..affc1a0a2 100644
--- a/src/containers/layout/AppLayoutContainer.js
+++ b/src/containers/layout/AppLayoutContainer.js
@@ -18,8 +18,7 @@ import Sidebar from '../../components/layout/Sidebar';
 import Services from '../../components/services/content/Services';
 import AppLoader from '../../components/ui/AppLoader';
 
-@inject('stores', 'actions') @observer
-export default class AppLayoutContainer extends Component {
+export default @inject('stores', 'actions') @observer class AppLayoutContainer extends Component {
   static defaultProps = {
     children: null,
   };
@@ -82,7 +81,7 @@ export default class AppLayoutContainer extends Component {
       <Sidebar
         services={services.allDisplayed}
         setActive={setActive}
-        isAppMuted={settings.all.isAppMuted}
+        isAppMuted={settings.all.app.isAppMuted}
         openSettings={openSettings}
         closeSettings={closeSettings}
         reorder={reorder}
@@ -92,25 +91,26 @@ export default class AppLayoutContainer extends Component {
         deleteService={deleteService}
         updateService={updateService}
         toggleMuteApp={toggleMuteApp}
-        showMessageBadgeWhenMutedSetting={settings.all.showMessageBadgeWhenMuted}
+        showMessageBadgeWhenMutedSetting={settings.all.app.showMessageBadgeWhenMuted}
         showMessageBadgesEvenWhenMuted={ui.showMessageBadgesEvenWhenMuted}
       />
     );
 
     const servicesContainer = (
       <Services
-        services={services.allDisplayed}
+        services={services.allDisplayedUnordered}
         handleIPCMessage={handleIPCMessage}
         setWebviewReference={setWebviewReference}
         openWindow={openWindow}
         reload={reload}
-        isAppMuted={settings.all.isAppMuted}
+        isAppMuted={settings.all.app.isAppMuted}
         update={updateService}
       />
     );
 
     return (
       <AppLayout
+        isFullScreen={app.isFullScreen}
         isOnline={app.isOnline}
         showServicesUpdatedInfoBar={ui.showServicesUpdatedInfoBar}
         appUpdateIsDownloaded={app.updateStatus === app.updateStatusTypes.DOWNLOADED}
@@ -125,6 +125,7 @@ export default class AppLayoutContainer extends Component {
         areRequiredRequestsSuccessful={requests.areRequiredRequestsSuccessful}
         retryRequiredRequests={retryRequiredRequests}
         areRequiredRequestsLoading={requests.areRequiredRequestsLoading}
+        darkMode={settings.all.app.darkMode}
       >
         {React.Children.count(children) > 0 ? children : null}
       </AppLayout>
diff --git a/src/containers/settings/AccountScreen.js b/src/containers/settings/AccountScreen.js
index c5c2982b0..5818af0b1 100644
--- a/src/containers/settings/AccountScreen.js
+++ b/src/containers/settings/AccountScreen.js
@@ -12,8 +12,7 @@ import AccountDashboard from '../../components/settings/account/AccountDashboard
 
 const { BrowserWindow } = remote;
 
-@inject('stores', 'actions') @observer
-export default class AccountScreen extends Component {
+export default @inject('stores', 'actions') @observer class AccountScreen extends Component {
   componentDidMount() {
     gaPage('Settings/Account Dashboard');
   }
diff --git a/src/containers/settings/EditServiceScreen.js b/src/containers/settings/EditServiceScreen.js
index f2d5550e1..17d727642 100644
--- a/src/containers/settings/EditServiceScreen.js
+++ b/src/containers/settings/EditServiceScreen.js
@@ -7,6 +7,7 @@ import UserStore from '../../stores/UserStore';
 import RecipesStore from '../../stores/RecipesStore';
 import ServicesStore from '../../stores/ServicesStore';
 import FeaturesStore from '../../stores/FeaturesStore';
+import SettingsStore from '../../stores/SettingsStore';
 import Form from '../../lib/Form';
 import { gaPage } from '../../lib/analytics';
 
@@ -51,10 +52,13 @@ const messages = defineMessages({
     id: 'settings.service.form.icon',
     defaultMessage: '!!!Custom icon',
   },
+  enableDarkMode: {
+    id: 'settings.service.form.enableDarkMode',
+    defaultMessage: '!!!Enable Dark Mode',
+  },
 });
 
-@inject('stores', 'actions') @observer
-export default class EditServiceScreen extends Component {
+export default @inject('stores', 'actions') @observer class EditServiceScreen extends Component {
   static contextTypes = {
     intl: intlShape,
   };
@@ -113,6 +117,11 @@ export default class EditServiceScreen extends Component {
           default: null,
           type: 'file',
         },
+        isDarkModeEnabled: {
+          label: intl.formatMessage(messages.enableDarkMode),
+          value: service.isDarkModeEnabled,
+          default: this.props.stores.settings.all.app.darkMode,
+        },
       },
     };
 
@@ -245,6 +254,7 @@ EditServiceScreen.wrappedComponent.propTypes = {
     recipes: PropTypes.instanceOf(RecipesStore).isRequired,
     services: PropTypes.instanceOf(ServicesStore).isRequired,
     features: PropTypes.instanceOf(FeaturesStore).isRequired,
+    settings: PropTypes.instanceOf(SettingsStore).isRequired,
   }).isRequired,
   router: PropTypes.shape({
     params: PropTypes.shape({
diff --git a/src/containers/settings/EditSettingsScreen.js b/src/containers/settings/EditSettingsScreen.js
index 1fa7ce8bc..df6442eb8 100644
--- a/src/containers/settings/EditSettingsScreen.js
+++ b/src/containers/settings/EditSettingsScreen.js
@@ -39,6 +39,10 @@ const messages = defineMessages({
     id: 'settings.app.form.language',
     defaultMessage: '!!!Language',
   },
+  darkMode: {
+    id: 'settings.app.form.darkMode',
+    defaultMessage: '!!!Dark Mode',
+  },
   showDisabledServices: {
     id: 'settings.app.form.showDisabledServices',
     defaultMessage: '!!!Display disabled services tabs',
@@ -51,22 +55,21 @@ const messages = defineMessages({
     id: 'settings.app.form.enableSpellchecking',
     defaultMessage: '!!!Enable spell checking',
   },
+  enableGPUAcceleration: {
+    id: 'settings.app.form.enableGPUAcceleration',
+    defaultMessage: '!!!Enable GPU Acceleration',
+  },
   spellcheckingLanguage: {
     id: 'settings.app.form.spellcheckingLanguage',
     defaultMessage: '!!!Language for spell checking',
   },
-  // spellcheckingAutomaticDetection: {
-  //   id: 'settings.app.form.spellcheckingAutomaticDetection',
-  //   defaultMessage: '!!!Detect language automatically',
-  // },
   beta: {
     id: 'settings.app.form.beta',
     defaultMessage: '!!!Include beta versions',
   },
 });
 
-@inject('stores', 'actions') @observer
-export default class EditSettingsScreen extends Component {
+export default @inject('stores', 'actions') @observer class EditSettingsScreen extends Component {
   static contextTypes = {
     intl: intlShape,
   };
@@ -84,22 +87,25 @@ export default class EditSettingsScreen extends Component {
     });
 
     settings.update({
-      settings: {
+      type: 'app',
+      data: {
         runInBackground: settingsData.runInBackground,
         enableSystemTray: settingsData.enableSystemTray,
         minimizeToSystemTray: settingsData.minimizeToSystemTray,
+        enableGPUAcceleration: settingsData.enableGPUAcceleration,
         showDisabledServices: settingsData.showDisabledServices,
+        darkMode: settingsData.darkMode,
         showMessageBadgeWhenMuted: settingsData.showMessageBadgeWhenMuted,
         enableSpellchecking: settingsData.enableSpellchecking,
-        // spellcheckingLanguage: settingsData.spellcheckingLanguage,
-        locale: settingsData.locale,
-        beta: settingsData.beta,
+        beta: settingsData.beta, // we need this info in the main process as well
+        locale: settingsData.locale, // we need this info in the main process as well
       },
     });
 
     user.update({
       userData: {
         beta: settingsData.beta,
+        locale: settingsData.locale,
       },
     });
   }
@@ -116,17 +122,6 @@ export default class EditSettingsScreen extends Component {
       });
     });
 
-    // const spellcheckerLocales = [{
-    //   value: 'auto',
-    //   label: intl.formatMessage(messages.spellcheckingAutomaticDetection),
-    // }];
-    // Object.keys(SPELLCHECKER_LOCALES).forEach((key) => {
-    //   spellcheckerLocales.push({
-    //     value: key,
-    //     label: SPELLCHECKER_LOCALES[key],
-    //   });
-    // });
-
     const config = {
       fields: {
         autoLaunchOnStart: {
@@ -141,40 +136,44 @@ export default class EditSettingsScreen extends Component {
         },
         runInBackground: {
           label: intl.formatMessage(messages.runInBackground),
-          value: settings.all.runInBackground,
+          value: settings.all.app.runInBackground,
           default: DEFAULT_APP_SETTINGS.runInBackground,
         },
         enableSystemTray: {
           label: intl.formatMessage(messages.enableSystemTray),
-          value: settings.all.enableSystemTray,
+          value: settings.all.app.enableSystemTray,
           default: DEFAULT_APP_SETTINGS.enableSystemTray,
         },
         minimizeToSystemTray: {
           label: intl.formatMessage(messages.minimizeToSystemTray),
-          value: settings.all.minimizeToSystemTray,
+          value: settings.all.app.minimizeToSystemTray,
           default: DEFAULT_APP_SETTINGS.minimizeToSystemTray,
         },
         showDisabledServices: {
           label: intl.formatMessage(messages.showDisabledServices),
-          value: settings.all.showDisabledServices,
+          value: settings.all.app.showDisabledServices,
           default: DEFAULT_APP_SETTINGS.showDisabledServices,
         },
         showMessageBadgeWhenMuted: {
           label: intl.formatMessage(messages.showMessageBadgeWhenMuted),
-          value: settings.all.showMessageBadgeWhenMuted,
+          value: settings.all.app.showMessageBadgeWhenMuted,
           default: DEFAULT_APP_SETTINGS.showMessageBadgeWhenMuted,
         },
         enableSpellchecking: {
           label: intl.formatMessage(messages.enableSpellchecking),
-          value: settings.all.enableSpellchecking,
+          value: settings.all.app.enableSpellchecking,
           default: DEFAULT_APP_SETTINGS.enableSpellchecking,
         },
-        // spellcheckingLanguage: {
-        //   label: intl.formatMessage(messages.spellcheckingLanguage),
-        //   value: settings.all.spellcheckingLanguage,
-        //   options: spellcheckerLocales,
-        //   default: DEFAULT_APP_SETTINGS.spellcheckingLanguage,
-        // },
+        darkMode: {
+          label: intl.formatMessage(messages.darkMode),
+          value: settings.all.app.darkMode,
+          default: DEFAULT_APP_SETTINGS.darkMode,
+        },
+        enableGPUAcceleration: {
+          label: intl.formatMessage(messages.enableGPUAcceleration),
+          value: settings.all.app.enableGPUAcceleration,
+          default: DEFAULT_APP_SETTINGS.enableGPUAcceleration,
+        },
         locale: {
           label: intl.formatMessage(messages.language),
           value: app.locale,
diff --git a/src/containers/settings/EditUserScreen.js b/src/containers/settings/EditUserScreen.js
index a67fa7fb5..3da3e8d2c 100644
--- a/src/containers/settings/EditUserScreen.js
+++ b/src/containers/settings/EditUserScreen.js
@@ -50,8 +50,7 @@ const messages = defineMessages({
   },
 });
 
-@inject('stores', 'actions') @observer
-export default class EditUserScreen extends Component {
+export default @inject('stores', 'actions') @observer class EditUserScreen extends Component {
   static contextTypes = {
     intl: intlShape,
   };
diff --git a/src/containers/settings/InviteScreen.js b/src/containers/settings/InviteScreen.js
index 5f341b1b3..38ca6ec74 100644
--- a/src/containers/settings/InviteScreen.js
+++ b/src/containers/settings/InviteScreen.js
@@ -5,8 +5,7 @@ import { inject, observer } from 'mobx-react';
 import Invite from '../../components/auth/Invite';
 import { gaPage } from '../../lib/analytics';
 
-@inject('stores', 'actions') @observer
-export default class InviteScreen extends Component {
+export default @inject('stores', 'actions') @observer class InviteScreen extends Component {
   componentDidMount() {
     gaPage('Settings/Invite');
   }
diff --git a/src/containers/settings/RecipesScreen.js b/src/containers/settings/RecipesScreen.js
index 65341e9e3..4efe81505 100644
--- a/src/containers/settings/RecipesScreen.js
+++ b/src/containers/settings/RecipesScreen.js
@@ -11,8 +11,7 @@ import { gaPage } from '../../lib/analytics';
 
 import RecipesDashboard from '../../components/settings/recipes/RecipesDashboard';
 
-@inject('stores', 'actions') @observer
-export default class RecipesScreen extends Component {
+export default @inject('stores', 'actions') @observer class RecipesScreen extends Component {
   static propTypes = {
     params: PropTypes.shape({
       filter: PropTypes.string,
diff --git a/src/containers/settings/ServicesScreen.js b/src/containers/settings/ServicesScreen.js
index 12db1bcd3..c1a133ef7 100644
--- a/src/containers/settings/ServicesScreen.js
+++ b/src/containers/settings/ServicesScreen.js
@@ -10,8 +10,7 @@ import { gaPage } from '../../lib/analytics';
 
 import ServicesDashboard from '../../components/settings/services/ServicesDashboard';
 
-@inject('stores', 'actions') @observer
-export default class ServicesScreen extends Component {
+export default @inject('stores', 'actions') @observer class ServicesScreen extends Component {
   componentDidMount() {
     gaPage('Settings/Service Dashboard');
   }
diff --git a/src/containers/settings/SettingsWindow.js b/src/containers/settings/SettingsWindow.js
index 13ca96f72..55589d0be 100644
--- a/src/containers/settings/SettingsWindow.js
+++ b/src/containers/settings/SettingsWindow.js
@@ -7,8 +7,7 @@ import ServicesStore from '../../stores/ServicesStore';
 import Layout from '../../components/settings/SettingsLayout';
 import Navigation from '../../components/settings/navigation/SettingsNavigation';
 
-@inject('stores', 'actions') @observer
-export default class SettingsContainer extends Component {
+export default @inject('stores', 'actions') @observer class SettingsContainer extends Component {
   render() {
     const { children, stores } = this.props;
     const { closeSettings } = this.props.actions.ui;
diff --git a/src/containers/subscription/SubscriptionFormScreen.js b/src/containers/subscription/SubscriptionFormScreen.js
index fc6e3c4be..9f7571bda 100644
--- a/src/containers/subscription/SubscriptionFormScreen.js
+++ b/src/containers/subscription/SubscriptionFormScreen.js
@@ -9,8 +9,7 @@ import SubscriptionForm from '../../components/subscription/SubscriptionForm';
 
 const { BrowserWindow } = remote;
 
-@inject('stores', 'actions') @observer
-export default class SubscriptionFormScreen extends Component {
+export default @inject('stores', 'actions') @observer class SubscriptionFormScreen extends Component {
   static propTypes = {
     onCloseWindow: PropTypes.func,
     content: PropTypes.oneOrManyChildElements,
diff --git a/src/containers/subscription/SubscriptionPopupScreen.js b/src/containers/subscription/SubscriptionPopupScreen.js
index bb0603170..6641f236d 100644
--- a/src/containers/subscription/SubscriptionPopupScreen.js
+++ b/src/containers/subscription/SubscriptionPopupScreen.js
@@ -5,8 +5,7 @@ import { inject, observer } from 'mobx-react';
 import SubscriptionPopup from '../../components/subscription/SubscriptionPopup';
 
 
-@inject('stores', 'actions') @observer
-export default class SubscriptionPopupScreen extends Component {
+export default @inject('stores', 'actions') @observer class SubscriptionPopupScreen extends Component {
   state = {
     complete: false,
   };