{% extends "base.html" %}
{% block title %}Database Configuration - Hermetic Suite{% endblock %}

{% block content %}
<div class="page-header">
    <h1 class="icon" id="databases">Database Configuration</h1>
    <p class="subtitle">Configure collection schedule and default alert thresholds</p>
    <div class="header-actions">
        <a href="{{ url_for('databases.index') }}" class="btn btn-secondary">← Back to Databases</a>
    </div>
</div>

<!-- Collection Schedule Card -->
<div class="card">
    <div class="card-header">
        <h2>Collection Schedule</h2>
    </div>
    <div class="card-body">
        {% if schedule_info.error %}
        <div class="alert alert-warning" style="margin-bottom: 1rem;">
            <strong>Scheduling unavailable:</strong> {{ schedule_info.error }}
        </div>
        <p class="text-muted">
            To enable scheduling, ensure the hsuite user has cron access. You can manually set up a cron job:
        </p>
        <div style="background: var(--bg-secondary); padding: 1rem; border-radius: 4px; margin: 1rem 0;">
            <code style="display: block; white-space: pre-wrap;"># Run every 15 minutes
*/15 * * * * /opt/hsuite/venv/bin/python /opt/hsuite/plugins/databases/collect_all.py</code>
        </div>
        {% else %}
        <form action="{{ url_for('databases.config_page') }}" method="POST">
            <input type="hidden" name="action" value="update_schedule">
            
            <div class="form-row" style="display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;">
                <div style="flex: 1; min-width: 200px;">
                    <label for="schedule" style="display: block; margin-bottom: 0.5rem; font-weight: 500;">
                        Automatic Collection Frequency
                    </label>
                    <select name="schedule" id="schedule" class="form-control" style="width: 100%; padding: 0.5rem;">
                        {% for value, label in schedule_info.options %}
                        <option value="{{ value }}" {% if schedule_info.current == value %}selected{% endif %}>
                            {{ label }}
                        </option>
                        {% endfor %}
                    </select>
                </div>
                <div style="padding-top: 1.5rem;">
                    <button type="submit" class="btn btn-primary">Update Schedule</button>
                </div>
            </div>
            
            <p class="text-muted" style="margin-top: 1rem; font-size: 0.9em;">
                {% if schedule_info.current and schedule_info.current != 'disabled' %}
                <span class="badge badge-success">Active</span>
                Currently collecting metrics <strong>{{ schedule_info.current_label|lower }}</strong>.
                {% else %}
                <span class="badge badge-secondary">Inactive</span>
                Automatic collection is disabled. Use manual collection or enable a schedule.
                {% endif %}
            </p>
        </form>
        {% endif %}
    </div>
</div>

<!-- Default Thresholds -->
<div class="card">
    <div class="card-header">
        <h2>Default Thresholds</h2>
    </div>
    <div class="card-body">
        <p class="text-muted" style="margin-bottom: 1rem;">
            These thresholds apply to all databases unless overridden in the database's edit page.
        </p>
        
        <table class="table">
            <thead>
                <tr>
                    <th>Metric</th>
                    <th>Comparison</th>
                    <th>Warning</th>
                    <th>Critical</th>
                    <th>Enabled</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                {% for t in thresholds if t.connection_id is none %}
                <tr>
                    <form method="POST" action="{{ url_for('databases.config_page') }}">
                        <input type="hidden" name="action" value="update_threshold">
                        <input type="hidden" name="threshold_id" value="{{ t.id }}">
                        <td>
                            <strong>{{ t.metric_type|replace('_', ' ')|title }}</strong>
                            <br><small class="text-muted">
                                {% if t.metric_type == 'connection_percent' %}
                                Percentage of max connections in use
                                {% elif t.metric_type == 'query_duration_ms' %}
                                Query duration in milliseconds
                                {% elif t.metric_type == 'cache_hit_ratio' %}
                                Buffer/cache hit ratio percentage
                                {% endif %}
                            </small>
                        </td>
                        <td>
                            <code>{{ t.comparison }}</code>
                            <small class="text-muted">
                                {% if t.comparison == '>' %}(greater than){% else %}(less than){% endif %}
                            </small>
                        </td>
                        <td>
                            <input type="number" name="warning" value="{{ t.warning_threshold }}" step="0.1" style="width: 80px;">
                        </td>
                        <td>
                            <input type="number" name="critical" value="{{ t.critical_threshold }}" step="0.1" style="width: 80px;">
                        </td>
                        <td>
                            <input type="checkbox" name="enabled" {% if t.enabled %}checked{% endif %}>
                        </td>
                        <td>
                            <button type="submit" class="btn btn-sm btn-primary">Save</button>
                        </td>
                    </form>
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</div>

<!-- Threshold Explanations -->
<div class="card">
    <div class="card-header">
        <h2>Threshold Explanations</h2>
    </div>
    <div class="card-body">
        <dl>
            <dt>Connection Percent ( &gt; )</dt>
            <dd>Alerts when the percentage of active connections exceeds the threshold. Default: Warning at 80%, Critical at 95%.</dd>
            
            <dt>Query Duration ( &gt; )</dt>
            <dd>Alerts when queries run longer than the threshold (in milliseconds). Default: Warning at 2000ms, Critical at 10000ms.</dd>
            
            <dt>Cache Hit Ratio ( &lt; )</dt>
            <dd>Alerts when the buffer/cache hit ratio falls below the threshold. A low hit ratio indicates poor cache utilization. Default: Warning below 90%, Critical below 80%.</dd>
        </dl>
    </div>
</div>

<style>
dl {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.5rem 1rem;
}

dt {
    font-weight: 600;
}

dd {
    margin: 0;
    color: var(--text-secondary);
}
</style>
{% endblock %}