New: Release Profiles, Frontend updates (#580)

* New: Release Profiles - UI Updates

* New: Release Profiles - API Changes

* New: Release Profiles - Test Updates

* New: Release Profiles - Backend Updates

* New: Interactive Artist Search

* New: Change Montiored on Album Details Page

* New: Show Duration on Album Details Page

* Fixed: Manual Import not working if no albums are Missing

* Fixed: Sort search input by sortTitle

* Fixed: Queue columnLabel throwing JS error

frontend/src/Activity/History/Details/HistoryDetails.css

@@ -0,0 +1,5 @@
+.description {
+  composes: title from 'Components/DescriptionList/DescriptionListItemDescription.css';
+
+  overflow-wrap: break-word;
+}

frontend/src/Activity/History/Details/HistoryDetails.js

@@ -7,6 +7,7 @@ import DescriptionList from 'Components/DescriptionList/DescriptionList';
 import DescriptionListItem from 'Components/DescriptionList/DescriptionListItem';
 import DescriptionListItemTitle from 'Components/DescriptionList/DescriptionListItemTitle';
 import DescriptionListItemDescription from 'Components/DescriptionList/DescriptionListItemDescription';
+import styles from './HistoryDetails.css';
 
 function getDetailedList(statusMessages) {
   return (
@@ -60,6 +61,7 @@ function HistoryDetails(props) {
     return (
       <DescriptionList>
         <DescriptionListItem
+          descriptionClassName={styles.description}
           title="Name"
           data={sourceTitle}
         />
@@ -75,6 +77,7 @@ function HistoryDetails(props) {
         {
           !!releaseGroup &&
             <DescriptionListItem
+              descriptionClassName={styles.description}
               title="Release Group"
               data={releaseGroup}
             />
@@ -136,6 +139,7 @@ function HistoryDetails(props) {
     return (
       <DescriptionList>
         <DescriptionListItem
+          descriptionClassName={styles.description}
           title="Name"
           data={sourceTitle}
         />
@@ -160,6 +164,7 @@ function HistoryDetails(props) {
     return (
       <DescriptionList>
         <DescriptionListItem
+          descriptionClassName={styles.description}
           title="Name"
           data={sourceTitle}
         />
@@ -167,6 +172,7 @@ function HistoryDetails(props) {
         {
           !!droppedPath &&
             <DescriptionListItem
+              descriptionClassName={styles.description}
               title="Source"
               data={droppedPath}
             />
@@ -175,6 +181,7 @@ function HistoryDetails(props) {
         {
           !!importedPath &&
             <DescriptionListItem
+              descriptionClassName={styles.description}
               title="Imported To"
               data={importedPath}
             />

frontend/src/Activity/History/History.js

@@ -5,6 +5,7 @@ import hasDifferentItems from 'Utilities/Object/hasDifferentItems';
 import LoadingIndicator from 'Components/Loading/LoadingIndicator';
 import Table from 'Components/Table/Table';
 import TableBody from 'Components/Table/TableBody';
+import TableOptionsModalWrapper from 'Components/Table/TableOptions/TableOptionsModalWrapper';
 import TablePager from 'Components/Table/TablePager';
 import PageContent from 'Components/Page/PageContent';
 import PageContentBodyConnector from 'Components/Page/PageContentBodyConnector';
@@ -75,6 +76,16 @@ class History extends Component {
           </PageToolbarSection>
 
           <PageToolbarSection alignContent={align.RIGHT}>
+            <TableOptionsModalWrapper
+              {...otherProps}
+              columns={columns}
+            >
+              <PageToolbarButton
+                label="Options"
+                iconName={icons.TABLE}
+              />
+            </TableOptionsModalWrapper>
+
             <FilterMenu
               alignMenu={align.RIGHT}
               selectedFilterKey={selectedFilterKey}

frontend/src/Activity/History/HistoryConnector.js

@@ -5,6 +5,7 @@ import { createSelector } from 'reselect';
 import { registerPagePopulator, unregisterPagePopulator } from 'Utilities/pagePopulator';
 import hasDifferentItems from 'Utilities/Object/hasDifferentItems';
 import selectUniqueIds from 'Utilities/Object/selectUniqueIds';
+import withCurrentPage from 'Components/withCurrentPage';
 import * as historyActions from 'Store/Actions/historyActions';
 import { fetchAlbums, clearAlbums } from 'Store/Actions/albumActions';
 import { fetchTracks, clearTracks } from 'Store/Actions/trackActions';
@@ -43,8 +44,19 @@ class HistoryConnector extends Component {
   // Lifecycle
 
   componentDidMount() {
+    const {
+      useCurrentPage,
+      fetchHistory,
+      gotoHistoryFirstPage
+    } = this.props;
+
     registerPagePopulator(this.repopulate);
-    this.props.gotoHistoryFirstPage();
+
+    if (useCurrentPage) {
+      fetchHistory();
+    } else {
+      gotoHistoryFirstPage();
+    }
   }
 
   componentDidUpdate(prevProps) {
@@ -138,6 +150,7 @@ class HistoryConnector extends Component {
 }
 
 HistoryConnector.propTypes = {
+  useCurrentPage: PropTypes.bool.isRequired,
   items: PropTypes.arrayOf(PropTypes.object).isRequired,
   fetchHistory: PropTypes.func.isRequired,
   gotoHistoryFirstPage: PropTypes.func.isRequired,
@@ -155,4 +168,6 @@ HistoryConnector.propTypes = {
   clearTracks: PropTypes.func.isRequired
 };
 
-export default connect(createMapStateToProps, mapDispatchToProps)(HistoryConnector);
+export default withCurrentPage(
+  connect(createMapStateToProps, mapDispatchToProps)(HistoryConnector)
+);

frontend/src/Activity/History/HistoryRow.js

@@ -6,7 +6,7 @@ import RelativeDateCellConnector from 'Components/Table/Cells/RelativeDateCellCo
 import TableRow from 'Components/Table/TableRow';
 import TableRowCell from 'Components/Table/Cells/TableRowCell';
 import AlbumTitleLink from 'Album/AlbumTitleLink';
-import EpisodeLanguage from 'Album/EpisodeLanguage';
+import TrackLanguage from 'Album/TrackLanguage';
 import TrackQuality from 'Album/TrackQuality';
 import ArtistNameLink from 'Artist/ArtistNameLink';
 import HistoryEventTypeCell from './HistoryEventTypeCell';
@@ -131,7 +131,7 @@ class HistoryRow extends Component {
             if (name === 'language') {
               return (
                 <TableRowCell key={name}>
-                  <EpisodeLanguage
+                  <TrackLanguage
                     language={language}
                     isCutoffMet={languageCutoffNotMet}
                   />