2022-12-08 20:04:20 +03:00
|
|
|
import Modifier from 'ember-modifier';
|
|
|
|
import {isEmpty} from '@ember/utils';
|
|
|
|
|
2022-12-09 20:06:49 +03:00
|
|
|
const ERROR_CLASS = 'error';
|
|
|
|
const SUCCESS_CLASS = 'success';
|
2022-12-08 20:04:20 +03:00
|
|
|
|
|
|
|
export default class ValidationStatusModifier extends Modifier {
|
2022-12-09 20:06:49 +03:00
|
|
|
modify(element, positional, {errors, property, hasValidated, errorClass = ERROR_CLASS, successClass = SUCCESS_CLASS}) {
|
|
|
|
const hasError = this.hasError(errors, property, hasValidated);
|
|
|
|
|
|
|
|
let validationClass = '';
|
|
|
|
|
|
|
|
if (!property || hasValidated?.includes(property)) {
|
|
|
|
validationClass = hasError ? errorClass : successClass;
|
|
|
|
}
|
2022-12-08 20:04:20 +03:00
|
|
|
|
|
|
|
element.classList.remove(errorClass);
|
|
|
|
element.classList.remove(successClass);
|
|
|
|
|
|
|
|
if (validationClass) {
|
|
|
|
element.classList.add(validationClass);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
hasError(errors, property, hasValidated) {
|
|
|
|
// if we aren't looking at a specific property we always want an error class
|
|
|
|
if (!property && errors && !errors.get('isEmpty')) {
|
|
|
|
return true;
|
|
|
|
}
|
|
|
|
|
|
|
|
// If we haven't yet validated this field, there is no validation class needed
|
|
|
|
if (!hasValidated || !hasValidated.includes(property)) {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
|
|
|
|
if (errors && !isEmpty(errors.errorsFor(property))) {
|
|
|
|
return true;
|
|
|
|
}
|
|
|
|
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
}
|