{% extends "base.html" %} {% block title %}Client Data Store — Rustvello
Monitor{% endblock %} {% block content %}
<div class="container-fluid">
  <!-- Page Header -->
  <div class="d-flex justify-content-between align-items-center mb-4">
    <h2 class="h4 mb-0 text-primary">
      <span class="material-icons align-middle me-2" style="font-size: 28px"
        >inventory_2</span
      >
      Client Data Store
    </h2>
  </div>

  <!-- Type Banner -->
  <div class="info-card mb-4">
    <h6 class="section-title">Data Store Type</h6>
    <p class="mb-0 fw-semibold">
      <span class="badge bg-primary fs-6">{{ backend_name }}</span>
      <span class="text-muted small ms-2">implementation</span>
    </p>
  </div>

  <div class="row g-3">
    <!-- Usage Stats -->
    <div class="col-md-6">
      <div class="metric-card h-100">
        <h6 class="section-title">Current Usage</h6>
        {% if usage_stats.is_empty() %}
        <p class="text-muted small mb-0">No statistics available.</p>
        {% else %}
        <div class="metric-grid">
          {% for (label, value) in usage_stats %}
          <div class="metric-item">
            <span class="metric-label">{{ label }}</span>
            <span class="badge bg-info">{{ value }}</span>
          </div>
          {% endfor %}
        </div>
        {% endif %}
      </div>
    </div>

    <!-- Configuration -->
    <div class="col-md-6">
      <div class="metric-card h-100">
        <h6 class="section-title">Configuration</h6>
        <div class="metric-grid">
          <div class="metric-item">
            <span class="metric-label">Store Enabled</span>
            <span
              class="badge {% if config_disabled %}bg-danger{% else %}bg-success{% endif %}"
            >
              {% if config_disabled %}Disabled{% else %}Enabled{% endif %}
            </span>
          </div>
          <div class="metric-item">
            <span class="metric-label">Min Size to Externalize</span>
            <span class="badge bg-info">{{ config_min_size }} B</span>
          </div>
          <div class="metric-item">
            <span class="metric-label">Max Size to Externalize</span>
            <span class="badge bg-info"
              >{% if config_max_size == 0 %}Unlimited{% else %}{{
              config_max_size }} B{% endif %}</span
            >
          </div>
          <div class="metric-item">
            <span class="metric-label">Local LRU Cache Size</span>
            <span class="badge bg-info">{{ config_cache_size }}</span>
          </div>
          <div class="metric-item">
            <span class="metric-label">Warn Threshold</span>
            <span class="badge bg-warning text-dark"
              >{{ config_warn_threshold }}</span
            >
          </div>
          <div class="metric-item">
            <span class="metric-label">Compression</span>
            <span class="badge bg-secondary">OFF</span>
          </div>
        </div>
      </div>
    </div>
  </div>

  <!-- Danger Zone -->
  <div class="row mt-4">
    <div class="col-12">
      <div class="card border-danger">
        <div class="card-header text-danger">
          <span class="material-icons align-middle me-1" style="font-size: 18px"
            >warning</span
          >
          Danger Zone
        </div>
        <div class="card-body">
          <p class="text-muted small mb-2">
            Permanently delete all externally stored data (arguments, results,
            exceptions).
          </p>
          <button
            class="btn btn-danger btn-sm"
            hx-post="/client-data-store/purge"
            hx-confirm="This will purge all client data store entries. This operation cannot be undone! Continue?"
            hx-swap="outerHTML"
          >
            <span
              class="material-icons align-middle me-1"
              style="font-size: 16px"
              >delete_forever</span
            >
            Purge Data Store
          </button>
        </div>
      </div>
    </div>
  </div>
</div>
{% endblock %}