mirror of
https://github.com/ascribe/onion.git
synced 2024-12-31 09:07:48 +01:00
Carry down currentUser as prop to MediaContainer instead of adding state
This commit is contained in:
Brett Sun
parent
875e98dd3b
commit
f2f775f20c
@ -1,7 +1,7 @@
|
||||
'use strict';
|
||||
|
||||
import React from 'react';
|
||||
import { Link, History } from 'react-router';
|
||||
import { Link } from 'react-router';
|
||||
import Moment from 'moment';
|
||||
|
||||
import Row from 'react-bootstrap/lib/Row';
|
||||
@ -44,8 +44,6 @@ let Edition = React.createClass({
|
||||
loadEdition: React.PropTypes.func
|
||||
},
|
||||
|
||||
mixins: [History],
|
||||
|
||||
getDefaultProps() {
|
||||
return {
|
||||
furtherDetailsType: FurtherDetails
|
||||
@ -53,98 +51,103 @@ let Edition = React.createClass({
|
||||
},
|
||||
|
||||
render() {
|
||||
let FurtherDetailsType = this.props.furtherDetailsType;
|
||||
const {
|
||||
actionPanelButtonListType,
|
||||
coaError,
|
||||
currentUser,
|
||||
edition,
|
||||
furtherDetailsType: FurtherDetailsType,
|
||||
loadEdition } = this.props;
|
||||
|
||||
return (
|
||||
<Row>
|
||||
<Col md={6}>
|
||||
<MediaContainer
|
||||
content={this.props.edition}/>
|
||||
content={edition}
|
||||
currentUser={currentUser} />
|
||||
</Col>
|
||||
<Col md={6} className="ascribe-edition-details">
|
||||
<div className="ascribe-detail-header">
|
||||
<hr style={{marginTop: 0}}/>
|
||||
<h1 className="ascribe-detail-title">{this.props.edition.title}</h1>
|
||||
<EditionDetailProperty label="BY" value={this.props.edition.artist_name} />
|
||||
<EditionDetailProperty label="DATE" value={Moment(this.props.edition.date_created, 'YYYY-MM-DD').year()} />
|
||||
<h1 className="ascribe-detail-title">{edition.title}</h1>
|
||||
<EditionDetailProperty label="BY" value={edition.artist_name} />
|
||||
<EditionDetailProperty label="DATE" value={Moment(edition.date_created, 'YYYY-MM-DD').year()} />
|
||||
<hr/>
|
||||
</div>
|
||||
<EditionSummary
|
||||
actionPanelButtonListType={this.props.actionPanelButtonListType}
|
||||
edition={this.props.edition}
|
||||
currentUser={this.props.currentUser}
|
||||
handleSuccess={this.props.loadEdition}/>
|
||||
actionPanelButtonListType={actionPanelButtonListType}
|
||||
edition={edition}
|
||||
currentUser={currentUser}
|
||||
handleSuccess={loadEdition}/>
|
||||
<CollapsibleParagraph
|
||||
title={getLangText('Certificate of Authenticity')}
|
||||
show={this.props.edition.acl.acl_coa === true}>
|
||||
show={edition.acl.acl_coa === true}>
|
||||
<CoaDetails
|
||||
coa={this.props.edition.coa}
|
||||
coaError={this.props.coaError}
|
||||
editionId={this.props.edition.bitcoin_id}/>
|
||||
coa={edition.coa}
|
||||
coaError={coaError}
|
||||
editionId={edition.bitcoin_id}/>
|
||||
</CollapsibleParagraph>
|
||||
|
||||
<CollapsibleParagraph
|
||||
title={getLangText('Provenance/Ownership History')}
|
||||
show={this.props.edition.ownership_history && this.props.edition.ownership_history.length > 0}>
|
||||
show={edition.ownership_history && edition.ownership_history.length > 0}>
|
||||
<HistoryIterator
|
||||
history={this.props.edition.ownership_history} />
|
||||
history={edition.ownership_history} />
|
||||
</CollapsibleParagraph>
|
||||
|
||||
<CollapsibleParagraph
|
||||
title={getLangText('Consignment History')}
|
||||
show={this.props.edition.consign_history && this.props.edition.consign_history.length > 0}>
|
||||
show={edition.consign_history && edition.consign_history.length > 0}>
|
||||
<HistoryIterator
|
||||
history={this.props.edition.consign_history} />
|
||||
history={edition.consign_history} />
|
||||
</CollapsibleParagraph>
|
||||
|
||||
<CollapsibleParagraph
|
||||
title={getLangText('Loan History')}
|
||||
show={this.props.edition.loan_history && this.props.edition.loan_history.length > 0}>
|
||||
show={edition.loan_history && edition.loan_history.length > 0}>
|
||||
<HistoryIterator
|
||||
history={this.props.edition.loan_history} />
|
||||
history={edition.loan_history} />
|
||||
</CollapsibleParagraph>
|
||||
|
||||
<CollapsibleParagraph
|
||||
title="Notes"
|
||||
show={!!(this.props.currentUser.username
|
||||
|| this.props.edition.acl.acl_edit
|
||||
|| this.props.edition.public_note)}>
|
||||
show={!!(currentUser.username || edition.acl.acl_edit || edition.public_note)}>
|
||||
<Note
|
||||
id={() => {return {'bitcoin_id': this.props.edition.bitcoin_id}; }}
|
||||
id={() => {return {'bitcoin_id': edition.bitcoin_id}; }}
|
||||
label={getLangText('Personal note (private)')}
|
||||
defaultValue={this.props.edition.private_note ? this.props.edition.private_note : null}
|
||||
defaultValue={edition.private_note ? edition.private_note : null}
|
||||
placeholder={getLangText('Enter your comments ...')}
|
||||
editable={true}
|
||||
successMessage={getLangText('Private note saved')}
|
||||
url={ApiUrls.note_private_edition}
|
||||
currentUser={this.props.currentUser}/>
|
||||
currentUser={currentUser}/>
|
||||
<Note
|
||||
id={() => {return {'bitcoin_id': this.props.edition.bitcoin_id}; }}
|
||||
id={() => {return {'bitcoin_id': edition.bitcoin_id}; }}
|
||||
label={getLangText('Personal note (public)')}
|
||||
defaultValue={this.props.edition.public_note ? this.props.edition.public_note : null}
|
||||
defaultValue={edition.public_note ? edition.public_note : null}
|
||||
placeholder={getLangText('Enter your comments ...')}
|
||||
editable={!!this.props.edition.acl.acl_edit}
|
||||
show={!!this.props.edition.public_note || !!this.props.edition.acl.acl_edit}
|
||||
editable={!!edition.acl.acl_edit}
|
||||
show={!!edition.public_note || !!edition.acl.acl_edit}
|
||||
successMessage={getLangText('Public edition note saved')}
|
||||
url={ApiUrls.note_public_edition}
|
||||
currentUser={this.props.currentUser}/>
|
||||
currentUser={currentUser}/>
|
||||
</CollapsibleParagraph>
|
||||
<CollapsibleParagraph
|
||||
title={getLangText('Further Details')}
|
||||
show={this.props.edition.acl.acl_edit
|
||||
|| Object.keys(this.props.edition.extra_data).length > 0
|
||||
|| this.props.edition.other_data.length > 0}>
|
||||
show={edition.acl.acl_edit ||
|
||||
Object.keys(edition.extra_data).length > 0 ||
|
||||
edition.other_data.length > 0}>
|
||||
<FurtherDetailsType
|
||||
editable={this.props.edition.acl.acl_edit}
|
||||
pieceId={this.props.edition.parent}
|
||||
extraData={this.props.edition.extra_data}
|
||||
otherData={this.props.edition.other_data}
|
||||
handleSuccess={this.props.loadEdition} />
|
||||
editable={edition.acl.acl_edit}
|
||||
pieceId={edition.parent}
|
||||
extraData={edition.extra_data}
|
||||
otherData={edition.other_data}
|
||||
handleSuccess={loadEdition} />
|
||||
</CollapsibleParagraph>
|
||||
<CollapsibleParagraph
|
||||
title={getLangText('SPOOL Details')}>
|
||||
<SpoolDetails
|
||||
edition={this.props.edition} />
|
||||
edition={edition} />
|
||||
</CollapsibleParagraph>
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
@ -14,10 +14,6 @@ import CollapsibleButton from './../ascribe_collapsible/collapsible_button';
|
||||
|
||||
import AclProxy from '../acl_proxy';
|
||||
|
||||
import UserActions from '../../actions/user_actions';
|
||||
import UserStore from '../../stores/user_store';
|
||||
|
||||
import { mergeOptions } from '../../utils/general_utils.js';
|
||||
import { getLangText } from '../../utils/lang_utils.js';
|
||||
|
||||
const EMBED_IFRAME_HEIGHT = {
|
||||
@ -28,25 +24,22 @@ const EMBED_IFRAME_HEIGHT = {
|
||||
let MediaContainer = React.createClass({
|
||||
propTypes: {
|
||||
content: React.PropTypes.object,
|
||||
currentUser: React.PropTypes.object,
|
||||
refreshObject: React.PropTypes.func
|
||||
},
|
||||
|
||||
getInitialState() {
|
||||
return mergeOptions(
|
||||
UserStore.getState(),
|
||||
{
|
||||
timerId: null
|
||||
});
|
||||
return {
|
||||
timerId: null
|
||||
};
|
||||
},
|
||||
|
||||
componentDidMount() {
|
||||
UserStore.listen(this.onChange);
|
||||
UserActions.fetchCurrentUser();
|
||||
|
||||
if (!this.props.content.digital_work) {
|
||||
return;
|
||||
}
|
||||
let isEncoding = this.props.content.digital_work.isEncoding;
|
||||
|
||||
const isEncoding = this.props.content.digital_work.isEncoding;
|
||||
if (this.props.content.digital_work.mime === 'video' && typeof isEncoding === 'number' && isEncoding !== 100 && !this.state.timerId) {
|
||||
let timerId = window.setInterval(this.props.refreshObject, 10000);
|
||||
this.setState({timerId: timerId});
|
||||
@ -60,22 +53,16 @@ let MediaContainer = React.createClass({
|
||||
},
|
||||
|
||||
componentWillUnmount() {
|
||||
UserStore.unlisten(this.onChange);
|
||||
|
||||
window.clearInterval(this.state.timerId);
|
||||
},
|
||||
|
||||
onChange(state) {
|
||||
this.setState(state);
|
||||
},
|
||||
|
||||
render() {
|
||||
const { content } = this.props;
|
||||
const { content, currentUser } = this.props;
|
||||
// Pieces and editions are joined to the user by a foreign key in the database, so
|
||||
// the information in content will be updated if a user updates their username.
|
||||
// We also force uniqueness of usernames, so this check is safe to dtermine if the
|
||||
// content was registered by the current user.
|
||||
const didUserRegisterContent = this.state.currentUser && (this.state.currentUser.username === content.user_registered);
|
||||
const didUserRegisterContent = currentUser && (currentUser.username === content.user_registered);
|
||||
|
||||
let thumbnail = content.thumbnail.thumbnail_sizes && content.thumbnail.thumbnail_sizes['600x600'] ?
|
||||
content.thumbnail.thumbnail_sizes['600x600'] : content.thumbnail.url_safe;
|
||||
@ -125,8 +112,12 @@ let MediaContainer = React.createClass({
|
||||
show={['video', 'audio', 'image'].indexOf(mimetype) === -1 || content.acl.acl_download}
|
||||
aclObject={content.acl}
|
||||
aclName="acl_download">
|
||||
<Button bsSize="xsmall" className="ascribe-margin-1px" href={this.props.content.digital_work.url} target="_blank">
|
||||
Download .{mimetype} <Glyphicon glyph="cloud-download"/>
|
||||
<Button
|
||||
bsSize="xsmall"
|
||||
className="ascribe-margin-1px"
|
||||
href={content.digital_work.url}
|
||||
target="_blank">
|
||||
{getLangText('Download')} .{mimetype} <Glyphicon glyph="cloud-download"/>
|
||||
</Button>
|
||||
</AclProxy>
|
||||
{embed}
|
||||
|
||||
@ -16,10 +16,10 @@ import MediaContainer from './media_container';
|
||||
let Piece = React.createClass({
|
||||
propTypes: {
|
||||
piece: React.PropTypes.object,
|
||||
currentUser: React.PropTypes.object,
|
||||
header: React.PropTypes.object,
|
||||
subheader: React.PropTypes.object,
|
||||
buttons: React.PropTypes.object,
|
||||
loadPiece: React.PropTypes.func,
|
||||
children: React.PropTypes.oneOfType([
|
||||
React.PropTypes.arrayOf(React.PropTypes.element),
|
||||
React.PropTypes.element
|
||||
@ -32,20 +32,22 @@ let Piece = React.createClass({
|
||||
},
|
||||
|
||||
render() {
|
||||
const { buttons, children, currentUser, header, piece, subheader } = this.props;
|
||||
|
||||
return (
|
||||
<Row>
|
||||
<Col md={6}>
|
||||
<MediaContainer
|
||||
refreshObject={this.updateObject}
|
||||
content={this.props.piece}/>
|
||||
content={piece}
|
||||
currentUser={currentUser}
|
||||
refreshObject={this.updateObject} />
|
||||
</Col>
|
||||
<Col md={6} className="ascribe-edition-details">
|
||||
{this.props.header}
|
||||
{this.props.subheader}
|
||||
{this.props.buttons}
|
||||
|
||||
{this.props.children}
|
||||
{header}
|
||||
{subheader}
|
||||
{buttons}
|
||||
|
||||
{children}
|
||||
</Col>
|
||||
</Row>
|
||||
);
|
||||
|
||||
@ -247,76 +247,76 @@ let PieceContainer = React.createClass({
|
||||
},
|
||||
|
||||
render() {
|
||||
if (this.state.piece && this.state.piece.id) {
|
||||
let FurtherDetailsType = this.props.furtherDetailsType;
|
||||
setDocumentTitle([this.state.piece.artist_name, this.state.piece.title].join(', '));
|
||||
const { furtherDetailsType: FurtherDetailsType } = this.props;
|
||||
const { currentUser, piece } = this.state;
|
||||
|
||||
if (piece && piece.id) {
|
||||
setDocumentTitle([piece.artist_name, piece.title].join(', '));
|
||||
|
||||
return (
|
||||
<Piece
|
||||
piece={this.state.piece}
|
||||
loadPiece={this.loadPiece}
|
||||
piece={piece}
|
||||
currentUser={currentUser}
|
||||
header={
|
||||
<div className="ascribe-detail-header">
|
||||
<hr style={{marginTop: 0}}/>
|
||||
<h1 className="ascribe-detail-title">{this.state.piece.title}</h1>
|
||||
<DetailProperty label="BY" value={this.state.piece.artist_name} />
|
||||
<DetailProperty label="DATE" value={Moment(this.state.piece.date_created, 'YYYY-MM-DD').year() } />
|
||||
{this.state.piece.num_editions > 0 ? <DetailProperty label="EDITIONS" value={ this.state.piece.num_editions } /> : null}
|
||||
<h1 className="ascribe-detail-title">{piece.title}</h1>
|
||||
<DetailProperty label="BY" value={piece.artist_name} />
|
||||
<DetailProperty label="DATE" value={Moment(piece.date_created, 'YYYY-MM-DD').year() } />
|
||||
{piece.num_editions > 0 ? <DetailProperty label="EDITIONS" value={ piece.num_editions } /> : null}
|
||||
<hr/>
|
||||
</div>
|
||||
}
|
||||
subheader={
|
||||
<div className="ascribe-detail-header">
|
||||
<DetailProperty label={getLangText('REGISTREE')} value={ this.state.piece.user_registered } />
|
||||
<DetailProperty label={getLangText('ID')} value={ this.state.piece.bitcoin_id } ellipsis={true} />
|
||||
<LicenseDetail license={this.state.piece.license_type} />
|
||||
<DetailProperty label={getLangText('REGISTREE')} value={ piece.user_registered } />
|
||||
<DetailProperty label={getLangText('ID')} value={ piece.bitcoin_id } ellipsis={true} />
|
||||
<LicenseDetail license={piece.license_type} />
|
||||
</div>
|
||||
}
|
||||
buttons={this.getActions()}>
|
||||
{this.getCreateEditionsDialog()}
|
||||
<CollapsibleParagraph
|
||||
title={getLangText('Loan History')}
|
||||
show={this.state.piece.loan_history && this.state.piece.loan_history.length > 0}>
|
||||
show={piece.loan_history && piece.loan_history.length > 0}>
|
||||
<HistoryIterator
|
||||
history={this.state.piece.loan_history} />
|
||||
history={piece.loan_history} />
|
||||
</CollapsibleParagraph>
|
||||
<CollapsibleParagraph
|
||||
title={getLangText('Notes')}
|
||||
show={!!(this.state.currentUser.username
|
||||
|| this.state.piece.acl.acl_edit
|
||||
|| this.state.piece.public_note)}>
|
||||
show={!!(currentUser.username || piece.acl.acl_edit || piece.public_note)}>
|
||||
<Note
|
||||
id={this.getId}
|
||||
label={getLangText('Personal note (private)')}
|
||||
defaultValue={this.state.piece.private_note || null}
|
||||
show = {!!this.state.currentUser.username}
|
||||
defaultValue={piece.private_note || null}
|
||||
show = {!!currentUser.username}
|
||||
placeholder={getLangText('Enter your comments ...')}
|
||||
editable={true}
|
||||
successMessage={getLangText('Private note saved')}
|
||||
url={ApiUrls.note_private_piece}
|
||||
currentUser={this.state.currentUser}/>
|
||||
currentUser={currentUser}/>
|
||||
<Note
|
||||
id={this.getId}
|
||||
label={getLangText('Personal note (public)')}
|
||||
defaultValue={this.state.piece.public_note || null}
|
||||
defaultValue={piece.public_note || null}
|
||||
placeholder={getLangText('Enter your comments ...')}
|
||||
editable={!!this.state.piece.acl.acl_edit}
|
||||
show={!!(this.state.piece.public_note || this.state.piece.acl.acl_edit)}
|
||||
editable={!!piece.acl.acl_edit}
|
||||
show={!!(piece.public_note || piece.acl.acl_edit)}
|
||||
successMessage={getLangText('Public note saved')}
|
||||
url={ApiUrls.note_public_piece}
|
||||
currentUser={this.state.currentUser}/>
|
||||
currentUser={currentUser}/>
|
||||
</CollapsibleParagraph>
|
||||
<CollapsibleParagraph
|
||||
title={getLangText('Further Details')}
|
||||
show={this.state.piece.acl.acl_edit
|
||||
|| Object.keys(this.state.piece.extra_data).length > 0
|
||||
|| this.state.piece.other_data.length > 0}
|
||||
show={piece.acl.acl_edit
|
||||
|| Object.keys(piece.extra_data).length > 0
|
||||
|| piece.other_data.length > 0}
|
||||
defaultExpanded={true}>
|
||||
<FurtherDetailsType
|
||||
editable={this.state.piece.acl.acl_edit}
|
||||
pieceId={this.state.piece.id}
|
||||
extraData={this.state.piece.extra_data}
|
||||
otherData={this.state.piece.other_data}
|
||||
editable={piece.acl.acl_edit}
|
||||
pieceId={piece.id}
|
||||
extraData={piece.extra_data}
|
||||
otherData={piece.other_data}
|
||||
handleSuccess={this.loadPiece} />
|
||||
</CollapsibleParagraph>
|
||||
|
||||
|
||||
@ -107,20 +107,22 @@ let PieceContainer = React.createClass({
|
||||
},
|
||||
|
||||
getActions() {
|
||||
if (this.state.piece &&
|
||||
this.state.piece.notifications &&
|
||||
this.state.piece.notifications.length > 0) {
|
||||
const { currentUser, piece } = this.state;
|
||||
|
||||
if (piece && piece.notifications && piece.notifications.length > 0) {
|
||||
return (
|
||||
<ListRequestActions
|
||||
pieceOrEditions={this.state.piece}
|
||||
currentUser={this.state.currentUser}
|
||||
pieceOrEditions={piece}
|
||||
currentUser={currentUser}
|
||||
handleSuccess={this.loadPiece}
|
||||
notifications={this.state.piece.notifications}/>);
|
||||
notifications={piece.notifications}/>);
|
||||
}
|
||||
},
|
||||
|
||||
render() {
|
||||
if(this.state.piece && this.state.piece.id) {
|
||||
const { currentUser, piece } = this.state;
|
||||
|
||||
if (piece && piece.id) {
|
||||
/*
|
||||
|
||||
This really needs a refactor!
|
||||
@ -129,37 +131,32 @@ let PieceContainer = React.createClass({
|
||||
|
||||
*/
|
||||
// Only show the artist name if you are the participant or if you are a judge and the piece is shortlisted
|
||||
let artistName = ((this.state.currentUser.is_jury && !this.state.currentUser.is_judge) ||
|
||||
(this.state.currentUser.is_judge && !this.state.piece.selected )) ?
|
||||
null : this.state.piece.artist_name;
|
||||
let artistName;
|
||||
if ((currentUser.is_jury && !currentUser.is_judge) || (currentUser.is_judge && !piece.selected )) {
|
||||
artistName = <span className="glyphicon glyphicon-eye-close" aria-hidden="true"/>;
|
||||
setDocumentTitle(piece.title);
|
||||
} else {
|
||||
artistName = piece.artist_name;
|
||||
setDocumentTitle([artistName, piece.title].join(', '));
|
||||
}
|
||||
|
||||
// Only show the artist email if you are a judge and the piece is shortlisted
|
||||
let artistEmail = (this.state.currentUser.is_judge && this.state.piece.selected ) ?
|
||||
<DetailProperty label={getLangText('REGISTREE')} value={ this.state.piece.user_registered } /> : null;
|
||||
|
||||
if (artistName === null) {
|
||||
setDocumentTitle(this.state.piece.title);
|
||||
} else {
|
||||
setDocumentTitle([artistName, this.state.piece.title].join(', '));
|
||||
}
|
||||
|
||||
if (artistName === null) {
|
||||
artistName = <span className="glyphicon glyphicon-eye-close" aria-hidden="true"/>;
|
||||
}
|
||||
const artistEmail = (currentUser.is_judge && piece.selected ) ?
|
||||
<DetailProperty label={getLangText('REGISTREE')} value={ piece.user_registered } /> : null;
|
||||
|
||||
return (
|
||||
<Piece
|
||||
piece={this.state.piece}
|
||||
loadPiece={this.loadPiece}
|
||||
piece={piece}
|
||||
currentUser={currentUser}
|
||||
header={
|
||||
<div className="ascribe-detail-header">
|
||||
<NavigationHeader
|
||||
piece={this.state.piece}
|
||||
currentUser={this.state.currentUser}/>
|
||||
piece={piece}
|
||||
currentUser={currentUser}/>
|
||||
|
||||
<h1 className="ascribe-detail-title">{this.state.piece.title}</h1>
|
||||
<h1 className="ascribe-detail-title">{piece.title}</h1>
|
||||
<DetailProperty label={getLangText('BY')} value={artistName} />
|
||||
<DetailProperty label={getLangText('DATE')} value={Moment(this.state.piece.date_created, 'YYYY-MM-DD').year()} />
|
||||
<DetailProperty label={getLangText('DATE')} value={Moment(piece.date_created, 'YYYY-MM-DD').year()} />
|
||||
{artistEmail}
|
||||
{this.getActions()}
|
||||
<hr/>
|
||||
@ -168,10 +165,10 @@ let PieceContainer = React.createClass({
|
||||
subheader={
|
||||
<PrizePieceRatings
|
||||
loadPiece={this.loadPiece}
|
||||
piece={this.state.piece}
|
||||
currentUser={this.state.currentUser}/>
|
||||
piece={piece}
|
||||
currentUser={currentUser}/>
|
||||
}>
|
||||
<PrizePieceDetails piece={this.state.piece} />
|
||||
<PrizePieceDetails piece={piece} />
|
||||
</Piece>
|
||||
);
|
||||
} else {
|
||||
|
||||
@ -28,56 +28,63 @@ let WalletPieceContainer = React.createClass({
|
||||
submitButtonType: React.PropTypes.func.isRequired
|
||||
},
|
||||
|
||||
|
||||
render() {
|
||||
if(this.props.piece && this.props.piece.id) {
|
||||
const {
|
||||
children,
|
||||
currentUser,
|
||||
handleDeleteSuccess,
|
||||
loadPiece,
|
||||
piece,
|
||||
submitButtonType } = this.props;
|
||||
|
||||
if(piece && piece.id) {
|
||||
return (
|
||||
<Piece
|
||||
piece={this.props.piece}
|
||||
loadPiece={this.props.loadPiece}
|
||||
piece={piece}
|
||||
currentUser={currentUser}
|
||||
header={
|
||||
<div className="ascribe-detail-header">
|
||||
<hr style={{marginTop: 0}}/>
|
||||
<h1 className="ascribe-detail-title">{this.props.piece.title}</h1>
|
||||
<DetailProperty label="BY" value={this.props.piece.artist_name} />
|
||||
<DetailProperty label="DATE" value={Moment(this.props.piece.date_created, 'YYYY-MM-DD').year()} />
|
||||
<h1 className="ascribe-detail-title">{piece.title}</h1>
|
||||
<DetailProperty label="BY" value={piece.artist_name} />
|
||||
<DetailProperty label="DATE" value={Moment(piece.date_created, 'YYYY-MM-DD').year()} />
|
||||
<hr/>
|
||||
</div>
|
||||
}
|
||||
subheader={
|
||||
<div className="ascribe-detail-header">
|
||||
<DetailProperty label={getLangText('REGISTREE')} value={ this.props.piece.user_registered } />
|
||||
<DetailProperty label={getLangText('ID')} value={ this.props.piece.bitcoin_id } ellipsis={true} />
|
||||
<hr/>
|
||||
</div>
|
||||
}>
|
||||
<div className="ascribe-detail-header">
|
||||
<DetailProperty label={getLangText('REGISTREE')} value={ piece.user_registered } />
|
||||
<DetailProperty label={getLangText('ID')} value={ piece.bitcoin_id } ellipsis={true} />
|
||||
<hr/>
|
||||
</div>
|
||||
}>
|
||||
<WalletActionPanel
|
||||
piece={this.props.piece}
|
||||
currentUser={this.props.currentUser}
|
||||
loadPiece={this.props.loadPiece}
|
||||
handleDeleteSuccess={this.props.handleDeleteSuccess}
|
||||
submitButtonType={this.props.submitButtonType}/>
|
||||
piece={piece}
|
||||
currentUser={currentUser}
|
||||
loadPiece={loadPiece}
|
||||
handleDeleteSuccess={handleDeleteSuccess}
|
||||
submitButtonType={submitButtonType}/>
|
||||
<CollapsibleParagraph
|
||||
title={getLangText('Loan History')}
|
||||
show={this.props.piece.loan_history && this.props.piece.loan_history.length > 0}>
|
||||
show={piece.loan_history && piece.loan_history.length > 0}>
|
||||
<HistoryIterator
|
||||
history={this.props.piece.loan_history}/>
|
||||
history={piece.loan_history}/>
|
||||
</CollapsibleParagraph>
|
||||
<CollapsibleParagraph
|
||||
title={getLangText('Notes')}
|
||||
show={!!(this.props.currentUser.username || this.props.piece.public_note)}>
|
||||
show={!!(currentUser.username || piece.public_note)}>
|
||||
<Note
|
||||
id={() => {return {'id': this.props.piece.id}; }}
|
||||
id={() => {return {'id': piece.id}; }}
|
||||
label={getLangText('Personal note (private)')}
|
||||
defaultValue={this.props.piece.private_note || null}
|
||||
defaultValue={piece.private_note || null}
|
||||
placeholder={getLangText('Enter your comments ...')}
|
||||
editable={true}
|
||||
successMessage={getLangText('Private note saved')}
|
||||
url={ApiUrls.note_private_piece}
|
||||
currentUser={this.props.currentUser}/>
|
||||
currentUser={currentUser}/>
|
||||
</CollapsibleParagraph>
|
||||
|
||||
{this.props.children}
|
||||
{children}
|
||||
</Piece>
|
||||
);
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user