import React from 'react';


require("./ErrorBubble.scss");


export default ({ errors, fields }) => {
    if (!errors || !fields || !fields.length) {
        return null;
    }
    
    let cnt = 0;
    for (let i = 0; i < fields.length; i++) {
        let array = errors[fields[i]];
        if (array) {
            cnt += array.length;
        }
    }

    if (!cnt) {
        return null;
    }

    return (
        <div className="error-bubble"><span>{ cnt }</span></div>
    );
}