Clickable owners in list; Sortable owners in playlist library

src/js/components/List.js

@@ -35,8 +35,8 @@ export default class List extends React.Component{
 		)
 	}
 
-	renderValue( row, key ){
-		var key = key.split('.')
+	renderValue( row, key_string ){
+		var key = key_string.split('.')
 		var value = row
 
 		for( var i = 0; i < key.length; i++ ){
@@ -47,6 +47,7 @@ export default class List extends React.Component{
 			}
 		}
 
+		if( key_string === 'owner' ) return <Link to={ '/user/'+ value.uri }>{value.id}</Link>
 		if( key[0] === 'artists' ) return <ArtistSentence artists={value} />
 		if( value === true ) return <FontAwesome name="check" />
 		if( typeof(value) === 'number' ) return <span>{value.toLocaleString()}</span>

src/js/components/ListItem.js

@@ -1,28 +0,0 @@
-
-import React, { PropTypes } from 'react'
-import FontAwesome from 'react-fontawesome'
-import { browserHistory } from 'react-router'
-
-export default class ListItem extends React.Component{
-
-	constructor(props) {
-		super(props);
-	}
-
-	handleClick(e){
-		if( e.target.tagName.toLowerCase() !== 'a' ){
-			browserHistory.push( this.props.link );
-		}
-	}
-
-	render(){
-		var className = 'list-item';
-		if( this.props.extraClasses ) className += ' '+this.props.extraClasses;
-
-		return (
-			<li className={className} onClick={ (e) => this.handleClick(e) }>
-				{ this.props.children }
-			</li>
-		);
-	}
-}

src/js/helpers.js

@@ -260,9 +260,10 @@ export let sortItems = function (array, property, reverse = false){
 
 		var a_value = a
 		var a_property_split = property.split('.')
-		for( var i = 0; i < a_property_split.length; i++ ){
-			if( typeof(a_value[a_property_split[i]]) === 'undefined' ){
+		for (var i = 0; i < a_property_split.length; i++) {
+			if (typeof(a_value[a_property_split[i]]) === 'undefined') {
 				a_value = false
+				break
 			}else{
 				a_value = a_value[a_property_split[i]]
 			}
@@ -271,25 +272,28 @@ export let sortItems = function (array, property, reverse = false){
 		var b_value = b
 		var b_property_split = property.split('.')
 		for( var i = 0; i < b_property_split.length; i++ ){
-			if( typeof(b_value[b_property_split[i]]) === 'undefined' ){
+			if (typeof(b_value[b_property_split[i]]) === 'undefined') {
 				b_value = false
-			}else{
+				break
+			} else {
 				b_value = b_value[b_property_split[i]]
 			}
 		}
 
 		if( typeof(a_value) === 'boolean'){
-			if( a_value && !b_value ) return -1
-			if( !a_value && b_value ) return 1
+			if (a_value && !b_value) return -1
+			if (!a_value && b_value) return 1
 			return 0
 
 		}else if( typeof(a_value) === 'string'){
-			if(a_value.toLowerCase() > b_value.toLowerCase()) return 1
-			return -1
+			if ( !a_value || !b_value ) return 0
+			if (a_value.toLowerCase() > b_value.toLowerCase()) return 1
+			if (a_value.toLowerCase() < b_value.toLowerCase()) return -1
+			return 0
 
 		}else{
-			if( parseInt(a_value) > parseInt(b_value) ) return 1
-			if( parseInt(a_value) < parseInt(b_value) ) return -1
+			if (parseInt(a_value) > parseInt(b_value)) return 1
+			if (parseInt(a_value) < parseInt(b_value)) return -1
 			return 0
 		}
 	}

src/js/views/library/LibraryPlaylists.js

@@ -50,7 +50,7 @@ class LibraryPlaylists extends React.Component{
 				{
 					width: 30,
 					label: 'Owner',
-					name: 'owner.id'
+					name: 'owner'
 				},
 				{
 					width: 10,
@@ -99,6 +99,10 @@ class LibraryPlaylists extends React.Component{
 				value: 'can_edit',
 				label: 'Editable'
 			},
+			{
+				value: 'owner.id',
+				label: 'Owner'
+			},
 			{
 				value: 'tracks.total',
 				label: 'Tracks'