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  121x     7424x     121x       59x 7424x 7483x     59x     59x 7424x 7483x     59x     59x 7424x 7483x     59x     59x 7424x 7483x     59x     59x 7424x 7483x     59x     59x 7424x 7483x       59x     7424x   121x 121x 121x 121x   121x 121x 121x 121x 121x 121x 121x 121x     121x  
<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>