{% set childIndex = loop is defined ? loop.index - 1 : 0 %}
{#{% set sectionAlias = (child is defined and child.alias is not empty)#}
{#    ? child.alias#}
{#    : ((section is defined and section.alias is not empty)#}
{#    ? section.alias#}
{#    : '') %}#}

    <div id="{{ child is defined ? child.id : '' }}" name="[25]" data-repeater-item>
        <input type="hidden" name="id" value="{{ child.id|default }}">
        <input type="hidden" name="sectionId" value="{{ section.id|default }}">
        <input type="hidden" name="imageId" value="{{ child.id|default }}">

        <ul class="nav nav-tabs nav-line-tabs mb-5 fs-6">
            {% for lang in getLangs() %}
                <li class="nav-item">
                    <a class="nav-link {{ loop.index == 1 ? 'active' }}" data-bs-toggle="tab" href="#kt_tab_pane_{{ section.id|default }}_{{ idx }}_{{ lang.shortTitle|default }}">
                        {{ lang.shortTitle|default|upper }}
                    </a>
                </li>
            {% endfor %}
        </ul>
        <div class="lang-repeater">
            <div class="tab-content my-5" data-repeater-list="langs">
                <div class="p-3">

                    {% if child is defined %}
                            {% set files = [] %}
                            {% set langsForImages = [] %}
                            {% for lang in child.langs|default %}
                                {% set key = lang.lang.shortTitle %}
                                {% set langsForImages = langsForImages|merge({(key): lang.alt}) %}
                            {% endfor %}

                            {% for image in child.images|filter(e => e.del == 0)|default([]) %}
                                {% if image.name|default %}
                                    {% set files = files|merge([{
                                        id: image.id,
                                        name: image.name,
                                        langs: langsForImages,
                                        location: asset('media/news/slider/'~image.name)
                                    }]) %}
                                {% endif %}
                            {% endfor %}
                            {{ include('admin/Common/_dropzone.html.twig', {
                                name: 'image' ~ child.id,
                                labelName: 'Kaydırıcı Resmi',
                                childIndex: childIndex,
                                dimensions: '540x540',
                                files: files,
                                multipleDropzone: true,
                                options: {
                                    maxFiles: 4,
                                }
                            }, with_context = false) }}
                    {% else %}
                            {% set files = [] %}
                            {% set langsForImages = [] %}
                            {% for lang in child.langs|default %}
                                {% set key = lang.lang.shortTitle %}
                                {% set langsForImages = langsForImages|merge({(key): lang.alt}) %}
                            {% endfor %}

                            {% for image in child.images|default([]) %}
                                {% if image.name|default %}
                                    {% set files = files|merge([{
                                        id: image.id,
                                        name: image.name,
                                        langs: langsForImages,
                                        location: asset('media/news/'~image.name)
                                    }]) %}
                                {% endif %}
                            {% endfor %}
                            {{ include('admin/Common/_dropzone.html.twig', {
                                name: 'image',
                                labelName: 'Kaydırıcı Resmi',
                                sectionId: section is defined ? section.id : null,
                                childIndex: childIndex,
                                dimensions: '540x540',
                                files: files,
                                multipleDropzone: true,
                                options: {
                                    maxFiles: 4,
                                }
                            }, with_context = false) }}
                    {% endif %}
                </div>
                {% for lang in getLangs() %}
                    {% set pageLang = child is defined ? getNewsSlidersLangs({'NewSlider': child, 'lang': lang.shortTitle}) : {} %}

                    <div class="tab-pane fade {{ loop.first ? 'show active' }}"  id="kt_tab_pane_{{ section.id|default }}_{{ idx }}_{{ lang.shortTitle }}" data-id="{{ pageLang.id|default }}" data-shorttitle="{{ lang.shortTitle }}" role="tabpanel" data-repeater-item>
                        <input type="hidden" name="key" value="{{ lang.shortTitle }}">
                        <input type="hidden" name="section_lang" value="{{ pageLang.id|default }}">
                        <div class="form-group row">
                                <div class="col-12 p-3">
                                    <label class="form-label" for="section_0_lang_{{ lang.shortTitle }}_text">Resim Açıklaması</label>
                                    <textarea id="section_0_lang_{{ lang.shortTitle }}_text" class="tox-target reindex-field" name="lang[{{ lang.shortTitle }}][text]">{{ pageLang.description|default|raw }}</textarea>
                                </div>
                        </div>
                    </div>
                {% endfor %}
            </div>
        </div>
            <a href="javascript:void(0)" data-repeater-delete class="btn btn-sm btn-light-danger">
                <i class="ki-duotone ki-trash fs-5">
                    <span class="path1"></span>
                    <span class="path2"></span>
                    <span class="path3"></span>
                    <span class="path4"></span>
                    <span class="path5"></span>
                </i> Sil
            </a>
        {#        <div class="fv-row mb-10">#}
        {#            <input type="hidden" name="image_ids" value="{{ sectionımages|column('serverıd')|json_encode|raw }}">#}
        {#            <label class="col-lg-2 col-form-label text-lg-right">resimler:</label>#}
        {#            <div class="dropzone text-start" id="dropzone_{{ idx }}" data-images="{{ sectionımages|json_encode|raw|e('html_attr') }}">#}
        {#                <div class="dz-message needsclick">#}
        {#                    <i class="ki-duotone ki-file-up fs-3x text-primary">#}
        {#                        <span class="path1"></span>#}
        {#                        <span class="path2"></span>#}
        {#                    </i>#}
        {#                    <div class="ms-4">#}
        {#                        <h3 class="fs-5 fw-bold text-gray-900 mb-1">resim eklemek için tıklayın veya resmi bu alana sürükleyin</h3>#}
        {#                        <span class="fs-7 fw-semibold text-gray-500">yalnızca <b>1</b> dosya ekleyebilirsiniz. resimler <b>540x720</b> ebatında olmalıdır.</span><br>#}
        {#                    </div>#}
        {#                </div>#}
        {#                <div class="dropzone-items"></div>#}
        {#            </div>#}
        {#        </div>#}
        <hr class="border border-danger my-10">
    </div>