Merge pull request #30113 from nextcloud/bugfix/noid/ext-storage-missing-spinner

3 files changed, 21 insertions, 0 deletions

diff --git a/apps/files_external/css/settings.scss b/apps/files_external/css/settings.scss
index 05ad4fd2caf..f11ea06c155 100644
--- a/apps/files_external/css/settings.scss
+++ b/apps/files_external/css/settings.scss
@@ -4,6 +4,10 @@
 
 #externalStorage {
 	margin: 15px 0 20px 0;
+
+	tr.externalStorageLoading > td {
+		text-align: center;
+	}
 }
 
 #externalStorage td {
diff --git a/apps/files_external/js/settings.js b/apps/files_external/js/settings.js
index 32c4b1bc03b..bed380bab14 100644
--- a/apps/files_external/js/settings.js
+++ b/apps/files_external/js/settings.js
@@ -907,6 +907,14 @@ MountConfigListView.prototype = _.extend({
 	loadStorages: function() {
 		var self = this;
 
+		var onLoaded1 = $.Deferred();
+		var onLoaded2 = $.Deferred();
+
+		this.$el.find('.externalStorageLoading').removeClass('hidden');
+		$.when(onLoaded1, onLoaded2).always(() => {
+			self.$el.find('.externalStorageLoading').addClass('hidden');
+		})
+
 		if (this._isPersonal) {
 			// load userglobal storages
 			$.ajax({
@@ -953,8 +961,11 @@ MountConfigListView.prototype = _.extend({
 						$('#emptycontent').show();
 					}
 					onCompletion.resolve();
+					onLoaded1.resolve();
 				}
 			});
+		} else {
+			onLoaded1.resolve();
 		}
 
 		var url = this._storageConfigClass.prototype._url;
@@ -973,6 +984,7 @@ MountConfigListView.prototype = _.extend({
 					self.recheckStorageConfig($tr);
 				});
 				onCompletion.resolve();
+				onLoaded2.resolve();
 			}
 		});
 	},
diff --git a/apps/files_external/templates/settings.php b/apps/files_external/templates/settings.php
index f63cab07560..675cce5da6e 100644
--- a/apps/files_external/templates/settings.php
+++ b/apps/files_external/templates/settings.php
@@ -124,6 +124,11 @@ $canCreateMounts = $_['visibilityType'] === BackendService::VISIBILITY_ADMIN ||
 			</tr>
 		</thead>
 		<tbody>
+			<tr class="externalStorageLoading">
+				<td colspan="8">
+					<span id="externalStorageLoading" class="icon icon-loading"></span>
+				</td>
+			</tr>
 			<tr id="addMountPoint"
 			<?php if (!$canCreateMounts): ?>
 				style="display: none;"