Octane and Cp-Validations

checkout.js

import Component from "@glimmer/component";
import { inject as service } from "@ember/service";
import { tracked } from "@glimmer/tracking";
import Object, { action } from "@ember/object";
import { validator, buildValidations } from "ember-cp-validations";
import { getOwner } from "@ember/application";

const Validations = buildValidations({
  billing_first_name: {
    description: "First Name",
    validators: [
      validator("presence", true),
      validator("length", {
        min: 1,
        max: 150
      })
    ]
  },
  billing_last_name: {
    description: "Last Name",
    validators: [
      validator("presence", true),
      validator("length", {
        min: 1,
        max: 150
      })
    ]
  }
});
class Form extends Object.extend(Validations) {
  @tracked billing_first_name = "";
  @tracked billing_last_name = "";
  @tracked billing_company = "";
  @tracked billing_address_1 = "";
  @tracked billing_address_2 = "";
  @tracked billing_city = "";
  @tracked billing_postcode = "";
  @tracked billing_phone = "";
  @tracked billing_email = "";
  @tracked payment_method = "";
  @tracked payment_method = "";
  @tracked woocommerce_checkout_place_order = "";
}

export default class CheckoutComponent extends Component {
  @tracked
  form = null;
  constructor() {
    super(...arguments);
    this.form = Form.create(getOwner(this).ownerInjection());
  }
  @service("cart") cart;

  @action
  onSubmit() {
    console.log(this.form);
    console.log(this.cart.items);
    // alert('Thank you!');
    this.cart.clear();
    this.form = Form.create();
  }
}