From 839f597921d00581151ac554ab800a9d20096313 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?John=20Molakvo=C3=A6=20=28skjnldsv=29?=
 <skjnldsv@protonmail.com>
Date: Tue, 15 Sep 2020 17:16:34 +0200
Subject: [PATCH] Properly show loading state if there are still pending
 requests
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
---
 core/src/views/UnifiedSearch.vue | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/core/src/views/UnifiedSearch.vue b/core/src/views/UnifiedSearch.vue
index 099fa33650..0114f2fcf1 100644
--- a/core/src/views/UnifiedSearch.vue
+++ b/core/src/views/UnifiedSearch.vue
@@ -35,6 +35,7 @@
 		<div class="unified-search__input-wrapper">
 			<form class="unified-search__form"
 				role="search"
+				:class="{'icon-loading-small': isLoading}"
 				@submit.prevent.stop="onInputEnter"
 				@reset.prevent.stop="onReset">
 				<!-- Search input -->
@@ -48,7 +49,7 @@
 					@keypress.enter.prevent.stop="onInputEnter">
 
 				<!-- Reset search button -->
-				<input v-if="!!query"
+				<input v-if="!!query && !isLoading"
 					type="reset"
 					class="unified-search__form-reset icon-close"
 					:aria-label="t('core','Reset search')"
@@ -646,6 +647,12 @@ $input-padding: 6px;
 		width: 100%;
 		margin: $margin;
 
+		// Loading spinner
+		&::after {
+			right: $input-padding;
+			left: auto;
+		}
+
 		&-input,
 		&-reset {
 			margin: $input-padding / 2;
@@ -673,6 +680,7 @@ $input-padding: 6px;
 			}
 
 			// Ellipsis earlier if reset button is here
+			.icon-loading-small &,
 			&--with-reset {
 				padding-right: $input-height;
 			}