diff --git a/js/components/MediaLibraryWindow/TracksTable.tsx b/js/components/MediaLibraryWindow/TracksTable.tsx index efffb019..c7e3003a 100644 --- a/js/components/MediaLibraryWindow/TracksTable.tsx +++ b/js/components/MediaLibraryWindow/TracksTable.tsx @@ -1,8 +1,16 @@ import * as React from "react"; +import { connect } from "react-redux"; +import { cursorSelectors } from "../../skinSelectors"; +import * as Selectors from "../../selectors"; +import * as Utils from "../../utils"; +import * as FileUtils from "../../fileUtils"; +import { AppState, PlaylistTrack } from "../../types"; -interface Props {} +interface StateProps { + tracks: PlaylistTrack[]; +} -export default class TracksTable extends React.Component { +class TracksTable extends React.Component { render() { return (
{ - - Ben Mason - Easy - Bad Pands - 3:25 - 1 - Primus - 2001 - BenMason-Easy.mp3 - + {this.props.tracks.map(track => { + return ( + + {track.artist} + {track.title} + {track.album} + {Utils.getTimeStr(track.duration)} + 1 + Primus + 2001 + + {track.url == null + ? track.defaultName + : FileUtils.filenameFromUrl(track.url)} + + + ); + })}
@@ -67,3 +83,11 @@ export default class TracksTable extends React.Component { ); } } + +const mapStateToProps = (state: AppState): StateProps => { + return { + tracks: Object.values(Selectors.getTracks(state)) + }; +}; + +export default connect(mapStateToProps)(TracksTable);