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

{% load bootstrap %}
{% load i18n %}
{% load static %}

{% block configuration %}
  {{ block.super }}

  <h3>{% trans "Custom Services" %}</h3>

  <div class="btn-toolbar">
    <a href="{% url 'pagekite:add-custom-service' %}" class="btn btn-default"
       role="button" title="{% trans 'Add Custom Service' %}">
      <span class="fa fa-plus" aria-hidden="true"></span>
      {% trans 'Add Custom Service' %}
    </a>
  </div>

  {% if custom_services %}
    <div class="list-group list-group-two-column custom-services">
      {% for service in custom_services %}
        <div class="list-group-item">
          <span class="service primary">
            <span title="Connects {{ service.url }} to {{ service.backend_host }}:{{ service.backend_port }}">
              {% if service.url|slice:":4" == "http" %}
                <a href="{{ service.url }}">{{ service.url }}</a>
              {% else %}
                {{ service.url }}
              {% endif %}
              <br>
              {% blocktrans trimmed with backend_host=service.backend_host backend_port=service.backend_port %}
                connected to {{ backend_host }}:{{ backend_port }}
              {% endblocktrans %}
            </span>
          </span>
          <form class="form secondary" method="post"
                action="{% url 'pagekite:delete-custom-service' %}">
            {% csrf_token %}
            <div class='d-none'>
              {{ service.delete_form.as_p }}
            </div>
            <button type="submit" class="btn btn-default"
                    title="{% trans "Delete this service" %}">
              <span class="fa fa-trash-o" aria-hidden="true"></span>
            </button>
          </form>
        </div>
      {% endfor %}
    </div>
  {% endif %}

{% endblock %}
