docbrown/app/javascript/article-form/components/ErrorList.jsx
2020-05-29 11:59:37 -04:00

27 lines
645 B
JavaScript

import { h } from 'preact';
import PropTypes from 'prop-types';
export const ErrorList = ({ errors }) => {
return (
<div className="crayons-notice crayons-notice--danger mb-6">
<h3 className="fs-l mb-2 fw-bold">Whoops, something went wrong:</h3>
<ul className="list-disc pl-6">
{Object.keys(errors).map((key) => {
return (
<li>
{key}
{`: `}
{errors[key]}
</li>
);
})}
</ul>
</div>
);
};
ErrorList.propTypes = {
errors: PropTypes.objectOf(PropTypes.string).isRequired,
};
ErrorList.displayName = 'ErrorList';