From a463166bb6c38830e63952fa635eaf96fd58466a Mon Sep 17 00:00:00 2001
From: Mark McDowall <mark@mcdowall.ca>
Date: Sun, 27 Feb 2022 00:17:40 -0800
Subject: [PATCH] Fixed: Clearing logs not updating UI once complete

Closes #1566

(cherry picked from commit 56b3acddc9f50f59c78c03ca072fe802752b88a7)
---
 frontend/src/Store/Actions/commandActions.js  | 24 ++++++++++++++++---
 .../src/System/Events/LogsTableConnector.js   |  9 ++++++-
 .../System/Logs/Files/LogFilesConnector.js    | 15 ++++++------
 3 files changed, 37 insertions(+), 11 deletions(-)

diff --git a/frontend/src/Store/Actions/commandActions.js b/frontend/src/Store/Actions/commandActions.js
index a31979d0d..083bdd61f 100644
--- a/frontend/src/Store/Actions/commandActions.js
+++ b/frontend/src/Store/Actions/commandActions.js
@@ -17,6 +17,7 @@ export const section = 'commands';
 let lastCommand = null;
 let lastCommandTimeout = null;
 const removeCommandTimeoutIds = {};
+const commandFinishedCallbacks = {};
 
 //
 // State
@@ -119,7 +120,7 @@ function scheduleRemoveCommand(command, dispatch) {
   }, 60000 * 5);
 }
 
-export function executeCommandHelper( payload, dispatch) {
+export function executeCommandHelper(payload, dispatch) {
   // TODO: show a message for the user
   if (lastCommand && isSameCommand(lastCommand, payload)) {
     console.warn('Please wait at least 5 seconds before running this command again');
@@ -136,14 +137,23 @@ export function executeCommandHelper( payload, dispatch) {
     lastCommand = null;
   }, 5000);
 
+  const {
+    commandFinished,
+    ...requestPayload
+  } = payload;
+
   const promise = createAjaxRequest({
     url: '/command',
     method: 'POST',
-    data: JSON.stringify(payload),
+    data: JSON.stringify(requestPayload),
     dataType: 'json'
   }).request;
 
   return promise.then((data) => {
+    if (commandFinished) {
+      commandFinishedCallbacks[data.id] = commandFinished;
+    }
+
     dispatch(addCommand(data));
   });
 }
@@ -183,12 +193,20 @@ export const actionHandlers = handleThunks({
       }
     });
 
+    const commandFinished = commandFinishedCallbacks[payload.id];
+
+    if (commandFinished) {
+      commandFinished(payload);
+    }
+
+    delete commandFinishedCallbacks[payload.id];
+
     dispatch(updateItem({ section: 'commands', ...payload }));
     scheduleRemoveCommand(payload, dispatch);
     showCommandMessage(payload, dispatch);
   },
 
-  [ADD_COMMAND]: function(getState, payload, dispatch) {
+  [REMOVE_COMMAND]: function(getState, payload, dispatch) {
     dispatch(removeItem({ section: 'commands', ...payload }));
   }
 
diff --git a/frontend/src/System/Events/LogsTableConnector.js b/frontend/src/System/Events/LogsTableConnector.js
index 20e6eafbf..a717cba15 100644
--- a/frontend/src/System/Events/LogsTableConnector.js
+++ b/frontend/src/System/Events/LogsTableConnector.js
@@ -96,7 +96,14 @@ class LogsTableConnector extends Component {
   };
 
   onClearLogsPress = () => {
-    this.props.executeCommand({ name: commandNames.CLEAR_LOGS });
+    this.props.executeCommand({
+      name: commandNames.CLEAR_LOGS,
+      commandFinished: this.onCommandFinished
+    });
+  };
+
+  onCommandFinished = () => {
+    this.props.gotoLogsFirstPage();
   };
 
   //
diff --git a/frontend/src/System/Logs/Files/LogFilesConnector.js b/frontend/src/System/Logs/Files/LogFilesConnector.js
index 03d958b33..98a55f32f 100644
--- a/frontend/src/System/Logs/Files/LogFilesConnector.js
+++ b/frontend/src/System/Logs/Files/LogFilesConnector.js
@@ -50,12 +50,6 @@ class LogFilesConnector extends Component {
     this.props.fetchLogFiles();
   }
 
-  componentDidUpdate(prevProps) {
-    if (prevProps.deleteFilesExecuting && !this.props.deleteFilesExecuting) {
-      this.props.fetchLogFiles();
-    }
-  }
-
   //
   // Listeners
 
@@ -64,7 +58,14 @@ class LogFilesConnector extends Component {
   };
 
   onDeleteFilesPress = () => {
-    this.props.executeCommand({ name: commandNames.DELETE_LOG_FILES });
+    this.props.executeCommand({
+      name: commandNames.DELETE_LOG_FILES,
+      commandFinished: this.onCommandFinished
+    });
+  };
+
+  onCommandFinished = () => {
+    this.props.fetchLogFiles();
   };
 
   //