New: Confirmation for searching movies

frontend/src/Movie/Index/MovieIndexSearchButton.tsx

@@ -1,11 +1,12 @@
-import React, { useCallback, useMemo } from 'react';
+import React, { useCallback, useMemo, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { useSelect } from 'App/SelectContext';
 import ClientSideCollectionAppState from 'App/State/ClientSideCollectionAppState';
 import MoviesAppState, { MovieIndexAppState } from 'App/State/MoviesAppState';
 import { MOVIE_SEARCH } from 'Commands/commandNames';
+import ConfirmModal from 'Components/Modal/ConfirmModal';
 import PageToolbarButton from 'Components/Page/Toolbar/PageToolbarButton';
-import { icons } from 'Helpers/Props';
+import { icons, kinds } from 'Helpers/Props';
 import { executeCommand } from 'Store/Actions/commandActions';
 import createCommandExecutingSelector from 'Store/Selectors/createCommandExecutingSelector';
 import createMovieClientSideCollectionItemsSelector from 'Store/Selectors/createMovieClientSideCollectionItemsSelector';
@@ -25,6 +26,8 @@ function MovieIndexSearchButton(props: MovieIndexSearchButtonProps) {
     useSelector(createMovieClientSideCollectionItemsSelector('movieIndex'));
 
   const dispatch = useDispatch();
+  const [isConfirmModalOpen, setIsConfirmModalOpen] = useState(false);
+
   const { isSelectMode, selectedFilterKey } = props;
   const [selectState] = useSelect();
   const { selectedState } = selectState;
@@ -49,6 +52,8 @@ function MovieIndexSearchButton(props: MovieIndexSearchButtonProps) {
       : translate('SearchAll');
 
   const onPress = useCallback(() => {
+    setIsConfirmModalOpen(false);
+
     dispatch(
       executeCommand({
         name: MOVIE_SEARCH,
@@ -57,14 +62,36 @@ function MovieIndexSearchButton(props: MovieIndexSearchButtonProps) {
     );
   }, [dispatch, moviesToSearch]);
 
+  const onConfirmPress = useCallback(() => {
+    setIsConfirmModalOpen(true);
+  }, [setIsConfirmModalOpen]);
+
+  const onConfirmModalClose = useCallback(() => {
+    setIsConfirmModalOpen(false);
+  }, [setIsConfirmModalOpen]);
+
   return (
-    <PageToolbarButton
-      label={isSelectMode ? searchSelectLabel : searchIndexLabel}
-      isSpinning={isSearching}
-      isDisabled={!items.length}
-      iconName={icons.SEARCH}
-      onPress={onPress}
-    />
+    <>
+      <PageToolbarButton
+        label={isSelectMode ? searchSelectLabel : searchIndexLabel}
+        isSpinning={isSearching}
+        isDisabled={!items.length}
+        iconName={icons.SEARCH}
+        onPress={moviesToSearch.length > 5 ? onConfirmPress : onPress}
+      />
+
+      <ConfirmModal
+        isOpen={isConfirmModalOpen}
+        kind={kinds.DANGER}
+        title={isSelectMode ? searchSelectLabel : searchIndexLabel}
+        message={translate('SearchMoviesConfirmationMessageText', {
+          count: moviesToSearch.length,
+        })}
+        confirmLabel={isSelectMode ? searchSelectLabel : searchIndexLabel}
+        onConfirm={onPress}
+        onCancel={onConfirmModalClose}
+      />
+    </>
   );
 }
 

src/NzbDrone.Core/Localization/Core/en.json

@@ -1072,6 +1072,7 @@
   "SearchOnAddCollectionHelpText": "Search for movies on this collection when added to library",
   "SearchOnAddHelpText": "Search for movies on this list when added to library",
   "SearchSelected": "Search Selected",
+  "SearchMoviesConfirmationMessageText": "Are you sure you want to run a search for {count} movie(s)?",
   "Seconds": "Seconds",
   "Security": "Security",
   "Seeders": "Seeders",