Add button to clear service cache

9 files changed, 88 insertions, 1 deletions

diff --git a/src/actions/service.js b/src/actions/service.js
index e3100e986..5d483b12a 100644
--- a/src/actions/service.js
+++ b/src/actions/service.js
@@ -25,6 +25,9 @@ export default {
     serviceId: PropTypes.string.isRequired,
     redirect: PropTypes.string,
   },
+  clearCache: {
+    serviceId: PropTypes.string.isRequired,
+  },
   setUnreadMessageCount: {
     serviceId: PropTypes.string.isRequired,
     count: PropTypes.object.isRequired,
diff --git a/src/api/LocalApi.js b/src/api/LocalApi.js
index 6f2b049d6..d52e9cd10 100644
--- a/src/api/LocalApi.js
+++ b/src/api/LocalApi.js
@@ -15,4 +15,8 @@ export default class LocalApi {
   removeKey(key) {
     return this.local.removeKey(key);
   }
+
+  clearAppCache() {
+    return this.local.clearAppCache();
+  }
 }
diff --git a/src/api/ServicesApi.js b/src/api/ServicesApi.js
index 3cb40ba0d..36ed9482f 100644
--- a/src/api/ServicesApi.js
+++ b/src/api/ServicesApi.js
@@ -1,5 +1,6 @@
 export default class ServicesApi {
-  constructor(server) {
+  constructor(server, local) {
+    this.local = local;
     this.server = server;
   }
 
@@ -30,4 +31,8 @@ export default class ServicesApi {
   reorder(data) {
     return this.server.reorderService(data);
   }
+
+  clearCache(serviceId) {
+    return this.local.clearCache(serviceId);
+  }
 }
diff --git a/src/api/server/LocalApi.js b/src/api/server/LocalApi.js
index 79ac6e12f..fec89f948 100644
--- a/src/api/server/LocalApi.js
+++ b/src/api/server/LocalApi.js
@@ -1,3 +1,7 @@
+import { remote } from 'electron';
+
+const { session } = remote;
+
 export default class LocalApi {
   // App
   async updateAppSettings(data) {
@@ -30,4 +34,11 @@ export default class LocalApi {
       localStorage.setItem('app', JSON.stringify(settings));
     }
   }
+
+  // Services
+  async clearCache(serviceId) {
+    console.debug(`Clearing cache for persist:service-${serviceId}`);
+    const s = session.fromPartition(`persist:service-${serviceId}`);
+    await new Promise(resolve => s.clearCache(resolve));
+  }
 }
diff --git a/src/components/settings/services/EditServiceForm.js b/src/components/settings/services/EditServiceForm.js
index 4458c4c5a..b5300f605 100644
--- a/src/components/settings/services/EditServiceForm.js
+++ b/src/components/settings/services/EditServiceForm.js
@@ -71,6 +71,14 @@ const messages = defineMessages({
     id: 'settings.service.form.isMutedInfo',
     defaultMessage: '!!!When disabled, all notification sounds and audio playback are muted',
   },
+  buttonClearCache: {
+    id: 'settings.service.form.buttonClearCache',
+    defaultMessage: '!!!Clear cache',
+  },
+  buttonClearingCache: {
+    id: 'settings.service.form.buttonClearingCache',
+    defaultMessage: '!!!Clearing cache',
+  },
   headlineNotifications: {
     id: 'settings.service.form.headlineNotifications',
     defaultMessage: '!!!Notifications',
@@ -102,8 +110,10 @@ export default class EditServiceForm extends Component {
     form: PropTypes.instanceOf(Form).isRequired,
     onSubmit: PropTypes.func.isRequired,
     onDelete: PropTypes.func.isRequired,
+    onClearCache: PropTypes.func.isRequired,
     isSaving: PropTypes.bool.isRequired,
     isDeleting: PropTypes.bool.isRequired,
+    isClearingCache: PropTypes.bool.isRequired,
   };
 
   static defaultProps = {
@@ -158,7 +168,9 @@ export default class EditServiceForm extends Component {
       form,
       isSaving,
       isDeleting,
+      isClearingCache,
       onDelete,
+      onClearCache,
     } = this.props;
     const { intl } = this.context;
 
@@ -181,6 +193,23 @@ export default class EditServiceForm extends Component {
       />
     );
 
+    const clearCacheButton = isClearingCache ? (
+      <Button
+        buttonType="secondary"
+        className="settings__clear-cache-button"
+        loaded={false}
+        label={intl.formatMessage(messages.buttonClearingCache)}
+        disabled
+      />
+    ) : (
+      <Button
+        buttonType="warning"
+        className="settings__clear-cache-button"
+        label={intl.formatMessage(messages.buttonClearCache)}
+        onClick={onClearCache}
+      />
+    );
+
     let activeTabIndex = 0;
     if (recipe.hasHostedOption && service.team) {
       activeTabIndex = 1;
@@ -287,6 +316,7 @@ export default class EditServiceForm extends Component {
               <div className="settings__settings-group">
                 <h3>{intl.formatMessage(messages.headlineGeneral)}</h3>
                 <Toggle field={form.$('isEnabled')} />
+                {clearCacheButton}
               </div>
             </div>
             {recipe.message && (
diff --git a/src/containers/settings/EditServiceScreen.js b/src/containers/settings/EditServiceScreen.js
index 3c52152b1..78f043e80 100644
--- a/src/containers/settings/EditServiceScreen.js
+++ b/src/containers/settings/EditServiceScreen.js
@@ -169,6 +169,14 @@ export default class EditServiceScreen extends Component {
     }
   }
 
+  clearCache() {
+    const { clearCache } = this.props.actions.service;
+    const { activeSettings: service } = this.props.stores.services;
+    clearCache({
+      serviceId: service.id,
+    });
+  }
+
   render() {
     const { recipes, services, user } = this.props.stores;
     const { action } = this.props.router.params;
@@ -211,8 +219,10 @@ export default class EditServiceScreen extends Component {
         status={services.actionStatus}
         isSaving={services.updateServiceRequest.isExecuting || services.createServiceRequest.isExecuting}
         isDeleting={services.deleteServiceRequest.isExecuting}
+        isClearingCache={services.clearCacheRequest.isExecuting}
         onSubmit={d => this.onSubmit(d)}
         onDelete={() => this.deleteService()}
+        onClearCache={() => this.clearCache()}
       />
     );
   }
@@ -234,6 +244,7 @@ EditServiceScreen.wrappedComponent.propTypes = {
       createService: PropTypes.func.isRequired,
       updateService: PropTypes.func.isRequired,
       deleteService: PropTypes.func.isRequired,
+      clearCache: PropTypes.func.isRequired,
     }).isRequired,
   }).isRequired,
 };
diff --git a/src/i18n/locales/en-US.json b/src/i18n/locales/en-US.json
index 567537d75..2b5a3fc4b 100644
--- a/src/i18n/locales/en-US.json
+++ b/src/i18n/locales/en-US.json
@@ -124,6 +124,8 @@
   "settings.service.form.indirectMessages": "Show message badge for all new messages",
   "settings.service.form.enableAudio": "Enable audio",
   "settings.service.form.isMutedInfo": "When disabled, all notification sounds and audio playback are muted",
+  "settings.service.form.buttonClearCache": "Clear cache",
+  "settings.service.form.buttonClearingCache": "Clearing cache...",
   "settings.service.form.headlineNotifications": "Notifications",
   "settings.service.form.headlineBadges": "Unread message badges",
   "settings.service.form.headlineGeneral": "General",
diff --git a/src/stores/ServicesStore.js b/src/stores/ServicesStore.js
index 66f37af26..237264bcc 100644
--- a/src/stores/ServicesStore.js
+++ b/src/stores/ServicesStore.js
@@ -16,6 +16,7 @@ export default class ServicesStore extends Store {
   @observable updateServiceRequest = new Request(this.api.services, 'update');
   @observable reorderServicesRequest = new Request(this.api.services, 'reorder');
   @observable deleteServiceRequest = new Request(this.api.services, 'delete');
+  @observable clearCacheRequest = new Request(this.api.services, 'clearCache');
 
   @observable filterNeedle = null;
 
@@ -31,6 +32,7 @@ export default class ServicesStore extends Store {
     this.actions.service.createFromLegacyService.listen(this._createFromLegacyService.bind(this));
     this.actions.service.updateService.listen(this._updateService.bind(this));
     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.focusService.listen(this._focusService.bind(this));
     this.actions.service.focusActiveService.listen(this._focusActiveService.bind(this));
@@ -205,6 +207,13 @@ export default class ServicesStore extends Store {
     gaEvent('Service', 'delete', service.recipe.id);
   }
 
+  @action async _clearCache({ serviceId }) {
+    this.clearCacheRequest.reset();
+    const request = this.clearCacheRequest.execute(serviceId);
+    await request._promise;
+    gaEvent('Service', 'clear cache');
+  }
+
   @action _setActive({ serviceId }) {
     const service = this.one(serviceId);
 
diff --git a/src/styles/button.scss b/src/styles/button.scss
index 75d2cb1d4..8d2adbbcc 100644
--- a/src/styles/button.scss
+++ b/src/styles/button.scss
@@ -48,6 +48,18 @@
     }
   }
 
+  &.franz-form__button--warning {
+    background: $theme-brand-warning;
+
+    &:hover {
+      background: darken($theme-brand-warning, 5%);
+    }
+
+    &:active {
+      background: lighten($theme-brand-warning, 5%);
+    }
+  }
+
   &.franz-form__button--inverted {
     background: none;
     padding: 10px 20px;