improve publish error messaging for edits

This commit is contained in:
Sean Yesmunt 2018-07-02 12:37:07 -04:00
parent eff657f7be
commit 7c96bad8bf
2 changed files with 49 additions and 17 deletions

View file

@ -25,11 +25,13 @@ class BidHelpText extends React.PureComponent<Props> {
} = this.props;
if (!uri) {
return __('Create a URL for this content');
return __('Create a URL for this content.');
}
if (isStillEditing) {
return __('You are currently editing this claim');
return __(
'You are currently editing this claim. If you change the URL, you will need reselect a file.'
);
}
if (isResolvingUri) {
@ -61,10 +63,10 @@ class BidHelpText extends React.PureComponent<Props> {
<React.Fragment>
{__('A deposit greater than')} {winningBidForClaimUri} {__('is needed to win')}
{` ${uri}. `}
{__('However, you can still get this URL for any amount')}
{__('However, you can still get this URL for any amount.')}
</React.Fragment>
) : (
__('Any amount will give you the winning bid')
__('Any amount will give you the winning bid.')
);
}
}

View file

@ -244,24 +244,54 @@ class PublishForm extends React.PureComponent<Props> {
}
checkIsFormValid() {
const { name, nameError, title, bid, bidError, tosAccepted } = this.props;
return name && !nameError && title && bid && !bidError && tosAccepted;
const {
name,
nameError,
title,
bid,
bidError,
tosAccepted,
editingURI,
isStillEditing,
filePath,
} = this.props;
// If they are editing, they don't need a new file chosen
const formValidLessFile = name && !nameError && title && bid && !bidError && tosAccepted;
return editingURI && !filePath ? isStillEditing && formValidLessFile : formValidLessFile;
}
renderFormErrors() {
const { name, nameError, title, bid, bidError, tosAccepted } = this.props;
const {
name,
nameError,
title,
bid,
bidError,
tosAccepted,
editingURI,
filePath,
isStillEditing,
} = this.props;
const isFormValid = this.checkIsFormValid();
// These are extra help
// If there is an error it will be presented as an inline error as well
return (
<div className="card__content card__subtitle form-field__error">
{!title && <div>{__('A title is required')}</div>}
{!name && <div>{__('A URL is required')}</div>}
{name && nameError && <div>{__('The URL you created is not valid.')}</div>}
{!bid && <div>{__('A bid amount is required')}</div>}
{bid && bidError && <div>{bidError}</div>}
{!tosAccepted && <div>{__('You must agree to the terms of service')}</div>}
</div>
!isFormValid && (
<div className="card__content card__subtitle form-field__error">
{!title && <div>{__('A title is required')}</div>}
{!name && <div>{__('A URL is required')}</div>}
{name && nameError && <div>{__('The URL you created is not valid')}</div>}
{!bid && <div>{__('A bid amount is required')}</div>}
{!!bid && bidError && <div>{bidError}</div>}
{!tosAccepted && <div>{__('You must agree to the terms of service')}</div>}
{!!editingURI &&
!isStillEditing &&
!filePath && <div>{__('You need to reselect a file after changing the LBRY URL')}</div>}
</div>
)
);
}
@ -314,7 +344,7 @@ class PublishForm extends React.PureComponent<Props> {
<section className={classnames('card card--section', { 'card--disabled': publishing })}>
<div className="card__title">{__('Content')}</div>
<div className="card__subtitle">
{editingURI ? __('Editing a claim') : __('What are you publishing?')}
{isStillEditing ? __('Editing a claim') : __('What are you publishing?')}
</div>
{(filePath || !!editingURI) && (
<div className="card-media__internal-links">
@ -327,7 +357,7 @@ class PublishForm extends React.PureComponent<Props> {
</div>
)}
<FileSelector currentPath={filePath} onFileChosen={this.handleFileChange} />
{!!editingURI && (
{!!isStillEditing && (
<p className="card__content card__subtitle">
{__("If you don't choose a file, the file from your existing claim")}
{` "${name}" `}