{% extends 'base.html' %}

{% block content %}

<div class="card card-primary card-outline">
    <div class="card-body">
        {% include "firewall/firewall_nav_tabs.html" %}
        <div class="tab-content" id="custom-content-below-tabContent">
            <div class="tab-pane fade show active" id="custom-content-below-home" role="tabpanel" aria-labelledby="custom-content-below-home-tab">
                <table class="table table-striped table-hover">
                    <thead>
                        <tr>
                            <th>Instance</th>
                            <th>Protocol</th>
                            <th>Port</th>
                            <th>Destination</th>
                            <th>Allow Forward</th>
                            <th>Masquerade Source</th>
                            <th><i class="far fa-edit"></i></th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for redirect_rule in redirect_rule_list %}
                            <tr>
                                <td>{{ redirect_rule.wireguard_instance }}</td>
                                <td>{{ redirect_rule.get_protocol_display }}</td>
                                <td>{{ redirect_rule.port }}</td>
                                <td>
                                    {% if redirect_rule.peer %}
                                        <a href="/peer/manage/?peer={{ redirect_rule.peer.uuid }}">
                                        {% if redirect_rule.peer.name %}
                                            {{ redirect_rule.peer.name }}
                                        {% else %}
                                            {{ redirect_rule.peer.public_key|slice:":16" }}{% if redirect_rule.peer.public_key|length > 16 %}...{% endif %}
                                        {% endif %}
                                        </a>                    
                                    {% else %}
                                        {{ redirect_rule.ip_address }}
                                    {% endif %}
                                </td>
                                <td>
                                    
                                    {% if redirect_rule.add_forward_rule %}
                                        <i class="fas fa-check"></i>
                                    {% else %}
                                        <i class="fas fa-times"></i>
                
                                    {% endif %}
                                
                                </td>
                                <td>
                                    {% if redirect_rule.masquerade_source %}
                                        <i class="fas fa-check"></i>
                                        <i class="fas fa-exclamation-triangle" title="This serves as a temporary solution when a peer does not use the VPN as its default gateway. It's important to note that this configuration is not recommended, as it alters the source address of all connections to match the IP address of the WireGuard instance."></i>
                                    {% else %}
                                        <i class="fas fa-times"></i>
                
                                    {% endif %}
                
                                </td>
                                <td style="width: 1%; white-space: nowrap;">
                                    <a href="/firewall/manage_port_forward_rule/?uuid={{ redirect_rule.uuid }}" ><i class="far fa-edit"></i></a>
                                </td>
                            </tr>
                        {% endfor %}
                
                    </tbody>
                </table>
                <a href="/firewall/manage_port_forward_rule/" class='btn btn-primary'>Create Port forwarding Rule</a>
                <a href="/firewall/firewall_settings/?chain=porforward" class='btn btn-outline-primary'>Firewall Settings</a>
            </div>
        </div>
    </div>
</div>





{% endblock %}