All files / src/app/components/dashboard dashboard.component.html

98.5% Statements 66/67
50% Branches 1/2
100% Functions 0/0
97.61% Lines 41/42

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79  119x     7608x     119x       58x 7608x 7666x     58x     58x 7608x 7666x     58x     58x 7608x 7666x     58x     58x 7608x 7666x     58x     58x 7608x 7666x     58x     58x 7608x 7666x       58x     7608x   119x 119x 119x 119x   119x 119x 119x 119x 119x 119x 119x 119x     119x  
<div class="container">
<h2 class="title is-2">Status</h2>
 
 
@if (!status) {
  <progress class="progress is-primary is-small" max="100"></progress>
}
@else {
  <div class="field is-grouped is-grouped-multiline status-container">
    <div class="control">
      <div class="tags has-addons">
        <span class="tag is-dark">Backend</span>
        <span class="tag" [ngClass]="{'is-light': !status.services.backend , 'is-success': status.services.backend === 'up', 'is-danger': status.services.backend === 'down' }">
          {{status.services.backend}}
        </span>
      </div>
    </div>
    <div class="control">
      <div class="tags has-addons">
        <span class="tag is-dark">Message broker</span>
        <span class="tag" [ngClass]="{'is-light': !status.services.cloud_broker , 'is-success': status.services.cloud_broker === 'up', 'is-danger': status.services.cloud_broker === 'down' }">
          {{status.services.cloud_broker}}
        </span>
      </div>
    </div>
    <div class="control">
      <div class="tags has-addons">
        <span class="tag is-dark">Database</span>
        <span class="tag" [ngClass]="{'is-light': !status.services.time_series_database , 'is-success': status.services.time_series_database === 'up', 'is-danger': status.services.time_series_database === 'down' }">
          {{status.services.time_series_database}}
        </span>
      </div>
    </div>
    <div class="control">
      <div class="tags has-addons">
        <span class="tag is-dark">Heartbeats Storage</span>
        <span class="tag" [ngClass]="{'is-light': !status.services.heartbeat_storage , 'is-success': status.services.heartbeat_storage === 'up', 'is-danger': status.services.heartbeat_storage === 'down' }">
          {{status.services.heartbeat_storage}}
        </span>
      </div>
    </div>
    <div class="control">
      <div class="tags has-addons">
        <span class="tag is-dark">Signals Storage</span>
        <span class="tag" [ngClass]="{'is-light': !status.services.signal_storage , 'is-success': status.services.signal_storage === 'up', 'is-danger': status.services.signal_storage === 'down' }">
          {{status.services.signal_storage}}
        </span>
      </div>
    </div>
    <div class="control">
      <div class="tags has-addons">
        <span class="tag is-dark">Database Analyzer</span>
        <span class="tag" [ngClass]="{'is-light': !status.services.data_analyzer , 'is-success': status.services.data_analyzer === 'up', 'is-danger': status.services.data_analyzer === 'down' }">
          {{status.services.data_analyzer}}
        </span>
      </div>
    </div>
  </div>
}
 
<p-tabs value="0" [lazy]="true">
  <p-tablist>
    <p-tab value="0">Samples</p-tab>
    <p-tab value="1">Commands</p-tab>
    <p-tab value="2">Events</p-tab>
  </p-tablist>
  <p-tabpanels>
    <p-tabpanel value="0">
      <app-calendar-heatmap heatMapType="samples"></app-calendar-heatmap>
    </p-tabpanel>
    <p-tabpanel value="1">
      <app-calendar-heatmap heatMapType="commands"></app-calendar-heatmap>
    </p-tabpanel>
    <p-tabpanel value="2">
      <app-calendar-heatmap heatMapType="events"></app-calendar-heatmap>
    </p-tabpanel>
  </p-tabpanels>
</p-tabs>