66 lines
1.6 KiB
JavaScript
66 lines
1.6 KiB
JavaScript
// @flow
|
|
import React from 'react';
|
|
import moment from 'moment';
|
|
import classnames from 'classnames';
|
|
import Button from 'component/button';
|
|
import { FormField } from 'component/common/form';
|
|
import { withRouter } from 'react-router-dom';
|
|
import { formatLbryUrlForWeb } from 'util/url';
|
|
|
|
type Props = {
|
|
lastViewed: number,
|
|
uri: string,
|
|
claim: ?StreamClaim,
|
|
selected: boolean,
|
|
onSelect?: () => void,
|
|
resolveUri: string => void,
|
|
slim: boolean,
|
|
history: { push: string => void },
|
|
};
|
|
|
|
class NavigationHistoryItem extends React.PureComponent<Props> {
|
|
static defaultProps = {
|
|
slim: false,
|
|
};
|
|
|
|
componentDidMount() {
|
|
const { claim, uri, resolveUri } = this.props;
|
|
|
|
if (!claim) {
|
|
resolveUri(uri);
|
|
}
|
|
}
|
|
|
|
render() {
|
|
const { lastViewed, selected, onSelect, claim, uri, slim, history } = this.props;
|
|
|
|
let title;
|
|
if (claim && claim.value) {
|
|
({ title } = claim.value);
|
|
}
|
|
|
|
const navigatePath = formatLbryUrlForWeb(uri);
|
|
const onClick =
|
|
onSelect ||
|
|
function() {
|
|
history.push(navigatePath);
|
|
};
|
|
|
|
return (
|
|
<div
|
|
role="button"
|
|
onClick={onClick}
|
|
className={classnames('item-list__row', {
|
|
'item-list__row--selected': selected,
|
|
})}
|
|
>
|
|
{!slim && <FormField checked={selected} type="checkbox" onChange={onSelect} />}
|
|
<span className="time time--ago">{moment(lastViewed).from(moment())}</span>
|
|
<Button className="item-list__element" button="link" label={uri} navigate={uri} />
|
|
<span className="item-list__element">{title}</span>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default withRouter(NavigationHistoryItem);
|