4 files changed, 103 insertions, 68 deletions

diff --git a/src/components/services/content/ServiceView.js b/src/components/services/content/ServiceView.js
index d91016c71..444d5fea4 100644
--- a/src/components/services/content/ServiceView.js
+++ b/src/components/services/content/ServiceView.js
@@ -1,6 +1,6 @@
 import React, { Component, Fragment } from 'react';
 import PropTypes from 'prop-types';
-import { autorun, reaction } from 'mobx';
+import { autorun } from 'mobx';
 import { observer, inject } from 'mobx-react';
 import classnames from 'classnames';
 
@@ -27,11 +27,7 @@ export default @inject('stores', 'actions') @observer class ServiceView extends
     stores: PropTypes.shape({
       settings: PropTypes.instanceOf(SettingsStore).isRequired,
     }).isRequired,
-    actions: PropTypes.shape({
-      service: PropTypes.shape({
-        setHibernation: PropTypes.func.isRequired,
-      }).isRequired,
-    }).isRequired,
+    isSpellcheckerEnabled: PropTypes.bool.isRequired,
   };
 
   static defaultProps = {
@@ -50,12 +46,6 @@ export default @inject('stores', 'actions') @observer class ServiceView extends
 
   forceRepaintTimeout = null;
 
-  constructor(props) {
-    super(props);
-
-    this.startHibernationTimer = this.startHibernationTimer.bind(this);
-  }
-
   componentDidMount() {
     this.autorunDisposer = autorun(() => {
       if (this.props.service.isActive) {
@@ -65,32 +55,6 @@ export default @inject('stores', 'actions') @observer class ServiceView extends
         }, 100);
       }
     });
-
-    reaction(
-      () => this.props.service.isActive,
-      () => {
-        if (!this.props.service.isActive && this.props.stores.settings.all.app.hibernate) {
-          // Service is inactive - start hibernation countdown
-          this.startHibernationTimer();
-        } else {
-          if (this.hibernationTimer) {
-            // Service is active but we have an active hibernation timer: Clear timeout
-            clearTimeout(this.hibernationTimer);
-          }
-
-          // Service is active, wake up service from hibernation
-          this.props.actions.service.setHibernation({
-            serviceId: this.props.service.id,
-            hibernating: false,
-          });
-        }
-      },
-    );
-
-    // Start hibernation counter if we are in background
-    if (!this.props.service.isActive && this.props.stores.settings.all.app.hibernate) {
-      this.startHibernationTimer();
-    }
   }
 
   componentWillUnmount() {
@@ -110,19 +74,6 @@ export default @inject('stores', 'actions') @observer class ServiceView extends
     });
   };
 
