From 11068aa9d035c3833b104954819686cc91f1c153 Mon Sep 17 00:00:00 2001
From: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
Date: Fri, 1 Nov 2024 20:52:00 -0500
Subject: [PATCH] Fix validation activity indicator (#14730)

* Don't show two spinners when loading/revalidating search results

* clarify
---
 web/src/pages/Explore.tsx           | 5 ++---
 web/src/views/search/SearchView.tsx | 7 +++++--
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/web/src/pages/Explore.tsx b/web/src/pages/Explore.tsx
index 9f80241c1..4efcb81b8 100644
--- a/web/src/pages/Explore.tsx
+++ b/web/src/pages/Explore.tsx
@@ -428,9 +428,8 @@ export default function Explore() {
           searchTerm={searchTerm}
           searchFilter={searchFilter}
           searchResults={searchResults}
-          isLoading={
-            (isLoadingInitialData || isLoadingMore || isValidating) ?? true
-          }
+          isLoading={(isLoadingInitialData || isLoadingMore) ?? true}
+          isValidating={isValidating}
           hasMore={!isReachingEnd}
           columns={gridColumns}
           defaultView={defaultView}
diff --git a/web/src/views/search/SearchView.tsx b/web/src/views/search/SearchView.tsx
index cf6640f18..836ae8f4f 100644
--- a/web/src/views/search/SearchView.tsx
+++ b/web/src/views/search/SearchView.tsx
@@ -37,6 +37,7 @@ type SearchViewProps = {
   searchFilter?: SearchFilter;
   searchResults?: SearchResult[];
   isLoading: boolean;
+  isValidating: boolean;
   hasMore: boolean;
   columns: number;
   defaultView?: string;
@@ -55,6 +56,7 @@ export default function SearchView({
   searchFilter,
   searchResults,
   isLoading,
+  isValidating,
   hasMore,
   columns,
   defaultView = "summary",
@@ -397,8 +399,9 @@ export default function SearchView({
           </div>
         )}
 
-        {isLoading &&
-          (searchTerm ||
+        {((isLoading && uniqueResults?.length == 0) || // show on initial load
+          (isValidating && !isLoading)) && // or revalidation
+          (searchTerm || // or change of filter/search term
             (searchFilter && Object.keys(searchFilter).length !== 0)) && (
             <ActivityIndicator className="absolute left-1/2 top-1/2 z-50 -translate-x-1/2 -translate-y-1/2 rounded-2xl bg-background/80 p-3 dark:bg-background/50" />
           )}