Precursor to scroll position history; Restoring Genius API; Settings services

src/js/App.js

@@ -81,19 +81,22 @@ class App extends React.Component{
 		}*/
 	}
 
-	componentDidUpdate(prevProps){
+	componentWillReceiveProps(nextProps){
 
 		// We've navigated to a new location
-	    if (this.props.location !== prevProps.location){
+	    if (this.props.location.pathname !== nextProps.location.pathname){
 
 			// Close context menu
-			this.props.uiActions.hideContextMenu();
+			if (this.props.context_menu){
+				this.props.uiActions.hideContextMenu();
+			}
 
 			// Restore scroll to top
 			// TODO: Detect if we've gone BACK, and then restore to previous
 			// scroll position. We'll need to keep a running history of locations
 			// and scroll positions, which may be performance-hindering
-			//$(window).scrollTop(0)
+			// At this point we can capture "window.scrollY" for the previous scroll position
+			//window.scrollTo(0, 0);
 		}
 	}
 

src/js/components/GridItem.js

@@ -26,7 +26,7 @@ export default class GridItem extends React.Component{
 
 	handleClick(e){
 		if (this.props.onClick && e.target.tagName.toLowerCase() !== 'a'){
-			this.props.onClick(e)
+			this.props.onClick(e);
 		}
 	}
 

src/js/components/Link.js

@@ -0,0 +1,27 @@
+
+import React from 'react'
+import { Link } from 'react-router'
+
+export default class Link extends React.Component{
+
+	constructor(props){
+		super(props);
+	}
+
+	handleClick(e){
+		if (!this.props.retainScroll){
+			window.scrollTo(0, 0);
+		}
+	}
+
+render(){
+		return (
+			<Link 
+				onClick={e => this.handleClick(e)}
+				className={this.props.className ? this.props.className : null} 
+				to={to}>
+					{this.props.children}
+			</Link>
+		);
+	}
+}

src/js/components/Services.js

@@ -164,7 +164,7 @@ class Services extends React.Component{
 	}
 
 	renderLastfm(){
-		var user_object = this.props.core.users["lastfm:user:"+this.props.lastfm.session.name];
+		var user_object = (this.props.lastfm.session ? this.props.core.users["lastfm:user:"+this.props.lastfm.session.name] : null);
 		if (user_object){
 			var user = (
 				<span className="user">
@@ -265,22 +265,22 @@ class Services extends React.Component{
 	renderMenu(){
 
 		if (this.props.spotify.me){
-			var spotify_user = <Thumbnail circle={true} size="small" images={this.props.spotify.me.images} />
+			var spotify_icon = <Thumbnail circle={true} size="small" images={this.props.spotify.me.images} />
 		} else {
-			var spotify_user = <Thumbnail circle={true} size="small" />
+			var spotify_icon = <Thumbnail circle={true} size="small" />
 		}
 
-		if (this.props.core.users["lastfm:user:"+this.props.lastfm.session.name]){
-			var lastfm_user = <Thumbnail circle={true} size="small" images={this.props.core.users["lastfm:user:"+this.props.lastfm.session.name].image} />
+		if (this.props.lastfm.session && this.props.core.users["lastfm:user:"+this.props.lastfm.session.name]){
+			var lastfm_icon = <Thumbnail circle={true} size="small" images={this.props.core.users["lastfm:user:"+this.props.lastfm.session.name].image} />
 		} else {
-			var lastfm_user = <Thumbnail circle={true} size="small" />
+			var lastfm_icon = <FontAwesome name="lastfm" />
 		}
 
 		return (
 			<div className="menu">
 				<div className="menu-item-wrapper">
 					<Link className={"menu-item"+(this.props.active == 'spotify' ? ' active' : '')} to={this.props.active == 'spotify' ? global.baseURL+'settings' : global.baseURL+'settings/service/spotify'}>
-						{spotify_user}
+						{spotify_icon}
 						<div className="title">
 							Spotify
 						</div>
@@ -289,7 +289,7 @@ class Services extends React.Component{
 				</div>
 				<div className="menu-item-wrapper">
 					<Link className={"menu-item"+(this.props.active == 'lastfm' ? ' active' : '')} to={this.props.active == 'lastfm' ? global.baseURL+'settings' : global.baseURL+'settings/service/lastfm'}>
-						{lastfm_user}
+						{lastfm_icon}
 						<div className="title">
 							LastFM
 						</div>
@@ -298,7 +298,7 @@ class Services extends React.Component{
 				</div>
 				<div className="menu-item-wrapper">
 					<Link className={"menu-item"+(this.props.active == 'snapcast' ? ' active' : '')} to={this.props.active == 'snapcast' ? global.baseURL+'settings' : global.baseURL+'settings/service/snapcast'}>
-						<FontAwesome name="rss" />
+						<FontAwesome name="sliders" />
 						<div className="title">
 							Snapcast
 						</div>

src/js/services/genius/actions.js

@@ -37,7 +37,7 @@ const sendRequest = (dispatch, getState, endpoint) => {
         $.ajax(config).then(
             response => {
                 dispatch(uiActions.stopLoading(loader_key));
-                resolve(response.response);
+                resolve(response.result);
             },
             (xhr, status, error) => {
                 dispatch(uiActions.stopLoading(loader_key));

src/js/services/localstorage/middleware.js

@@ -78,14 +78,10 @@ const localstorageMiddleware = (function(){
                 );
                 break;
 
-            case 'SPOTIFY_SET_CONFIG':
+            case 'SPOTIFY_SET':
                 helpers.setStorage(
                     'spotify', 
-                    {
-                        authentication_provider: action.config.authentication_provider, 
-                        country: action.config.country, 
-                        locale: action.config.locale
-                    }
+                    action.data
                 );
                 break;