{% from "icons.html.j2" import icon %}

{% macro alarm_ok() %}
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
         class="bi bi-check-circle text-success" viewBox="0 0 16 16">
        <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/>
        <path d="M10.97 4.97a.235.235 0 0 0-.02.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-1.071-1.05z"/>
    </svg>
{% endmacro %}

{% macro alarm_unknown() %}
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
         class="bi bi-question-circle text-muted" viewBox="0 0 16 16">
        <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/>
        <path d="M5.255 5.786a.237.237 0 0 0 .241.247h.825c.138 0 .248-.113.266-.25.09-.656.54-1.134 1.342-1.134.686 0 1.314.343 1.314 1.168 0 .635-.374.927-.965 1.371-.673.489-1.206 1.06-1.168 1.987l.003.217a.25.25 0 0 0 .25.246h.811a.25.25 0 0 0 .25-.25v-.105c0-.718.273-.927 1.01-1.486.609-.463 1.244-.977 1.244-2.056 0-1.511-1.276-2.241-2.673-2.241-1.267 0-2.655.59-2.75 2.286zm1.557 5.763c0 .533.425.927 1.01.927.609 0 1.028-.394 1.028-.927 0-.552-.42-.94-1.029-.94-.584 0-1.009.388-1.009.94z"/>
    </svg>
{% endmacro %}

{% macro alarm_critical() %}
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
         class="bi bi-exclamation-circle text-danger" viewBox="0 0 16 16">
        <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/>
        <path d="M7.002 11a1 1 0 1 1 2 0 1 1 0 0 1-2 0zM7.1 4.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 4.995z"/>
    </svg>
{% endmacro %}

{% macro alarms_table(alarms) %}
    <div class="table-responsive">
        <table class="table table-sm">
            <thead>
            <tr>
                <th scope="col">Resource</th>
                <th scope="col">Aspect</th>
                <th scope="col">State</th>
                <th scope="col">Message</th>
                <th scope="col">Last Update</th>
            </tr>
            </thead>
            <tbody>
            {% for alarm in alarms %}
                <tr class="bg-{% if alarm.alarm_state.name == "OK" %}success{% elif alarm.alarm_state.name == "UNKNOWN" %}dark{% elif alarm.alarm_state.name == "WARNING" %}warning{% else %}danger{% endif %} text-{% if alarm.alarm_state.name == "WARNING" %}dark{% else %}light{% endif %}">
                    <td>{{ alarm.target | describe_brn }}</td>
                    <td>{{ alarm.aspect }}</td>
                    <td>{{ alarm.alarm_state.name }}</td>
                    <td>{{ alarm.text }}</td>
                    <td>{{ alarm.last_updated | format_datetime }}</td>
                </tr>
            {% endfor %}
            </tbody>
        </table>
    </div>
{% endmacro %}

{% macro instances_table(application, instances) %}
    <div class="table-responsive">
        <table class="table table-striped table-sm">
            <thead>
            <tr>
                <th scope="col">Group</th>
                <th scope="col">Provider</th>
                <th scope="col">Region</th>
                <th scope="col">Instance ID</th>
                <th scope="col">Created</th>
                <th scope="col">Alarms</th>
                <th scope="col">Actions</th>
            </tr>
            </thead>
            <tbody>
            {% for instance in instances %}
                {% if not instance.destroyed %}
                    <tr class="align-middle{% if instance.deprecated %} bg-warning{% endif %}">
                        <td>
                            <a href="{{ url_for("portal.group.group_edit", group_id=instance.group.id) }}">{{ instance.group.group_name }}</a>
                        </td>
                        <td>{{ instance.provider }}</td>
                        <td>{{ instance.region }}</td>
                        <td>
                            <code>{{ instance.instance_id }}</code>
                        </td>
                        <td>
                            {{ instance.added | format_datetime }}
                        </td>
                        <td>
                            {% for alarm in [] %}
                                <span title="{{ alarm.alarm_type }}">
                            {% if alarm.alarm_state.name == "OK" %}
                                {{ alarm_ok() }}
                            {% elif alarm.alarm_state.name == "UNKNOWN" %}
                                {{ alarm_unknown() }}
                            {% else %}
                                {{ alarm_critical() }}
                            {% endif %}
                            </span>
                            {% endfor %}
                        </td>
                        <td>
                            {% if application in ["eotk"] %}
                            <a href="{{ url_for("portal." + application + "." + application + "_conf", group_id=instance.group_id) }}"
                               class="btn btn-primary btn-sm">Preview Configuration</a>
                            {% endif %}
                            <a href="https://{{ instance.region }}.console.aws.amazon.com/systems-manager/session-manager/{{ instance.instance_id }}?region={{ instance.region }}" class="btn btn-outline-secondary btn-sm" target="_ssm">
                                {{ icon("terminal") }}
                            </a>
                        </td>
                    </tr>
                {% endif %}
            {% endfor %}
            </tbody>
        </table>
    </div>
{% endmacro %}

