feat(App): Add option to clear app cache (@dannyqiu)

meetfranz · Jan 3, 2018 · be801ff · be801ff
1 parent 3c21a97
commit be801ff
Show file tree

Hide file tree

Showing 12 changed files with 109 additions and 82 deletions.
diff --git a/package.json b/package.json
@@ -34,6 +34,7 @@
     "babel-polyfill": "^6.23.0",
     "babel-runtime": "^6.23.0",
     "classnames": "^2.2.5",
+    "du": "^0.1.0",
     "electron-fetch": "^1.1.0",
     "electron-spellchecker": "^1.1.2",
     "electron-updater": "^2.4.3",
@@ -54,6 +55,7 @@
     "mobx-react-router": "^3.1.2",
     "moment": "^2.17.1",
     "normalize-url": "^1.9.1",
+    "pretty-bytes": "^4.0.2",
     "prop-types": "^15.5.10",
     "prop-types-extended": "^0.2.1",
     "react": "^15.4.1",

diff --git a/src/api/LocalApi.js b/src/api/LocalApi.js
@@ -16,6 +16,10 @@ export default class LocalApi {
     return this.local.removeKey(key);
   }
 
+  getAppCacheSize() {
+    return this.local.getAppCacheSize();
+  }
+
   clearAppCache() {
     return this.local.clearAppCache();
   }

diff --git a/src/api/server/LocalApi.js b/src/api/server/LocalApi.js
@@ -1,4 +1,7 @@
 import { remote } from 'electron';
+import du from 'du';
+
+import { getServicePartitionsDirectory } from '../../helpers/service-helpers.js';
 
 const { session } = remote;
 
@@ -36,14 +39,29 @@ export default class LocalApi {
   }
 
   // Services
+  async getAppCacheSize() {
+    const partitionsDir = getServicePartitionsDirectory();
+    return new Promise((resolve, reject) => {
+      du(partitionsDir, (err, size) => {
+        if (err) reject(err);
+
+        console.debug('LocalApi::getAppCacheSize resolves', size);
+        resolve(size);
+      });
+    });
+  }
+
   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));
+
+    console.debug('LocalApi::clearCache resolves', serviceId);
+    return new Promise(resolve => s.clearCache(resolve));
   }
 
   async clearAppCache() {
     const s = session.defaultSession;
-    await new Promise(resolve => s.clearCache(resolve));
+
+    console.debug('LocalApi::clearCache clearAppCache');
+    return new Promise(resolve => s.clearCache(resolve));
   }
 }
diff --git a/src/api/server/ServerApi.js b/src/api/server/ServerApi.js
@@ -213,7 +213,9 @@ export default class ServerApi {
       throw request;
     }
     const data = await request.json();
-    await removeServicePartitionDirectory(id);
+
+    removeServicePartitionDirectory(id, true);
+
     console.debug('ServerApi::deleteService resolves', data);
     return data;
   }