-  startHibernationTimer() {
-    const timerDuration = (Number(this.props.stores.settings.all.app.hibernationStrategy) || 300) * 1000;
-
-    const hibernationTimer = setTimeout(() => {
-      this.props.actions.service.setHibernation({
-        serviceId: this.props.service.id,
-        hibernating: true,
-      });
-    }, timerDuration);
-
-    this.hibernationTimer = hibernationTimer;
-  }
-
   render() {
     const {
       detachService,
@@ -132,6 +83,7 @@ export default @inject('stores', 'actions') @observer class ServiceView extends
       edit,
       enable,
       stores,
+      isSpellcheckerEnabled,
     } = this.props;
 
     const {
@@ -193,22 +145,19 @@ export default @inject('stores', 'actions') @observer class ServiceView extends
           </Fragment>
         ) : (
           <>
-            {(!service.isHibernating || service.disableHibernation) ? (
+            {(!service.isHibernating || service.isHibernationEnabled) ? (
               <>
                 {showNavBar && (
                   <WebControlsScreen service={service} />
                 )}
-                <ServiceWebview
-                  service={service}
-                  setWebviewReference={setWebviewReference}
-                  detachService={detachService}
-                />
-                {/* {service.lostRecipeConnection && (
-                  <ConnectionLostBanner
-                    name={service.name}
-                    reload={reload}
+                {!service.isHibernating && (
+                  <ServiceWebview
+                    service={service}
+                    setWebviewReference={setWebviewReference}
+                    detachService={detachService}
+                    isSpellcheckerEnabled={isSpellcheckerEnabled}
                   />
-                )} */}
+                )}
               </>
             ) : (
               <div>
diff --git a/src/components/services/content/ServiceWebview.js b/src/components/services/content/ServiceWebview.js
index 2e3354279..4edbde5e2 100644
--- a/src/components/services/content/ServiceWebview.js
+++ b/src/components/services/content/ServiceWebview.js
@@ -15,6 +15,7 @@ class ServiceWebview extends Component {
     service: PropTypes.instanceOf(ServiceModel).isRequired,
     setWebviewReference: PropTypes.func.isRequired,
     detachService: PropTypes.func.isRequired,
+    isSpellcheckerEnabled: PropTypes.bool.isRequired,
   };
 
   @observable webview = null;
@@ -55,6 +56,7 @@ class ServiceWebview extends Component {
     const {
       service,
       setWebviewReference,
+      isSpellcheckerEnabled,
     } = this.props;
 
     const preloadScript = path.join(__dirname, '../../../', 'webview', 'recipe.js');
@@ -70,7 +72,7 @@ class ServiceWebview extends Component {
         autosize
         src={service.url}
         preload={preloadScript}
-        partition={`persist:service-${service.id}`}
+        partition={service.partition}
         onDidAttach={() => {
           setWebviewReference({
             serviceId: service.id,
@@ -81,6 +83,7 @@ class ServiceWebview extends Component {
         useragent={service.userAgent}
         disablewebsecurity={service.recipe.disablewebsecurity ? true : undefined}
         allowpopups
+        webpreferences={`spellcheck=${isSpellcheckerEnabled ? 1 : 0}`}
       />
     );
   }
diff --git a/src/components/services/content/Services.js b/src/components/services/content/Services.js
index da2ee0b9e..f679eeed0 100644
--- a/src/components/services/content/Services.js
+++ b/src/components/services/content/Services.js
@@ -10,6 +10,7 @@ import injectSheet from 'react-jss';
 import ServiceView from './ServiceView';
 import Appear from '../../ui/effects/Appear';
 import serverlessLogin from '../../../helpers/serverless-helpers';
+import { TODOS_RECIPE_ID } from '../../../features/todos';
 
 const messages = defineMessages({
   welcome: {
@@ -58,6 +59,7 @@ export default @injectSheet(styles) @inject('actions') @observer class Services
     hasActivatedTrial: PropTypes.bool.isRequired,
     classes: PropTypes.object.isRequired,
     actions: PropTypes.object.isRequired,
+    isSpellcheckerEnabled: PropTypes.bool.isRequired,
   };
 
   static defaultProps = {
@@ -111,6 +113,7 @@ export default @injectSheet(styles) @inject('actions') @observer class Services
       userHasCompletedSignup,
       hasActivatedTrial,
       classes,
+      isSpellcheckerEnabled,
     } = this.props;
 
     const {
@@ -168,7 +171,7 @@ export default @injectSheet(styles) @inject('actions') @observer class Services
             </div>
           </Appear>
         )}
-        {services.map(service => (
+        {services.filter(service => service.recipe.id !== TODOS_RECIPE_ID).map(service => (
           <ServiceView
             key={service.id}
             service={service}
@@ -186,6 +189,7 @@ export default @injectSheet(styles) @inject('actions') @observer class Services
               redirect: false,
             })}
             upgrade={() => openSettings({ path: 'user' })}
+            isSpellcheckerEnabled={isSpellcheckerEnabled}
           />
         ))}
       </div>
diff --git a/src/components/services/tabs/TabItem.js b/src/components/services/tabs/TabItem.js
index efa5fa60c..479f151a6 100644
--- a/src/components/services/tabs/TabItem.js
+++ b/src/components/services/tabs/TabItem.js
@@ -5,9 +5,14 @@ import PropTypes from 'prop-types';
 import { observer } from 'mobx-react';
 import classnames from 'classnames';
 import { SortableElement } from 'react-sortable-hoc';
+import injectSheet from 'react-jss';
+import ms from 'ms';
 
+import { observable, autorun } from 'mobx';
 import ServiceModel from '../../../models/Service';
-import { ctrlKey } from '../../../environment';
+import { ctrlKey, cmdKey } from '../../../environment';
+
+const IS_SERVICE_DEBUGGING_ENABLED = (localStorage.getItem('debug') || '').includes('Franz:Service');
 
 const { Menu } = remote;
 
@@ -50,9 +55,38 @@ const messages = defineMessages({
   },
 });
 
-@observer
-class TabItem extends Component {
+const styles = {
+  pollIndicator: {
+    position: 'absolute',
+    bottom: 2,
+    width: 10,
+    height: 10,
+    borderRadius: 5,
+    background: 'gray',
+    transition: 'background 0.5s',
+  },
+  pollIndicatorPoll: {
+    left: 2,
+  },
+  pollIndicatorAnswer: {
+    left: 14,
+  },
+  polled: {
+    background: 'yellow !important',
+    transition: 'background 0.1s',
+  },
+  pollAnswered: {
+    background: 'green !important',
+    transition: 'background 0.1s',
+  },
+  stale: {
+    background: 'red !important',
+  },
+};
+
+@injectSheet(styles) @observer class TabItem extends Component {
   static propTypes = {
+    classes: PropTypes.object.isRequired,
     service: PropTypes.instanceOf(ServiceModel).isRequired,
     clickHandler: PropTypes.func.isRequired,
     shortcutIndex: PropTypes.number.isRequired,
@@ -71,8 +105,33 @@ class TabItem extends Component {
     intl: intlShape,
   };
 
+  @observable isPolled = false;
+
+  @observable isPollAnswered = false;
+
+  componentDidMount() {
+    const { service } = this.props;
+
+    if (IS_SERVICE_DEBUGGING_ENABLED) {
+      autorun(() => {
+        if (Date.now() - service.lastPoll < ms('0.2s')) {
+          this.isPolled = true;
+
+          setTimeout(() => { this.isPolled = false; }, ms('1s'));
+        }
+
+        if (Date.now() - service.lastPollAnswer < ms('0.2s')) {
+          this.isPollAnswered = true;
+
+          setTimeout(() => { this.isPollAnswered = false; }, ms('1s'));
+        }
+      });
+    }
+  }
+
   render() {
     const {
+      classes,
       service,
       clickHandler,
       shortcutIndex,
@@ -97,6 +156,7 @@ class TabItem extends Component {
     }, {
       label: intl.formatMessage(messages.reload),
       click: reload,
+      accelerator: `${cmdKey}+R`,
     }, {
       label: intl.formatMessage(messages.edit),
       click: () => openSettings({
@@ -141,7 +201,7 @@ class TabItem extends Component {
                 •
             </span>
           )}
-          {service.isHibernating && !service.disableHibernation && (
+          {service.isHibernating && !service.isHibernationEnabled && (
             <span className="tab-item__message-count hibernating">
               •
             </span>
@@ -153,6 +213,7 @@ class TabItem extends Component {
     return (
       <li
         className={classnames({
+          [classes.stale]: IS_SERVICE_DEBUGGING_ENABLED && service.lostRecipeConnection,
           'tab-item': true,
           'is-active': service.isActive,
           'has-custom-icon': service.hasCustomIcon,
@@ -168,6 +229,24 @@ class TabItem extends Component {
           alt=""
         />
         {notificationBadge}
+        {IS_SERVICE_DEBUGGING_ENABLED && (
+          <>
+            <div
+              className={classnames({
+                [classes.pollIndicator]: true,
+                [classes.pollIndicatorPoll]: true,
+                [classes.polled]: this.isPolled,
+              })}
+            />
+            <div
+              className={classnames({
+                [classes.pollIndicator]: true,
+                [classes.pollIndicatorAnswer]: true,
+                [classes.pollAnswered]: this.isPollAnswered,
+              })}
+            />
+          </>
+        )}
       </li>
     );
   }