{% extends "organizations/admin/sso_edit.html" %}

{% load blocktrans trans from i18n %}
{% load crispy from crispy_forms_tags %}

{% block organization_edit_content_subheader %}
  {% trans "SAML integration" %}
{% endblock organization_edit_content_subheader %}

{% block organization_edit_sidebar_help_topics %}
  {% include "includes/elements/link.html" with url="https://docs.readthedocs.io/en/stable/guides/set-up-single-sign-on-saml.html" text=_("How to set up single sign-on with SAML") is_external=True class="item" %}
  {% include "includes/elements/link.html" with url="https://docs.readthedocs.io/en/stable/commercial/single-sign-on.html" text=_("Organization single sign-on") is_external=True class="item" %}
{% endblock organization_edit_sidebar_help_topics %}

{% block organization_edit_content %}
  {% if not sso_saml_enabled %}
    {% include "organizations/includes/feature_disabled.html" with organization=organization plan="Pro" %}
  {% endif %}

  {% if sso_integration %}
    <div class="ui basic segment">
      <div class="ui message">
        <div class="header">{% trans "Invite new users into your organization" %}</div>
        <p>
          {% trans "You can invite people to join your organization by sending them this link:" %}
        </p>

        <div class="ui fluid action input">
          <input type="text"
                 readonly
                 id="rtd-saml-login-url"
                 value="{{ rtd_saml_login_url }}" />
          <button class="ui right icon button"
                  data-clipboard-target="#rtd-saml-login-url">
            <i class="fas fa-copy icon"></i>
          </button>
        </div>
      </div>

      <div class="ui message">
        <div class="header">
          {% trans "Invite existing users into your organization" %}
        </div>
        <p>
          {% trans "You can invite existing users to join your organization by sending them this link:" %}
        </p>

        <div class="ui fluid action input">
          <input type="text"
                 readonly
                 id="rtd-saml-connect-url"
                 value="{{ rtd_saml_connect_url }}" />
          <button class="ui right icon button"
                  data-clipboard-target="#rtd-saml-connect-url">
            <i class="fas fa-copy icon"></i>
          </button>
        </div>
      </div>
    </div>
  {% endif %}

  {% if sso_saml_enabled %}
    <div class="ui segment">
      <h3>{% trans "Configure your SAML provider" %}</h3>

      <p>
        {% blocktrans %}
          Use the following information to configure your SAML integration in your identity provider (IdP).
        {% endblocktrans %}
      </p>

      <div class="ui form">
        <div class="field">
          <label>{% trans "Single sign-on URL" %}</label>
          <div class="ui fluid action input">
            <input type="text"
                   value="{{ rtd_saml_sso_url }}"
                   id="saml-sso-url"
                   readonly="true">
            <button class="ui right icon button"
                    data-clipboard-target="input#saml-sso-url">
              <i class="fas fa-copy icon"></i>
            </button>
          </div>
        </div>
        <div class="field">
          <label>{% trans "Audience URI (SP entity ID)" %}</label>
          <div class="ui fluid action input">
            <input type="text"
                   value="{{ rtd_saml_sp_url }}"
                   id="saml-sp-url"
                   readonly="true">
            <button class="ui right icon button"
                    data-clipboard-target="input#saml-sp-url">
              <i class="fas fa-copy icon"></i>
            </button>
          </div>
        </div>
        <div class="field">
          <label>{% trans "Name ID format" %}</label>
          <div class="ui fluid action input">
            <input type="text"
                   value="EmailAddress"
                   id="saml-name-id-format"
                   readonly="true">
            <button class="ui right icon button"
                    data-clipboard-target="input#saml-name-id-format">
              <i class="fas fa-copy icon"></i>
            </button>
          </div>
        </div>
        <div class="field">
          <label>{% trans "Application username" %}</label>
          <div class="ui fluid action input">
            <input type="text"
                   value="Email"
                   id="saml-application-username"
                   readonly="true">
            <button class="ui right icon button"
                    data-clipboard-target="input#saml-application-username">
              <i class="fas fa-copy icon"></i>
            </button>
          </div>
        </div>
      </div>
    </div>
  {% endif %}

  {% if sso_integration %}
    <div class="ui basic segment">
      <h3>{% trans "SAML integration details" %}</h3>

      <form class="ui form" method="post" action=".">
        {% csrf_token %}
        {{ form | crispy }}
        <input class="ui submit primary button"
               type="submit"
               name="submit"
               value="{% trans "Update" %}" />
      </form>

      <div class="ui form">
        <div class="field">
          <label>{% trans "Entity ID" %}</label>
          <div class="ui fluid input">
            <input type="text" value="{{ saml_app_config.entity_id }}" readonly>
          </div>
        </div>
        <div class="field">
          <label>{% trans "Single sign-on URL" %}</label>
          <div class="ui fluid input">
            <input type="text" value="{{ saml_app_config.sso_url }}" readonly>
          </div>
        </div>
        <div class="field">
          <label>{% trans "Single logout URL" %}</label>
          <div class="ui fluid input">
            <input type="text" value="{{ saml_app_config.slo_url }}" readonly>
          </div>
        </div>
        <div class="field">
          <label>{% trans "Certificate" %}</label>
          <div class="ui fluid input">
            <textarea readonly>{{ saml_app_config.x509cert }}</textarea>
          </div>
        </div>
      </div>
    </div>
  {% else %}
    <div class="ui basic fitted {% if not sso_saml_enabled %}disabled{% endif %} segment">
      <h3>{% trans "Create SAML integration" %}</h3>

      <form class="ui form" method="post" action=".">
        {% csrf_token %}
        {{ form | crispy }}
        <input class="ui submit primary button"
               type="submit"
               name="submit"
               value="{% trans "Create" %}" />
      </form>
    </div>
  {% endif %}
{% endblock organization_edit_content %}