{% from 'themes/whitelabel/crud/_macros.html' import render_field, render_form_errors %}

{% macro render_child_field(construct, field, type, data, ds, child_url=none, errors=none) %}
  {% if type.readonly and type.field_type not in ('list',) %}
    <div class="fcu-form-group">
      <label class="fcu-label">{{ construct.t(type.name).capitalize() }}</label>
      {% set value = type.format_value(field, data) if data else "" %}
      <p class="fcu-text" style="font-weight: 500; margin: 0;">{{ value }}</p>
    </div>
  {% elif type.field_type == 'related' %}
    {% if child_url %}
      {% set _pv = namespace(url=child_url) %}
      {{ render_field(construct, field, type, _pv, data, ds, errors=errors) }}
    {% else %}
      <div class="fcu-form-group">
        <label class="fcu-label" for="{{ field }}">
          {{ construct.t(type.name).capitalize() }}
        </label>
        {% set current = type.form_value(data) if data else none %}
        <select class="fcu-form-control"
                name="{{ field }}" id="{{ field }}">
          <option value="">---</option>
          {% for item in type.related_class().search()[0] %}
            {% set pk = item[type.related_class._primary_key] %}
            <option value="{{ pk }}"
                    {% if current and current[type.related_class._primary_key] == pk %}selected{% endif %}>
              {{ item }}
            </option>
          {% endfor %}
        </select>
      </div>
    {% endif %}
  {% elif type.field_type == 'manyrelated' %}
    {% if child_url %}
      {% set _pv = namespace(url=child_url) %}
      {{ render_field(construct, field, type, _pv, data, ds, errors=errors) }}
    {% else %}
      <div class="fcu-form-group">
        <label class="fcu-label">
          {{ construct.t(type.name).capitalize() }}
        </label>
        {% set current_items = type.form_value(data) if data else [] %}
        {% set all_items = type.related_class().search()[0] %}
        <select class="fcu-form-control"
                name="{{ field }}" id="{{ field }}" multiple size="5">
          {% for item in all_items %}
            {% set pk = item[type.related_class._primary_key] %}
            <option value="{{ pk }}"
                    {% for ci in current_items %}{% if ci[type.related_class._primary_key] == pk %}selected{% endif %}{% endfor %}>
              {{ item }}
            </option>
          {% endfor %}
        </select>
        <p class="fcu-text fcu-text--muted" style="margin-top: 4px; font-size: var(--fcu-font-size-sm);">{{ construct.t("crud-select") }}</p>
      </div>
    {% endif %}
  {% else %}
    {{ render_field(construct, field, type, none, data, ds, errors=errors) }}
  {% endif %}
{% endmacro %}

{% if edit_actions %}
  <div style="display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px;">
    {% for action in edit_actions %}
      <a href="{{ action.href }}"
         class="fcu-btn"
         up-follow
         up-target="{{ nested_content_target }}"
         up-history="true">
        {{ icon(action.icon, style="font-size: 14px;") }}
        {{ construct.t(action.name) }}
      </a>
    {% endfor %}
  </div>
{% endif %}
<form method="post" action="{{ form_action }}" up-target="{{ nested_content_target }}"
       up-history="true">
  {{ csrf_field() }}
  {% if request.values.get('next') %}<input type="hidden" name="next" value="{{ request.values.get('next') }}">{% endif %}
  {{ render_form_errors(construct, errors) }}
  {% for field, type in child_fields %}
    {{ render_child_field(construct, field, type, form_data, ds, child_url=child_url, errors=errors) }}
  {% endfor %}
  <div style="display: flex; align-items: center; gap: 16px; margin-top: 32px;">
    <button type="submit"
            class="fcu-btn fcu-btn--primary">
      {{ icon("save", style="font-size: 14px;") }}
      {% if is_edit %}{{ construct.t("crud-save-button") }}{% else %}{{ construct.t("crud-create-button") }}{% endif %}
    </button>
    <a href="{{ next_url(cancel_url) }}"
       class="fcu-btn fcu-btn--secondary"
       up-follow
       up-target="{{ nested_content_target }}"
       up-history="true">
      {{ icon("cancel", style="font-size: 14px;") }} {{ construct.t("crud-cancel-button") }}
    </a>
  </div>
</form>