{% extends "base.html" %}
{% block title %}Rules Library | Suvra{% endblock %}
{% block content %}
<section class="page-head">
  <h1>Rules Library</h1>
  <p class="muted">Browse available rules and add them to your policies.</p>
</section>
{% include "policy_nav.html" %}
{% if message %}<p class="flash">{{ message }}</p>{% endif %}
{% if error_message %}<p class="flash">{{ error_message }}</p>{% endif %}

<section class="panel policy-selector">
  <div class="panel-body">
    <form method="get" action="/dashboard/rules" class="stack-form">
      <label>Add rules to
        <select name="policy_id" onchange="this.form.submit()">
          {% for option in target_options %}
          <option value="{{ option.policy_id }}" {% if option.policy_id == selected_policy_id %}selected{% endif %}>{{ option.label }}</option>
          {% endfor %}
        </select>
      </label>
    </form>
  </div>
</section>

{% for group in grouped_rules %}
<details class="rules-group" {% if loop.first %}open{% endif %}>
  <summary class="rules-group-header">
    <span class="rules-group-title">{{ group.category_label }} Rules</span>
    <span class="rules-group-stats">{{ group.rules|length }} rule{{ "s" if group.rules|length != 1 }}</span>
  </summary>
  <div class="rules-group-body">
    {% for rule in group.rules %}
    <details class="rule-card rule-card--collapsible">
      <summary class="rule-card-summary">
        <span class="rule-card-summary-name">{{ rule.name }}</span>
        {% if rule.description %}<span class="rule-card-summary-desc muted">{{ rule.description }}</span>{% endif %}
        <span class="rule-card-summary-actions">
          {% if rule.already_added %}<span class="badge">Already added</span>{% endif %}
          <span class="badge {{ rule.effect_badge_class }}">{{ rule.effect }}</span>
        </span>
      </summary>
      <div class="rule-card-header">
        <div>
          <p><code>{{ rule.action_type }}</code></p>
        </div>
      </div>
      <div class="rule-card-body">
        {% if rule.constraint_rows %}
        <dl class="kv constraint-list">
          {% for row in rule.constraint_rows %}
          <dt>{{ row.label }}</dt>
          <dd>{% if row.monospace %}<code>{{ row.value }}</code>{% else %}{{ row.value }}{% endif %}</dd>
          {% endfor %}
        </dl>
        {% endif %}
      </div>
      <div class="rule-card-actions">
        {% if rule.already_added %}
        <button class="btn btn-secondary" type="button" disabled>Already added</button>
        {% else %}
        <form method="post" action="/dashboard/policy/{{ selected_policy_id }}/rules/add">
          <input type="hidden" name="rule_id" value="{{ rule.rule_id }}" />
          <input type="hidden" name="selected_policy_id" value="{{ selected_policy_id }}" />
          <input type="hidden" name="return_to" value="library" />
          <button class="btn btn-primary" type="submit">Add to Policy</button>
        </form>
        {% if rule.constraint_inputs %}
        <details class="inline-reveal">
          <summary class="btn btn-secondary">Customize Values</summary>
          <form method="post" action="/dashboard/policy/{{ selected_policy_id }}/rules/add_custom" class="stack-form inline-form-panel">
            <input type="hidden" name="rule_id" value="{{ rule.rule_id }}" />
            <input type="hidden" name="selected_policy_id" value="{{ selected_policy_id }}" />
            <input type="hidden" name="return_to" value="library" />
            {% for field in rule.constraint_inputs %}
            <label>{{ field.label }}
              {% if field.input_tag == "textarea" %}
              <textarea name="constraint__{{ field.key }}" rows="3">{{ field.value }}</textarea>
              {% else %}
              <input type="{{ 'number' if field.field_type == 'number' else 'text' }}" name="constraint__{{ field.key }}" value="{{ field.value }}" />
              {% endif %}
            </label>
            {% if field.help_text %}<p class="muted">{{ field.help_text }}</p>{% endif %}
            {% endfor %}
            <button class="btn btn-primary" type="submit">Add Customized Rule</button>
          </form>
        </details>
        {% endif %}
        {% endif %}
      </div>
    </details>
    {% endfor %}
  </div>
</details>
{% endfor %}
{% endblock %}