From 9bac2992b50c978f13c057364a91cd86fefc710a Mon Sep 17 00:00:00 2001
From: Bogdan <mynameisbogdan@users.noreply.github.com>
Date: Thu, 13 Jul 2023 00:37:57 +0300
Subject: [PATCH] Fixed: (UI) Show available indexers count in Add Indexer

---
 .../src/Indexer/Add/AddIndexerModalContent.css | 17 +++++++++++++++++
 .../Add/AddIndexerModalContent.css.d.ts        |  2 ++
 .../src/Indexer/Add/AddIndexerModalContent.js  | 18 ++++++++++++------
 src/NzbDrone.Core/Localization/Core/en.json    |  1 +
 4 files changed, 32 insertions(+), 6 deletions(-)

diff --git a/frontend/src/Indexer/Add/AddIndexerModalContent.css b/frontend/src/Indexer/Add/AddIndexerModalContent.css
index e9ad94b8f..5a92b40cb 100644
--- a/frontend/src/Indexer/Add/AddIndexerModalContent.css
+++ b/frontend/src/Indexer/Add/AddIndexerModalContent.css
@@ -72,3 +72,20 @@
     margin-left: -30px;
   }
 }
+
+.modalFooter {
+  composes: modalFooter from '~Components/Modal/ModalFooter.css';
+
+  justify-content: space-between;
+}
+
+.available {
+  font-weight: bold;
+}
+
+@media only screen and (max-width: $breakpointExtraSmall) {
+  .modalFooter {
+    flex-direction: column;
+    gap: 10px;
+  }
+}
diff --git a/frontend/src/Indexer/Add/AddIndexerModalContent.css.d.ts b/frontend/src/Indexer/Add/AddIndexerModalContent.css.d.ts
index 0e1cb0339..cbedc72a4 100644
--- a/frontend/src/Indexer/Add/AddIndexerModalContent.css.d.ts
+++ b/frontend/src/Indexer/Add/AddIndexerModalContent.css.d.ts
@@ -2,12 +2,14 @@
 // Please do not change this file!
 interface CssExports {
   'alert': string;
+  'available': string;
   'filterContainer': string;
   'filterInput': string;
   'filterLabel': string;
   'filterRow': string;
   'indexers': string;
   'modalBody': string;
+  'modalFooter': string;
   'scroller': string;
 }
 export const cssExports: CssExports;
diff --git a/frontend/src/Indexer/Add/AddIndexerModalContent.js b/frontend/src/Indexer/Add/AddIndexerModalContent.js
index 9d36ae4e7..4617664ad 100644
--- a/frontend/src/Indexer/Add/AddIndexerModalContent.js
+++ b/frontend/src/Indexer/Add/AddIndexerModalContent.js
@@ -278,12 +278,18 @@ class AddIndexerModalContent extends Component {
           </Scroller>
         </ModalBody>
 
-        <ModalFooter>
-          <Button
-            onPress={onModalClose}
-          >
-            {translate('Close')}
-          </Button>
+        <ModalFooter className={styles.modalFooter}>
+          <div className={styles.available}>
+            {
+              isPopulated ?
+                translate('CountIndexersAvailable', [filteredIndexers.length]) :
+                null
+            }
+          </div>
+
+          <div>
+            <Button onPress={onModalClose}>{translate('Close')}</Button>
+          </div>
         </ModalFooter>
       </ModalContent>
     );
diff --git a/src/NzbDrone.Core/Localization/Core/en.json b/src/NzbDrone.Core/Localization/Core/en.json
index 2183dcfcd..aa497b0ab 100644
--- a/src/NzbDrone.Core/Localization/Core/en.json
+++ b/src/NzbDrone.Core/Localization/Core/en.json
@@ -106,6 +106,7 @@
   "CouldNotConnectSignalR": "Could not connect to SignalR, UI won't update",
   "CountApplicationsSelected": "{0} application(s) selected",
   "CountDownloadClientsSelected": "{0} download client(s) selected",
+  "CountIndexersAvailable": "{0} indexer(s) available",
   "CountIndexersSelected": "{0} indexer(s) selected",
   "Custom": "Custom",
   "CustomFilters": "Custom Filters",