Sha256: fdcc83465c8a72bd67318c43fe64c8a92f4c4050e53d45e72791f5752c57b46b
Contents?: true
Size: 1.3 KB
Versions: 23
Compression:
Stored size: 1.3 KB
Contents
/**
* Base class for form components that provides helper methods
* for rendering errors associated with the form
**/
class BaseForm extends React.Component {
/**
* Returns the JSX required to render a list of errors.
*
* @returns {*}
*/
getErrorsElement() {
const { errors } = this.props;
// Don't render anything if no errors present.
if(!errors || !errors.errors || (errors.errors.length == 0)) {
return null;
}
const errorCount = errors.errors.length;
const singleError = (errorCount == 1);
return (
<div className="ui-banner ui-banner--status-error ui-banner--default-vertical-spacing ui-banner--default-horizontal-spacing">
<div className="ui-banner__ribbon">
<svg className="next-icon next-icon--24" viewBox="0 0 24 24">
<use xmlns="http://www.w3.org/1999/xlink" xlinkHref="#next-error" />
</svg>
</div>
<div className="ui-banner__content">
<h2 className="ui-banner__title">
There {singleError ? 'is' : 'are'} {errorCount} error{singleError ? '' : 's'} for this {errors.type}:
</h2>
<ul>
{errors.messages.map((message, i) => {
return <li key={i}>{message}</li>;
})}
</ul>
</div>
</div>
)
}
}
Version data entries
23 entries across 23 versions & 1 rubygems