{% macro eotk_table(instances) %}
{{ instances_table("eotk", instances) }}
{% endmacro %}

{% macro automations_table(automations) %}
    <div class="table-responsive">
        <table class="table table-striped table-sm">
            <thead>
            <tr>
                <th scope="col">Description</th>
                <th scope="col">Status</th>
                <th scope="col">Enabled</th>
                <th scope="col">Last Run</th>
                <th scope="col">Next Run</th>
                <th scope="col">Actions</th>
            </tr>
            </thead>
            <tbody>
            {% for automation in automations %}
                <tr>
                    <td title="{{ automation.short_name }}">{{ automation.description }}</td>
                    <td title="{{ automation.state.name }}">
                        {% if automation.state.name == "IDLE" %}
                            🕰️
                        {% elif automation.state.name == "RUNNING" %}
                            🏃
                        {% else %}
                            💥
                        {% endif %}
                    </td>
                    <td>{% if automation.enabled %}✅{% else %}❌{% endif %}</td>
                    <td>{{ automation.last_run | format_datetime }}</td>
                    <td>{{ automation.next_run | format_datetime }}</td>
                    <td>
                        <a href="{{ url_for("portal.automation.automation_edit", automation_id=automation.id) }}" class="btn btn-primary btn-sm">View/Edit</a>
                        <a href="{{ url_for("portal.automation.automation_kick", automation_id=automation.id) }}" class="btn btn-success btn-sm">Kick Timer</a>
                    </td>
                </tr>
            {% endfor %}
            </tbody>
        </table>
    </div>
{% endmacro %}

{% macro automation_logs_table(logs) %}
<div class="table-responsive">
        <table class="table table-striped table-sm">
            <thead>
            <tr>
                <th scope="col">Log Created</th>
                <th scope="col">Log</th>
            </tr>
            </thead>
            <tbody>
            {% for log in logs %}
                <tr>
                    <td>{{ log.added | format_datetime }}</td>
                    <td><pre style="overflow: scroll; height: 200px;">{{ log.logs | e }}</pre></td>
                </tr>
            {% endfor %}
            </tbody>
        </table>
    </div>
{% endmacro %}

{% macro groups_table(groups, pool=None) %}
<div class="table-responsive">
        <table class="table table-striped table-sm">
            <thead>
            <tr>
                <th scope="col">Name</th>
                <th scope="col">Description</th>
                <th scope="col">EOTK</th>
                <th scope="col">Sites</th>
                <th scope="col">Actions</th>
            </tr>
            </thead>
            <tbody>
            {% for group in groups %}
                <tr>
                    <td>{{ group.group_name }}</td>
                    <td>{{ group.description }}</td>
                    <td>{% if group.eotk %}✅{% else %}❌{% endif %}</td>
                    <td>{{ group.origins | length }}</td>
                    <td>
                        <a href="{{ url_for("portal.group.group_edit", group_id=group.id) }}" class="btn btn-primary btn-sm">View/Edit</a>
                        {% if pool %}
                        <a href="{{ url_for("portal.pool.pool_group_remove", pool_id=pool.id, group_id=group.id) }}" class="btn btn-danger btn-sm">Remove</a>
                        {% endif %}
                    </td>
                </tr>
            {% endfor %}
            </tbody>
        </table>
    </div>
{% endmacro %}

