From f28b138019e7265c2e43e486c75621405ab427a3 Mon Sep 17 00:00:00 2001
From: Aymeric Giraudet <aymeric.giraudet@algolia.com>
Date: Fri, 9 Sep 2022 15:58:52 +0200
Subject: [PATCH] fix(rish): hide reset button when search is stalled in
 `SearchBox`

---
 .../react-instantsearch-hooks-web/src/ui/SearchBox.tsx    | 2 +-
 .../src/ui/__tests__/SearchBox.test.tsx                   | 8 ++++++++
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/packages/react-instantsearch-hooks-web/src/ui/SearchBox.tsx b/packages/react-instantsearch-hooks-web/src/ui/SearchBox.tsx
index e270fd4dda..a8d1d8bb1a 100644
--- a/packages/react-instantsearch-hooks-web/src/ui/SearchBox.tsx
+++ b/packages/react-instantsearch-hooks-web/src/ui/SearchBox.tsx
@@ -207,7 +207,7 @@ export function SearchBox({
           className={cx('ais-SearchBox-reset', classNames.reset)}
           type="reset"
           title={translations.resetTitle}
-          hidden={value.length === 0 && !isSearchStalled}
+          hidden={value.length === 0 || isSearchStalled}
         >
           <ResetIcon classNames={classNames} />
         </button>
diff --git a/packages/react-instantsearch-hooks-web/src/ui/__tests__/SearchBox.test.tsx b/packages/react-instantsearch-hooks-web/src/ui/__tests__/SearchBox.test.tsx
index 20e6a47d23..0e01fde5e5 100644
--- a/packages/react-instantsearch-hooks-web/src/ui/__tests__/SearchBox.test.tsx
+++ b/packages/react-instantsearch-hooks-web/src/ui/__tests__/SearchBox.test.tsx
@@ -349,6 +349,14 @@ describe('SearchBox', () => {
     expect(container.querySelector('.ais-SearchBox-reset')).not.toBeVisible();
   });
 
+  test('with search stalled hides the reset indicator', () => {
+    const props = createProps({ value: 'query', isSearchStalled: true });
+
+    const { container } = render(<SearchBox {...props} />);
+
+    expect(container.querySelector('.ais-SearchBox-reset')).not.toBeVisible();
+  });
+
   test('with search stalled shows the loading indicator', () => {
     const props = createProps({ isSearchStalled: true });