github.com/hernad/nomad@v1.6.112/ui/app/components/chart-primitives/v-annotations.js (about)

     1  /**
     2   * Copyright (c) HashiCorp, Inc.
     3   * SPDX-License-Identifier: MPL-2.0
     4   */
     5  
     6  import Component from '@glimmer/component';
     7  import { htmlSafe } from '@ember/template';
     8  import { action, get } from '@ember/object';
     9  import styleString from 'nomad-ui/utils/properties/glimmer-style-string';
    10  
    11  const iconFor = {
    12    error: 'cancel-circle-fill',
    13    info: 'info-circle-fill',
    14  };
    15  
    16  const iconClassFor = {
    17    error: 'is-danger',
    18    info: '',
    19  };
    20  
    21  export default class ChartPrimitiveVAnnotations extends Component {
    22    @styleString
    23    get chartAnnotationsStyle() {
    24      return {
    25        height: this.args.height,
    26      };
    27    }
    28  
    29    get processed() {
    30      const { scale, prop, annotations, timeseries, format } = this.args;
    31  
    32      if (!annotations || !annotations.length) return null;
    33  
    34      let sortedAnnotations = annotations.sortBy(prop);
    35      if (timeseries) {
    36        sortedAnnotations = sortedAnnotations.reverse();
    37      }
    38  
    39      let prevX = 0;
    40      let prevHigh = false;
    41      return sortedAnnotations.map((annotation) => {
    42        const x = scale(annotation[prop]);
    43        if (prevX && !prevHigh && Math.abs(x - prevX) < 30) {
    44          prevHigh = true;
    45        } else if (prevHigh) {
    46          prevHigh = false;
    47        }
    48        const y = prevHigh ? -15 : 0;
    49        const formattedX = format(timeseries)(annotation[prop]);
    50  
    51        prevX = x;
    52        return {
    53          annotation,
    54          style: htmlSafe(`transform:translate(${x}px,${y}px)`),
    55          icon: iconFor[annotation.type],
    56          iconClass: iconClassFor[annotation.type],
    57          staggerClass: prevHigh ? 'is-staggered' : '',
    58          label: `${annotation.type} event at ${formattedX}`,
    59          isActive: this.annotationIsActive(annotation),
    60        };
    61      });
    62    }
    63  
    64    annotationIsActive(annotation) {
    65      const { key, activeAnnotation } = this.args;
    66      if (!activeAnnotation) return false;
    67  
    68      if (key) return get(annotation, key) === get(activeAnnotation, key);
    69      return annotation === activeAnnotation;
    70    }
    71  
    72    @action
    73    selectAnnotation(annotation) {
    74      if (this.args.annotationClick) this.args.annotationClick(annotation);
    75    }
    76  }