peach-workspace/peach-web/templates/status/scuttlebutt.html.tera

96 lines
5.6 KiB
Plaintext

{%- extends "nav" -%}
{%- block card %}
{# ASSIGN VARIABLES #}
{# ---------------- #}
{%- if sbot_status.memory -%}
{% set mem = sbot_status.memory / 1024 / 1024 | round | int -%}
{%- else -%}
{% set mem = "0" -%}
{%- endif -%}
{%- if sbot_status.blobstore -%}
{% set blobs = sbot_status.blobstore / 1024 / 1024 | round | int -%}
{%- else -%}
{% set blobs = "0" -%}
{%- endif -%}
<!-- SCUTTLEBUTT STATUS -->
<div class="card center">
<!-- SBOT INFO BOX -->
<div class="capsule capsule-container {% if sbot_status.state == "active" %}border-success{% elif sbot_status.state == "inactive" %}border-warning{% else %}border-danger{% endif %}">
<!-- SBOT STATUS GRID -->
<div class="two-grid" title="go-sbot process state">
<!-- top-right config icon -->
<a class="link two-grid-top-right" href="/settings/scuttlebutt" title="Configure Scuttlebutt settings">
<img id="configureNetworking" class="icon-small icon-active" src="/icons/cog.svg" alt="Configure">
</a>
<!-- left column -->
<!-- go-sbot state icon with label -->
<div class="grid-column-1">
<img id="sbotStateIcon" class="center icon {% if sbot_status.state == "active" %}icon-active{% else %}icon-inactive{% endif %}" src="/icons/hermies.svg" alt="Hermies">
<label id="sbotStateLabel" for="sbotStateIcon" class="center label-small font-gray" style="margin-top: 0.5rem;" title="Sbot state">{{ sbot_status.state | upper }}</label>
</div>
<!-- right column -->
<!-- go-sbot version and uptime / downtime with labels -->
<div class="grid-column-2">
<label class="label-small font-gray" for="sbotVersion" title="go-sbot version">VERSION</label>
<p id="sbotVersion" class="card-text" title="Version">1.1.0-alpha</p>
{% if sbot_status.state == "active" %}
<label class="label-small font-gray" for="sbotUptime" title="go-sbot uptime" style="margin-top: 0.5rem;">UPTIME</label>
<p id="sbotUptime" class="card-text" title="Uptime">{{ sbot_status.uptime }}</p>
{# render downtime element if downtime is `Some(time)` #}
{# downtime will be `None` if service is stopped and disabled #}
{%- elif sbot_status.downtime -%}
<label class="label-small font-gray" for="sbotDowntime" title="go-sbot downtime" style="margin-top: 0.5rem;">DOWNTIME</label>
<p id="sbotDowntime" class="card-text" title="Downtime">{{ sbot_status.downtime }}</p>
{%- endif -%}
<label class="label-small font-gray" for="sbotBootState" title="go-sbot boot state" style="margin-top: 0.5rem;">RUN ON STARTUP</label>
{% if sbot_status.boot_state == "enabled" %}
<p id="runOnStartup" class="card-text" title="Enabled">Enabled</p>
{% else %}
<p id="runOnStartup" class="card-text" title="Disabled">Disabled</p>
{%- endif -%}
</div>
</div>
<hr style="color: var(--light-gray);">
<div id="middleSection" style="margin-top: 1rem;">
<div id="sbotInfo" class="center" style="display: flex; justify-content: space-between; width: 90%;">
<div class="center" style="display: flex; align-items: last baseline;">
{% if sbot_status.state == "active" %}
<label class="card-text" style="margin-right: 5px;">{{ latest_seq }}</label>
<label class="label-small font-gray">MESSAGES IN LOCAL DATABASE</label>
{% else %}
<label class="label-small font-gray">DATABASE UNAVAILABLE</label>
{% endif %}
</div>
</div>
</div>
<hr style="color: var(--light-gray);">
<!-- THREE-ACROSS STACK -->
<div class="three-grid card-container" style="margin-top: 1rem;">
<div class="stack">
<img class="icon icon-active" title="Hops" src="/icons/orbits.png">
<div class="flex-grid" style="padding-top: 0.5rem;">
<label class="label-medium font-normal" style="padding-right: 3px;" title="Replication hops">{{ sbot_config.hops }}</label>
</div>
<label class="label-small font-gray">HOPS</label>
</div>
<div class="stack">
<img class="icon icon-active" title="Blobs" src="/icons/image-file.png">
<div class="flex-grid" style="padding-top: 0.5rem;">
<label class="label-medium font-normal" style="padding-right: 3px;" title="Blobstore size in MB">{{ blobs }}</label>
<label class="label-small font-normal">MB</label>
</div>
<label class="label-small font-gray">BLOBSTORE</label>
</div>
<div class="stack">
<img class="icon{% if sbot_status.memory %} icon-active{% else %} icon-inactive{% endif %}" title="Memory" src="/icons/ram.png">
<div class="flex-grid" style="padding-top: 0.5rem;">
<label class="label-medium{% if sbot_status.state == "inactive" %} font-gray{% else %} font-normal{% endif %}" style="padding-right: 3px;" title="Memory usage of the go-sbot process in MB">{{ mem }}</label>
<label class="label-small{% if sbot_status.state == "inactive" %} font-gray{% else %} font-normal{% endif %}">MB</label>
</div>
<label class="label-small font-gray">MEMORY</label>
</div>
</div>
</div>
</div>
{%- endblock card -%}