open-nomad/ui/app/templates/components/scale-events-chart.hbs

<LineChart
  @timeseries={{true}}
  @curve="stepAfter"
  @xProp="time"
  @yProp="count"
  @data={{this.data}}
  @annotations={{this.annotations}}
  @activeAnnotation={{this.activeEvent}}
  @annotationKey="event.uid"
  @onAnnotationClick={{action this.toggleEvent}} />
{{#if this.activeEvent}}
  <div data-test-event-details>
    <div class="event">
      <div data-test-type class="type">
        {{#if this.activeEvent.event.error}}
          {{x-icon "cancel-circle-fill" class="is-danger"}}
        {{else}}
          {{x-icon "info-circle-fill" class="is-grey"}}
        {{/if}}
      </div>
      <div>
        <p data-test-timestamp class="timestamp">{{format-month-ts this.activeEvent.event.time}}</p>
        <p data-test-message class="message">{{this.activeEvent.event.message}}</p>
      </div>
    </div>
    <JsonViewer @json={{this.activeEvent.event.meta}} @fluidHeight={{true}} />
  </div>
{{/if}}