{% extends '@admin/index.twig' %}

{% block content %}
  <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 mb-3 border-bottom">
    <h1 class="h2">
      <i aria-hidden="true" class="bi bi-folder"></i> {{ ad_categ_trans_1 }} {{ ad_categ_trans_2 }}:
      <em>{{ categoryName }}</em>
    </h1>
  </div>
  <div class="row">
    <div class="col-lg-12">
      <form action="./category/update" method="post" accept-charset="utf-8">
        <input type="hidden" name="id" value="{{ categoryId }}">
        <input type="hidden" name="parent_id" value="{{ category.parent_id }}">
        <input type="hidden" name="group_id" value="{{ category.group_id }}">
        <input type="hidden" name="active" value="{{ category.active }}">
        {% if permLevel != basic %}
          <input type="hidden" name="restricted_groups[]" value="{{ groupPermission }}">
        {% else %}
          <input type="hidden" name="restricted_groups[]" value="-1">
        {% endif %}
        <input type="hidden" name="restricted_users" value="{{ userPermission }}">
        {{ csrfInputToken | raw }}

        <div class="row mb-2">
          <label class="col-lg-2 col-form-label" for="name">{{ 'categoryNameLabel' | translate }}:</label>
          <div class="col-lg-4">
            <input type="text" name="name" class="form-control" id="name">
          </div>
        </div>

        <div class="row mb-2">
          <label class="col-lg-2 col-form-label" for="catlang">{{ ad_categ_lang }}:</label>
          <div class="col-lg-4">
            <select name="catlang" id="catlang" class="form-select">
              {{ langToTranslate|raw }}
            </select>
          </div>
        </div>

        <div class="row mb-2">
          <label class="col-lg-2 col-form-label">{{ 'categoryDescriptionLabel' | translate }}</label>
          <div class="col-lg-4">
            <textarea name="description" rows="3" class="form-control"></textarea>
          </div>
        </div>

        <div class="row mb-2">
          <label class="col-lg-2 col-form-label">
            {{ 'categoryOwnerLabel' | translate }}
          </label>
          <div class="col-lg-4">
            <select name="user_id" class="form-control">
              {% for user in userSelection %}
                <option value="{{ user.id }}"{% if user.selected %} selected{% endif %}>
                  {{ user.displayName|e }} ({{ user.login|e }})
                </option>
              {% endfor %}
            </select>
          </div>
        </div>

        <!-- SERP Title -->
        <div class="row mb-2">
          <label class="col-lg-2 col-form-label" for="serpTitle">{{ 'msgSerpTitle' | translate }}</label>
          <div class="col-lg-4">
            <input type="text" name="serpTitle" id="serpTitle" value="" class="form-control">
          </div>
        </div>

        <!-- SERP Description -->
        <div class="row mb-2">
          <label class="col-lg-2 col-form-label" for="serpDescription">{{ 'msgSerpDescription' | translate }}</label>
          <div class="col-lg-4">
                  <textarea type="text" name="serpDescription" id="serpDescription" rows="5" class="form-control">
                  </textarea>
          </div>
        </div>

        <div class="row mb-2">
          <label class="col-lg-2 col-form-label">{{ ad_categ_transalready }}</label>
          <div class="col-lg-4">
            <ul class="list-unstyled">
              {% for language, description in langTranslated %}
                <input type="text" readonly class="form-control-plaintext" id="staticEmail"
                       value="{{ language }}: {{ description }}">
              {% endfor %}
            </ul>
          </div>
        </div>

        <div class="row">
          <div class="offset-lg-2 col-lg-4">
            <button class="btn btn-primary" type="submit" name="submit">
              {{ ad_categ_translatecateg }}
            </button>
          </div>
        </div>

      </form>
    </div>
  </div>
{% endblock %}