From 8b0b7c1cb0bc496a416236dd935a67e78f7d65e7 Mon Sep 17 00:00:00 2001
From: Stevie Robinson <stevie.robinson@gmail.com>
Date: Mon, 9 Dec 2024 04:36:10 +0100
Subject: [PATCH] New: Reactive search button on Wanted pages

(cherry picked from commit e8c3aa20bd92701a16dcd97c5e103b79b3683105)

Closes #10750
---
 .../src/Wanted/CutoffUnmet/CutoffUnmet.js     | 21 ++++++-------------
 .../CutoffUnmet/CutoffUnmetConnector.js       |  5 +++--
 frontend/src/Wanted/Missing/Missing.js        | 19 ++++++-----------
 .../src/Wanted/Missing/MissingConnector.js    |  5 +++--
 4 files changed, 18 insertions(+), 32 deletions(-)

diff --git a/frontend/src/Wanted/CutoffUnmet/CutoffUnmet.js b/frontend/src/Wanted/CutoffUnmet/CutoffUnmet.js
index 41bbb9a9e..be913d7bc 100644
--- a/frontend/src/Wanted/CutoffUnmet/CutoffUnmet.js
+++ b/frontend/src/Wanted/CutoffUnmet/CutoffUnmet.js
@@ -153,12 +153,15 @@ class CutoffUnmet extends Component {
         <PageToolbar>
           <PageToolbarSection>
             <PageToolbarButton
-              label={translate('SearchSelected')}
+              label={itemsSelected ? translate('SearchSelected') : translate('SearchAll')}
               iconName={icons.SEARCH}
-              isDisabled={!itemsSelected || isSearchingForCutoffUnmetMovies}
-              onPress={this.onSearchSelectedPress}
+              isDisabled={isSearchingForCutoffUnmetMovies}
+              isSpinning={isSearchingForCutoffUnmetMovies}
+              onPress={itemsSelected ? this.onSearchSelectedPress : this.onSearchAllCutoffUnmetPress}
             />
 
+            <PageToolbarSeparator />
+
             <PageToolbarButton
               label={isShowingMonitored ? translate('UnmonitorSelected') : translate('MonitorSelected')}
               iconName={icons.MONITORED}
@@ -166,18 +169,6 @@ class CutoffUnmet extends Component {
               isSpinning={isSaving}
               onPress={this.onToggleSelectedPress}
             />
-
-            <PageToolbarSeparator />
-
-            <PageToolbarButton
-              label={translate('SearchAll')}
-              iconName={icons.SEARCH}
-              isDisabled={!items.length}
-              isSpinning={isSearchingForCutoffUnmetMovies}
-              onPress={this.onSearchAllCutoffUnmetPress}
-            />
-
-            <PageToolbarSeparator />
           </PageToolbarSection>
 
           <PageToolbarSection alignContent={align.RIGHT}>
diff --git a/frontend/src/Wanted/CutoffUnmet/CutoffUnmetConnector.js b/frontend/src/Wanted/CutoffUnmet/CutoffUnmetConnector.js
index ef3af7bf1..410b1a933 100644
--- a/frontend/src/Wanted/CutoffUnmet/CutoffUnmetConnector.js
+++ b/frontend/src/Wanted/CutoffUnmet/CutoffUnmetConnector.js
@@ -18,9 +18,10 @@ function createMapStateToProps() {
   return createSelector(
     (state) => state.wanted.cutoffUnmet,
     createCommandExecutingSelector(commandNames.CUTOFF_UNMET_MOVIES_SEARCH),
-    (cutoffUnmet, isSearchingForCutoffUnmetMovies) => {
+    createCommandExecutingSelector(commandNames.MOVIE_SEARCH),
+    (cutoffUnmet, isSearchingForCutoffUnmetMovies, isSearchingForSelectedCutoffUnmetMovies) => {
       return {
-        isSearchingForCutoffUnmetMovies,
+        isSearchingForCutoffUnmetMovies: isSearchingForCutoffUnmetMovies || isSearchingForSelectedCutoffUnmetMovies,
         isSaving: cutoffUnmet.items.filter((m) => m.isSaving).length > 1,
         ...cutoffUnmet
       };
diff --git a/frontend/src/Wanted/Missing/Missing.js b/frontend/src/Wanted/Missing/Missing.js
index d88a12028..da243fb04 100644
--- a/frontend/src/Wanted/Missing/Missing.js
+++ b/frontend/src/Wanted/Missing/Missing.js
@@ -159,12 +159,15 @@ class Missing extends Component {
         <PageToolbar>
           <PageToolbarSection>
             <PageToolbarButton
-              label={translate('SearchSelected')}
+              label={itemsSelected ? translate('SearchSelected') : translate('SearchAll')}
               iconName={icons.SEARCH}
-              isDisabled={!itemsSelected || isSearchingForMissingMovies}
-              onPress={this.onSearchSelectedPress}
+              isSpinning={isSearchingForMissingMovies}
+              isDisabled={isSearchingForMissingMovies}
+              onPress={itemsSelected ? this.onSearchSelectedPress : this.onSearchAllMissingPress}
             />
 
+            <PageToolbarSeparator />
+
             <PageToolbarButton
               label={isShowingMonitored ? translate('UnmonitorSelected') : translate('MonitorSelected')}
               iconName={icons.MONITORED}
@@ -175,16 +178,6 @@ class Missing extends Component {
 
             <PageToolbarSeparator />
 
-            <PageToolbarButton
-              label={translate('SearchAll')}
-              iconName={icons.SEARCH}
-              isDisabled={!items.length}
-              isSpinning={isSearchingForMissingMovies}
-              onPress={this.onSearchAllMissingPress}
-            />
-
-            <PageToolbarSeparator />
-
             <PageToolbarButton
               label={translate('ManualImport')}
               iconName={icons.INTERACTIVE}
diff --git a/frontend/src/Wanted/Missing/MissingConnector.js b/frontend/src/Wanted/Missing/MissingConnector.js
index dcc4ce27d..b09b3201a 100644
--- a/frontend/src/Wanted/Missing/MissingConnector.js
+++ b/frontend/src/Wanted/Missing/MissingConnector.js
@@ -17,9 +17,10 @@ function createMapStateToProps() {
   return createSelector(
     (state) => state.wanted.missing,
     createCommandExecutingSelector(commandNames.MISSING_MOVIES_SEARCH),
-    (missing, isSearchingForMissingMovies) => {
+    createCommandExecutingSelector(commandNames.MOVIE_SEARCH),
+    (missing, isSearchingForMissingMovies, isSearchingForSelectedMissingMovies) => {
       return {
-        isSearchingForMissingMovies,
+        isSearchingForMissingMovies: isSearchingForMissingMovies || isSearchingForSelectedMissingMovies,
         isSaving: missing.items.filter((m) => m.isSaving).length > 1,
         ...missing
       };