import * as React from 'react' ; import { LibraryActions } from '../../actions.d' ; import { Album , albumURI } from 'compactd-models' ; import { Link } from 'react-router-dom' ; import * as PropTypes from 'prop-types' ; import { MatchResult } from 'fuzzy' ; import * as classnames from 'classnames' ; import BetterImage from 'components/BetterImage' ; import AlbumComponent from 'components/AlbumComponent' ; import * as pluralize from 'pluralize' ; require ( './AlbumListItem.scss' ) ; interface AlbumListItemProps { actions : LibraryActions ; album : string ; all : boolean ; active ? : boolean ; emitter ? : any ; hash ? : string ; index ? : number ; visible ? : boolean ; } export class AlbumListItem extends React . Component < AlbumListItemProps , { } > { static contextTypes = { router : PropTypes . shape ( { history : PropTypes . shape ( { push : PropTypes . func . isRequired , replace : PropTypes . func . isRequired , createHref : PropTypes . func . isRequired } ) . isRequired } ) . isRequired } ; handleClick ( event ) { if ( ! event . defaultPrevented && event . button === 0 ) { event . preventDefault ( ) ; const { history } = this . context . router ; const props = albumURI ( this . props . album ) ; history . push ( this . props . active ? '/library' : `/library/${ this . props . all ? 'all/' : '' }${ props . artist }/${ props . name }` ) ; } } render ( ) { const { actions , album , active , hash , emitter , index , visible } = this . props ; return < div className = "album-list-item" > < AlbumComponent active = { active } layout = "medium" theme = "dark" subtitle = "counters" id = { album } index = { index } onClick = { this . handleClick . bind ( this ) } / > < /div>; } }