fix(docsearch): remove recent search when favorited

algolia · Apr 3, 2020 · 858a498 · 858a498
1 parent 708b470
commit 858a498
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 19 deletions.
diff --git a/src/EmptyScreen.tsx b/src/EmptyScreen.tsx
@@ -57,6 +57,7 @@ export function EmptyScreen(props: EmptyScreenProps) {
                   event.preventDefault();
                   event.stopPropagation();
                   props.favoriteSearches.add(item);
+                  props.recentSearches.remove(item);
                   props.refresh();
                 }}
               >
@@ -91,18 +92,20 @@ export function EmptyScreen(props: EmptyScreenProps) {
           </div>
         )}
         renderAction={({ item }) => (
-          <button
-            className="DocSearch-Hit-action-button"
-            title="Remove this search from favorite"
-            onClick={event => {
-              event.preventDefault();
-              event.stopPropagation();
-              props.favoriteSearches.remove(item);
-              props.refresh();
-            }}
-          >
-            <ResetIcon />
-          </button>
+          <div className="DocSearch-Hit-action">
+            <button
+              className="DocSearch-Hit-action-button"
+              title="Remove this search from favorite"
+              onClick={event => {
+                event.preventDefault();
+                event.stopPropagation();
+                props.favoriteSearches.remove(item);
+                props.refresh();
+              }}
+            >
+              <ResetIcon />
+            </button>
+          </div>
         )}
       />
     </div>

diff --git a/src/NoResultsScreen.tsx b/src/NoResultsScreen.tsx
@@ -6,7 +6,7 @@ import {
 
 import { InternalDocSearchHit } from './types';
 
-interface NoResultsProps
+interface NoResultsScreenProps
   extends AutocompleteApi<
     InternalDocSearchHit,
     React.FormEvent,
@@ -17,7 +17,7 @@ interface NoResultsProps
   inputRef: React.MutableRefObject<null | HTMLInputElement>;
 }
 
-export function NoResultsScreen(props: NoResultsProps) {
+export function NoResultsScreen(props: NoResultsScreenProps) {
   return (
     <div className="DocSearch-NoResults">
       <p className="DocSearch-Title">

diff --git a/src/ResultsScreen.tsx b/src/ResultsScreen.tsx
@@ -8,7 +8,7 @@ import { InternalDocSearchHit } from './types';
 import { Results } from './Results';
 import { SourceIcon, SelectIcon } from './icons';
 
-interface ResultsProps
+interface ResultsScreenProps
   extends AutocompleteApi<
     InternalDocSearchHit,
     React.FormEvent,
@@ -19,7 +19,7 @@ interface ResultsProps
   onItemClick(item: InternalDocSearchHit): void;
 }
 
-export function ResultsScreen(props: ResultsProps) {
+export function ResultsScreen(props: ResultsScreenProps) {
   return (
     <div className="DocSearch-Dropdown-Container">
       {props.state.suggestions.map((suggestion, index) => {

diff --git a/src/ScreenState.tsx b/src/ScreenState.tsx
@@ -11,7 +11,7 @@ import { ResultsScreen } from './ResultsScreen';
 import { NoResultsScreen } from './NoResultsScreen';
 import { ErrorScreen } from './ErrorScreen';
 
-interface DropdownProps<TItem>
+interface ScreenStateProps<TItem>
   extends AutocompleteApi<
     TItem,
     React.FormEvent,
@@ -25,7 +25,7 @@ interface DropdownProps<TItem>
   inputRef: React.MutableRefObject<null | HTMLInputElement>;
 }
 
-export function ScreenState(props: DropdownProps<InternalDocSearchHit>) {
+export function ScreenState(props: ScreenStateProps<InternalDocSearchHit>) {
   if (props.state.status === 'error') {
     return <ErrorScreen />;
   }
@@ -37,7 +37,7 @@ export function ScreenState(props: DropdownProps<InternalDocSearchHit>) {
   if (!props.state.query) {
     return (
       <EmptyScreen
-        {...(props as DropdownProps<any>)}
+        {...(props as ScreenStateProps<any>)}
         hasSuggestions={hasSuggestions}
       />
     );