{% macro origins_table(origins) %}
    <div class="table-responsive">
        <table class="table table-striped table-sm">
            <thead>
            <tr>
                <th scope="col">Name</th>
                <th scope="col">Description</th>
                <th scope="col">Auto-Rotation</th>
                <th scope="col">Smart Proxy</th>
                <th scope="col">Assets Origin</th>
                <th scope="col">Onion Service</th>
                <th scope="col">Group</th>
                <th scope="col">Actions</th>
            </tr>
            </thead>
            <tbody>
            {% for origin in origins %}
                {% if not origin.destroyed %}
                    <tr>
                        <td>
                            <a href="https://{{ origin.domain_name }}" target="_bypass" rel="noopener noreferer"
                               class="btn btn-secondary btn-sm">⎋</a>
                            {{ origin.domain_name }}
                        </td>
                        <td>{{ origin.description }}</td>
                        <td>{% if origin.auto_rotation %}✅{% else %}❌{% endif %}</td>
                        <td>{% if origin.smart %}✅{% else %}❌{% endif %}</td>
                        <td>{% if origin.assets %}✅{% else %}❌{% endif %}</td>
                        <td>{% if origin.onion() %}✅{% else %}❌{% endif %}</td>
                        <td>
                            <a href="{{ url_for("portal.group.group_edit", group_id=origin.group.id) }}">{{ origin.group.group_name }}</a>
                        </td>
                        <td>
                            <a href="{{ url_for("portal.origin.origin_edit", origin_id=origin.id) }}"
                               class="btn btn-primary btn-sm">View/Edit</a>
                            <a href="{{ url_for("portal.origin.origin_destroy", origin_id=origin.id) }}"
                               class="btn btn-danger btn-sm">Destroy</a>
                        </td>
                    </tr>
                {% endif %}
            {% endfor %}
            </tbody>
        </table>
    </div>
{% endmacro %}

{% macro origin_onion_table(origins) %}
    <div class="table-responsive">
        <table class="table table-striped table-sm">
            <thead>
            <tr>
                <th scope="col">Name</th>
                <th scope="col">Description</th>
                <th scope="col">Onion Service</th>
                <th scope="col">Group</th>
                <th scope="col">Actions</th>
            </tr>
            </thead>
            <tbody>
            {% for origin in origins %}
                {% if not origin.destroyed %}
                    <tr>
                        <td>
                            <a href="https://{{ origin.domain_name }}" target="_bypass" rel="noopener noreferer"
                               class="btn btn-secondary btn-sm">⎋</a>
                            {{ origin.domain_name }}
                        </td>
                        <td>{{ origin.description }}</td>
                        <td>
                            {% if origin.onion() %}
                            <a href="https://{{ origin.onion() }}" target="_bypass" rel="noopener noreferer"
                               class="btn btn-secondary btn-sm">⎋</a>
                            {{ origin.onion() }}
                            {% endif %}
                        </td>
                        <td>
                            <a href="{{ url_for("portal.group.group_edit", group_id=origin.group.id) }}">{{ origin.group.group_name }}</a>
                        </td>
                        <td>
                            <a href="{{ url_for("portal.origin.origin_edit", origin_id=origin.id) }}"
                               class="btn btn-primary btn-sm">View/Edit</a>
                        </td>
                    </tr>
                {% endif %}
            {% endfor %}
            </tbody>
        </table>
    </div>
{% endmacro %}

