Localization framework

frontend/src/Author/Index/Posters/AuthorIndexPoster.js

@@ -10,6 +10,7 @@ import Link from 'Components/Link/Link';
 import SpinnerIconButton from 'Components/Link/SpinnerIconButton';
 import { icons } from 'Helpers/Props';
 import getRelativeDate from 'Utilities/Date/getRelativeDate';
+import translate from 'Utilities/String/translate';
 import AuthorIndexPosterInfo from './AuthorIndexPosterInfo';
 import styles from './AuthorIndexPoster.css';
 
@@ -122,7 +123,7 @@ class AuthorIndexPoster extends Component {
               <SpinnerIconButton
                 className={styles.action}
                 name={icons.REFRESH}
-                title="Refresh Author"
+                title={translate('RefreshAuthor')}
                 isSpinning={isRefreshingAuthor}
                 onPress={onRefreshAuthorPress}
               />
@@ -132,7 +133,7 @@ class AuthorIndexPoster extends Component {
                   <SpinnerIconButton
                     className={styles.action}
                     name={icons.SEARCH}
-                    title="Search for monitored books"
+                    title={translate('SearchForMonitoredBooks')}
                     isSpinning={isSearchingAuthor}
                     onPress={onSearchPress}
                   />
@@ -141,7 +142,7 @@ class AuthorIndexPoster extends Component {
               <IconButton
                 className={styles.action}
                 name={icons.EDIT}
-                title="Edit Author"
+                title={translate('EditAuthor')}
                 onPress={this.onEditAuthorPress}
               />
             </Label>
@@ -150,7 +151,7 @@ class AuthorIndexPoster extends Component {
               status === 'ended' &&
                 <div
                   className={styles.ended}
-                  title="Ended"
+                  title={translate('Ended')}
                 />
             }
 

frontend/src/Author/Index/Posters/Options/AuthorIndexPosterOptionsModalContent.js

@@ -11,6 +11,7 @@ import ModalContent from 'Components/Modal/ModalContent';
 import ModalFooter from 'Components/Modal/ModalFooter';
 import ModalHeader from 'Components/Modal/ModalHeader';
 import { inputTypes } from 'Helpers/Props';
+import translate from 'Utilities/String/translate';
 
 const posterSizeOptions = [
   { key: 'small', value: 'Small' },
@@ -114,7 +115,9 @@ class AuthorIndexPosterOptionsModalContent extends Component {
         <ModalBody>
           <Form>
             <FormGroup>
-              <FormLabel>Poster Size</FormLabel>
+              <FormLabel>
+                {translate('PosterSize')}
+              </FormLabel>
 
               <FormInputGroup
                 type={inputTypes.SELECT}
@@ -126,61 +129,71 @@ class AuthorIndexPosterOptionsModalContent extends Component {
             </FormGroup>
 
             <FormGroup>
-              <FormLabel>Detailed Progress Bar</FormLabel>
+              <FormLabel>
+                {translate('DetailedProgressBar')}
+              </FormLabel>
 
               <FormInputGroup
                 type={inputTypes.CHECK}
                 name="detailedProgressBar"
                 value={detailedProgressBar}
-                helpText="Show text on progess bar"
+                helpText={translate('DetailedProgressBarHelpText')}
                 onChange={this.onChangePosterOption}
               />
             </FormGroup>
 
             <FormGroup>
-              <FormLabel>Show Name</FormLabel>
+              <FormLabel>
+                {translate('ShowName')}
+              </FormLabel>
 
               <FormInputGroup
                 type={inputTypes.CHECK}
                 name="showTitle"
                 value={showTitle}
-                helpText="Show author name under poster"
+                helpText={translate('ShowTitleHelpText')}
                 onChange={this.onChangePosterOption}
               />
             </FormGroup>
 
             <FormGroup>
-              <FormLabel>Show Monitored</FormLabel>
+              <FormLabel>
+                {translate('ShowMonitored')}
+              </FormLabel>
 
               <FormInputGroup
                 type={inputTypes.CHECK}
                 name="showMonitored"
                 value={showMonitored}
-                helpText="Show monitored status under poster"
+                helpText={translate('ShowMonitoredHelpText')}
                 onChange={this.onChangePosterOption}
               />
             </FormGroup>
 
             <FormGroup>
-              <FormLabel>Show Quality Profile</FormLabel>
+              <FormLabel>
+                {translate('ShowQualityProfile')}
+              </FormLabel>
 
               <FormInputGroup
                 type={inputTypes.CHECK}
                 name="showQualityProfile"
                 value={showQualityProfile}
-                helpText="Show quality profile under poster"
+                helpText={translate('ShowQualityProfileHelpText')}
                 onChange={this.onChangePosterOption}
               />
             </FormGroup>
 
             <FormGroup>
-              <FormLabel>Show Search</FormLabel>
+              <FormLabel>
+                {translate('ShowSearch')}
+              </FormLabel>
 
               <FormInputGroup
                 type={inputTypes.CHECK}
                 name="showSearchAction"
                 value={showSearchAction}
-                helpText="Show search button on hover"
+                helpText={translate('ShowSearchActionHelpText')}
                 onChange={this.onChangePosterOption}
               />
             </FormGroup>