fix(files): fix private variables and share loading marker between header and row

Signed-off-by: John Molakvoæ <skjnldsv@protonmail.com>

3 files changed, 25 insertions, 4 deletions

diff --git a/apps/files/src/components/FileEntry.vue b/apps/files/src/components/FileEntry.vue
index 130cd12367e..fca83cabbd1 100644
--- a/apps/files/src/components/FileEntry.vue
+++ b/apps/files/src/components/FileEntry.vue
@@ -63,6 +63,7 @@
 			<!-- Menu actions -->
 			<NcActions v-if="active"
 				ref="actionsMenu"
+				:disabled="source._loading"
 				:force-title="true"
 				:inline="enabledInlineActions.length">
 				<NcActionButton v-for="action in enabledMenuActions"
@@ -433,7 +434,10 @@ export default Vue.extend({
 		async onActionClick(action) {
 			const displayName = action.displayName([this.source], this.currentView)
 			try {
+				// Set the loading marker
 				this.loading = action.id
+				Vue.set(this.source, '_loading', true)
+
 				const success = await action.exec(this.source, this.currentView)
 				if (success) {
 					showSuccess(this.t('files', '"{displayName}" action executed successfully', { displayName }))
@@ -444,7 +448,9 @@ export default Vue.extend({
 				logger.error('Error while executing action', { action, e })
 				showError(this.t('files', '"{displayName}" action failed', { displayName }))
 			} finally {
+				// Reset the loading marker
 				this.loading = ''
+				Vue.set(this.source, '_loading', false)
 			}
 		},
 
diff --git a/apps/files/src/components/FilesListHeaderActions.vue b/apps/files/src/components/FilesListHeaderActions.vue
index b7d48f1de25..d60fd81ad00 100644
--- a/apps/files/src/components/FilesListHeaderActions.vue
+++ b/apps/files/src/components/FilesListHeaderActions.vue
@@ -22,7 +22,7 @@
 <template>
 	<th class="files-list__column files-list__row-actions-batch" colspan="2">
 		<NcActions ref="actionsMenu"
-			:disabled="!!loading"
+			:disabled="!!loading || areSomeNodesLoading"
 			:force-title="true"
 			:inline="3">
 			<NcActionButton v-for="action in enabledActions"
@@ -105,6 +105,10 @@ export default Vue.extend({
 				.map(fileid => this.getNode(fileid))
 				.filter(node => node)
 		},
+
+		areSomeNodesLoading() {
+			return this.nodes.some(node => node._loading)
+		},
 	},
 
 	methods: {
@@ -122,9 +126,16 @@ export default Vue.extend({
 			const displayName = action.displayName(this.nodes, this.currentView)
 			const selectionIds = this.selectedNodes
 			try {
+				// Set loading markers
 				this.loading = action.id
+				this.nodes.forEach(node => {
+					Vue.set(node, '_loading', true)
+				})
+
+				// Dispatch action execution
 				const results = await action.execBatch(this.nodes, this.currentView)
 
+				// Handle potential failures
 				if (results.some(result => result !== true)) {
 					// Remove the failed ids from the selection
 					const failedIds = selectionIds
@@ -142,7 +153,11 @@ export default Vue.extend({
 				logger.error('Error while executing action', { action, e })
 				showError(this.t('files', '"{displayName}" action failed', { displayName }))
 			} finally {
+				// Remove loading markers
 				this.loading = null
+				this.nodes.forEach(node => {
+					Vue.set(node, '_loading', false)
+				})
 			}
 		},
 
diff --git a/apps/files/src/views/FilesList.vue b/apps/files/src/views/FilesList.vue
index c8d539113ce..fad161a56ec 100644
--- a/apps/files/src/views/FilesList.vue
+++ b/apps/files/src/views/FilesList.vue
@@ -175,13 +175,13 @@ export default Vue.extend({
 
 			// Custom column must provide their own sorting methods
 			if (customColumn?.sort && typeof customColumn.sort === 'function') {
-				const results = [...(this.currentFolder?.children || []).map(this.getNode).filter(file => file)]
+				const results = [...(this.currentFolder?._children || []).map(this.getNode).filter(file => file)]
 					.sort(customColumn.sort)
 				return this.isAscSorting ? results : results.reverse()
 			}
 
 			return orderBy(
-				[...(this.currentFolder?.children || []).map(this.getNode).filter(file => file)],
+				[...(this.currentFolder?._children || []).map(this.getNode).filter(file => file)],
 				[
 					// Sort folders first if sorting by name
 					...this.sortingMode === 'basename' ? [v => v.type !== 'folder'] : [],
@@ -272,7 +272,7 @@ export default Vue.extend({
 				this.filesStore.updateNodes(contents)
 
 				// Define current directory children
-				folder.children = contents.map(node => node.attributes.fileid)
+				folder._children = contents.map(node => node.attributes.fileid)
 
 				// If we're in the root dir, define the root
 				if (dir === '/') {