{% macro onions_table(onions) %}
    <div class="table-responsive">
        <table class="table table-striped table-sm">
            <thead>
            <tr>
                <th scope="col">Domain Name</th>
                <th scope="col">Onion Name</th>
                <th scope="col">Description</th>
                <th scope="col">Group</th>
                <th scope="col">Actions</th>
            </tr>
            </thead>
            <tbody>
            {% for onion in onions %}
                {% if not onion.destroyed %}
                    <tr>
                        <td>
                            <a href="https://{{ onion.domain_name }}" target="_bypass" rel="noopener noreferer"
                               class="btn btn-secondary btn-sm">⎋</a>
                            {{ onion.domain_name }}
                        </td>
                        <td>
                            <a href="https://{{ onion.onion_name }}.onion" target="_bypass" rel="noopener noreferer"
                               class="btn btn-secondary btn-sm">⎋</a>
                            {{ onion.onion_name }}
                        </td>
                        <td>{{ onion.description }}</td>
                        <td>
                            <a href="{{ url_for("portal.group.group_edit", group_id=onion.group.id) }}">{{ onion.group.group_name }}</a>
                        </td>
                        <td>
                            <a href="{{ url_for("portal.onion.onion_edit", onion_id=onion.id) }}"
                               class="btn btn-primary btn-sm">View/Edit</a>
                        </td>
                    </tr>
                {% endif %}
            {% endfor %}
            </tbody>
        </table>
    </div>
{% endmacro %}

{% macro pools_table(pools) %}
<div class="table-responsive">
        <table class="table table-striped table-sm">
            <thead>
            <tr>
                <th scope="col">Name</th>
                <th scope="col">Description</th>
                <th scope="col">Actions</th>
            </tr>
            </thead>
            <tbody>
            {% for pool in pools %}
                <tr>
                    <td>{{ pool.pool_name }}</td>
                    <td>{{ pool.description }}</td>
                    <td><a href="{{ url_for("portal.pool.pool_edit", pool_id=pool.id) }}" class="btn btn-primary btn-sm">View/Edit</a></td>
                </tr>
            {% endfor %}
            </tbody>
        </table>
    </div>
{% endmacro %}

{% macro proxies_table(proxies) %}
    <div class="table-responsive">
        <table class="table table-striped table-sm">
            <thead>
            <tr>
                <th scope="col">Origin Domain Name</th>
                <th scope="col">Pool</th>
                <th scope="col">Group</th>
                <th scope="col">Provider</th>
                <th scope="col">URL</th>
                <th scope="col">Created</th>
                <th scope="col">Alarms</th>
                <th scope="col">Actions</th>
            </tr>
            </thead>
            <tbody>
            {% for proxy in proxies %}
                {% if not proxy.destroyed %}
                    <tr class="align-middle{% if proxy.deprecated %} bg-warning{% endif %}">
                        <td>
                            <a href="https://{{ proxy.origin.domain_name }}" class="btn btn-secondary btn-sm"
                               target="_bypass"
                               rel="noopener noreferer">⎋</a>
                            <a href="{{ url_for("portal.origin.origin_edit", origin_id=proxy.origin.id) }}">{{ proxy.origin.domain_name }}</a>
                        </td>
                        <td>{{ proxy.pool.pool_name }}</td>
                        <td>
                            <a href="{{ url_for("portal.group.group_edit", group_id=proxy.origin.group.id) }}">{{ proxy.origin.group.group_name }}</a>
                        </td>
                        <td>{{ proxy.provider }}</td>
                        <td>
                            <a href="{{ proxy.url }}" class="btn btn-secondary btn-sm" target="_bypass"
                               rel="noopener noreferer">⎋</a>
                            <span{% if proxy.deprecated %}
                                class="text-decoration-line-through"{% endif %}>{{ proxy.url }}</span>
                        </td>
                        <td>
                            {{ proxy.added | format_datetime }}
                        </td>
                        <td>
                            {% for alarm in proxy.alarms %}
                                <span title="{{ alarm.alarm_type }}">
                            {% if alarm.alarm_state.name == "OK" %}
                                {{ alarm_ok() }}
                            {% elif alarm.alarm_state.name == "UNKNOWN" %}
                                {{ alarm_unknown() }}
                            {% else %}
                                {{ alarm_critical() }}
                            {% endif %}
                            </span>
                            {% endfor %}
                        </td>
                        <td>
                            {% if proxy.deprecated %}
                                <a href="#" class="disabled btn btn-sm btn-outline-dark">Expiring
                                    in {{ proxy.deprecated | mirror_expiry }}</a>
                                <a href="{{ url_for("portal.proxy.proxy_expire", proxy_id=proxy.id) }}"
                                   class="btn btn-danger btn-sm">Expire</a>
                            {% else %}
                                <a href="{{ url_for("portal.proxy.proxy_block", proxy_id=proxy.id) }}"
                                   class="btn btn-warning btn-sm">Mark blocked</a>
                            {% endif %}
                        </td>
                    </tr>
                {% endif %}
            {% endfor %}
            </tbody>
        </table>
    </div>
{% endmacro %}

