Translate System pages

(cherry picked from commit 93e8ff0ac7610fa8739f2e577ece98c2c06c8881)

frontend/src/System/Backup/BackupRow.js

@@ -116,6 +116,7 @@ class BackupRow extends Component {
 
         <TableRowCell className={styles.actions}>
           <IconButton
+            title={translate('RestoreBackup')}
             name={icons.RESTORE}
             onPress={this.onRestorePress}
           />
@@ -138,7 +139,9 @@ class BackupRow extends Component {
           isOpen={isConfirmDeleteModalOpen}
           kind={kinds.DANGER}
           title={translate('DeleteBackup')}
-          message={translate('DeleteBackupMessageText', { name })}
+          message={translate('DeleteBackupMessageText', {
+            name
+          })}
           confirmLabel={translate('Delete')}
           onConfirm={this.onConfirmDeletePress}
           onCancel={this.onConfirmDeleteModalClose}

frontend/src/System/Backup/Backups.js

@@ -109,7 +109,7 @@ class Backups extends Component {
           {
             !isFetching && !!error &&
               <Alert kind={kinds.DANGER}>
-                {translate('UnableToLoadBackups')}
+                {translate('BackupsLoadError')}
               </Alert>
           }
 

frontend/src/System/Backup/RestoreBackupModalContent.js

@@ -14,7 +14,7 @@ import styles from './RestoreBackupModalContent.css';
 
 function getErrorMessage(error) {
   if (!error || !error.responseJSON || !error.responseJSON.message) {
-    return 'Error restoring backup';
+    return translate('ErrorRestoringBackup');
   }
 
   return error.responseJSON.message;
@@ -146,7 +146,9 @@ class RestoreBackupModalContent extends Component {
 
         <ModalBody>
           {
-            !!id && `Would you like to restore the backup '${name}'?`
+            !!id && translate('WouldYouLikeToRestoreBackup', {
+              name
+            })
           }
 
           {
@@ -203,7 +205,7 @@ class RestoreBackupModalContent extends Component {
 
         <ModalFooter>
           <div className={styles.additionalInfo}>
-            Note: Prowlarr will automatically restart and reload the UI during the restore process.
+            {translate('RestartReloadNote')}
           </div>
 
           <Button onPress={onModalClose}>
@@ -216,7 +218,7 @@ class RestoreBackupModalContent extends Component {
             isSpinning={isRestoring}
             onPress={this.onRestorePress}
           >
-            Restore
+            {translate('Restore')}
           </SpinnerButton>
         </ModalFooter>
       </ModalContent>

frontend/src/System/Events/LogsTable.js

@@ -84,7 +84,7 @@ function LogsTable(props) {
         {
           isPopulated && !error && !items.length &&
             <Alert kind={kinds.INFO}>
-              No events found
+              {translate('NoEventsFound')}
             </Alert>
         }
 

frontend/src/System/Events/LogsTableDetailsModal.js

@@ -28,7 +28,7 @@ function LogsTableDetailsModal(props) {
         onModalClose={onModalClose}
       >
         <ModalHeader>
-          Details
+          {translate('Details')}
         </ModalHeader>
 
         <ModalBody>

frontend/src/System/Logs/Files/LogFiles.js

@@ -1,8 +1,8 @@
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import Alert from 'Components/Alert';
-import Link from 'Components/Link/Link';
 import LoadingIndicator from 'Components/Loading/LoadingIndicator';
+import InlineMarkdown from 'Components/Markdown/InlineMarkdown';
 import PageContent from 'Components/Page/PageContent';
 import PageContentBody from 'Components/Page/PageContentBody';
 import PageToolbar from 'Components/Page/Toolbar/PageToolbar';
@@ -77,13 +77,15 @@ class LogFiles extends Component {
         <PageContentBody>
           <Alert>
             <div>
-              Log files are located in: {location}
+              {translate('LogFilesLocation', {
+                location
+              })}
             </div>
 
             {
               currentLogView === 'Log Files' &&
                 <div>
-                  The log level defaults to 'Info' and can be changed in <Link to="/settings/general">General Settings</Link>
+                  <InlineMarkdown data={translate('TheLogLevelDefault')} />
                 </div>
             }
           </Alert>

frontend/src/System/Logs/Files/LogFilesConnector.js

@@ -7,6 +7,7 @@ import { executeCommand } from 'Store/Actions/commandActions';
 import { fetchLogFiles } from 'Store/Actions/systemActions';
 import createCommandExecutingSelector from 'Store/Selectors/createCommandExecutingSelector';
 import combinePath from 'Utilities/String/combinePath';
+import translate from 'Utilities/String/translate';
 import LogFiles from './LogFiles';
 
 function createMapStateToProps() {
@@ -29,7 +30,7 @@ function createMapStateToProps() {
         isFetching,
         items,
         deleteFilesExecuting,
-        currentLogView: 'Log Files',
+        currentLogView: translate('LogFiles'),
         location: combinePath(isWindows, appData, ['logs'])
       };
     }

frontend/src/System/Logs/Files/LogFilesTableRow.js

@@ -4,6 +4,7 @@ import Link from 'Components/Link/Link';
 import RelativeDateCell from 'Components/Table/Cells/RelativeDateCell';
 import TableRowCell from 'Components/Table/Cells/TableRowCell';
 import TableRow from 'Components/Table/TableRow';
+import translate from 'Utilities/String/translate';
 import styles from './LogFilesTableRow.css';
 
 class LogFilesTableRow extends Component {
@@ -32,7 +33,7 @@ class LogFilesTableRow extends Component {
             target="_blank"
             noRouter={true}
           >
-            Download
+            {translate('Download')}
           </Link>
         </TableRowCell>
       </TableRow>

frontend/src/System/Logs/LogsNavMenu.js

@@ -4,6 +4,7 @@ import Menu from 'Components/Menu/Menu';
 import MenuButton from 'Components/Menu/MenuButton';
 import MenuContent from 'Components/Menu/MenuContent';
 import MenuItem from 'Components/Menu/MenuItem';
+import translate from 'Utilities/String/translate';
 
 class LogsNavMenu extends Component {
 
@@ -50,13 +51,13 @@ class LogsNavMenu extends Component {
           <MenuItem
             to={'/system/logs/files'}
           >
-            Log Files
+            {translate('LogFiles')}
           </MenuItem>
 
           <MenuItem
             to={'/system/logs/files/update'}
           >
-            Updater Log Files
+            {translate('UpdaterLogFiles')}
           </MenuItem>
         </MenuContent>
       </Menu>

frontend/src/System/Updates/Updates.js

@@ -45,11 +45,11 @@ class Updates extends Component {
     const hasUpdateToInstall = hasUpdates && _.some(items, { installable: true, latest: true });
     const noUpdateToInstall = hasUpdates && !hasUpdateToInstall;
 
-    const externalUpdaterPrefix = 'Unable to update Prowlarr directly,';
+    const externalUpdaterPrefix = translate('UpdateAppDirectlyLoadError');
     const externalUpdaterMessages = {
-      external: 'Prowlarr is configured to use an external update mechanism',
-      apt: 'use apt to install the update',
-      docker: 'update the docker container to receive the update'
+      external: translate('ExternalUpdater'),
+      apt: translate('AptUpdater'),
+      docker: translate('DockerUpdater')
     };
 
     return (
@@ -78,7 +78,7 @@ class Updates extends Component {
                       isSpinning={isInstallingUpdate}
                       onPress={onInstallLatestPress}
                     >
-                      Install Latest
+                      {translate('InstallLatest')}
                     </SpinnerButton> :
 
                     <Fragment>
@@ -114,7 +114,7 @@ class Updates extends Component {
                 />
 
                 <div className={styles.message}>
-                  {translate('TheLatestVersionIsAlreadyInstalled')}
+                  {translate('OnLatestVersion')}
                 </div>
 
                 {
@@ -166,7 +166,7 @@ class Updates extends Component {
                                 kind={kinds.SUCCESS}
                                 title={formatDateTime(update.installedOn, longDateFormat, timeFormat)}
                               >
-                                Currently Installed
+                                {translate('CurrentlyInstalled')}
                               </Label> :
                               null
                           }
@@ -178,7 +178,7 @@ class Updates extends Component {
                                 kind={kinds.INVERSE}
                                 title={formatDateTime(update.installedOn, longDateFormat, timeFormat)}
                               >
-                                Previously Installed
+                                {translate('PreviouslyInstalled')}
                               </Label> :
                               null
                           }
@@ -214,16 +214,16 @@ class Updates extends Component {
 
           {
             !!updatesError &&
-              <div>
-                Failed to fetch updates
-              </div>
+              <Alert kind={kinds.WARNING}>
+                {translate('FailedToFetchUpdates')}
+              </Alert>
           }
 
           {
             !!generalSettingsError &&
-              <div>
-                Failed to update settings
-              </div>
+              <Alert kind={kinds.DANGER}>
+                {translate('FailedToUpdateSettings')}
+              </Alert>
           }
         </PageContentBody>
       </PageContent>