From 2dd3041f97a26af5f21b1fa595f4313d6a42fbb1 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 />
             ) : (