{% macro bridgeconfs_table(bridgeconfs) %}
    <div class="table-responsive">
        <table class="table table-striped table-sm">
            <thead>
            <tr>
                <th scope="col">Group</th>
                <th scope="col">Provider</th>
                <th scope="col">Distribution Method</th>
                <th scope="col">Number</th>
                <th scope="col">Actions</th>
            </tr>
            </thead>
            <tbody>
            {% for bridgeconf in bridgeconfs %}
                {% if not bridgeconf.destroyed %}
                    <tr class="align-middle">
                        <td>
                            <a href="{{ url_for("portal.group.group_edit", group_id=bridgeconf.group.id) }}">{{ bridgeconf.group.group_name }}</a>
                        </td>
                        <td>{{ bridgeconf.provider }}</td>
                        <td>{{ bridgeconf.method }}</td>
                        <td>{{ bridgeconf.number }}</td>
                        <td>
                            <a href="{{ url_for("portal.bridgeconf.bridgeconf_edit", bridgeconf_id=bridgeconf.id) }}"
                               class="btn btn-primary btn-sm">View/Edit</a>
                            <a href="{{ url_for("portal.bridgeconf.bridgeconf_destroy", bridgeconf_id=bridgeconf.id) }}"
                               class="btn btn-danger btn-sm">Destroy</a>
                        </td>
                    </tr>
                {% endif %}
            {% endfor %}
            </tbody>
        </table>
    </div>
{% endmacro %}

{% macro bridges_table(bridges) %}
    <div class="table-responsive">
        <table class="table table-striped table-sm">
            <thead>
            <tr>
                <th scope="col">Group</th>
                <th scope="col">Configuration</th>
                <th scope="col">Nickname</th>
                <th scope="col">Hashed Fingerprint</th>
                <th scope="col">Alarms</th>
                <th scope="col">Actions</th>
            </tr>
            </thead>
            <tbody>
            {% for bridge in bridges %}
                {% if not bridge.destroyed %}
                    <tr class="align-middle{% if bridge.deprecated %} bg-warning{% endif %}">
                        <td>
                            <a href="{{ url_for("portal.group.group_edit", group_id=bridge.conf.group.id) }}">{{ bridge.conf.group.group_name }}</a>
                        </td>
                        <td>{{ bridge.conf.description }} ({{ bridge.conf.provider }}/{{ bridge.conf.method }})</td>
                        <td>
                            <a href="https://metrics.torproject.org/rs.html#details/{{ bridge.hashed_fingerprint }}">
                                {{ bridge.nickname }}
                            </a>
                        </td>
                        <td>
                            <code>{{ bridge.hashed_fingerprint }}</code>
                        </td>
                        <td>
                            {% for alarm in bridge.alarms %}
                                <span title="{{ alarm.alarm_type }}">
                            {% if alarm.alarm_state.name == "OK" %}
                                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
                                     class="bi bi-check-circle text-success" viewBox="0 0 16 16">
                                  <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/>
                                  <path d="M10.97 4.97a.235.235 0 0 0-.02.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-1.071-1.05z"/>
                                </svg>
                            {% elif alarm.alarm_state.name == "UNKNOWN" %}
                                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
                                     class="bi bi-question-circle text-muted" viewBox="0 0 16 16">
                                  <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/>
                                  <path d="M5.255 5.786a.237.237 0 0 0 .241.247h.825c.138 0 .248-.113.266-.25.09-.656.54-1.134 1.342-1.134.686 0 1.314.343 1.314 1.168 0 .635-.374.927-.965 1.371-.673.489-1.206 1.06-1.168 1.987l.003.217a.25.25 0 0 0 .25.246h.811a.25.25 0 0 0 .25-.25v-.105c0-.718.273-.927 1.01-1.486.609-.463 1.244-.977 1.244-2.056 0-1.511-1.276-2.241-2.673-2.241-1.267 0-2.655.59-2.75 2.286zm1.557 5.763c0 .533.425.927 1.01.927.609 0 1.028-.394 1.028-.927 0-.552-.42-.94-1.029-.94-.584 0-1.009.388-1.009.94z"/>
                                </svg>
                            {% else %}
                                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
                                     class="bi bi-exclamation-circle text-danger" viewBox="0 0 16 16">
                                  <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/>
                                  <path d="M7.002 11a1 1 0 1 1 2 0 1 1 0 0 1-2 0zM7.1 4.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 4.995z"/>
                                </svg>
                            {% endif %}
                            </span>
                            {% endfor %}
                        </td>
                        <td>
                            {% if bridge.deprecated %}
                                <a href="#" class="disabled btn btn-sm btn-outline-dark">Expiring
                                    in {{ bridge.deprecated | mirror_expiry }}</a>
                            {% else %}
                                <a href="{{ url_for("portal.bridge.bridge_blocked", bridge_id=bridge.id) }}"
                                   class="btn btn-warning btn-sm">Mark blocked</a>
                            {% endif %}
                        </td>
                    </tr>
                {% endif %}
            {% endfor %}
            </tbody>
        </table>
    </div>
{% endmacro %}

