{% extends "base.html" %}
{% block title %}Zarządzanie zmiennymi dynamicznymi{% endblock %}

{% block content %}
<div class="card">
  <div class="card-header">
    <h3>Definiowanie zmiennych dynamicznych</h3>
    <p class="text-muted">Te zmienne mogą być używane w konfiguracji <code>/etc/hosts</code>, np. <code>${app_name}</code>, <code>${hostname}</code>.</p>
  </div>
  <div class="card-body">
    <form method="POST">
      <div class="row">
        <div class="col-md-5">
          <label class="form-label">Nazwa zmiennej</label>
          <input type="text" class="form-control" name="variable_name" placeholder="np. app_name" required>
        </div>
        <div class="col-md-5">
          <label class="form-label">Wartość zmiennej</label>
          <input type="text" class="form-control" name="variable_value" placeholder="np. MojaAplikacja" required>
        </div>
        <div class="col-md-2 d-flex align-items-end">
          <button type="submit" class="btn btn-primary w-100">Dodaj</button>
        </div>
      </div>
    </form>

    <table class="table table-striped mt-4">
      <thead>
        <tr>
          <th>ID</th>
          <th>Nazwa zmiennej</th>
          <th>Wartość</th>
          <th>Akcje</th>
        </tr>
      </thead>
      <tbody>
        {% for var in variables %}
        <tr>
          <td>{{ var.id }}</td>
          <td><code>${{ var.variable_name }}</code></td> 
          <td>{{ var.variable_value }}</td>
          <td>
            <form method="POST" action="{{ url_for('delete_dynamic_variable', variable_id=var.id) }}" onsubmit="return confirm('Usunąć zmienną?');">
              <button class="btn btn-danger btn-sm">Usuń</button>
            </form>
          </td>
        </tr>
        {% else %}
        <tr>
          <td colspan="4">Brak zdefiniowanych zmiennych.</td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
</div>
{% endblock %}