Translate frontend series pages

frontend/src/Series/Delete/DeleteSeriesModalContent.js

@@ -5,12 +5,14 @@ import FormInputGroup from 'Components/Form/FormInputGroup';
 import FormLabel from 'Components/Form/FormLabel';
 import Icon from 'Components/Icon';
 import Button from 'Components/Link/Button';
+import InlineMarkdown from 'Components/Markdown/InlineMarkdown';
 import ModalBody from 'Components/Modal/ModalBody';
 import ModalContent from 'Components/Modal/ModalContent';
 import ModalFooter from 'Components/Modal/ModalFooter';
 import ModalHeader from 'Components/Modal/ModalHeader';
 import { icons, inputTypes, kinds } from 'Helpers/Props';
 import formatBytes from 'Utilities/Number/formatBytes';
+import translate from 'Utilities/String/translate';
 import styles from './DeleteSeriesModalContent.css';
 
 class DeleteSeriesModalContent extends Component {
@@ -61,20 +63,13 @@ class DeleteSeriesModalContent extends Component {
 
     const deleteFiles = this.state.deleteFiles;
     const addImportListExclusion = deleteOptions.addImportListExclusion;
-    let deleteFilesLabel = `Delete ${episodeFileCount} Episode Files`;
-    let deleteFilesHelpText = 'Delete the episode files and series folder';
-
-    if (episodeFileCount === 0) {
-      deleteFilesLabel = 'Delete Series Folder';
-      deleteFilesHelpText = 'Delete the series folder and its contents';
-    }
 
     return (
       <ModalContent
         onModalClose={onModalClose}
       >
         <ModalHeader>
-          Delete - {title}
+          {translate('DeleteSeriesModalHeader', { title })}
         </ModalHeader>
 
         <ModalBody>
@@ -88,25 +83,25 @@ class DeleteSeriesModalContent extends Component {
           </div>
 
           <FormGroup>
-            <FormLabel>Add List Exclusion</FormLabel>
+            <FormLabel>{translate('AddListExclusion')}</FormLabel>
 
             <FormInputGroup
               type={inputTypes.CHECK}
               name="addImportListExclusion"
               value={addImportListExclusion}
-              helpText="Prevent series from being added to Sonarr by lists"
+              helpText={translate('AddListExclusionHelpText')}
               onChange={onDeleteOptionChange}
             />
           </FormGroup>
 
           <FormGroup>
-            <FormLabel>{deleteFilesLabel}</FormLabel>
+            <FormLabel>{episodeFileCount === 0 ? translate('DeleteSeriesFolder') : translate('DeleteEpisodesFiles', { episodeFileCount })}</FormLabel>
 
             <FormInputGroup
               type={inputTypes.CHECK}
               name="deleteFiles"
               value={deleteFiles}
-              helpText={deleteFilesHelpText}
+              helpText={episodeFileCount === 0 ? translate('DeleteSeriesFolderHelpText') : translate('DeleteEpisodesFilesHelpText')}
               kind={kinds.DANGER}
               onChange={this.onDeleteFilesChange}
             />
@@ -115,11 +110,10 @@ class DeleteSeriesModalContent extends Component {
           {
             deleteFiles &&
               <div className={styles.deleteFilesMessage}>
-                <div>The series folder <strong>{path}</strong> and all of its content will be deleted.</div>
-
+                <div><InlineMarkdown data={translate('DeleteSeriesFolderConfirmation', { path })} blockClassName={styles.folderPath} /></div>
                 {
                   !!episodeFileCount &&
-                    <div>{episodeFileCount} episode files totaling {formatBytes(sizeOnDisk)}</div>
+                    <div>{translate('DeleteSeriesFolderEpisodeCount', { episodeFileCount, size: formatBytes(sizeOnDisk) })}</div>
                 }
               </div>
           }
@@ -128,14 +122,14 @@ class DeleteSeriesModalContent extends Component {
 
         <ModalFooter>
           <Button onPress={onModalClose}>
-            Close
+            {translate('Close')}
           </Button>
 
           <Button
             kind={kinds.DANGER}
             onPress={this.onDeleteSeriesConfirmed}
           >
-            Delete
+            {translate('Delete')}
           </Button>
         </ModalFooter>
       </ModalContent>