Mixin ember-cp-validations validators

email-validator.js

import { validator } from 'ember-cp-validations';

export default {
  email: [
    validator('presence', {
      presence: true,
      message: 'O email deve ser informado'
    }),
    validator('format', {
      type: 'email',
      message: 'Email inválido'
    })
  ]
};

login-validator.js

import Ember from 'ember';
import { validator } from 'ember-cp-validations';
import EmailValidations from './email-validator';

const { assign } = Ember;

export default assign(EmailValidations, {
  password: [
    validator('presence', {
      presence: true,
      message: 'A senha deve ser informada'
    }),
    validator('length', {
      min: 8,
      message: 'A senha deve possuir no mínimo 8 caracteres'
    })
  ]
});

register-details.hbs

<div class="card-panel grey lighten-5 z-depth-1">
  <form class="form register-form" {{action "submit" on="submit"}}>
    <div class="row">
      {{inputs/validated-input
          inputId="first_name_input"
          className="first-name"
          didValidate=didValidate
          model=this
          valuePath="firstName"
          placeholder="Nome"
      }}
    </div>
    <div class="row">
      {{inputs/validated-input
          inputId="last_name_input"
          className="last-name"
          didValidate=didValidate
          model=this
          valuePath="lastName"
          placeholder="Sobrenome"
      }}
    </div>
    <div class="row">
      {{inputs/validated-input
          className="email"
          didValidate=didValidate
          model=this
          valuePath="email"
          placeholder="Email"
          type="email"
      }}
    </div>
    <div class="row">
      {{inputs/validated-input
          className="password"
          didValidate=didValidate
          model=this
          valuePath="password"
          placeholder="Senha"
          type="password"
      }}
    </div>
    <div class="row">
      {{inputs/validated-input
          className="password-confirmation"
          didValidate=didValidate
          model=this
          valuePath="passwordConfirmation"
          placeholder="Senha novamente"
          type="password"
      }}
    </div>
    <div class="row">
      <button {{action "submit"}}
        class="submit"
        type="submit">
        Criar minha conta
      </button>
    </div>
  </form>
</div>

register-details.js

//app/components/register-details.js
import Ember from 'ember';
import { buildValidations } from 'ember-cp-validations';
import UserValidations from 'auth/validators/user-validator';

const Validations = buildValidations(UserValidations);

const {
  Component,
  computed,
  get,
  set
} = Ember;

export default Component.extend(Validations, {
  didValidate: false,
  email: null,
  errors: null,
  firstName: null,
  lastName: null,
  password: null,
  passwordConfirmation: null,

  actions: {
    submit() {
      this.validate().then(({ validations }) => {
        if (get(validations, 'isValid')) {
          // saving model
        } else {
          set(this, 'didValidate', true);
        }
      }
    }
  }
});

user-validator.js

import Ember from 'ember';
import { validator } from 'ember-cp-validations';
import LoginValidations from './login-validator';

const { assign } = Ember;

export default assign(LoginValidations, {
  firstName: [
    validator('presence', {
      presence: true,
      message: 'O nome deve ser informado'
    }),
    validator('length', {
      min: 3,
      message: 'O nome deve possuir no mínimo 3 caracteres'
    })
  ],

  lastName: [
    validator('presence', {
      presence: true,
      message: 'O sobrenome deve ser informado'
    }),
    validator('length', {
      min: 3,
      message: 'O sobrenome deve possuir no mínimo 3 caracteres'
    })
  ],

  passwordConfirmation: validator('confirmation', {
    on: 'password',
    message: 'A senha não confere'
  })
});