New: Optionally display authors as LastName, FirstName in index

Fixes #1062

frontend/src/Author/Index/Table/AuthorIndexRow.js

@@ -82,6 +82,7 @@ class AuthorIndexRow extends Component {
       monitored,
       status,
       authorName,
+      authorNameLastFirst,
       titleSlug,
       qualityProfile,
       metadataProfile,
@@ -95,6 +96,7 @@ class AuthorIndexRow extends Component {
       tags,
       images,
       showBanners,
+      showTitle,
       showSearchAction,
       columns,
       isRefreshingAuthor,
@@ -169,14 +171,14 @@ class AuthorIndexRow extends Component {
                         {
                           hasBannerError &&
                             <div className={styles.overlayTitle}>
-                              {authorName}
+                              {showTitle === 'firstLast' ? authorName : authorNameLastFirst}
                             </div>
                         }
                       </Link> :
 
                       <AuthorNameLink
                         titleSlug={titleSlug}
-                        authorName={authorName}
+                        authorName={showTitle === 'firstLast' ? authorName : authorNameLastFirst}
                       />
                   }
                 </VirtualTableRowCell>
@@ -408,6 +410,7 @@ AuthorIndexRow.propTypes = {
   monitored: PropTypes.bool.isRequired,
   status: PropTypes.string.isRequired,
   authorName: PropTypes.string.isRequired,
+  authorNameLastFirst: PropTypes.string.isRequired,
   titleSlug: PropTypes.string.isRequired,
   qualityProfile: PropTypes.object.isRequired,
   metadataProfile: PropTypes.object.isRequired,
@@ -422,6 +425,7 @@ AuthorIndexRow.propTypes = {
   tags: PropTypes.arrayOf(PropTypes.number).isRequired,
   images: PropTypes.arrayOf(PropTypes.object).isRequired,
   showBanners: PropTypes.bool.isRequired,
+  showTitle: PropTypes.string.isRequired,
   showSearchAction: PropTypes.bool.isRequired,
   columns: PropTypes.arrayOf(PropTypes.object).isRequired,
   isRefreshingAuthor: PropTypes.bool.isRequired,

frontend/src/Author/Index/Table/AuthorIndexTable.js

@@ -25,12 +25,13 @@ class AuthorIndexTable extends Component {
   componentDidUpdate(prevProps) {
     const {
       items,
+      sortKey,
       jumpToCharacter
     } = this.props;
 
     if (jumpToCharacter != null && jumpToCharacter !== prevProps.jumpToCharacter) {
 
-      const scrollIndex = getIndexOfFirstCharacter(items, jumpToCharacter);
+      const scrollIndex = getIndexOfFirstCharacter(items, sortKey, jumpToCharacter);
 
       if (scrollIndex != null) {
         this.setState({ scrollIndex });
@@ -47,7 +48,8 @@ class AuthorIndexTable extends Component {
     const {
       items,
       columns,
-      showBanners
+      showBanners,
+      showTitle
     } = this.props;
 
     const author = items[rowIndex];
@@ -66,6 +68,7 @@ class AuthorIndexTable extends Component {
           qualityProfileId={author.qualityProfileId}
           metadataProfileId={author.metadataProfileId}
           showBanners={showBanners}
+          showTitle={showTitle}
         />
       </VirtualTableRow>
     );
@@ -118,9 +121,10 @@ class AuthorIndexTable extends Component {
 AuthorIndexTable.propTypes = {
   items: PropTypes.arrayOf(PropTypes.object).isRequired,
   columns: PropTypes.arrayOf(PropTypes.object).isRequired,
-  sortKey: PropTypes.string,
+  sortKey: PropTypes.string.isRequired,
   sortDirection: PropTypes.oneOf(sortDirections.all),
   showBanners: PropTypes.bool.isRequired,
+  showTitle: PropTypes.string.isRequired,
   jumpToCharacter: PropTypes.string,
   scrollTop: PropTypes.number,
   scroller: PropTypes.instanceOf(Element).isRequired,

frontend/src/Author/Index/Table/AuthorIndexTableConnector.js

@@ -12,6 +12,7 @@ function createMapStateToProps() {
       return {
         isSmallScreen: dimensions.isSmallScreen,
         showBanners: tableOptions.showBanners,
+        showTitle: tableOptions.showTitle,
         columns
       };
     }

frontend/src/Author/Index/Table/AuthorIndexTableOptions.js

@@ -6,6 +6,11 @@ import FormLabel from 'Components/Form/FormLabel';
 import { inputTypes } from 'Helpers/Props';
 import translate from 'Utilities/String/translate';
 
+const nameOptions = [
+  { key: 'firstLast', value: translate('NameFirstLast') },
+  { key: 'lastFirst', value: translate('NameLastFirst') }
+];
+
 class AuthorIndexTableOptions extends Component {
 
   //
@@ -16,23 +21,27 @@ class AuthorIndexTableOptions extends Component {
 
     this.state = {
       showBanners: props.showBanners,
-      showSearchAction: props.showSearchAction
+      showSearchAction: props.showSearchAction,
+      showTitle: props.showTitle
     };
   }
 
   componentDidUpdate(prevProps) {
     const {
       showBanners,
-      showSearchAction
+      showSearchAction,
+      showTitle
     } = this.props;
 
     if (
       showBanners !== prevProps.showBanners ||
-      showSearchAction !== prevProps.showSearchAction
+      showSearchAction !== prevProps.showSearchAction ||
+      showTitle !== prevProps.showTitle
     ) {
       this.setState({
         showBanners,
-        showSearchAction
+        showSearchAction,
+        showTitle
       });
     }
   }
@@ -59,11 +68,26 @@ class AuthorIndexTableOptions extends Component {
   render() {
     const {
       showBanners,
-      showSearchAction
+      showSearchAction,
+      showTitle
     } = this.state;
 
     return (
       <Fragment>
+        <FormGroup>
+          <FormLabel>
+            {translate('NameStyle')}
+          </FormLabel>
+
+          <FormInputGroup
+            type={inputTypes.SELECT}
+            name="showTitle"
+            value={showTitle}
+            values={nameOptions}
+            onChange={this.onTableOptionChange}
+          />
+        </FormGroup>
+
         <FormGroup>
           <FormLabel>
             {translate('ShowBanners')}
@@ -97,6 +121,7 @@ class AuthorIndexTableOptions extends Component {
 }
 
 AuthorIndexTableOptions.propTypes = {
+  showTitle: PropTypes.string.isRequired,
   showBanners: PropTypes.bool.isRequired,
   showSearchAction: PropTypes.bool.isRequired,
   onTableOptionChange: PropTypes.func.isRequired