open-nomad/ui/app/controllers/evaluations/index.js

import { getOwner } from '@ember/application';
import Controller from '@ember/controller';
import { action } from '@ember/object';
import { tracked } from '@glimmer/tracking';
import { schedule } from '@ember/runloop';
import { inject as service } from '@ember/service';
import { useMachine } from 'ember-statecharts';
import { use } from 'ember-usable';
import evaluationsMachine from '../../machines/evaluations';

const ALL_NAMESPACE_WILDCARD = '*';

export default class EvaluationsController extends Controller {
  @service store;
  @service userSettings;

  // We use statecharts here to manage complex user flows for the sidebar logic
  @use
  statechart = useMachine(evaluationsMachine).withConfig({
    services: {
      loadEvaluation: this.loadEvaluation,
    },
    actions: {
      updateEvaluationQueryParameter: this.updateEvaluationQueryParameter,
      removeCurrentEvaluationQueryParameter:
        this.removeCurrentEvaluationQueryParameter,
    },
    guards: {
      sidebarIsOpen: this._sidebarIsOpen,
    },
  });

  queryParams = [
    'nextToken',
    'currentEval',
    'pageSize',
    'status',
    'qpNamespace',
    'type',
    'searchTerm',
  ];
  @tracked currentEval = null;

  @action
  _sidebarIsOpen() {
    return !!this.currentEval;
  }

  @action
  async loadEvaluation(context, { evaluation }) {
    let evaluationId;
    if (evaluation?.id) {
      evaluationId = evaluation.id;
    } else {
      evaluationId = this.currentEval;
    }

    return this.store.findRecord('evaluation', evaluationId, {
      reload: true,
      adapterOptions: { related: true },
    });
  }

  @action
  async handleEvaluationClick(evaluation, e) {
    if (
      e instanceof MouseEvent ||
      (e instanceof KeyboardEvent && (e.code === 'Enter' || e.code === 'Space'))
    ) {
      this.statechart.send('LOAD_EVALUATION', { evaluation });
    }
  }

  @action
  notifyEvalChange([evaluation]) {
    schedule('actions', this, () => {
      this.statechart.send('CHANGE_EVAL', { evaluation });
    });
  }

  @action
  updateEvaluationQueryParameter(context, { evaluation }) {
    this.currentEval = evaluation.id;
  }

  @action
  removeCurrentEvaluationQueryParameter() {
    this.currentEval = null;
  }

  get shouldDisableNext() {
    return !this.model.meta?.nextToken;
  }

  get shouldDisablePrev() {
    return !this.previousTokens.length;
  }

  get optionsEvaluationsStatus() {
    return [
      { key: null, label: 'All' },
      { key: 'blocked', label: 'Blocked' },
      { key: 'pending', label: 'Pending' },
      { key: 'complete', label: 'Complete' },
      { key: 'failed', label: 'Failed' },
      { key: 'canceled', label: 'Canceled' },
    ];
  }

  get optionsTriggeredBy() {
    return [
      { key: null, label: 'All' },
      { key: 'job-register', label: 'Job Register' },
      { key: 'job-deregister', label: 'Job Deregister' },
      { key: 'periodic-job', label: 'Periodic Job' },
      { key: 'node-drain', label: 'Node Drain' },
      { key: 'node-update', label: 'Node Update' },
      { key: 'alloc-stop', label: 'Allocation Stop' },
      { key: 'scheduled', label: 'Scheduled' },
      { key: 'rolling-update', label: 'Rolling Update' },
      { key: 'deployment-watcher', label: 'Deployment Watcher' },
      { key: 'failed-follow-up', label: 'Failed Follow Up' },
      { key: 'max-plan-attempts', label: 'Max Plan Attempts' },
      { key: 'alloc-failure', label: 'Allocation Failure' },
      { key: 'queued-allocs', label: 'Queued Allocations' },
      { key: 'preemption', label: 'Preemption' },
      { key: 'job-scaling', label: 'Job Scalling' },
    ];
  }

  get optionsNamespaces() {
    const namespaces = this.store.peekAll('namespace').map((namespace) => ({
      key: namespace.name,
      label: namespace.name,
    }));

    // Create default namespace selection
    namespaces.unshift({
      key: ALL_NAMESPACE_WILDCARD,
      label: 'All (*)',
    });

    return namespaces;
  }

  get optionsType() {
    return [
      { key: null, label: 'All' },
      { key: 'client', label: 'Client' },
      { key: 'no client', label: 'No Client' },
    ];
  }

  @tracked pageSize = this.userSettings.pageSize;
  @tracked nextToken = null;
  @tracked previousTokens = [];
  @tracked status = null;
  @tracked triggeredBy = null;
  @tracked qpNamespace = ALL_NAMESPACE_WILDCARD;
  @tracked type = null;
  @tracked searchTerm = null;

  @action
  onChange(newPageSize) {
    this.pageSize = newPageSize;
  }

  @action
  onNext(nextToken) {
    this.previousTokens = [...this.previousTokens, this.nextToken];
    this.nextToken = nextToken;
  }

  @action
  onPrev() {
    const lastToken = this.previousTokens.pop();
    this.previousTokens = [...this.previousTokens];
    this.nextToken = lastToken;
  }

  @action
  refresh() {
    const isDefaultParams = this.nextToken === null && this.status === null;
    if (isDefaultParams) {
      getOwner(this).lookup('route:evaluations.index').refresh();
      return;
    }

    this._resetTokens();
    this.status = null;
    this.pageSize = this.userSettings.pageSize;
  }

  @action
  setQueryParam(qp, selection) {
    this._resetTokens();
    this[qp] = selection;
  }

  @action
  toggle() {
    this._resetTokens();
    this.shouldOnlyDisplayClientEvals = !this.shouldOnlyDisplayClientEvals;
  }

  @action
  _resetTokens() {
    this.nextToken = null;
    this.previousTokens = [];
  }
}