From 54a99cee191ffb3f64c91b0c3814f8a9b95baa29 Mon Sep 17 00:00:00 2001
From: Ash <ash@sanity.io>
Date: Wed, 27 Nov 2024 16:26:10 +0000
Subject: [PATCH] feat(sanity): do not fade out global search results while
 fetching more

Search results now only fade out when input parameters change,
reflecting that the results that have already been loaded no longer
match the input parameters.

They no longer fade out when fetching more results for the same set of
input parameters.
---
 .../components/searchResults/SearchResults.tsx       | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/packages/sanity/src/core/studio/components/navbar/search/components/searchResults/SearchResults.tsx b/packages/sanity/src/core/studio/components/navbar/search/components/searchResults/SearchResults.tsx
index b94726dd5014..695cc7c1d414 100644
--- a/packages/sanity/src/core/studio/components/navbar/search/components/searchResults/SearchResults.tsx
+++ b/packages/sanity/src/core/studio/components/navbar/search/components/searchResults/SearchResults.tsx
@@ -17,8 +17,8 @@ import {type ItemSelectHandler, SearchResultItem} from './item/SearchResultItem'
 const VIRTUAL_LIST_SEARCH_RESULT_ITEM_HEIGHT = 57 // px
 const VIRTUAL_LIST_OVERSCAN = 4
 
-const SearchResultsInnerFlex = styled(Flex)<{$loading: boolean}>`
-  opacity: ${({$loading}) => ($loading ? 0.5 : 1)};
+const SearchResultsInnerFlex = styled(Flex)<{$loadingFirstPage: boolean}>`
+  opacity: ${({$loadingFirstPage}) => ($loadingFirstPage ? 0.5 : 1)};
   overflow-x: hidden;
   overflow-y: auto;
   position: relative;
@@ -37,7 +37,7 @@ export function SearchResults({disableIntentLink, inputElement, onItemSelect}: S
     dispatch,
     onClose,
     setSearchCommandList,
-    state: {debug, filters, fullscreen, lastActiveIndex, result, terms},
+    state: {debug, filters, fullscreen, lastActiveIndex, result, terms, cursor},
   } = useSearchState()
   const {t} = useTranslation()
   const recentSearchesStore = useRecentSearchesStore()
@@ -90,7 +90,11 @@ export function SearchResults({disableIntentLink, inputElement, onItemSelect}: S
           {hasSearchResults && <SortMenu />}
 
           {/* Results */}
-          <SearchResultsInnerFlex $loading={result.loading} aria-busy={result.loading} flex={1}>
+          <SearchResultsInnerFlex
+            $loadingFirstPage={result.loading && cursor === null}
+            aria-busy={result.loading}
+            flex={1}
+          >
             {hasError ? (
               <SearchError />
             ) : (