Localization framework

frontend/src/Settings/DownloadClients/RemotePathMappings/EditRemotePathMappingModalContent.js

@@ -13,6 +13,7 @@ import ModalFooter from 'Components/Modal/ModalFooter';
 import ModalHeader from 'Components/Modal/ModalHeader';
 import { inputTypes, kinds } from 'Helpers/Props';
 import { stringSettingShape } from 'Helpers/Props/Shapes/settingShape';
+import translate from 'Utilities/String/translate';
 import styles from './EditRemotePathMappingModalContent.css';
 
 function EditRemotePathMappingModalContent(props) {
@@ -51,19 +52,23 @@ function EditRemotePathMappingModalContent(props) {
 
         {
           !isFetching && !!error &&
-            <div>Unable to add a new remote path mapping, please try again.</div>
+            <div>
+              {translate('UnableToAddANewRemotePathMappingPleaseTryAgain')}
+            </div>
         }
 
         {
           !isFetching && !error &&
             <Form {...otherProps}>
               <FormGroup>
-                <FormLabel>Host</FormLabel>
+                <FormLabel>
+                  {translate('Host')}
+                </FormLabel>
 
                 <FormInputGroup
                   type={inputTypes.SELECT}
                   name="host"
-                  helpText="The same host you specified for the remote Download Client"
+                  helpText={translate('HostHelpText')}
                   {...host}
                   values={downloadClientHosts}
                   onChange={onInputChange}
@@ -71,24 +76,28 @@ function EditRemotePathMappingModalContent(props) {
               </FormGroup>
 
               <FormGroup>
-                <FormLabel>Remote Path</FormLabel>
+                <FormLabel>
+                  {translate('RemotePath')}
+                </FormLabel>
 
                 <FormInputGroup
                   type={inputTypes.TEXT}
                   name="remotePath"
-                  helpText="Root path to the directory that the Download Client accesses"
+                  helpText={translate('RemotePathHelpText')}
                   {...remotePath}
                   onChange={onInputChange}
                 />
               </FormGroup>
 
               <FormGroup>
-                <FormLabel>Local Path</FormLabel>
+                <FormLabel>
+                  {translate('LocalPath')}
+                </FormLabel>
 
                 <FormInputGroup
                   type={inputTypes.PATH}
                   name="localPath"
-                  helpText="Path that Readarr should use to access the remote path locally"
+                  helpText={translate('LocalPathHelpText')}
                   {...localPath}
                   onChange={onInputChange}
                 />

frontend/src/Settings/DownloadClients/RemotePathMappings/RemotePathMapping.js

@@ -5,6 +5,7 @@ import Icon from 'Components/Icon';
 import Link from 'Components/Link/Link';
 import ConfirmModal from 'Components/Modal/ConfirmModal';
 import { icons, kinds } from 'Helpers/Props';
+import translate from 'Utilities/String/translate';
 import EditRemotePathMappingModalConnector from './EditRemotePathMappingModalConnector';
 import styles from './RemotePathMapping.css';
 
@@ -87,9 +88,9 @@ class RemotePathMapping extends Component {
         <ConfirmModal
           isOpen={this.state.isDeleteRemotePathMappingModalOpen}
           kind={kinds.DANGER}
-          title="Delete Delay Profile"
-          message="Are you sure you want to delete this remote path mapping?"
-          confirmLabel="Delete"
+          title={translate('DeleteDelayProfile')}
+          message={translate('DeleteDelayProfileMessageText')}
+          confirmLabel={translate('Delete')}
           onConfirm={this.onConfirmDeleteRemotePathMapping}
           onCancel={this.onDeleteRemotePathMappingModalClose}
         />

frontend/src/Settings/DownloadClients/RemotePathMappings/RemotePathMappings.js

@@ -5,6 +5,7 @@ import Icon from 'Components/Icon';
 import Link from 'Components/Link/Link';
 import PageSectionContent from 'Components/Page/PageSectionContent';
 import { icons } from 'Helpers/Props';
+import translate from 'Utilities/String/translate';
 import EditRemotePathMappingModalConnector from './EditRemotePathMappingModalConnector';
 import RemotePathMapping from './RemotePathMapping';
 import styles from './RemotePathMappings.css';
@@ -44,9 +45,9 @@ class RemotePathMappings extends Component {
     } = this.props;
 
     return (
-      <FieldSet legend="Remote Path Mappings">
+      <FieldSet legend={translate('RemotePathMappings')}>
         <PageSectionContent
-          errorMessage="Unable to load Remote Path Mappings"
+          errorMessage={translate('UnableToLoadRemotePathMappings')}
           {...otherProps}
         >
           <div className={styles.remotePathMappingsHeader}>