diff --git a/js/components/ascribe_accordion_list/accordion_list_item_piece.js b/js/components/ascribe_accordion_list/accordion_list_item_piece.js index 006479c5..9f876388 100644 --- a/js/components/ascribe_accordion_list/accordion_list_item_piece.js +++ b/js/components/ascribe_accordion_list/accordion_list_item_piece.js @@ -12,8 +12,11 @@ import { getLangText } from '../../utils/lang_utils'; let AccordionListItemPiece = React.createClass({ propTypes: { className: React.PropTypes.string, - artistName: React.PropTypes.string, - piece: React.PropTypes.object, + artistName: React.PropTypes.oneOfType([ + React.PropTypes.string, + React.PropTypes.element + ]), + piece: React.PropTypes.object.isRequired, children: React.PropTypes.oneOfType([ React.PropTypes.arrayOf(React.PropTypes.element), React.PropTypes.element @@ -51,17 +54,21 @@ let AccordionListItemPiece = React.createClass({ piece, subsubheading, thumbnailPlaceholder: ThumbnailPlaceholder } = this.props; - const { url, url_safe } = piece.thumbnail; + const { url: thumbnailUrl, url_safe: thumbnailSafeUrl } = piece.thumbnail; + + // Display the 300x300 thumbnail if we have it, otherwise just use the safe url + const thumbnailDisplayUrl = (piece.thumbnail.thumbnail_sizes && piece.thumbnail.thumbnail_sizes['300x300']) || thumbnailSafeUrl; + let thumbnail; // Since we're going to refactor the thumbnail generation anyway at one point, // for not use the annoying ascribe_spiral.png, we're matching the url against // this name and replace it with a CSS version of the new logo. - if (url.match(/https:\/\/.*\/media\/thumbnails\/ascribe_spiral.png/)) { + if (thumbnailUrl.match(/https:\/\/.*\/media\/thumbnails\/ascribe_spiral.png/)) { thumbnail = (); } else { thumbnail = ( -
+
); } @@ -79,8 +86,7 @@ let AccordionListItemPiece = React.createClass({ subsubheading={subsubheading} buttons={buttons} badge={badge} - linkData={this.getLinkData()} - > + linkData={this.getLinkData()}> {children} ); diff --git a/js/components/ascribe_detail/detail_property.js b/js/components/ascribe_detail/detail_property.js index 8b0f50b5..0191ffa9 100644 --- a/js/components/ascribe_detail/detail_property.js +++ b/js/components/ascribe_detail/detail_property.js @@ -1,9 +1,10 @@ 'use strict'; import React from 'react'; +import classNames from 'classnames'; -let DetailProperty = React.createClass({ +const DetailProperty = React.createClass({ propTypes: { label: React.PropTypes.string, value: React.PropTypes.oneOfType([ @@ -12,6 +13,7 @@ let DetailProperty = React.createClass({ React.PropTypes.element ]), separator: React.PropTypes.string, + className: React.PropTypes.string, labelClassName: React.PropTypes.string, valueClassName: React.PropTypes.string, ellipsis: React.PropTypes.bool, @@ -30,31 +32,23 @@ let DetailProperty = React.createClass({ }, render() { - let styles = {}; - const { labelClassName, - label, - separator, - valueClassName, - children, - value } = this.props; - - if(this.props.ellipsis) { - styles = { - whiteSpace: 'nowrap', - overflow: 'hidden', - textOverflow: 'ellipsis' - }; - } + const { + children, + className, + ellipsis, + label, + labelClassName, + separator, + valueClassName, + value } = this.props; return ( -
+
{label} {separator}
-
+
{children || value}
diff --git a/js/components/ascribe_detail/edition.js b/js/components/ascribe_detail/edition.js index 40fd6625..0879dea0 100644 --- a/js/components/ascribe_detail/edition.js +++ b/js/components/ascribe_detail/edition.js @@ -16,7 +16,7 @@ import CollapsibleParagraph from './../ascribe_collapsible/collapsible_paragraph import Form from './../ascribe_forms/form'; import Property from './../ascribe_forms/property'; -import EditionDetailProperty from './detail_property'; +import DetailProperty from './detail_property'; import LicenseDetail from './license_detail'; import FurtherDetails from './further_details'; @@ -57,16 +57,16 @@ let Edition = React.createClass({ return ( - + - +
-
+

{this.props.edition.title}

- - + +
0){ let statusStr = this.props.edition.status.join(', ').replace(/_/g, ' '); - status = ; + status = ; if (this.props.edition.pending_new_owner && this.props.edition.acl.acl_withdraw_transfer){ status = ( - + ); } } @@ -183,14 +183,14 @@ let EditionSummary = React.createClass({ let { actionPanelButtonListType, edition, currentUser } = this.props; return (
- - - @@ -201,14 +201,15 @@ let EditionSummary = React.createClass({ `AclInformation` would show up */} 1}> - + - +
@@ -225,61 +226,67 @@ let CoaDetails = React.createClass({ }, contactOnIntercom() { - window.Intercom('showNewMessage', `Hi, I'm having problems generating a Certificate of Authenticity for Edition: ${this.props.editionId}`); - console.logGlobal(new Error(`Coa couldn't be created for edition: ${this.props.editionId}`), this.props.coaError); + const { coaError, editionId } = this.props; + + window.Intercom('showNewMessage', getLangText("Hi, I'm having problems generating a Certificate of Authenticity for Edition: %s", editionId)); + console.logGlobal(new Error(`Coa couldn't be created for edition: ${editionId}`), coaError); }, render() { - if(this.props.coaError) { - return ( -
-

{getLangText('There was an error generating your Certificate of Authenticity.')}

-

- {getLangText('Try to refresh the page. If this happens repeatedly, please ')} - {getLangText('contact us')}. -

-
- ); - } - if(this.props.coa && this.props.coa.url_safe) { - return ( -
-
- -
-
- - - - - - + const { coa, coaError } = this.props; + let coaDetailElement; -
+ if (coaError) { + coaDetailElement = [ +

{getLangText('There was an error generating your Certificate of Authenticity.')}

, +

+ {getLangText('Try to refresh the page. If this happens repeatedly, please ')} + {getLangText('contact us')}. +

+ ]; + } else if (coa && coa.url_safe) { + coaDetailElement = [ +
+ +
, +
+ + + + + +
- ); - } else if(typeof this.props.coa === 'string'){ - return ( -
- {this.props.coa} -
- ); - } - return ( -
- -

{getLangText("Just a sec, we\'re generating your COA")}

+ ]; + } else if (typeof coa === 'string') { + coaDetailElement = coa; + } else { + coaDetailElement = [ + , +

{getLangText("Just a sec, we're generating your COA")}

,

{getLangText('(you may leave the page)')}

+ ]; + } + + return ( +
+
+ {coaDetailElement} +
+ {/* Hide the COA and just show that it's a seperate document when printing */} +
+ {getLangText('The COA is available as a seperate document')} +
); } @@ -291,16 +298,34 @@ let SpoolDetails = React.createClass({ }, render() { - let bitcoinIdValue = ( - {this.props.edition.bitcoin_id} + const { edition: { + bitcoin_id: bitcoinId, + hash_as_address: hashAsAddress, + btc_owner_address_noprefix: bitcoinOwnerAddress + } } = this.props; + + const bitcoinIdValue = ( + + {bitcoinId} + ); - let hashOfArtwork = ( - {this.props.edition.hash_as_address} + const hashOfArtwork = ( + + {hashAsAddress} + ); - let ownerAddress = ( - {this.props.edition.btc_owner_address_noprefix} + const ownerAddress = ( + + {bitcoinOwnerAddress} + ); return ( diff --git a/js/components/ascribe_detail/edition_action_panel.js b/js/components/ascribe_detail/edition_action_panel.js index 36a79e7c..92c51c32 100644 --- a/js/components/ascribe_detail/edition_action_panel.js +++ b/js/components/ascribe_detail/edition_action_panel.js @@ -72,10 +72,10 @@ let EditionActionPanel = React.createClass({ EditionListActions.closeAllEditionLists(); EditionListActions.clearAllEditionSelections(); - let notification = new GlobalNotificationModel(response.notification, 'success'); + const notification = new GlobalNotificationModel(response.notification, 'success'); GlobalNotificationActions.appendGlobalNotification(notification); - this.history.pushState(null, '/collection'); + this.history.push('/collection'); }, refreshCollection() { @@ -84,7 +84,7 @@ let EditionActionPanel = React.createClass({ EditionListActions.refreshEditionList({pieceId: this.props.edition.parent}); }, - handleSuccess(response){ + handleSuccess(response) { this.refreshCollection(); this.props.handleSuccess(); if (response){ @@ -93,7 +93,7 @@ let EditionActionPanel = React.createClass({ } }, - render(){ + render() { const { actionPanelButtonListType: ActionPanelButtonListType, edition, diff --git a/js/components/ascribe_detail/further_details_fileuploader.js b/js/components/ascribe_detail/further_details_fileuploader.js index b044bbbc..acdbe9e0 100644 --- a/js/components/ascribe_detail/further_details_fileuploader.js +++ b/js/components/ascribe_detail/further_details_fileuploader.js @@ -20,6 +20,7 @@ let FurtherDetailsFileuploader = React.createClass({ otherData: React.PropTypes.arrayOf(React.PropTypes.object), setIsUploadReady: React.PropTypes.func, submitFile: React.PropTypes.func, + onValidationFailed: React.PropTypes.func, isReadyForFormSubmission: React.PropTypes.func, editable: React.PropTypes.bool, multiple: React.PropTypes.bool @@ -60,6 +61,7 @@ let FurtherDetailsFileuploader = React.createClass({ }} validation={AppConstants.fineUploader.validation.additionalData} submitFile={this.props.submitFile} + onValidationFailed={this.props.onValidationFailed} setIsUploadReady={this.props.setIsUploadReady} isReadyForFormSubmission={this.props.isReadyForFormSubmission} session={{ diff --git a/js/components/ascribe_detail/history_iterator.js b/js/components/ascribe_detail/history_iterator.js index 413aeb21..03904863 100644 --- a/js/components/ascribe_detail/history_iterator.js +++ b/js/components/ascribe_detail/history_iterator.js @@ -22,7 +22,11 @@ let HistoryIterator = React.createClass({ return ( {historicalEventDescription} - {contractName} + + {contractName} + ); } else if(historicalEvent.length === 2) { diff --git a/js/components/ascribe_detail/media_container.js b/js/components/ascribe_detail/media_container.js index c6845a44..3c1e7eb9 100644 --- a/js/components/ascribe_detail/media_container.js +++ b/js/components/ascribe_detail/media_container.js @@ -114,7 +114,7 @@ let MediaContainer = React.createClass({ url={content.digital_work.url} extraData={extraData} encodingStatus={content.digital_work.isEncoding} /> -

+

- + - + {this.props.header} {this.props.subheader} {this.props.buttons} diff --git a/js/components/ascribe_detail/piece_container.js b/js/components/ascribe_detail/piece_container.js index 7dfc9570..9615c455 100644 --- a/js/components/ascribe_detail/piece_container.js +++ b/js/components/ascribe_detail/piece_container.js @@ -159,7 +159,7 @@ let PieceContainer = React.createClass({ let notification = new GlobalNotificationModel(response.notification, 'success'); GlobalNotificationActions.appendGlobalNotification(notification); - this.history.pushState(null, '/collection'); + this.history.push('/collection'); }, getCreateEditionsDialog() { @@ -219,7 +219,9 @@ let PieceContainer = React.createClass({ no more than 1 key, we're hiding the `DetailProperty` actions as otherwise `AclInformation` would show up */} - + -

+

{this.state.piece.title}

diff --git a/js/components/ascribe_forms/form.js b/js/components/ascribe_forms/form.js index d4002e85..91d00f65 100644 --- a/js/components/ascribe_forms/form.js +++ b/js/components/ascribe_forms/form.js @@ -178,20 +178,20 @@ let Form = React.createClass({ let formData = this.getFormData(); // sentry shouldn't post the user's password - if(formData.password) { + if (formData.password) { delete formData.password; } console.logGlobal(err, formData); - if(this.props.isInline) { + if (this.props.isInline) { let notification = new GlobalNotificationModel(getLangText('Something went wrong, please try again later'), 'danger'); GlobalNotificationActions.appendGlobalNotification(notification); } else { this.setState({errors: [getLangText('Something went wrong, please try again later')]}); } - } + this.setState({submitted: false}); }, diff --git a/js/components/ascribe_forms/form_register_piece.js b/js/components/ascribe_forms/form_register_piece.js index 83d38b50..596f8a56 100644 --- a/js/components/ascribe_forms/form_register_piece.js +++ b/js/components/ascribe_forms/form_register_piece.js @@ -109,6 +109,11 @@ let RegisterPieceForm = React.createClass({ ); }, + handleThumbnailValidationFailed(thumbnailFile) { + // If the validation fails, set the thumbnail as submittable since its optional + this.refs.submitButton.setReadyStateForKey('thumbnailKeyReady', true); + }, + isThumbnailDialogExpanded() { const { enableSeparateThumbnail } = this.props; const { digitalWorkFile } = this.state; @@ -194,14 +199,15 @@ let RegisterPieceForm = React.createClass({ url: ApiUrls.blob_thumbnails }} handleChangedFile={this.handleChangedThumbnail} + onValidationFailed={this.handleThumbnailValidationFailed} isReadyForFormSubmission={formSubmissionValidation.fileOptional} keyRoutine={{ url: AppConstants.serverUrl + 's3/key/', fileClass: 'thumbnail' }} validation={{ - itemLimit: AppConstants.fineUploader.validation.registerWork.itemLimit, - sizeLimit: AppConstants.fineUploader.validation.additionalData.sizeLimit, + itemLimit: AppConstants.fineUploader.validation.workThumbnail.itemLimit, + sizeLimit: AppConstants.fineUploader.validation.workThumbnail.sizeLimit, allowedExtensions: ['png', 'jpg', 'jpeg', 'gif'] }} setIsUploadReady={this.setIsUploadReady('thumbnailKeyReady')} diff --git a/js/components/ascribe_forms/form_send_contract_agreement.js b/js/components/ascribe_forms/form_send_contract_agreement.js index 6f5f74d7..043c0361 100644 --- a/js/components/ascribe_forms/form_send_contract_agreement.js +++ b/js/components/ascribe_forms/form_send_contract_agreement.js @@ -58,7 +58,7 @@ let SendContractAgreementForm = React.createClass({ notification = new GlobalNotificationModel(notification, 'success', 10000); GlobalNotificationActions.appendGlobalNotification(notification); - this.history.pushState(null, '/collection'); + this.history.push('/collection'); }, getFormData() { diff --git a/js/components/ascribe_forms/input_fineuploader.js b/js/components/ascribe_forms/input_fineuploader.js index db5bae05..fa9c72b6 100644 --- a/js/components/ascribe_forms/input_fineuploader.js +++ b/js/components/ascribe_forms/input_fineuploader.js @@ -52,6 +52,7 @@ const InputFineUploader = React.createClass({ plural: string }), handleChangedFile: func, + onValidationFailed: func, // Provided by `Property` onChange: React.PropTypes.func @@ -107,6 +108,7 @@ const InputFineUploader = React.createClass({ isFineUploaderActive, isReadyForFormSubmission, keyRoutine, + onValidationFailed, setIsUploadReady, uploadMethod, validation, @@ -127,6 +129,7 @@ const InputFineUploader = React.createClass({ createBlobRoutine={createBlobRoutine} validation={validation} submitFile={this.submitFile} + onValidationFailed={onValidationFailed} setIsUploadReady={setIsUploadReady} isReadyForFormSubmission={isReadyForFormSubmission} areAssetsDownloadable={areAssetsDownloadable} diff --git a/js/components/ascribe_modal/modal_wrapper.js b/js/components/ascribe_modal/modal_wrapper.js index 3f3b4af4..fd77e5ae 100644 --- a/js/components/ascribe_modal/modal_wrapper.js +++ b/js/components/ascribe_modal/modal_wrapper.js @@ -46,7 +46,13 @@ let ModalWrapper = React.createClass({ renderChildren() { return ReactAddons.Children.map(this.props.children, (child) => { return ReactAddons.addons.cloneWithProps(child, { - handleSuccess: this.handleSuccess + handleSuccess: (response) => { + if (typeof child.props.handleSuccess === 'function') { + child.props.handleSuccess(response); + } + + this.handleSuccess(response); + } }); }); }, diff --git a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar.js b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar.js index 60370431..bcc15603 100644 --- a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar.js +++ b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar.js @@ -39,30 +39,6 @@ let PieceListToolbar = React.createClass({ ]) }, - getFilterWidget(){ - if (this.props.filterParams){ - return ( - - ); - } - return null; - }, - - getOrderWidget(){ - if (this.props.orderParams){ - return ( - - ); - } - return null; - }, - render() { const { className, children, searchFor, searchQuery } = this.props; @@ -75,8 +51,14 @@ let PieceListToolbar = React.createClass({ {children} - {this.getOrderWidget()} - {this.getFilterWidget()} + + 0) { + if (trueValuesOnly.length) { return { visibility: 'visible'}; } else { return { visibility: 'hidden' }; @@ -81,60 +81,64 @@ let PieceListToolbarFilterWidget = React.createClass({ ); - return ( - - {/* We iterate over filterParams, to receive the label and then for each - label also iterate over its items, to get all filterable options */} - {this.props.filterParams.map(({ label, items }, i) => { - return ( -
-
  • - {label}: -
    • - {items.map((param, j) => { + if (this.props.filterParams && this.props.filterParams.length) { + return ( + + {/* We iterate over filterParams, to receive the label and then for each + label also iterate over its items, to get all filterable options */} + {this.props.filterParams.map(({ label, items }, i) => { + return ( +
    +
  • + {label}: +
    • + {items.map((param, j) => { - // As can be seen in the PropTypes, a param can either - // be a string or an object of the shape: - // - // { - // key: , - // label: - // } - // - // This is why we need to distinguish between both here. - if(typeof param !== 'string') { - label = param.label; - param = param.key; - } else { - param = param; - label = param.split('acl_')[1].replace(/_/g, ' '); - } + // As can be seen in the PropTypes, a param can either + // be a string or an object of the shape: + // + // { + // key: , + // label: + // } + // + // This is why we need to distinguish between both here. + if (typeof param !== 'string') { + label = param.label; + param = param.key; + } else { + param = param; + label = param.split('acl_')[1].replace(/_/g, ' '); + } - return ( -
  • -
    - - {getLangText(label)} - - -
    -
    • - ); - })} -
    - ); - })} -     - ); + return ( +
  • +
    + + {getLangText(label)} + + +
    +
    • + ); + })} +
    + ); + })} +     + ); + } else { + return null; + } } }); diff --git a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_order_widget.js b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_order_widget.js index cfd1e108..1a4aaefc 100644 --- a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_order_widget.js +++ b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_order_widget.js @@ -37,7 +37,7 @@ let PieceListToolbarOrderWidget = React.createClass({ isOrderActive() { // We're hiding the star in that complicated matter so that, // the surrounding button is not resized up on appearance - if(this.props.orderBy.length > 0) { + if (this.props.orderBy && this.props.orderBy.length) { return { visibility: 'visible'}; } else { return { visibility: 'hidden' }; @@ -51,36 +51,40 @@ let PieceListToolbarOrderWidget = React.createClass({ · ); - return ( - -
  • - {getLangText('Sort by')}: -
    • - {this.props.orderParams.map((param) => { - return ( -
    -
  • -
    - - {getLangText(param.replace('_', ' '))} - - -1} /> -
    -
    • -
    - ); - })} -     - ); + if (this.props.orderParams && this.props.orderParams.length) { + return ( + +
  • + {getLangText('Sort by')}: +
    • + {this.props.orderParams.map((param) => { + return ( +
    +
  • +
    + + {getLangText(param.replace('_', ' '))} + + -1} /> +
    +
    • +
    + ); + })} +     + ); + } else { + return null; + } } }); diff --git a/js/components/ascribe_routes/proxy_handler.js b/js/components/ascribe_routes/proxy_handler.js index 228f0f62..7752912a 100644 --- a/js/components/ascribe_routes/proxy_handler.js +++ b/js/components/ascribe_routes/proxy_handler.js @@ -40,7 +40,7 @@ export function AuthRedirect({to, when}) { // and redirect if `true`. if(exprToValidate) { - window.setTimeout(() => history.replaceState(null, to, query)); + window.setTimeout(() => history.replace({ query, pathname: to })); return true; // Otherwise there can also be the case that the backend @@ -48,7 +48,7 @@ export function AuthRedirect({to, when}) { } else if(!exprToValidate && when === 'loggedIn' && redirect) { delete query.redirect; - window.setTimeout(() => history.replaceState(null, '/' + redirect, query)); + window.setTimeout(() => history.replace({ query, pathname: '/' + redirect })); return true; } else if(!exprToValidate && when === 'loggedOut' && redirectAuthenticated) { diff --git a/js/components/ascribe_slides_container/slides_container.js b/js/components/ascribe_slides_container/slides_container.js index 39d515a3..109bbae7 100644 --- a/js/components/ascribe_slides_container/slides_container.js +++ b/js/components/ascribe_slides_container/slides_container.js @@ -57,21 +57,21 @@ const SlidesContainer = React.createClass({ // When the start_from parameter is used, this.setSlideNum can not simply be used anymore. nextSlide(additionalQueryParams) { const slideNum = parseInt(this.props.location.query.slide_num, 10) || 0; - let nextSlide = slideNum + 1; - this.setSlideNum(nextSlide, additionalQueryParams); + this.setSlideNum(slideNum + 1, additionalQueryParams); }, setSlideNum(nextSlideNum, additionalQueryParams = {}) { - let queryParams = Object.assign(this.props.location.query, additionalQueryParams); - queryParams.slide_num = nextSlideNum; - this.history.pushState(null, this.props.location.pathname, queryParams); + const { location: { pathname } } = this.props; + const query = Object.assign({}, this.props.location.query, additionalQueryParams, { slide_num: nextSlideNum }); + + this.history.push({ pathname, query }); }, // breadcrumbs are defined as attributes of the slides. // To extract them we have to read the DOM element's attributes extractBreadcrumbs() { const startFrom = parseInt(this.props.location.query.start_from, 10) || -1; - let breadcrumbs = []; + const breadcrumbs = []; React.Children.map(this.props.children, (child, i) => { if(child && i >= startFrom && child.props['data-slide-title']) { @@ -179,4 +179,4 @@ const SlidesContainer = React.createClass({ } }); -export default SlidesContainer; \ No newline at end of file +export default SlidesContainer; diff --git a/js/components/ascribe_uploader/ascribe_file_drag_and_drop/file_drag_and_drop_dialog.js b/js/components/ascribe_uploader/ascribe_file_drag_and_drop/file_drag_and_drop_dialog.js index 25552819..db28846b 100644 --- a/js/components/ascribe_uploader/ascribe_file_drag_and_drop/file_drag_and_drop_dialog.js +++ b/js/components/ascribe_uploader/ascribe_file_drag_and_drop/file_drag_and_drop_dialog.js @@ -26,7 +26,7 @@ let FileDragAndDropDialog = React.createClass({ getDragDialog(fileClass) { if (dragAndDropAvailable) { return [ -

    {getLangText('Drag %s here', fileClass)}

    , +

    {getLangText('Drag %s here', fileClass)}

    ,

    {getLangText('or')}

    ]; } else { @@ -46,6 +46,8 @@ let FileDragAndDropDialog = React.createClass({ if (hasFiles) { return null; } else { + let dialogElement; + if (enableLocalHashing && !uploadMethod) { const currentQueryParams = getCurrentQueryParams(); @@ -55,9 +57,9 @@ let FileDragAndDropDialog = React.createClass({ const queryParamsUpload = Object.assign({}, currentQueryParams); queryParamsUpload.method = 'upload'; - return ( -
    -

    {getLangText('Would you rather')}

    + dialogElement = ( +
    +

    {getLangText('Would you rather')}

    {/* The frontend in live is hosted under /app, Since `Link` is appending that base url, if its defined @@ -85,32 +87,40 @@ let FileDragAndDropDialog = React.createClass({ ); } else { if (multipleFiles) { - return ( - - {this.getDragDialog(fileClassToUpload.plural)} - - {getLangText('choose %s to upload', fileClassToUpload.plural)} - + dialogElement = [ + this.getDragDialog(fileClassToUpload.plural), + + {getLangText('choose %s to upload', fileClassToUpload.plural)} - ); + ]; } else { const dialog = uploadMethod === 'hash' ? getLangText('choose a %s to hash', fileClassToUpload.singular) : getLangText('choose a %s to upload', fileClassToUpload.singular); - return ( - - {this.getDragDialog(fileClassToUpload.singular)} - - {dialog} - + dialogElement = [ + this.getDragDialog(fileClassToUpload.singular), + + {dialog} - ); + ]; } } + + return ( +
    +
    + {dialogElement} +
    + {/* Hide the uploader and just show that there's been on files uploaded yet when printing */} +

    + {getLangText('No files uploaded')} +

    +
    + ); } } }); diff --git a/js/components/ascribe_uploader/ascribe_file_drag_and_drop/file_drag_and_drop_preview_image.js b/js/components/ascribe_uploader/ascribe_file_drag_and_drop/file_drag_and_drop_preview_image.js index 927a5b22..5c757121 100644 --- a/js/components/ascribe_uploader/ascribe_file_drag_and_drop/file_drag_and_drop_preview_image.js +++ b/js/components/ascribe_uploader/ascribe_file_drag_and_drop/file_drag_and_drop_preview_image.js @@ -49,7 +49,7 @@ const FileDragAndDropPreviewImage = React.createClass({ }; let actionSymbol; - + // only if assets are actually downloadable, there should be a download icon if the process is already at // 100%. If not, no actionSymbol should be displayed if(progress === 100 && areAssetsDownloadable) { @@ -68,7 +68,7 @@ const FileDragAndDropPreviewImage = React.createClass({ return (
    diff --git a/js/components/ascribe_uploader/react_s3_fine_uploader.js b/js/components/ascribe_uploader/react_s3_fine_uploader.js index eb211504..877146a5 100644 --- a/js/components/ascribe_uploader/react_s3_fine_uploader.js +++ b/js/components/ascribe_uploader/react_s3_fine_uploader.js @@ -50,6 +50,7 @@ const ReactS3FineUploader = React.createClass({ }), handleChangedFile: func, // is for when a file is dropped or selected submitFile: func, // is for when a file has been successfully uploaded, TODO: rename to handleSubmitFile + onValidationFailed: func, autoUpload: bool, debug: bool, objectProperties: shape({ @@ -523,13 +524,16 @@ const ReactS3FineUploader = React.createClass({ }, isFileValid(file) { - if(file.size > this.props.validation.sizeLimit) { + if (file.size > this.props.validation.sizeLimit) { + const fileSizeInMegaBytes = this.props.validation.sizeLimit / 1000000; - let fileSizeInMegaBytes = this.props.validation.sizeLimit / 1000000; - - let notification = new GlobalNotificationModel(getLangText('A file you submitted is bigger than ' + fileSizeInMegaBytes + 'MB.'), 'danger', 5000); + const notification = new GlobalNotificationModel(getLangText('A file you submitted is bigger than ' + fileSizeInMegaBytes + 'MB.'), 'danger', 5000); GlobalNotificationActions.appendGlobalNotification(notification); + if (typeof this.props.onValidationFailed === 'function') { + this.props.onValidationFailed(file); + } + return false; } else { return true; diff --git a/js/components/footer.js b/js/components/footer.js index 31145d4b..f2e35dfc 100644 --- a/js/components/footer.js +++ b/js/components/footer.js @@ -7,7 +7,7 @@ import { getLangText } from '../utils/lang_utils'; let Footer = React.createClass({ render() { return ( -
    +


    api | diff --git a/js/components/header.js b/js/components/header.js index 797684ec..c16cba86 100644 --- a/js/components/header.js +++ b/js/components/header.js @@ -219,10 +219,11 @@ let Header = React.createClass({ return (

    + className="hidden-print">
    ); } diff --git a/js/components/password_reset_container.js b/js/components/password_reset_container.js index 31275a08..6d2d089e 100644 --- a/js/components/password_reset_container.js +++ b/js/components/password_reset_container.js @@ -130,8 +130,9 @@ let PasswordResetForm = React.createClass({ }, handleSuccess() { - this.history.pushState(null, '/collection'); - let notification = new GlobalNotificationModel(getLangText('password successfully updated'), 'success', 10000); + this.history.push('/collection'); + + const notification = new GlobalNotificationModel(getLangText('password successfully updated'), 'success', 10000); GlobalNotificationActions.appendGlobalNotification(notification); }, diff --git a/js/components/piece_list.js b/js/components/piece_list.js index de979e65..68ba5c33 100644 --- a/js/components/piece_list.js +++ b/js/components/piece_list.js @@ -115,13 +115,13 @@ let PieceList = React.createClass({ }, componentDidUpdate() { - const { redirectTo, shouldRedirect } = this.props; + const { location: { query }, redirectTo, shouldRedirect } = this.props; const { unfilteredPieceListCount } = this.state; if (redirectTo && unfilteredPieceListCount === 0 && (typeof shouldRedirect === 'function' && shouldRedirect(unfilteredPieceListCount))) { // FIXME: hack to redirect out of the dispatch cycle - window.setTimeout(() => this.history.pushState(null, this.props.redirectTo, this.props.location.query), 0); + window.setTimeout(() => this.history.push({ query, pathname: redirectTo }), 0); } }, @@ -174,15 +174,16 @@ let PieceList = React.createClass({ } }, - searchFor(searchTerm) { - this.loadPieceList({ - page: 1, - search: searchTerm - }); - this.history.pushState(null, this.props.location.pathname, {page: 1}); + searchFor(search) { + const { location: { pathname } } = this.props; + + this.loadPieceList({ search, page: 1 }); + this.history.push({ pathname, query: { page: 1 } }); }, - applyFilterBy(filterBy){ + applyFilterBy(filterBy) { + const { location: { pathname } } = this.props; + this.setState({ isFilterDirty: true }); @@ -207,7 +208,7 @@ let PieceList = React.createClass({ // we have to redirect the user always to page one as it could be that there is no page two // for filtered pieces - this.history.pushState(null, this.props.location.pathname, {page: 1}); + this.history.push({ pathname, query: { page: 1 } }); }, applyOrderBy(orderBy) { diff --git a/js/components/register_piece.js b/js/components/register_piece.js index 8211e91e..b69ed7c2 100644 --- a/js/components/register_piece.js +++ b/js/components/register_piece.js @@ -66,7 +66,7 @@ let RegisterPiece = React.createClass( { }, handleSuccess(response){ - let notification = new GlobalNotificationModel(response.notification, 'success', 10000); + const notification = new GlobalNotificationModel(response.notification, 'success', 10000); GlobalNotificationActions.appendGlobalNotification(notification); // once the user was able to register a piece successfully, we need to make sure to keep @@ -80,7 +80,7 @@ let RegisterPiece = React.createClass( { this.state.filterBy ); - this.history.pushState(null, `/pieces/${response.piece.id}`); + this.history.push(`/pieces/${response.piece.id}`); }, getSpecifyEditions() { diff --git a/js/components/whitelabel/prize/portfolioreview/components/pr_forms/pr_register_piece_form.js b/js/components/whitelabel/prize/portfolioreview/components/pr_forms/pr_register_piece_form.js index a8d946b5..271901bb 100644 --- a/js/components/whitelabel/prize/portfolioreview/components/pr_forms/pr_register_piece_form.js +++ b/js/components/whitelabel/prize/portfolioreview/components/pr_forms/pr_register_piece_form.js @@ -19,8 +19,10 @@ import ApiUrls from '../../../../../../constants/api_urls'; import requests from '../../../../../../utils/requests'; -import { getLangText } from '../../../../../../utils/lang_utils'; +import { getErrorNotificationMessage } from '../../../../../../utils/error_utils'; import { setCookie } from '../../../../../../utils/fetch_api_utils'; +import { validateForms } from '../../../../../../utils/form_utils'; +import { getLangText } from '../../../../../../utils/lang_utils'; import { formSubmissionValidation } from '../../../../../ascribe_uploader/react_s3_fine_uploader_utils'; @@ -35,7 +37,7 @@ const PRRegisterPieceForm = React.createClass({ mixins: [History], - getInitialState(){ + getInitialState() { return { digitalWorkKeyReady: true, thumbnailKeyReady: true, @@ -54,16 +56,16 @@ const PRRegisterPieceForm = React.createClass({ * second adding all the additional details */ submit() { - if(!this.validateForms()) { + if (!this.validateForms()) { return; - } else { - // disable the submission button right after the user - // clicks on it to avoid double submission - this.setState({ - submitted: true - }); } + // disable the submission button right after the user + // clicks on it to avoid double submission + this.setState({ + submitted: true + }); + const { currentUser } = this.props; const { registerPieceForm, additionalDataForm, @@ -104,12 +106,20 @@ const PRRegisterPieceForm = React.createClass({ GlobalNotificationActions.appendGlobalNotification(notificationMessage); }); }) - .then(() => this.history.pushState(null, `/pieces/${this.state.piece.id}`)) + .then(() => this.history.push(`/pieces/${this.state.piece.id}`)) .catch((err) => { - const notificationMessage = new GlobalNotificationModel(getLangText("Oops! We weren't able to send your submission. Contact: support@ascribe.io"), 'danger', 5000); + const errMessage = (getErrorNotificationMessage(err) || getLangText("Oops! We weren't able to send your submission.")) + + getLangText(' Please contact support@ascribe.io'); + + const notificationMessage = new GlobalNotificationModel(errMessage, 'danger', 10000); GlobalNotificationActions.appendGlobalNotification(notificationMessage); console.logGlobal(new Error('Portfolio Review piece registration failed'), err); + + // Reset the submit button + this.setState({ + submitted: false + }); }); }, @@ -118,11 +128,7 @@ const PRRegisterPieceForm = React.createClass({ additionalDataForm, uploadersForm } = this.refs; - const registerPieceFormValidation = registerPieceForm.validate(); - const additionalDataFormValidation = additionalDataForm.validate(); - const uploaderFormValidation = uploadersForm.validate(); - - return registerPieceFormValidation && additionalDataFormValidation && uploaderFormValidation; + return validateForms([registerPieceForm, additionalDataForm, uploadersForm], true); }, getCreateBlobRoutine() { @@ -139,7 +145,7 @@ const PRRegisterPieceForm = React.createClass({ }, /** - * This method is overloaded so that we can track the ready-state + * These two methods are overloaded so that we can track the ready-state * of each uploader in the component * @param {string} uploaderKey Name of the uploader's key to track */ @@ -151,6 +157,14 @@ const PRRegisterPieceForm = React.createClass({ }; }, + handleOptionalFileValidationFailed(uploaderKey) { + return () => { + this.setState({ + [uploaderKey]: true + }); + }; + }, + getSubmitButton() { const { digitalWorkKeyReady, thumbnailKeyReady, @@ -303,7 +317,7 @@ const PRRegisterPieceForm = React.createClass({ + label={getLangText('Featured Cover photo (max 5MB)')}> this.history.replaceState(null, `/${location.query.redirect}`, queryCopy)); + if (location && location.query && location.query.redirect) { + window.setTimeout(() => this.history.replace({ + pathname: `/${location.query.redirect}`, + query: omitFromObject(location.query, ['redirect']) + })); } }, @@ -125,4 +128,4 @@ const PRLanding = React.createClass({ } }); -export default PRLanding; \ No newline at end of file +export default PRLanding; diff --git a/js/components/whitelabel/prize/portfolioreview/components/pr_register_piece.js b/js/components/whitelabel/prize/portfolioreview/components/pr_register_piece.js index 0fbca419..99c9a401 100644 --- a/js/components/whitelabel/prize/portfolioreview/components/pr_register_piece.js +++ b/js/components/whitelabel/prize/portfolioreview/components/pr_register_piece.js @@ -39,7 +39,7 @@ const PRRegisterPiece = React.createClass({ if(currentUser && currentUser.email) { const submittedPieceId = getCookie(currentUser.email); if(submittedPieceId) { - this.history.pushState(null, `/pieces/${submittedPieceId}`); + this.history.push(`/pieces/${submittedPieceId}`); } } }, @@ -62,7 +62,7 @@ const PRRegisterPiece = React.createClass({

    Portfolio Review

    -

    {getLangText('Submission closing on %s', ' 22 Dec 2015')}

    +

    {getLangText('Submission closing on %s', ' 27 Dec 2015')}

    For more information, visit:  portfolio-review.de @@ -84,4 +84,4 @@ const PRRegisterPiece = React.createClass({ } }); -export default PRRegisterPiece; \ No newline at end of file +export default PRRegisterPiece; diff --git a/js/components/whitelabel/prize/portfolioreview/components/pr_routes/pr_proxy_handler.js b/js/components/whitelabel/prize/portfolioreview/components/pr_routes/pr_proxy_handler.js index 04ff8ce6..f81c4539 100644 --- a/js/components/whitelabel/prize/portfolioreview/components/pr_routes/pr_proxy_handler.js +++ b/js/components/whitelabel/prize/portfolioreview/components/pr_routes/pr_proxy_handler.js @@ -17,7 +17,7 @@ export function AuthPrizeRoleRedirect({ to, when }) { .reduce((a, b) => a || b); if (exprToValidate) { - window.setTimeout(() => history.replaceState(null, to, query)); + window.setTimeout(() => history.replace({ query, pathname: to })); return true; } else { return false; diff --git a/js/components/whitelabel/prize/prize_routes.js b/js/components/whitelabel/prize/prize_routes.js index 7a72e5d9..5f80b30c 100644 --- a/js/components/whitelabel/prize/prize_routes.js +++ b/js/components/whitelabel/prize/prize_routes.js @@ -12,6 +12,8 @@ import SPPieceContainer from './simple_prize/components/ascribe_detail/prize_pie import SPSettingsContainer from './simple_prize/components/prize_settings_container'; import SPApp from './simple_prize/prize_app'; +import SluicePieceContainer from './sluice/components/sluice_detail/sluice_piece_container'; + import PRApp from './portfolioreview/pr_app'; import PRLanding from './portfolioreview/components/pr_landing'; import PRRegisterPiece from './portfolioreview/components/pr_register_piece'; @@ -53,7 +55,7 @@ const ROUTES = { path='collection' component={ProxyHandler(AuthRedirect({to: '/login', when: 'loggedOut'}))(SPPieceList)} headerTitle='COLLECTION'/> - + diff --git a/js/components/whitelabel/prize/simple_prize/actions/prize_rating_actions.js b/js/components/whitelabel/prize/simple_prize/actions/prize_rating_actions.js index 68b5334b..91852704 100644 --- a/js/components/whitelabel/prize/simple_prize/actions/prize_rating_actions.js +++ b/js/components/whitelabel/prize/simple_prize/actions/prize_rating_actions.js @@ -10,14 +10,15 @@ class PrizeRatingActions { this.generateActions( 'updatePrizeRatings', 'updatePrizeRatingAverage', - 'updatePrizeRating' + 'updatePrizeRating', + 'resetPrizeRatings' ); } - fetchAverage(pieceId) { + fetchAverage(pieceId, round) { return Q.Promise((resolve, reject) => { PrizeRatingFetcher - .fetchAverage(pieceId) + .fetchAverage(pieceId, round) .then((res) => { this.actions.updatePrizeRatingAverage(res.data); resolve(res); @@ -29,10 +30,10 @@ class PrizeRatingActions { }); } - fetchOne(pieceId) { + fetchOne(pieceId, round) { return Q.Promise((resolve, reject) => { PrizeRatingFetcher - .fetchOne(pieceId) + .fetchOne(pieceId, round) .then((res) => { this.actions.updatePrizeRating(res.rating.rating); resolve(res); @@ -43,10 +44,10 @@ class PrizeRatingActions { }); } - createRating(pieceId, rating) { + createRating(pieceId, rating, round) { return Q.Promise((resolve, reject) => { PrizeRatingFetcher - .rate(pieceId, rating) + .rate(pieceId, rating, round) .then((res) => { this.actions.updatePrizeRating(res.rating.rating); resolve(res); @@ -70,10 +71,6 @@ class PrizeRatingActions { }); }); } - - updateRating(rating) { - this.actions.updatePrizeRating(rating); - } } -export default alt.createActions(PrizeRatingActions); \ No newline at end of file +export default alt.createActions(PrizeRatingActions); diff --git a/js/components/whitelabel/prize/simple_prize/components/ascribe_accordion_list/accordion_list_item_prize.js b/js/components/whitelabel/prize/simple_prize/components/ascribe_accordion_list/accordion_list_item_prize.js index 965b9012..3fc3f5fd 100644 --- a/js/components/whitelabel/prize/simple_prize/components/ascribe_accordion_list/accordion_list_item_prize.js +++ b/js/components/whitelabel/prize/simple_prize/components/ascribe_accordion_list/accordion_list_item_prize.js @@ -171,23 +171,25 @@ let AccordionListItemPrize = React.createClass({ }, render() { + const { children, className, content } = this.props; + const { currentUser } = this.state; + // 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.props.content.selected )) ? -

    } buttons={this.getPrizeButtons()} badge={this.getPrizeBadge()}> - {this.props.children} + {children}
    ); diff --git a/js/components/whitelabel/prize/simple_prize/components/ascribe_detail/prize_piece_container.js b/js/components/whitelabel/prize/simple_prize/components/ascribe_detail/prize_piece_container.js index 16849ed1..c5ab2c81 100644 --- a/js/components/whitelabel/prize/simple_prize/components/ascribe_detail/prize_piece_container.js +++ b/js/components/whitelabel/prize/simple_prize/components/ascribe_detail/prize_piece_container.js @@ -9,15 +9,16 @@ import StarRating from 'react-star-rating'; import ReactError from '../../../../../../mixins/react_error'; import { ResourceNotFoundError } from '../../../../../../models/errors'; -import PieceActions from '../../../../../../actions/piece_actions'; -import PieceStore from '../../../../../../stores/piece_store'; - -import PieceListStore from '../../../../../../stores/piece_list_store'; -import PieceListActions from '../../../../../../actions/piece_list_actions'; - +import PrizeActions from '../../actions/prize_actions'; +import PrizeStore from '../../stores/prize_store'; import PrizeRatingActions from '../../actions/prize_rating_actions'; import PrizeRatingStore from '../../stores/prize_rating_store'; +import PieceActions from '../../../../../../actions/piece_actions'; +import PieceStore from '../../../../../../stores/piece_store'; +import PieceListStore from '../../../../../../stores/piece_list_store'; +import PieceListActions from '../../../../../../actions/piece_list_actions'; + import UserStore from '../../../../../../stores/user_store'; import UserActions from '../../../../../../actions/user_actions'; @@ -34,9 +35,7 @@ import CollapsibleParagraph from '../../../../../../components/ascribe_collapsib import FurtherDetailsFileuploader from '../../../../../ascribe_detail/further_details_fileuploader'; import InputCheckbox from '../../../../../ascribe_forms/input_checkbox'; -import LoanForm from '../../../../../ascribe_forms/form_loan'; import ListRequestActions from '../../../../../ascribe_forms/list_form_request_actions'; -import ModalWrapper from '../../../../../ascribe_modal/modal_wrapper'; import GlobalNotificationModel from '../../../../../../models/global_notification_model'; import GlobalNotificationActions from '../../../../../../actions/global_notification_actions'; @@ -52,39 +51,41 @@ import { setDocumentTitle } from '../../../../../../utils/dom_utils'; /** * This is the component that implements resource/data specific functionality */ -let PieceContainer = React.createClass({ +let PrizePieceContainer = React.createClass({ propTypes: { - params: React.PropTypes.object + params: React.PropTypes.object, + selectedPrizeActionButton: React.PropTypes.func }, mixins: [ReactError], getInitialState() { - return mergeOptions( - PieceStore.getState(), - UserStore.getState() - ); + //FIXME: this component uses the PieceStore, but we avoid using the getState() here since it may contain stale data + // It should instead use something like getInitialState() where that call also resets the state. + return UserStore.getState(); + }, + + componentWillMount() { + // Every time we enter the piece detail page, just reset the piece + // store as it will otherwise display wrong/old data once the user loads + // the piece detail a second time + PieceActions.updatePiece({}); }, componentDidMount() { PieceStore.listen(this.onChange); UserStore.listen(this.onChange); - // Every time we enter the piece detail page, just reset the piece - // store as it will otherwise display wrong/old data once the user loads - // the piece detail a second time - PieceActions.updatePiece({}); - - PieceActions.fetchOne(this.props.params.pieceId); UserActions.fetchCurrentUser(); + this.loadPiece(); }, // This is done to update the container when the user clicks on the prev or next // button to update the URL parameter (and therefore to switch pieces) componentWillReceiveProps(nextProps) { - if(this.props.params.pieceId !== nextProps.params.pieceId) { + if (this.props.params.pieceId !== nextProps.params.pieceId) { PieceActions.updatePiece({}); - PieceActions.fetchOne(nextProps.params.pieceId); + this.loadPiece(nextProps.params.pieceId); } }, @@ -101,26 +102,32 @@ let PieceContainer = React.createClass({ UserStore.unlisten(this.onChange); }, - onChange(state) { this.setState(state); }, 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 ( ); + notifications={piece.notifications}/>); } }, + loadPiece(pieceId = this.props.params.pieceId) { + PieceActions.fetchOne(pieceId); + }, + render() { - if(this.state.piece && this.state.piece.id) { + const { selectedPrizeActionButton } = this.props; + const { currentUser, piece } = this.state; + + if (piece && piece.id) { /* This really needs a refactor! @@ -129,37 +136,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 = - - {this.props.piece.selected ? this.getLoanButton() : null} - + {this.getSelectedActionButton()}
    @@ -373,13 +358,19 @@ let PrizePieceRatings = React.createClass({
    {this.state.ratings.map((item, i) => { - let note = item.note ? + let note = item.note ? (
    note: {item.note} -
    : null; +
    + ) : null; + return ( -
    -
    +
    +
    ); - } - else if (this.props.currentUser && this.props.currentUser.is_jury) { + } else if (this.props.currentUser && this.props.currentUser.is_jury) { // Jury can set rating and note return ( ); + } else { + return null; } - return null; } }); @@ -457,6 +448,7 @@ let PrizePieceDetails = React.createClass({ return ( this.history.replaceState(null, '/collection'), 0); + window.setTimeout(() => this.history.replace('/collection'), 0); } }, diff --git a/js/components/whitelabel/prize/simple_prize/components/prize_piece_list.js b/js/components/whitelabel/prize/simple_prize/components/prize_piece_list.js index 972b3fac..23cdbb23 100644 --- a/js/components/whitelabel/prize/simple_prize/components/prize_piece_list.js +++ b/js/components/whitelabel/prize/simple_prize/components/prize_piece_list.js @@ -48,9 +48,8 @@ let PrizePieceList = React.createClass({ }, getButtonSubmit() { - const { currentUser } = this.state; - if (this.state.prize && this.state.prize.active && - !currentUser.is_jury && !currentUser.is_admin && !currentUser.is_judge){ + const { currentUser, prize } = this.state; + if (prize && prize.active && !currentUser.is_jury && !currentUser.is_admin && !currentUser.is_judge) { return ( + } + handleSuccess={this.handleSuccess} + title={getLangText('REQUEST LOAN')}> + + + ); + } +}); + +export default SluiceSelectedPrizeActionButton; + diff --git a/js/components/whitelabel/prize/sluice/components/sluice_detail/sluice_piece_container.js b/js/components/whitelabel/prize/sluice/components/sluice_detail/sluice_piece_container.js new file mode 100644 index 00000000..2d9debca --- /dev/null +++ b/js/components/whitelabel/prize/sluice/components/sluice_detail/sluice_piece_container.js @@ -0,0 +1,23 @@ +'use strict'; + +import React from 'react'; + +import SluiceSelectedPrizeActionButton from '../sluice_buttons/sluice_selected_prize_action_button'; + +import PrizePieceContainer from '../../../simple_prize/components/ascribe_detail/prize_piece_container'; + +const SluicePieceContainer = React.createClass({ + propTypes: { + params: React.PropTypes.object + }, + + render() { + return ( + + ); + } +}); + +export default SluicePieceContainer; diff --git a/js/components/whitelabel/wallet/components/ascribe_detail/wallet_piece_container.js b/js/components/whitelabel/wallet/components/ascribe_detail/wallet_piece_container.js index 26a186ca..4be15b04 100644 --- a/js/components/whitelabel/wallet/components/ascribe_detail/wallet_piece_container.js +++ b/js/components/whitelabel/wallet/components/ascribe_detail/wallet_piece_container.js @@ -25,12 +25,16 @@ let WalletPieceContainer = React.createClass({ currentUser: React.PropTypes.object.isRequired, loadPiece: React.PropTypes.func.isRequired, handleDeleteSuccess: React.PropTypes.func.isRequired, - submitButtonType: React.PropTypes.func.isRequired + submitButtonType: React.PropTypes.func.isRequired, + children: React.PropTypes.oneOfType([ + React.PropTypes.object, + React.PropTypes.array + ]) }, - + render() { - if(this.props.piece && this.props.piece.id) { + if (this.props.piece && this.props.piece.id) { return ( } subheader={ -
    - - -
    -
    - }> +
    + + +
    +
    + }> - {this.props.children}     ); - } - else { + } else { return (
    diff --git a/js/components/whitelabel/wallet/components/cyland/cyland_detail/cyland_piece_container.js b/js/components/whitelabel/wallet/components/cyland/cyland_detail/cyland_piece_container.js index d211d3e8..4a857e92 100644 --- a/js/components/whitelabel/wallet/components/cyland/cyland_detail/cyland_piece_container.js +++ b/js/components/whitelabel/wallet/components/cyland/cyland_detail/cyland_piece_container.js @@ -85,7 +85,7 @@ let CylandPieceContainer = React.createClass({ let notification = new GlobalNotificationModel(response.notification, 'success'); GlobalNotificationActions.appendGlobalNotification(notification); - this.history.pushState(null, '/collection'); + this.history.push('/collection'); }, render() { diff --git a/js/components/whitelabel/wallet/components/cyland/cyland_landing.js b/js/components/whitelabel/wallet/components/cyland/cyland_landing.js index 21f8835a..0a8dadd1 100644 --- a/js/components/whitelabel/wallet/components/cyland/cyland_landing.js +++ b/js/components/whitelabel/wallet/components/cyland/cyland_landing.js @@ -49,7 +49,7 @@ let CylandLanding = React.createClass({ // if user is already logged in, redirect him to piece list if(this.state.currentUser && this.state.currentUser.email) { // FIXME: hack to redirect out of the dispatch cycle - window.setTimeout(() => this.history.replaceState(null, '/collection'), 0); + window.setTimeout(() => this.history.replace('/collection'), 0); } }, diff --git a/js/components/whitelabel/wallet/components/cyland/cyland_register_piece.js b/js/components/whitelabel/wallet/components/cyland/cyland_register_piece.js index fabed011..3f5f0116 100644 --- a/js/components/whitelabel/wallet/components/cyland/cyland_register_piece.js +++ b/js/components/whitelabel/wallet/components/cyland/cyland_register_piece.js @@ -129,7 +129,7 @@ let CylandRegisterPiece = React.createClass({ PieceActions.fetchOne(this.state.piece.id); - this.history.pushState(null, `/pieces/${this.state.piece.id}`); + this.history.push(`/pieces/${this.state.piece.id}`); }, // We need to increase the step to lock the forms that are already filled out diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_contract_notifications.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_contract_notifications.js index 7975c1f3..4f6a88a1 100644 --- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_contract_notifications.js +++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_contract_notifications.js @@ -119,7 +119,7 @@ let IkonotvContractNotifications = React.createClass({ NotificationActions.flushContractAgreementListNotifications(); NotificationActions.fetchContractAgreementListNotifications(); - this.history.pushState(null, '/collection'); + this.history.push('/collection'); }, handleDeny() { @@ -132,7 +132,7 @@ let IkonotvContractNotifications = React.createClass({ handleDenySuccess() { let notification = new GlobalNotificationModel(getLangText('You have denied the conditions'), 'success', 5000); GlobalNotificationActions.appendGlobalNotification(notification); - this.history.pushState(null, '/collection'); + this.history.push('/collection'); }, getCopyrightAssociationForm(){ diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_detail/ikonotv_piece_container.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_detail/ikonotv_piece_container.js index df58b7c7..c9b5ca83 100644 --- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_detail/ikonotv_piece_container.js +++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_detail/ikonotv_piece_container.js @@ -94,7 +94,7 @@ let IkonotvPieceContainer = React.createClass({ let notification = new GlobalNotificationModel(response.notification, 'success'); GlobalNotificationActions.appendGlobalNotification(notification); - this.history.pushState(null, '/collection'); + this.history.push('/collection'); }, render() { diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_forms/ikonotv_artist_details_form.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_forms/ikonotv_artist_details_form.js index 7aec7ff4..0b97c8dd 100644 --- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_forms/ikonotv_artist_details_form.js +++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_forms/ikonotv_artist_details_form.js @@ -60,9 +60,8 @@ let IkonotvArtistDetailsForm = React.createClass({ render() { let buttons, spinner, heading; let { isInline, handleSuccess } = this.props; - - if(!isInline) { + if (!isInline) { buttons = (