{% macro mirrorlists_table(mirrorlists) %}
    <div class="table-responsive">
        <table class="table table-striped table-sm">
            <thead>
            <tr>
                <th scope="col">Pool</th>
                <th scope="col">Provider</th>
                <th scope="col">Format</th>
                <th scope="col">Encoding</th>
                <th scope="col">URI</th>
                <th scope="col">Description</th>
                <th scope="col">Actions</th>
            </tr>
            </thead>
            <tbody>
            {% for list in mirrorlists %}
                {% if not list.destroyed %}
                    <tr class="align-middle">
                        <td>{{ list.pool.pool_name }}</td>
                        <td>{{ list.provider | provider_name }}</td>
                        <td>{{ list.format | format_name }}</td>
                        <td>{{ list.encoding | list_encoding_name }}</td>
                        <td><a href="{{ list.url() }}">{{ list.url() }}</a></td>
                        <td>{{ list.description }}</td>
                        <td>
                            <a href="{{ url_for("portal.list.list_edit", list_id=list.id) }}"
                               class="btn btn-primary btn-sm">View/Edit</a>
                            <a href="{{ url_for("portal.list.list_preview", format_=list.format, pool_id=list.pool.id) }}"
                               class="btn btn-secondary btn-sm">Preview</a>
                            <a href="{{ url_for("portal.list.list_destroy", list_id=list.id) }}"
                               class="btn btn-danger btn-sm">Destroy</a>
                        </td>
                    </tr>
                {% endif %}
            {% endfor %}
            </tbody>
        </table>
    </div>
{% endmacro %}

{% macro webhook_table(webhooks) %}
    <div class="table-responsive">
        <table class="table table-striped table-sm">
            <thead>
            <tr>
                <th scope="col">Description</th>
                <th scope="col">Format</th>
                <th scope="col">URL</th>
            </tr>
            </thead>
            <tbody>
            {% for webhook in webhooks %}
                {% if not webhook.destroyed %}
                    <tr class="align-middle">
                        <td>{{ webhook.description }}</td>
                        <td>{{ webhook.format | webhook_format_name }}</td>
                        <td><code>{{ webhook.url }}</code></td>
                        <td>
                            <a href="{{ url_for("portal.webhook.webhook_destroy", webhook_id=webhook.id) }}"
                               class="btn btn-danger btn-sm">Destroy</a>
                        </td>
                    </tr>
                {% endif %}
            {% endfor %}
            </tbody>
        </table>
    </div>
{% endmacro %}