From 81fd6d48dc2348905c1e1ac390fd389436d4e13b Mon Sep 17 00:00:00 2001
From: Ferdinand Thiessen <opensource@fthiessen.de>
Date: Mon, 28 Aug 2023 17:44:20 +0200
Subject: [PATCH] fix(FilePicker): Only show checkbox skeletons if multiselect
 was enabled

Signed-off-by: Ferdinand Thiessen <opensource@fthiessen.de>
---
 lib/components/FilePicker/FileList.vue        |  2 +-
 lib/components/FilePicker/LoadingTableRow.vue | 11 ++++++++++-
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/lib/components/FilePicker/FileList.vue b/lib/components/FilePicker/FileList.vue
index 6c454c72..cb75ea27 100644
--- a/lib/components/FilePicker/FileList.vue
+++ b/lib/components/FilePicker/FileList.vue
@@ -51,7 +51,7 @@
 			</thead>
 			<tbody>
 				<template v-if="loading">
-					<LoadingTableRow v-for="i in [1, 2, 3, 4]" :key="i" />
+					<LoadingTableRow v-for="i in [1, 2, 3, 4]" :key="i" :show-checkbox="multiselect"/>
 				</template>
 				<template v-else>
 					<FileListRow v-for="file in sortedFiles"
diff --git a/lib/components/FilePicker/LoadingTableRow.vue b/lib/components/FilePicker/LoadingTableRow.vue
index fe408011..a16b7feb 100644
--- a/lib/components/FilePicker/LoadingTableRow.vue
+++ b/lib/components/FilePicker/LoadingTableRow.vue
@@ -1,7 +1,7 @@
 <!-- Simple component to fake a loading table row with placeholders -->
 <template>
 	<tr aria-hidden="true" class="file-picker__row loading-row">
-		<td class="row-checkbox">
+		<td v-if="showCheckbox" class="row-checkbox">
 			<span />
 		</td>
 		<td class="row-name">
@@ -16,6 +16,15 @@
 	</tr>
 </template>
 
+<script setup lang="ts">
+defineProps<{
+	/**
+	 * Does the filelist use the checkbox column
+	 */
+	showCheckbox: boolean
+}>()
+</script>
+
 <style scoped lang="scss">
 @use './FileList.scss';