New: Readarr 0.1

frontend/src/Components/Form/PlaylistInput.js

@@ -104,28 +104,28 @@ class PlaylistInput extends Component {
         {
           !isPopulated && !isFetching &&
             <div>
-              Authenticate with spotify to retrieve playlists to import.
+              Authenticate with Goodreads to retrieve bookshelves to import.
             </div>
         }
 
         {
           isPopulated && !isFetching && !user &&
             <div>
-              Could not retrieve data from Spotify.  Try re-authenticating.
+              Could not retrieve data from Goodreads.  Try re-authenticating.
             </div>
         }
 
         {
           isPopulated && !isFetching && user && !items.length &&
             <div>
-              No playlists found for Spotify user {user}.
+              No bookshelves found for Goodreads user {user}.
             </div>
         }
 
         {
           isPopulated && !isFetching && user && !!items.length &&
             <div className={className}>
-              Select playlists to import from Spotify user {user}.
+              Select playlists to import from Goodreads user {user}.
               <Table
                 columns={columns}
                 selectAll={true}

frontend/src/Components/HeartRating.js

@@ -13,7 +13,7 @@ function HeartRating({ rating, iconSize }) {
         size={iconSize}
       />
 
-      {rating * 10}%
+      {rating.toFixed(1)}
     </span>
   );
 }

frontend/src/Components/Page/Header/ArtistSearchInput.js

@@ -88,7 +88,7 @@ class ArtistSearchInput extends Component {
 
   goToArtist(item) {
     this.setState({ value: '' });
-    this.props.onGoToArtist(item.item.foreignArtistId);
+    this.props.onGoToArtist(item.item.titleSlug);
   }
 
   reset() {

frontend/src/Components/Page/Header/ArtistSearchInputConnector.js

@@ -16,14 +16,14 @@ function createCleanArtistSelector() {
           artistName,
           sortName,
           images,
-          foreignArtistId,
+          titleSlug,
           tags = []
         } = artist;
 
         return {
           artistName,
           sortName,
-          foreignArtistId,
+          titleSlug,
           images,
           tags: tags.reduce((acc, id) => {
             const matchingTag = allTags.find((tag) => tag.id === id);
@@ -53,8 +53,8 @@ function createMapStateToProps() {
 
 function createMapDispatchToProps(dispatch, props) {
   return {
-    onGoToArtist(foreignArtistId) {
-      dispatch(push(`${window.Readarr.urlBase}/artist/${foreignArtistId}`));
+    onGoToArtist(titleSlug) {
+      dispatch(push(`${window.Readarr.urlBase}/author/${titleSlug}`));
     },
 
     onGoToAddNewArtist(query) {

frontend/src/Components/Page/Header/PageHeader.css

@@ -4,7 +4,7 @@
   align-items: center;
   flex: 0 0 auto;
   height: $headerHeight;
-  background-color: $themeAlternateBlue;
+  background-color: $themeAlternateRed;
   color: $white;
 }
 
@@ -41,12 +41,12 @@
   composes: link from '~Components/Link/Link.css';
 
   width: 30px;
-  color: $themeRed;
+  color: $themeDarkRed;
   text-align: center;
   line-height: 60px;
 
   &:hover {
-    color: #9c1f30;
+    color: $themeDarkColor;
   }
 }
 

frontend/src/Components/Page/Sidebar/PageSidebar.js

@@ -33,7 +33,7 @@ const links = [
         to: '/artisteditor'
       },
       {
-        title: 'Album Studio',
+        title: 'Bookshelf',
         to: '/albumstudio'
       },
       {

frontend/src/Components/Page/Sidebar/PageSidebarItem.css

@@ -5,7 +5,7 @@
 }
 
 .isActiveItem {
-  border-left: 3px solid $themeBlue;
+  border-left: 3px solid $themeAlternateRed;
 }
 
 .link {
@@ -15,7 +15,7 @@
 
   &:hover,
   &:focus {
-    color: $themeBlue;
+    color: $themeRed;
     text-decoration: none;
   }
 }
@@ -27,7 +27,7 @@
 }
 
 .isActiveLink {
-  color: $themeBlue;
+  color: $themeRed;
 }
 
 .isActiveParentLink {

frontend/src/Components/StarRating.js

@@ -6,10 +6,10 @@ import styles from './StarRating.css';
 
 function StarRating({ rating, votes, iconSize }) {
   const starWidth = {
-    width: `${rating * 10}%`
+    width: `${rating * 20}%`
   };
 
-  const helpText = `${rating/2} (${votes} Votes)`;
+  const helpText = `${rating.toFixed(1)} (${votes} Votes)`;
 
   return (
     <span className={styles.starRating} title={helpText}>

frontend/src/Components/Table/VirtualTable.js

@@ -190,6 +190,7 @@ VirtualTable.propTypes = {
 VirtualTable.defaultProps = {
   className: styles.tableContainer,
   headerHeight: 38,
+  rowHeight: 38,
   onRecompute: () => {}
 };