FreedomBox/plinth/modules/wireguard/templates/wireguard.html

{% extends "app.html" %}
{% comment %}
# SPDX-License-Identifier: AGPL-3.0-or-later
{% endcomment %}

{% load bootstrap %}
{% load i18n %}
{% load extras %}

{% block configuration %}
  <h3>{% trans "As a Server" %}</h3>

  {% if server.public_key %}
    <h4>{% trans "Server" %}</h4>

    <p>
      {% blocktrans trimmed %}
        Information for this {{ box_name }}:
      {% endblocktrans %}
    </p>

    <div class="table-responsive">
      <table class="table" id="server-info-table">
        <tr>
          <th>{% trans "Property" %}</th>
          <th>{% trans "Value" %}</th>
        </tr>
          <tr>
            <td>{% trans "Public Key" %}</td>
            <td>{{ server.public_key }}</td>
          </tr>
            <tr>
              <td>{% trans "Endpoint(s)" %}</td>
              <td>
                <pre>{% for endpoint in server_endpoints %}{{ endpoint }}
{% endfor %}</pre>
              </td>
          </tr>
          <tr>
            <td>
              {% blocktrans trimmed %}
                {{ box_name }} VPN IP for services
              {% endblocktrans %}
            </td>
            <td>{{ server.ip_address }}</td>
          </tr>
      </table>
    </div>

    <h4>{% trans "Peers" %}</h4>

    <p>{% trans "Peers allowed to connect to this server:" %}</p>

    <div class="table-responsive">
      <table class="table" id="server-peers-list">
        <tr>
          <th>{% trans "Public Key" %}</th>
          <th>{% trans "Allowed IPs" %}</th>
          <th>{% trans "Last Connected Time" %}</th>
        </tr>
        {% if server.peers %}
          {% for peer in server.peers.values %}
            {% if peer.public_key %}
              <tr>
                <td>
                  <a href="{% url 'wireguard:show-client' peer.public_key|urlencode:'' %}">
                    {{ peer.public_key }}
                  </a>
                </td>
                <td>{{ peer.allowed_ips|join:", " }}</td>
                <td>{{ peer.status.latest_handshake|default:'' }}</td>
              </tr>
            {% endif %}
          {% endfor %}
        {% else %}
          <tr>
            <td colspan="3">
              {% blocktrans trimmed %}
                No peers configured to connect to this {{ box_name }} yet.
              {% endblocktrans %}
            </td>
          </tr>
        {% endif %}
      </table>
    </div>

    <div class="btn-toolbar">
      <a title="{% trans 'Auto add a new peer' %}"
         role="button" class="btn btn-primary btn-auto-add-client"
         href="{% url 'wireguard:auto-add-client' %}">
        {% icon 'magic' %}
        {% trans "Add Client Automatically" %}
      </a>
        <a title="{% trans 'Add a new peer' %}"
           role="button" class="btn btn-default btn-add-client"
           href="{% url 'wireguard:add-client' %}">
          {% icon 'plus' %}
          {% trans "Add Allowed Client" %}
        </a>
    </div>
  {% else %}
    <div>
      <p class="alert alert-info">{% trans "WireGuard server not started yet." %}</p>
      <form method="post" action="{% url 'wireguard:enable-server' %}">
        {% csrf_token %}
        <button type="submit" class="btn btn-primary btn-start-server"
                title="{% trans 'Start WireGuard Server' %}">
          {% icon 'rocket' %}
          {% trans "Start WireGuard Server" %}
        </button>
      </form>
    </div>
  {% endif %}

  <h3>{% trans "As a Client" %}</h3>
  <p>
    {% blocktrans trimmed %}
    Servers that {{ box_name }} will connect to:
    {% endblocktrans %}
  </p>
  <div class="table-responsive">
    <table class="table" id="client-peers-list">
      <tr>
        <th>{% trans "Endpoint" %}</th>
        <th>{% trans "Public Key" %}</th>
        <th>{% trans "Last Connected Time" %}</th>
      </tr>
      {% if client_peers %}
        {% for interface, server in client_peers.items %}
          {% for peer in server.peers.values %}
            {% if forloop.first %}
              <tr>
                <td class="peer-endpoint">{{ peer.endpoint }}</td>
                <td class="peer-public-key"
                    data-public-key="{{ peer.public_key }}">
                  <a href="{% url 'wireguard:show-server' interface %}">
                    {{ peer.public_key }}
                  </a>
                </td>
                <td>{{ peer.status.latest_handshake|default:'' }}</td>
              </tr>
            {% endif %}
          {% endfor %}
        {% endfor %}
      {% else %}
        <tr>
          <td colspan="4">
            {% blocktrans trimmed %}
              No connections to remote servers are configured yet.
            {% endblocktrans %}
          </td>
        </tr>
      {% endif %}
    </table>
  </div>

  <div class="btn-toolbar">
    <a title="{% trans 'Add a new server' %}"
       role="button" class="btn btn-default btn-add-server"
       href="{% url 'wireguard:add-server' %}">
      {% icon 'plus' %}
      {% trans "Add Connection to Server" %}
    </a>
  </div>

  {{ block.super }}

{% endblock %}