diff --git a/src/components/settings/services/EditServiceForm.js b/src/components/settings/services/EditServiceForm.js
@@ -71,14 +71,6 @@ 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',
@@ -110,10 +102,8 @@ 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 = {
@@ -168,9 +158,7 @@ export default class EditServiceForm extends Component {
       form,
       isSaving,
       isDeleting,
-      isClearingCache,
       onDelete,
-      onClearCache,
     } = this.props;
     const { intl } = this.context;
 
@@ -193,23 +181,6 @@ 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;
@@ -316,7 +287,6 @@ 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/components/settings/settings/EditSettingsForm.js b/src/components/settings/settings/EditSettingsForm.js
@@ -40,13 +40,13 @@ const messages = defineMessages({
     id: 'settings.app.translationHelp',
     defaultMessage: '!!!Help us to translate Franz into your language.',
   },
+  cacheInfo: {
+    id: 'settings.app.cacheInfo',
+    defaultMessage: '!!!Franz cache is currently using {size} of disk space.',
+  },
   buttonClearAllCache: {
     id: 'settings.app.buttonClearAllCache',
-    defaultMessage: '!!!Clear global cache for Franz and all services',
-  },
-  buttonClearingAllCache: {
-    id: 'settings.app.buttonClearingAllCache',
-    defaultMessage: '!!!Clearing global cache...',
+    defaultMessage: '!!!Clear cache',
   },
   buttonSearchForUpdate: {
     id: 'settings.app.buttonSearchForUpdate',
@@ -87,6 +87,7 @@ export default class EditSettingsForm extends Component {
     updateIsReadyToInstall: PropTypes.bool.isRequired,
     isClearingAllCache: PropTypes.bool.isRequired,
     onClearAllCache: PropTypes.func.isRequired,
+    cacheSize: PropTypes.string.isRequired,
   };
 
   static contextTypes = {
@@ -115,6 +116,7 @@ export default class EditSettingsForm extends Component {
       updateIsReadyToInstall,
       isClearingAllCache,
       onClearAllCache,
+      cacheSize,
     } = this.props;
     const { intl } = this.context;
 
@@ -127,23 +129,6 @@ export default class EditSettingsForm extends Component {
       updateButtonLabelMessage = messages.buttonSearchForUpdate;
     }
 
-    const clearAllCacheButton = isClearingAllCache ? (
-      <Button
-        buttonType="secondary"
-        className="settings__clear-all-cache-button"
-        loaded={false}
-        label={intl.formatMessage(messages.buttonClearingAllCache)}
-        disabled
-      />
-    ) : (
-      <Button
-        buttonType="warning"
-        className="settings__clear-all-cache-button"
-        label={intl.formatMessage(messages.buttonClearAllCache)}
-        onClick={onClearAllCache}
-      />
-    );
-
     return (
       <div className="settings__main">
         <div className="settings__header">
@@ -184,7 +169,26 @@ export default class EditSettingsForm extends Component {
             <h2 id="advanced">{intl.formatMessage(messages.headlineAdvanced)}</h2>
             <Toggle field={form.$('enableSpellchecking')} />
             {/* <Select field={form.$('spellcheckingLanguage')} /> */}
-            {clearAllCacheButton}
+            <div className="settings__settings-group">
+              <h3>
+                {/* {intl.formatMessage(messages.headlineGeneral)} */}
+                Service cache
+              </h3>
+              <p>
+                {intl.formatMessage(messages.cacheInfo, {
+                  size: cacheSize,
+                })}
+              </p>
+              <p>
+                <Button
+                  buttonType="secondary"
+                  label={intl.formatMessage(messages.buttonClearAllCache)}
+                  onClick={onClearAllCache}
+                  disabled={isClearingAllCache}
+                  loaded={!isClearingAllCache}
+                />
+              </p>
+            </div>
 
             {/* Updates */}
             <h2 id="updates">{intl.formatMessage(messages.headlineUpdates)}</h2>
@@ -195,6 +199,7 @@ export default class EditSettingsForm extends Component {
               />
             ) : (
               <Button
+                buttonType="secondary"
                 label={intl.formatMessage(updateButtonLabelMessage)}
                 onClick={checkForUpdates}
                 disabled={isCheckingForUpdates || isUpdateAvailable}

diff --git a/src/containers/settings/EditServiceScreen.js b/src/containers/settings/EditServiceScreen.js
@@ -169,14 +169,6 @@ 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;
@@ -219,10 +211,8 @@ 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()}
       />
     );
   }
@@ -244,7 +234,6 @@ 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/containers/settings/EditSettingsScreen.js b/src/containers/settings/EditSettingsScreen.js
@@ -193,8 +193,17 @@ export default class EditSettingsScreen extends Component {
   }
 
   render() {
-    const { updateStatus, updateStatusTypes, isClearingAllCache } = this.props.stores.app;
-    const { checkForUpdates, installUpdate, clearAllCache } = this.props.actions.app;
+    const {
+      updateStatus,
+      cacheSize,
+      updateStatusTypes,
+      isClearingAllCache,
+    } = this.props.stores.app;
+    const {
+      checkForUpdates,
+      installUpdate,
+      clearAllCache,
+    } = this.props.actions.app;
     const form = this.prepareForm();
 
     return (
@@ -207,6 +216,7 @@ export default class EditSettingsScreen extends Component {
         noUpdateAvailable={updateStatus === updateStatusTypes.NOT_AVAILABLE}
         updateIsReadyToInstall={updateStatus === updateStatusTypes.DOWNLOADED}
         onSubmit={d => this.onSubmit(d)}
+        cacheSize={cacheSize}
         isClearingAllCache={isClearingAllCache}
         onClearAllCache={clearAllCache}
       />

diff --git a/src/helpers/service-helpers.js b/src/helpers/service-helpers.js
@@ -4,16 +4,17 @@ import fs from 'fs-extra';
 
 const app = remote.app;
 
-function getServicePartitionsDirectory() {
+export function getServicePartitionsDirectory() {
   return path.join(app.getPath('userData'), 'Partitions');
 }
 
-export function removeServicePartitionDirectory(id = '') {
-  const servicePartition = path.join(getServicePartitionsDirectory(), `service-${id}`);
+export function removeServicePartitionDirectory(id = '', addServicePrefix = false) {
+  const servicePartition = path.join(getServicePartitionsDirectory(), `${addServicePrefix ? 'service-' : ''}${id}`);
+
   return fs.remove(servicePartition);
 }
 
 export async function getServiceIdsFromPartitions() {
   const files = await fs.readdir(getServicePartitionsDirectory());
-  return files.map(filename => filename.replace('service-', ''));
+  return files.filter(n => n !== '__chrome_extension');
 }
diff --git a/src/i18n/locales/en-US.json b/src/i18n/locales/en-US.json
@@ -124,8 +124,6 @@
   "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",
@@ -151,8 +149,8 @@
   "settings.app.updateStatusSearching": "Is searching for update",
   "settings.app.updateStatusAvailable": "Update available, downloading...",
   "settings.app.updateStatusUpToDate": "You are using the latest version of Franz",
-  "settings.app.buttonClearAllCache": "Clear global cache for Franz and all services",
-  "settings.app.buttonClearingAllCache": "Clearing global cache...",
+  "settings.app.cacheInfo": "Franz cache is currently using {size} of disk space.",
+  "settings.app.buttonClearAllCache": "Clear cache",
   "settings.app.form.autoLaunchOnStart": "Launch Franz on start",
   "settings.app.form.autoLaunchInBackground": "Open in background",
   "settings.app.form.enableSystemTray": "Show Franz in system tray",