github.com/hernad/nomad@v1.6.112/ui/app/components/chart-primitives/h-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 export default class ChartPrimitiveVAnnotations extends Component { 12 @styleString 13 get chartAnnotationsStyle() { 14 return { 15 width: this.args.width, 16 left: this.args.left, 17 }; 18 } 19 20 get processed() { 21 const { scale, prop, annotations, format, labelProp } = this.args; 22 23 if (!annotations || !annotations.length) return null; 24 25 let sortedAnnotations = annotations.sortBy(prop).reverse(); 26 27 return sortedAnnotations.map((annotation) => { 28 const y = scale(annotation[prop]); 29 const x = 0; 30 const formattedY = format()(annotation[prop]); 31 32 return { 33 annotation, 34 style: htmlSafe(`transform:translate(${x}px,${y}px)`), 35 label: annotation[labelProp], 36 a11yLabel: `${annotation[labelProp]} at ${formattedY}`, 37 isActive: this.annotationIsActive(annotation), 38 }; 39 }); 40 } 41 42 annotationIsActive(annotation) { 43 const { key, activeAnnotation } = this.args; 44 if (!activeAnnotation) return false; 45 46 if (key) return get(annotation, key) === get(activeAnnotation, key); 47 return annotation === activeAnnotation; 48 } 49 50 @action 51 selectAnnotation(annotation) { 52 if (this.args.annotationClick) this.args.annotationClick(annotation); 53 } 54 }