Merge pull request #38905 from nextcloud/artonge/feat/improve_files_versions_preview_logic

Reduce load of files versions preview loading

2 files changed, 13 insertions, 1 deletions

diff --git a/apps/files/src/models/Tab.js b/apps/files/src/models/Tab.js
index 63d1ad97ff6..f688fe9e007 100644
--- a/apps/files/src/models/Tab.js
+++ b/apps/files/src/models/Tab.js
@@ -28,6 +28,7 @@ export default class Tab {
 	_icon
 	_iconSvgSanitized
 	_mount
+	_setIsActive
 	_update
 	_destroy
 	_enabled
@@ -42,12 +43,13 @@ export default class Tab {
 	 * @param {?string} options.icon the icon css class
 	 * @param {?string} options.iconSvg the icon in svg format
 	 * @param {Function} options.mount function to mount the tab
+	 * @param {Function} [options.setIsActive] function to forward the active state of the tab
 	 * @param {Function} options.update function to update the tab
 	 * @param {Function} options.destroy function to destroy the tab
 	 * @param {Function} [options.enabled] define conditions whether this tab is active. Must returns a boolean
 	 * @param {Function} [options.scrollBottomReached] executed when the tab is scrolled to the bottom
 	 */
-	constructor({ id, name, icon, iconSvg, mount, update, destroy, enabled, scrollBottomReached } = {}) {
+	constructor({ id, name, icon, iconSvg, mount, setIsActive, update, destroy, enabled, scrollBottomReached } = {}) {
 		if (enabled === undefined) {
 			enabled = () => true
 		}
@@ -68,6 +70,9 @@ export default class Tab {
 		if (typeof mount !== 'function') {
 			throw new Error('The mount argument should be a function')
 		}
+		if (setIsActive !== undefined && typeof setIsActive !== 'function') {
+			throw new Error('The setIsActive argument should be a function')
+		}
 		if (typeof update !== 'function') {
 			throw new Error('The update argument should be a function')
 		}
@@ -85,6 +90,7 @@ export default class Tab {
 		this._name = name
 		this._icon = icon
 		this._mount = mount
+		this._setIsActive = setIsActive
 		this._update = update
 		this._destroy = destroy
 		this._enabled = enabled
@@ -119,6 +125,10 @@ export default class Tab {
 		return this._mount
 	}
 
+	get setIsActive() {
+		return this._setIsActive || (() => undefined)
+	}
+
 	get update() {
 		return this._update
 	}
diff --git a/apps/files/src/views/Sidebar.vue b/apps/files/src/views/Sidebar.vue
index 915c8765b6c..ff6e1a52b43 100644
--- a/apps/files/src/views/Sidebar.vue
+++ b/apps/files/src/views/Sidebar.vue
@@ -366,6 +366,7 @@ export default {
 		 */
 		setActiveTab(id) {
 			OCA.Files.Sidebar.setActiveTab(id)
+			this.tabs.forEach(tab => tab.setIsActive(id === tab.id))
 		},
 
 		/**
@@ -453,6 +454,7 @@ export default {
 						if (this.$refs.tabs) {
 							this.$refs.tabs.updateTabs()
 						}
+						this.setActiveTab(this.Sidebar.activeTab || this.tabs[0].id)
 					})
 				} catch (error) {
 					this.error = t('files', 'Error while loading the file data')