From cc63c3f3cd34fa30162a08cbf819b2eab7b04851 Mon Sep 17 00:00:00 2001
From: Qstick <qstick@gmail.com>
Date: Sun, 30 Apr 2023 22:41:46 -0500
Subject: [PATCH] Fixed: Movie count incorrect in Movie Editor

Fixes #8423
---
 .../Select/Edit/EditMoviesModalContent.tsx    |  2 +-
 .../Index/Select/MovieIndexSelectFooter.tsx   |  2 +-
 frontend/src/Utilities/String/translate.js    | 19 ++++++++-----------
 3 files changed, 10 insertions(+), 13 deletions(-)

diff --git a/frontend/src/Movie/Index/Select/Edit/EditMoviesModalContent.tsx b/frontend/src/Movie/Index/Select/Edit/EditMoviesModalContent.tsx
index a70db4b1c..973196044 100644
--- a/frontend/src/Movie/Index/Select/Edit/EditMoviesModalContent.tsx
+++ b/frontend/src/Movie/Index/Select/Edit/EditMoviesModalContent.tsx
@@ -166,7 +166,7 @@ function EditMoviesModalContent(props: EditMoviesModalContentProps) {
 
       <ModalFooter className={styles.modalFooter}>
         <div className={styles.selected}>
-          {translate('MoviesSelectedInterp', selectedCount.toString())}
+          {translate('MoviesSelectedInterp', [selectedCount])}
         </div>
 
         <div>
diff --git a/frontend/src/Movie/Index/Select/MovieIndexSelectFooter.tsx b/frontend/src/Movie/Index/Select/MovieIndexSelectFooter.tsx
index d3ed279eb..50ef063a7 100644
--- a/frontend/src/Movie/Index/Select/MovieIndexSelectFooter.tsx
+++ b/frontend/src/Movie/Index/Select/MovieIndexSelectFooter.tsx
@@ -181,7 +181,7 @@ function MovieIndexSelectFooter() {
       </div>
 
       <div className={styles.selected}>
-        {translate('MoviesSelectedInterp', selectedCount.toString())}
+        {translate('MoviesSelectedInterp', [selectedCount])}
       </div>
 
       <EditMoviesModal
diff --git a/frontend/src/Utilities/String/translate.js b/frontend/src/Utilities/String/translate.js
index 38605c2de..696d5ad28 100644
--- a/frontend/src/Utilities/String/translate.js
+++ b/frontend/src/Utilities/String/translate.js
@@ -1,34 +1,31 @@
-import $ from 'jquery';
+import createAjaxRequest from 'Utilities/createAjaxRequest';
 
 function getTranslations() {
   let localization = null;
   const ajaxOptions = {
     async: false,
-    type: 'GET',
-    global: false,
     dataType: 'json',
-    url: `${window.Radarr.apiRoot}/localization`,
+    url: '/localization',
     success: function(data) {
       localization = data.Strings;
     }
   };
 
-  ajaxOptions.headers = ajaxOptions.headers || {};
-  ajaxOptions.headers['X-Api-Key'] = window.Radarr.apiKey;
+  createAjaxRequest(ajaxOptions);
 
-  $.ajax(ajaxOptions);
   return localization;
 }
 
 const translations = getTranslations();
 
-export default function translate(key, args = '') {
+export default function translate(key, args) {
+  const translation = translations[key] || key;
+
   if (args) {
-    const translatedKey = translate(key);
-    return translatedKey.replace(/\{(\d+)\}/g, (match, index) => {
+    return translation.replace(/\{(\d+)\}/g, (match, index) => {
       return args[index];
     });
   }
 
-  return translations[key] || key;
+  return translation;
 }