From aeb80edd47b5ac55111d9cf83942485a7ea38cd5 Mon Sep 17 00:00:00 2001
From: saruwman <41330038+saruwman@users.noreply.github.com>
Date: Wed, 22 Apr 2020 14:28:08 +0000
Subject: Improve cache clearing UI feedback (#620)

* Warning about using Nodejs versions > 10

I removed the warning about using nodejs versions above 10 because they function well in the dev environement.

* clear all cache issue
---
 .../settings/settings/EditSettingsForm.js          | 24 ++++++++++++++++++++--
 1 file changed, 22 insertions(+), 2 deletions(-)

(limited to 'src/components/settings')

diff --git a/src/components/settings/settings/EditSettingsForm.js b/src/components/settings/settings/EditSettingsForm.js
index 5cd8bdb36..6d86c09ec 100644
--- a/src/components/settings/settings/EditSettingsForm.js
+++ b/src/components/settings/settings/EditSettingsForm.js
@@ -99,6 +99,10 @@ const messages = defineMessages({
     id: 'settings.app.cacheInfo',
     defaultMessage: '!!!Ferdi cache is currently using {size} of disk space.',
   },
+  cacheNotCleared: {
+    id: 'settings.app.cacheNotCleared',
+    defaultMessage: 'Couldn\'t clear all cache',
+  },
   buttonClearAllCache: {
     id: 'settings.app.buttonClearAllCache',
     defaultMessage: '!!!Clear cache',
@@ -169,6 +173,14 @@ export default @observer class EditSettingsForm extends Component {
     intl: intlShape,
   };
 
+  state={
+    clearCacheButtonClicked: false,
+  }
+
+  onClearCacheClicked=() => {
+    this.setState({ clearCacheButtonClicked: true });
+  }
+
   submit(e) {
     e.preventDefault();
     this.props.form.submit({
@@ -217,7 +229,7 @@ export default @observer class EditSettingsForm extends Component {
       lockingFeatureEnabled,
       scheduledDNDEnabled,
     } = window.ferdi.stores.settings.all.app;
-
+    const notCleared = this.state.clearCacheButtonClicked && isClearingAllCache === false && cacheSize !== 0;
     return (
       <div className="settings__main">
         <div className="settings__header">
@@ -483,11 +495,17 @@ export default @observer class EditSettingsForm extends Component {
                   size: cacheSize,
                 })}
               </p>
+              {notCleared && (
+              <p>
+                {intl.formatMessage(messages.cacheNotCleared)
+                }
+              </p>
+              )}
               <p>
                 <Button
                   buttonType="secondary"
                   label={intl.formatMessage(messages.buttonClearAllCache)}
-                  onClick={onClearAllCache}
+                  onClick={() => { onClearAllCache(); this.onClearCacheClicked(); }}
                   disabled={isClearingAllCache}
                   loaded={!isClearingAllCache}
                 />
@@ -542,10 +560,12 @@ export default @observer class EditSettingsForm extends Component {
               <span className="mdi mdi-github-face" />
               <span>
 
+
                 Ferdi is based on
                 {' '}
                 <a href="https://github.com/meetfranz/franz" target="_blank">Franz</a>
 
+
                 , a project published
                 under the
                 {' '}
-- 
cgit v1.2.3-54-g00ecf