Catchup Linting

Signed-off-by: Robin Dadswell <robin@dadswell.email>

azure-pipelines.yml

@@ -791,9 +791,6 @@ stages:
 
     - job: Analyze_Backend
       displayName: Backend
-      dependsOn: Prepare
-      condition: and(succeeded(), eq(dependencies.Prepare.outputs['setVar.backendNotUpdated'], '0'))
-
       variables:
         disable.coverage.autogenerate: 'true'
       pool:

frontend/src/Activity/Blacklist/Blacklist.js

@@ -3,6 +3,7 @@ import React, { Component } from 'react';
 import LoadingIndicator from 'Components/Loading/LoadingIndicator';
 import PageContent from 'Components/Page/PageContent';
 import PageContentBodyConnector from 'Components/Page/PageContentBodyConnector';
+import PageContentBody from 'Components/Page/PageContentBody';
 import PageToolbar from 'Components/Page/Toolbar/PageToolbar';
 import PageToolbarButton from 'Components/Page/Toolbar/PageToolbarButton';
 import PageToolbarSection from 'Components/Page/Toolbar/PageToolbarSection';

frontend/src/Activity/History/History.js

@@ -4,6 +4,7 @@ import LoadingIndicator from 'Components/Loading/LoadingIndicator';
 import FilterMenu from 'Components/Menu/FilterMenu';
 import PageContent from 'Components/Page/PageContent';
 import PageContentBodyConnector from 'Components/Page/PageContentBodyConnector';
+import PageContentBody from 'Components/Page/PageContentBody';
 import PageToolbar from 'Components/Page/Toolbar/PageToolbar';
 import PageToolbarButton from 'Components/Page/Toolbar/PageToolbarButton';
 import PageToolbarSection from 'Components/Page/Toolbar/PageToolbarSection';

frontend/src/Author/Details/AuthorDetails.js

@@ -24,14 +24,11 @@ import PageToolbarSeparator from 'Components/Page/Toolbar/PageToolbarSeparator';
 import Popover from 'Components/Tooltip/Popover';
 import Tooltip from 'Components/Tooltip/Tooltip';
 import { align, icons, kinds, sizes, tooltipPositions } from 'Helpers/Props';
-import InteractiveSearchFilterMenuConnector from 'InteractiveSearch/InteractiveSearchFilterMenuConnector';
-import InteractiveSearchTable from 'InteractiveSearch/InteractiveSearchTable';
 import OrganizePreviewModalConnector from 'Organize/OrganizePreviewModalConnector';
 import RetagPreviewModalConnector from 'Retag/RetagPreviewModalConnector';
 import QualityProfileNameConnector from 'Settings/Profiles/Quality/QualityProfileNameConnector';
 import fonts from 'Styles/Variables/fonts';
 import formatBytes from 'Utilities/Number/formatBytes';
-import stripHtml from 'Utilities/String/stripHtml';
 import selectAll from 'Utilities/Table/selectAll';
 import toggleSelected from 'Utilities/Table/toggleSelected';
 import InteractiveImportModal from '../../InteractiveImport/InteractiveImportModal';

frontend/src/Author/Details/AuthorDetailsPageConnector.js

@@ -7,6 +7,7 @@ import { createSelector } from 'reselect';
 import LoadingIndicator from 'Components/Loading/LoadingIndicator';
 import NotFound from 'Components/NotFound';
 import PageContent from 'Components/Page/PageContent';
+import PageContentBody from 'Components/Page/PageContentBody';
 import PageContentBodyConnector from 'Components/Page/PageContentBodyConnector';
 import getErrorMessage from 'Utilities/Object/getErrorMessage';
 import AuthorDetailsConnector from './AuthorDetailsConnector';

frontend/src/Author/Details/BookRow.js

@@ -9,6 +9,7 @@ import RelativeDateCellConnector from 'Components/Table/Cells/RelativeDateCellCo
 import TableRowCell from 'Components/Table/Cells/TableRowCell';
 import TableRow from 'Components/Table/TableRow';
 import { kinds, sizes } from 'Helpers/Props';
