import Resource from '@rancher/ember-api-store/models/resource';
import { get, set, computed, defineProperty } from '@ember/object';
import { inject as service } from '@ember/service';
import { ucFirst } from 'shared/utils/util';
import { getDisplayLocation, getDisplaySize } from 'shared/mixins/node-driver';
import { isArray } from '@ember/array';

export default Resource.extend({
  intl:         service(),
  modalService: service('modal'),

  type:         'nodeTemplate',
  canClone:     true,

  init() {
    this._super(...arguments);

    const { driver } = this;

    if (driver) {
      this.initDisplayLocation(driver);
      this.initDisplaySize(driver);
    }
  },

  config: computed('driver', function() {
    const driver = get(this, 'driver');

    return get(this, `${ driver }Config`);
  }),

  displayProvider: computed('driver', 'intl.locale', function() {
    const intl = get(this, 'intl');
    const driver = get(this, 'driver');
    const key = `nodeDriver.displayName.${ driver }`;

    if ( intl.exists(key) ) {
      return intl.t(key);
    } else {
      return ucFirst(driver);
    }
  }),

  actions: {
    edit() {
      let driver = get(this, 'driver');

      get(this, 'modalService').toggleModal('modal-edit-node-template', {
        driver,
        config:       get(this, `${ driver }Config`),
        nodeTemplate: this,
        edit:         true,
      });
    },

    clone() {
      const { driver } = this;

      get(this, 'modalService').toggleModal('modal-edit-node-template', {
        driver,
        config:       get(this, `${ driver }Config`),
        nodeTemplate: this,
        clone:        true,
      });
    }
  },

  _displayVar(keyOrFn) {
    const intl = get(this, 'intl');

    if ( keyOrFn ) {
      if ( typeof (keyOrFn) === 'function' ) {
        return keyOrFn.call(this);
      }  else {
        return get(this, keyOrFn) || intl.t('generic.unknown');
      }
    } else {
      return intl.t('generic.unknown');
    }
  },

  clearConfigsExcept(keep) {
    const keys = this.allKeys().filter((x) => x.endsWith('Config'));

    for ( let key, i = 0 ; i < keys.length ; i++ ) {
      key = keys[i];
      if ( key !== keep && get(this, key) ) {
        set(this, key, null);
      }
    }
  },

  initDisplayLocation(driver) {
    let location     = getDisplayLocation(driver);
    let computedKeys = null;

    if (location.keyOrKeysToWatch) {
      computedKeys = isArray(location.keyOrKeysToWatch) ? location.keyOrKeysToWatch : [location.keyOrKeysToWatch];

      this.registerDynamicComputedProperty('displayLocation', computedKeys, location.getDisplayProperty);
    }
  },

  initDisplaySize(driver) {
    let size     = getDisplaySize(driver);
    let computedKeys = null;

    if (size.keyOrKeysToWatch) {
      computedKeys = isArray(size.keyOrKeysToWatch) ? size.keyOrKeysToWatch : [size.keyOrKeysToWatch];

      this.registerDynamicComputedProperty('displaySize', computedKeys, size.getDisplayProperty);
    }
  },

  registerDynamicComputedProperty(propertyName, watchedKeys, key) {
    defineProperty(this, propertyName, computed(...watchedKeys, () => {
      return this._displayVar(key);
    }));
  },

});

@@ -2376,32 +2376,44 @@
     if (location
+ && location
 .keyOrKeysToWatc
@@ -2409,32 +2409,32 @@
 rKeysToWatch) %7B%0A
-
       computedKe
@@ -2631,32 +2631,88 @@
 splayProperty);%0A
+    %7D else %7B%0A      set(this, 'displayLocation', 'N/A');%0A
     %7D%0A  %7D,%0A%0A  in
@@ -2816,24 +2816,32 @@
     if (size
+ && size
 .keyOrKeysTo
@@ -2945,32 +2945,32 @@
 rKeysToWatch%5D;%0A%0A
-
       this.regis
@@ -3047,24 +3047,76 @@
 yProperty);%0A
+    %7D else %7B%0A      set(this, 'displaySize', 'N/A');%0A
     %7D%0A  %7D,%0A%0A

Add else to nodetemplate display loc and size