datahub/wherehows-web/app/components/datasets/owners/suggested-owners.ts

import Component from '@ember/component';
import { IOwner } from 'wherehows-web/typings/api/datasets/owners';
import { computed, get, set } from '@ember/object';
import ComputedProperty, { empty } from '@ember/object/computed';

export default class DatasetsOwnersSuggestedOwners extends Component {
  /**
   * Sets the class names binded to the html element generated by this component
   */
  classNames = ['dataset-authors-suggested'];

  constructor() {
    super();
    // Sets default class values
    this.owners || set(this, 'owners', []);
  }

  /**
   * Whether or not the component is expanded. If not, users will only see the initial header information
   * whereas if expanded then users will see the list of all suggested owners
   * @type {boolean}
   * @default false
   */
  isExpanded = false;

  /**
   * Computed based on the owners array, detects whether this array is empty or not
   * @type {ComputedProperty<boolean>}
   */
  isEmpty = empty('owners');

  /**
   * Passed in value from parent component, `dataset-authors`, a.k.a. systemGeneratedOwners, this list
   * represents a possible list of owners provided by scanning various systems.
   * @type {Array<IOwner>}
   * @default []
   */
  owners: Array<IOwner>;

  /**
   * For the facepile in the suggestions window header, we do not need tos how all the faces of all the
   * possible owners as this could be a large amount. Take only up to the first four to pass into the
   * template for rendering
   * @type {ComputedProperty<Array<IOwner>>}
   */
  facepileOwners: ComputedProperty<Array<IOwner>> = computed('owners', function(this: DatasetsOwnersSuggestedOwners) {
    return get(this, 'owners').slice(0, 4);
  });
}