+import formatTimeSpan from 'Utilities/Date/formatTimeSpan';
 import styles from './BookRow.css';
 
 function getBookCountKind(monitored, bookFileCount, bookCount) {

frontend/src/Author/Editor/AuthorEditorRow.js

@@ -3,10 +3,12 @@ import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import AuthorNameLink from 'Author/AuthorNameLink';
 import AuthorStatusCell from 'Author/Index/Table/AuthorStatusCell';
+import CheckInput from 'Components/Form/CheckInput';
 import TableRowCell from 'Components/Table/Cells/TableRowCell';
 import TableSelectCell from 'Components/Table/Cells/TableSelectCell';
 import TableRow from 'Components/Table/TableRow';
 import TagListConnector from 'Components/TagListConnector';
+import styles from './AuthorEditorRow.css';
 
 class AuthorEditorRow extends Component {
 

frontend/src/Author/Index/AuthorIndexConnector.js

@@ -8,8 +8,7 @@ import withScrollPosition from 'Components/withScrollPosition';
 import { setAuthorFilter, setAuthorSort, setAuthorTableOption, setAuthorView } from 'Store/Actions/authorIndexActions';
 import { executeCommand } from 'Store/Actions/commandActions';
 import scrollPositions from 'Store/scrollPositions';
-import createAuthorClientSideCollectionItemsSelector
-  from 'Store/Selectors/createAuthorClientSideCollectionItemsSelector';
+import createAuthorClientSideCollectionItemsSelector from 'Store/Selectors/createAuthorClientSideCollectionItemsSelector';
 import createCommandExecutingSelector from 'Store/Selectors/createCommandExecutingSelector';
 import createDimensionsSelector from 'Store/Selectors/createDimensionsSelector';
 import AuthorIndex from './AuthorIndex';

frontend/src/Author/Index/Overview/AuthorIndexOverview.js

@@ -11,7 +11,6 @@ import SpinnerIconButton from 'Components/Link/SpinnerIconButton';
 import { icons } from 'Helpers/Props';
 import dimensions from 'Styles/Variables/dimensions';
 import fonts from 'Styles/Variables/fonts';
-import stripHtml from 'Utilities/String/stripHtml';
 import AuthorIndexOverviewInfo from './AuthorIndexOverviewInfo';
 import styles from './AuthorIndexOverview.css';
 

frontend/src/Book/Details/BookDetailsPageConnector.js

@@ -7,6 +7,7 @@ import { createSelector } from 'reselect';
 import LoadingIndicator from 'Components/Loading/LoadingIndicator';
 import NotFound from 'Components/NotFound';
 import PageContent from 'Components/Page/PageContent';
+import PageContentBody from 'Components/Page/PageContentBody';
 import PageContentBodyConnector from 'Components/Page/PageContentBodyConnector';
 import { clearBooks, fetchBooks } from 'Store/Actions/bookActions';
 import BookDetailsConnector from './BookDetailsConnector';

frontend/src/BookFile/Editor/BookFileEditorRow.js

@@ -4,6 +4,7 @@ import BookQuality from 'Book/BookQuality';
 import TableRowCell from 'Components/Table/Cells/TableRowCell';
 import TableSelectCell from 'Components/Table/Cells/TableSelectCell';
 import TableRow from 'Components/Table/TableRow';
+import padNumber from 'Utilities/Number/padNumber';
 
 function BookFileEditorRow(props) {
   const {

frontend/src/BookFile/Editor/BookFileEditorTableContent.js

@@ -2,9 +2,14 @@ import _ from 'lodash';
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import SelectInput from 'Components/Form/SelectInput';
+import Button from 'Components/Link/Button';
 import SpinnerButton from 'Components/Link/SpinnerButton';
 import LoadingIndicator from 'Components/Loading/LoadingIndicator';
 import ConfirmModal from 'Components/Modal/ConfirmModal';
+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 Table from 'Components/Table/Table';
 import TableBody from 'Components/Table/TableBody';
 import { kinds } from 'Helpers/Props';

frontend/src/Calendar/CalendarPage.js

@@ -6,6 +6,7 @@ import Measure from 'Components/Measure';
 import FilterMenu from 'Components/Menu/FilterMenu';
 import PageContent from 'Components/Page/PageContent';
 import PageContentBodyConnector from 'Components/Page/PageContentBodyConnector';
+import PageContentBody from 'Components/Page/PageContentBody';
 import PageToolbar from 'Components/Page/Toolbar/PageToolbar';
 import PageToolbarButton from 'Components/Page/Toolbar/PageToolbarButton';
 import PageToolbarSection from 'Components/Page/Toolbar/PageToolbarSection';

frontend/src/Components/Form/FormInputGroup.js

@@ -17,6 +17,7 @@ import NumberInput from './NumberInput';
 import OAuthInputConnector from './OAuthInputConnector';
 import PasswordInput from './PasswordInput';
 import PathInputConnector from './PathInputConnector';
+import PlaylistInputConnector from './PlaylistInputConnector';
 import QualityProfileSelectInputConnector from './QualityProfileSelectInputConnector';
 import RootFolderSelectInputConnector from './RootFolderSelectInputConnector';
 import SeriesTypeSelectInput from './SeriesTypeSelectInput';

frontend/src/Components/Menu/ToolbarMenuButton.js

@@ -1,7 +1,9 @@
+import classNames from 'classnames';
 import PropTypes from 'prop-types';
 import React from 'react';
 import Icon from 'Components/Icon';
 import MenuButton from 'Components/Menu/MenuButton';
+import { icons } from 'Helpers/Props';
 import styles from './ToolbarMenuButton.css';
 
 function ToolbarMenuButton(props) {

frontend/src/Components/Page/PageContentBody.js

@@ -3,6 +3,7 @@ import React, { Component } from 'react';
 import OverlayScroller from 'Components/Scroller/OverlayScroller';
 import Scroller from 'Components/Scroller/Scroller';
 import { scrollDirections } from 'Helpers/Props';
+import { isMobile as isMobileUtil } from 'Utilities/mobile';
 import { isLocked } from 'Utilities/scrollLock';
 import styles from './PageContentBody.css';
 

frontend/src/Components/Table/TableOptions/TableOptionsModal.js

@@ -2,7 +2,7 @@ import _ from 'lodash';
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import { DndProvider } from 'react-dnd';
-import { HTML5Backend } from 'react-dnd-html5-backend';
+import HTML5Backend from 'react-dnd-html5-backend';
 import Form from 'Components/Form/Form';
 import FormGroup from 'Components/Form/FormGroup';
 import FormInputGroup from 'Components/Form/FormInputGroup';

frontend/src/InteractiveImport/Interactive/InteractiveImportModalContent.js

@@ -18,8 +18,8 @@ import TableBody from 'Components/Table/TableBody';
 import { align, icons, kinds, scrollDirections } from 'Helpers/Props';
 import SelectAuthorModal from 'InteractiveImport/Author/SelectAuthorModal';
 import SelectBookModal from 'InteractiveImport/Book/SelectBookModal';
-import ConfirmImportModal from 'InteractiveImport/Confirmation/ConfirmImportModal';
 import SelectEditionModal from 'InteractiveImport/Edition/SelectEditionModal';
+import ConfirmImportModal from 'InteractiveImport/Confirmation/ConfirmImportModal';
 import SelectQualityModal from 'InteractiveImport/Quality/SelectQualityModal';
 import getErrorMessage from 'Utilities/Object/getErrorMessage';
 import getSelectedIds from 'Utilities/Table/getSelectedIds';

frontend/src/InteractiveImport/Interactive/InteractiveImportRow.js

@@ -2,17 +2,19 @@ import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import BookQuality from 'Book/BookQuality';
 import Icon from 'Components/Icon';
+import LoadingIndicator from 'Components/Loading/LoadingIndicator';
 import TableRowCell from 'Components/Table/Cells/TableRowCell';
 import TableRowCellButton from 'Components/Table/Cells/TableRowCellButton';
 import TableSelectCell from 'Components/Table/Cells/TableSelectCell';
 import TableRow from 'Components/Table/TableRow';
 import Popover from 'Components/Tooltip/Popover';
 import Tooltip from 'Components/Tooltip/Tooltip';
-import { icons, kinds, tooltipPositions } from 'Helpers/Props';
+import { icons, kinds, sortDirections, tooltipPositions } from 'Helpers/Props';
 import SelectAuthorModal from 'InteractiveImport/Author/SelectAuthorModal';
 import SelectBookModal from 'InteractiveImport/Book/SelectBookModal';
 import SelectQualityModal from 'InteractiveImport/Quality/SelectQualityModal';
 import formatBytes from 'Utilities/Number/formatBytes';
+import hasDifferentItems from 'Utilities/Object/hasDifferentItems';
 import InteractiveImportRowCellPlaceholder from './InteractiveImportRowCellPlaceholder';
 import styles from './InteractiveImportRow.css';
 

frontend/src/InteractiveSearch/InteractiveSearch.js

@@ -2,9 +2,12 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import Icon from 'Components/Icon';
 import LoadingIndicator from 'Components/Loading/LoadingIndicator';
+import FilterMenu from 'Components/Menu/FilterMenu';
+import PageMenuButton from 'Components/Menu/PageMenuButton';
 import Table from 'Components/Table/Table';
 import TableBody from 'Components/Table/TableBody';
-import { icons, sortDirections } from 'Helpers/Props';
+import { align, icons, sortDirections } from 'Helpers/Props';
+import InteractiveSearchFilterModalConnector from './InteractiveSearchFilterModalConnector';
 import InteractiveSearchRow from './InteractiveSearchRow';
 import styles from './InteractiveSearch.css';
 

frontend/src/Search/Author/AddNewAuthorSearchResult.js

@@ -9,7 +9,6 @@ import Link from 'Components/Link/Link';
 import { icons, kinds, sizes } from 'Helpers/Props';
 import dimensions from 'Styles/Variables/dimensions';
 import fonts from 'Styles/Variables/fonts';
-import stripHtml from 'Utilities/String/stripHtml';
 import AddNewAuthorModal from './AddNewAuthorModal';
 import styles from './AddNewAuthorSearchResult.css';
 

frontend/src/Search/Book/AddNewBookModalContent.js

@@ -9,7 +9,6 @@ import ModalContent from 'Components/Modal/ModalContent';
 import ModalFooter from 'Components/Modal/ModalFooter';
 import ModalHeader from 'Components/Modal/ModalHeader';
 import { kinds } from 'Helpers/Props';
-import stripHtml from 'Utilities/String/stripHtml';
 import AddAuthorOptionsForm from '../Common/AddAuthorOptionsForm.js';
 import styles from './AddNewBookModalContent.css';
 

frontend/src/Search/Book/AddNewBookSearchResult.js

@@ -10,7 +10,6 @@ import Link from 'Components/Link/Link';
 import { icons, sizes } from 'Helpers/Props';
 import dimensions from 'Styles/Variables/dimensions';
 import fonts from 'Styles/Variables/fonts';
-import stripHtml from 'Utilities/String/stripHtml';
 import AddNewBookModal from './AddNewBookModal';
 import styles from './AddNewBookSearchResult.css';
 

frontend/src/Settings/General/GeneralSettings.js

@@ -6,6 +6,7 @@ import LoadingIndicator from 'Components/Loading/LoadingIndicator';
 import ConfirmModal from 'Components/Modal/ConfirmModal';
 import PageContent from 'Components/Page/PageContent';
 import PageContentBodyConnector from 'Components/Page/PageContentBodyConnector';
+import PageContentBody from 'Components/Page/PageContentBody';
 import { kinds } from 'Helpers/Props';
 import SettingsToolbarConnector from 'Settings/SettingsToolbarConnector';
 import AnalyticSettings from './AnalyticSettings';

frontend/src/Settings/MediaManagement/MediaManagement.js

@@ -10,6 +10,7 @@ import PageContent from 'Components/Page/PageContent';
 import PageContentBodyConnector from 'Components/Page/PageContentBodyConnector';
 import { inputTypes, sizes } from 'Helpers/Props';
 import RemotePathMappingsConnector from 'Settings/DownloadClients/RemotePathMappings/RemotePathMappingsConnector';
+import PageContentBody from 'Components/Page/PageContentBody';
 import SettingsToolbarConnector from 'Settings/SettingsToolbarConnector';
 import NamingConnector from './Naming/NamingConnector';
 import RootFoldersConnector from './RootFolder/RootFoldersConnector';

frontend/src/Settings/Profiles/Metadata/EditMetadataProfileModalContent.js

@@ -12,6 +12,9 @@ import ModalContent from 'Components/Modal/ModalContent';
 import ModalFooter from 'Components/Modal/ModalFooter';
 import ModalHeader from 'Components/Modal/ModalHeader';
 import { inputTypes, kinds } from 'Helpers/Props';
+import PrimaryTypeItems from './PrimaryTypeItems';
+import ReleaseStatusItems from './ReleaseStatusItems';
+import SecondaryTypeItems from './SecondaryTypeItems';
 import styles from './EditMetadataProfileModalContent.css';
 
 function EditMetadataProfileModalContent(props) {

frontend/src/Settings/Profiles/Metadata/PrimaryTypeItem.js

@@ -0,0 +1,60 @@
+import classNames from 'classnames';
+import PropTypes from 'prop-types';
+import React, { Component } from 'react';
+import CheckInput from 'Components/Form/CheckInput';
+import styles from './TypeItem.css';
+
+class PrimaryTypeItem extends Component {
+
+  //
+  // Listeners
+
+  onAllowedChange = ({ value }) => {
+    const {
+      albumTypeId,
+      onMetadataPrimaryTypeItemAllowedChange
+    } = this.props;
+
+    onMetadataPrimaryTypeItemAllowedChange(albumTypeId, value);
+  }
+
+  //
+  // Render
+
+  render() {
+    const {
+      name,
+      allowed
+    } = this.props;
+
+    return (
+      <div
+        className={classNames(
+          styles.metadataProfileItem
+        )}
+      >
+        <label
+          className={styles.albumTypeName}
+        >
+          <CheckInput
+            containerClassName={styles.checkContainer}
+            name={name}
+            value={allowed}
+            onChange={this.onAllowedChange}
+          />
+          {name}
+        </label>
+      </div>
+    );
+  }
+}
+
+PrimaryTypeItem.propTypes = {
+  albumTypeId: PropTypes.number.isRequired,
+  name: PropTypes.string.isRequired,
+  allowed: PropTypes.bool.isRequired,
+  sortIndex: PropTypes.number.isRequired,
+  onMetadataPrimaryTypeItemAllowedChange: PropTypes.func
+};
+
+export default PrimaryTypeItem;

frontend/src/Settings/Profiles/Metadata/PrimaryTypeItems.js

@@ -0,0 +1,87 @@
+import PropTypes from 'prop-types';
+import React, { Component } from 'react';
+import FormGroup from 'Components/Form/FormGroup';
+import FormInputHelpText from 'Components/Form/FormInputHelpText';
+import FormLabel from 'Components/Form/FormLabel';
+import PrimaryTypeItem from './PrimaryTypeItem';
+import styles from './TypeItems.css';
+
+class PrimaryTypeItems extends Component {
+
+  //
+  // Render
+
+  render() {
+    const {
+      metadataProfileItems,
+      errors,
+      warnings,
+      ...otherProps
+    } = this.props;
+
+    return (
+      <FormGroup>
+        <FormLabel>Primary Types</FormLabel>
+        <div>
+
+          {
+            errors.map((error, index) => {
+              return (
+                <FormInputHelpText
+                  key={index}
+                  text={error.message}
+                  isError={true}
+                  isCheckInput={false}
+                />
+              );
+            })
+          }
+
+          {
+            warnings.map((warning, index) => {
+              return (
+                <FormInputHelpText
+                  key={index}
+                  text={warning.message}
+                  isWarning={true}
+                  isCheckInput={false}
+                />
+              );
+            })
+          }
+
+          <div className={styles.albumTypes}>
+            {
+              metadataProfileItems.map(({ allowed, albumType }, index) => {
+                return (
+                  <PrimaryTypeItem
+                    key={albumType.id}
+                    albumTypeId={albumType.id}
+                    name={albumType.name}
+                    allowed={allowed}
+                    sortIndex={index}
+                    {...otherProps}
+                  />
+                );
+              }).reverse()
+            }
+          </div>
+        </div>
+      </FormGroup>
+    );
+  }
+}
+
+PrimaryTypeItems.propTypes = {
+  metadataProfileItems: PropTypes.arrayOf(PropTypes.object).isRequired,
+  errors: PropTypes.arrayOf(PropTypes.object),
+  warnings: PropTypes.arrayOf(PropTypes.object),
+  formLabel: PropTypes.string
+};
+
+PrimaryTypeItems.defaultProps = {
+  errors: [],
+  warnings: []
+};
+
+export default PrimaryTypeItems;

frontend/src/Settings/Profiles/Metadata/ReleaseStatusItem.js

@@ -0,0 +1,60 @@
+import classNames from 'classnames';
+import PropTypes from 'prop-types';
+import React, { Component } from 'react';
+import CheckInput from 'Components/Form/CheckInput';
+import styles from './TypeItem.css';
+
+class ReleaseStatusItem extends Component {
+
+  //
+  // Listeners
+
+  onAllowedChange = ({ value }) => {
+    const {
+      albumTypeId,
+      onMetadataReleaseStatusItemAllowedChange
+    } = this.props;
+
+    onMetadataReleaseStatusItemAllowedChange(albumTypeId, value);
+  }
+
+  //
+  // Render
+
+  render() {
+    const {
+      name,
+      allowed
+    } = this.props;
+
+    return (
+      <div
+        className={classNames(
+          styles.metadataProfileItem
+        )}
+      >
+        <label
+          className={styles.albumTypeName}
+        >
+          <CheckInput
+            containerClassName={styles.checkContainer}
+            name={name}
+            value={allowed}
+            onChange={this.onAllowedChange}
+          />
+          {name}
+        </label>
+      </div>
+    );
+  }
+}
+
+ReleaseStatusItem.propTypes = {
+  albumTypeId: PropTypes.number.isRequired,
+  name: PropTypes.string.isRequired,
+  allowed: PropTypes.bool.isRequired,
+  sortIndex: PropTypes.number.isRequired,
+  onMetadataReleaseStatusItemAllowedChange: PropTypes.func
+};
+
+export default ReleaseStatusItem;

frontend/src/Settings/Profiles/Metadata/ReleaseStatusItems.js

@@ -0,0 +1,87 @@
+import PropTypes from 'prop-types';
+import React, { Component } from 'react';
+import FormGroup from 'Components/Form/FormGroup';
+import FormInputHelpText from 'Components/Form/FormInputHelpText';
+import FormLabel from 'Components/Form/FormLabel';
+import ReleaseStatusItem from './ReleaseStatusItem';
+import styles from './TypeItems.css';
+
+class ReleaseStatusItems extends Component {
+
+  //
+  // Render
+
+  render() {
+    const {
+      metadataProfileItems,
+      errors,
+      warnings,
+      ...otherProps
+    } = this.props;
+
+    return (
+      <FormGroup>
+        <FormLabel>Release Statuses</FormLabel>
+        <div>
+
+          {
+            errors.map((error, index) => {
+              return (
+                <FormInputHelpText
+                  key={index}
+                  text={error.message}
+                  isError={true}
+                  isCheckInput={false}
+                />
+              );
+            })
+          }
+
+          {
+            warnings.map((warning, index) => {
+              return (
+                <FormInputHelpText
+                  key={index}
+                  text={warning.message}
+                  isWarning={true}
+                  isCheckInput={false}
+                />
+              );
+            })
+          }
+
+          <div className={styles.albumTypes}>
+            {
+              metadataProfileItems.map(({ allowed, releaseStatus }, index) => {
+                return (
+                  <ReleaseStatusItem
+                    key={releaseStatus.id}
+                    albumTypeId={releaseStatus.id}
+                    name={releaseStatus.name}
+                    allowed={allowed}
+                    sortIndex={index}
+                    {...otherProps}
+                  />
+                );
+              })
+            }
+          </div>
+        </div>
+      </FormGroup>
+    );
+  }
+}
+
+ReleaseStatusItems.propTypes = {
+  metadataProfileItems: PropTypes.arrayOf(PropTypes.object).isRequired,
+  errors: PropTypes.arrayOf(PropTypes.object),
+  warnings: PropTypes.arrayOf(PropTypes.object),
+  formLabel: PropTypes.string
+};
+
+ReleaseStatusItems.defaultProps = {
+  errors: [],
+  warnings: []
+};
+
+export default ReleaseStatusItems;

frontend/src/Settings/Profiles/Metadata/SecondaryTypeItem.js

@@ -0,0 +1,60 @@
+import classNames from 'classnames';
+import PropTypes from 'prop-types';
+import React, { Component } from 'react';
+import CheckInput from 'Components/Form/CheckInput';
+import styles from './TypeItem.css';
+
+class SecondaryTypeItem extends Component {
+
+  //
+  // Listeners
+
+  onAllowedChange = ({ value }) => {
+    const {
+      albumTypeId,
+      onMetadataSecondaryTypeItemAllowedChange
+    } = this.props;
+
+    onMetadataSecondaryTypeItemAllowedChange(albumTypeId, value);
+  }
+
+  //
+  // Render
+
+  render() {
+    const {
+      name,
+      allowed
+    } = this.props;
+
+    return (
+      <div
+        className={classNames(
+          styles.metadataProfileItem
+        )}
+      >
+        <label
+          className={styles.albumTypeName}
+        >
+          <CheckInput
+            containerClassName={styles.checkContainer}
+            name={name}
+            value={allowed}
+            onChange={this.onAllowedChange}
+          />
+          {name}
+        </label>
+      </div>
+    );
+  }
+}
+
+SecondaryTypeItem.propTypes = {
+  albumTypeId: PropTypes.number.isRequired,
+  name: PropTypes.string.isRequired,
+  allowed: PropTypes.bool.isRequired,
+  sortIndex: PropTypes.number.isRequired,
+  onMetadataSecondaryTypeItemAllowedChange: PropTypes.func
+};
+
+export default SecondaryTypeItem;

frontend/src/Settings/Profiles/Metadata/SecondaryTypeItems.js

@@ -0,0 +1,87 @@
+import PropTypes from 'prop-types';
+import React, { Component } from 'react';
+import FormGroup from 'Components/Form/FormGroup';
+import FormInputHelpText from 'Components/Form/FormInputHelpText';
+import FormLabel from 'Components/Form/FormLabel';
+import SecondaryTypeItem from './SecondaryTypeItem';
+import styles from './TypeItems.css';
+
+class SecondaryTypeItems extends Component {
+
+  //
+  // Render
+
+  render() {
+    const {
+      metadataProfileItems,
+      errors,
+      warnings,
+      ...otherProps
+    } = this.props;
+
+    return (
+      <FormGroup>
+        <FormLabel>Secondary Types</FormLabel>
+        <div>
+
+          {
+            errors.map((error, index) => {
+              return (
+                <FormInputHelpText
+                  key={index}
+                  text={error.message}
+                  isError={true}
+                  isCheckInput={false}
+                />
+              );
+            })
+          }
+
+          {
+            warnings.map((warning, index) => {
+              return (
+                <FormInputHelpText
+                  key={index}
+                  text={warning.message}
+                  isWarning={true}
+                  isCheckInput={false}
+                />
+              );
+            })
+          }
+
+          <div className={styles.albumTypes}>
+            {
+              metadataProfileItems.map(({ allowed, albumType }, index) => {
+                return (
+                  <SecondaryTypeItem
+                    key={albumType.id}
+                    albumTypeId={albumType.id}
+                    name={albumType.name}
+                    allowed={allowed}
+                    sortIndex={index}
+                    {...otherProps}
+                  />
+                );
+              })
+            }
+          </div>
+        </div>
+      </FormGroup>
+    );
+  }
+}
+
+SecondaryTypeItems.propTypes = {
+  metadataProfileItems: PropTypes.arrayOf(PropTypes.object).isRequired,
+  errors: PropTypes.arrayOf(PropTypes.object),
+  warnings: PropTypes.arrayOf(PropTypes.object),
+  formLabel: PropTypes.string
+};
+
+SecondaryTypeItems.defaultProps = {
+  errors: [],
+  warnings: []
+};
+
+export default SecondaryTypeItems;

frontend/src/Settings/UI/UISettings.js

@@ -7,9 +7,11 @@ import FormInputGroup from 'Components/Form/FormInputGroup';
 import FormLabel from 'Components/Form/FormLabel';
 import LoadingIndicator from 'Components/Loading/LoadingIndicator';
 import PageContent from 'Components/Page/PageContent';
+import PageContentBody from 'Components/Page/PageContentBody';
 import PageContentBodyConnector from 'Components/Page/PageContentBodyConnector';
 import { inputTypes } from 'Helpers/Props';
 import SettingsToolbarConnector from 'Settings/SettingsToolbarConnector';
+import styles from './UISettings.css';
 
 export const firstDayOfWeekOptions = [
   { key: 0, value: 'Sunday' },

frontend/src/Store/Actions/index.js

@@ -1,3 +1,6 @@
+import * as albums from './albumActions';
+import * as albumHistory from './albumHistoryActions';
+import * as albumStudio from './albumStudioActions';
 import * as app from './appActions';
 import * as author from './authorActions';
 import * as authorEditor from './authorEditorActions';

frontend/src/Store/Actions/seriesActions.js

@@ -4,6 +4,7 @@ import { createThunk, handleThunks } from 'Store/thunks';
 import createFetchHandler from './Creators/createFetchHandler';
 import createHandleActions from './Creators/createHandleActions';
 import createSetClientSideCollectionSortReducer from './Creators/Reducers/createSetClientSideCollectionSortReducer';
+import createSetTableOptionReducer from './Creators/Reducers/createSetTableOptionReducer';
 
 //
 // Variables

frontend/src/System/Events/LogsTable.js

@@ -4,6 +4,7 @@ import LoadingIndicator from 'Components/Loading/LoadingIndicator';
 import FilterMenu from 'Components/Menu/FilterMenu';
 import PageContent from 'Components/Page/PageContent';
 import PageContentBodyConnector from 'Components/Page/PageContentBodyConnector';
+import PageContentBody from 'Components/Page/PageContentBody';
 import PageToolbar from 'Components/Page/Toolbar/PageToolbar';
 import PageToolbarButton from 'Components/Page/Toolbar/PageToolbarButton';
 import PageToolbarSection from 'Components/Page/Toolbar/PageToolbarSection';

frontend/src/System/Status/Health/HealthConnector.js

@@ -4,6 +4,7 @@ import { connect } from 'react-redux';
 import { createSelector } from 'reselect';
 import { testAllDownloadClients, testAllIndexers } from 'Store/Actions/settingsActions';
 import { fetchHealth } from 'Store/Actions/systemActions';
+import createHealthCheckSelector from 'Store/Selectors/createHealthCheckSelector';
 import Health from './Health';
 
 function createMapStateToProps() {

frontend/src/System/Status/Health/HealthStatusConnector.js

@@ -4,6 +4,7 @@ import { connect } from 'react-redux';
 import { createSelector } from 'reselect';
 import PageSidebarStatus from 'Components/Page/Sidebar/PageSidebarStatus';
 import { fetchHealth } from 'Store/Actions/systemActions';
+import createHealthCheckSelector from 'Store/Selectors/createHealthCheckSelector';
 
 function createMapStateToProps() {
   return createSelector(

frontend/src/System/Status/Status.js

@@ -1,6 +1,7 @@
 import React, { Component } from 'react';
 import PageContent from 'Components/Page/PageContent';
 import PageContentBodyConnector from 'Components/Page/PageContentBodyConnector';
+import PageContentBody from 'Components/Page/PageContentBody';
 import AboutConnector from './About/AboutConnector';
 import DiskSpaceConnector from './DiskSpace/DiskSpaceConnector';
 import HealthConnector from './Health/HealthConnector';

frontend/src/System/Tasks/Tasks.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import PageContent from 'Components/Page/PageContent';
 import PageContentBodyConnector from 'Components/Page/PageContentBodyConnector';
+import PageContentBody from 'Components/Page/PageContentBody';
 import QueuedTasksConnector from './Queued/QueuedTasksConnector';
 import ScheduledTasksConnector from './Scheduled/ScheduledTasksConnector';
 

frontend/src/System/Updates/Updates.js

@@ -8,6 +8,7 @@ import LoadingIndicator from 'Components/Loading/LoadingIndicator';
 import InlineMarkdown from 'Components/Markdown/InlineMarkdown';
 import PageContent from 'Components/Page/PageContent';
 import PageContentBodyConnector from 'Components/Page/PageContentBodyConnector';
+import PageContentBody from 'Components/Page/PageContentBody';
 import { icons, kinds } from 'Helpers/Props';
 import formatDate from 'Utilities/Date/formatDate';
 import UpdateChanges from './UpdateChanges';

frontend/src/Wanted/CutoffUnmet/CutoffUnmet.js

@@ -5,6 +5,7 @@ import FilterMenu from 'Components/Menu/FilterMenu';
 import ConfirmModal from 'Components/Modal/ConfirmModal';
 import PageContent from 'Components/Page/PageContent';
 import PageContentBodyConnector from 'Components/Page/PageContentBodyConnector';
+import PageContentBody from 'Components/Page/PageContentBody';
 import PageToolbar from 'Components/Page/Toolbar/PageToolbar';
 import PageToolbarButton from 'Components/Page/Toolbar/PageToolbarButton';
 import PageToolbarSection from 'Components/Page/Toolbar/PageToolbarSection';