From e85eb4c59395c4c59d0bb19fb8ad64063a8d7f3b Mon Sep 17 00:00:00 2001
From: John Molakvoæ <skjnldsv@protonmail.com>
Date: Fri, 24 Mar 2023 17:38:08 +0100
Subject: fix(files): selection and render performance
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: John Molakvoæ <skjnldsv@protonmail.com>
---
 apps/files/src/components/FileEntry.vue        | 16 +++++++++++++---
 apps/files/src/components/FilesListVirtual.vue |  4 ++--
 2 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/apps/files/src/components/FileEntry.vue b/apps/files/src/components/FileEntry.vue
index 4dfe3da0e4c..343d24f05e1 100644
--- a/apps/files/src/components/FileEntry.vue
+++ b/apps/files/src/components/FileEntry.vue
@@ -23,7 +23,8 @@
 <template>
 	<Fragment>
 		<td class="files-list__row-checkbox">
-			<NcCheckboxRadioSwitch :aria-label="t('files', 'Select the row for {displayName}', { displayName })"
+			<NcCheckboxRadioSwitch v-if="active"
+				:aria-label="t('files', 'Select the row for {displayName}', { displayName })"
 				:checked.sync="selectedFiles"
 				:value="fileid.toString()"
 				name="selectedFiles" />
@@ -97,7 +98,7 @@
 			:key="column.id"
 			:class="`files-list__row-${currentView?.id}-${column.id}`"
 			class="files-list__row-column-custom">
-			<CustomElementRender :current-view="currentView" :render="column.render" :source="source" />
+			<CustomElementRender v-if="active" :current-view="currentView" :render="column.render" :source="source" />
 		</td>
 	</Fragment>
 </template>
@@ -116,7 +117,7 @@ import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
 import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
 import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch.js'
 import NcLoadingIcon from '@nextcloud/vue/dist/Components/NcLoadingIcon.js'
-import Vue, { CreateElement } from 'vue'
+import Vue from 'vue'
 import { showError } from '@nextcloud/dialogs'
 
 import { useFilesStore } from '../store/files'
@@ -152,6 +153,10 @@ export default Vue.extend({
 	},
 
 	props: {
+		active: {
+			type: Boolean,
+			default: false,
+		},
 		isSizeAvailable: {
 			type: Boolean,
 			default: false,
@@ -290,6 +295,11 @@ export default Vue.extend({
 	},
 
 	watch: {
+		active(active) {
+			if (active === false) {
+				this.resetState()
+			}
+		},
 		/**
 		 * When the source changes, reset the preview
 		 * and fetch the new one.
diff --git a/apps/files/src/components/FilesListVirtual.vue b/apps/files/src/components/FilesListVirtual.vue
index af83578d704..77da9bb2d6f 100644
--- a/apps/files/src/components/FilesListVirtual.vue
+++ b/apps/files/src/components/FilesListVirtual.vue
@@ -31,8 +31,8 @@
 		list-class="files-list__body"
 		list-tag="tbody"
 		role="table">
-		<template #default="{ item }">
-			<FileEntry :is-size-available="isSizeAvailable" :source="item" />
+		<template #default="{ item, active }">
+			<FileEntry :active="active" :is-size-available="isSizeAvailable" :source="item" />
 		</template>
 
 		<template #before>
-- 
cgit v1.2.3