{% set firstView = fsc.views | first %}
{% set doc = firstView.model %}
{% set currentView = fsc.getCurrentView() %}

<div class="container-fluid">
    <div class="row">
        <div class="col-sm-12">
            {% if fsc.permissions.allowUpdate %}
                <form action="{{ doc.url() }}" method="post" enctype="multipart/form-data"
                      onsubmit="animateSpinner('add')">
                    {{ formToken() }}
                    <input type="hidden" name="activetab" value="{{ currentView.getViewName() }}"/>
                    <input type="hidden" name="action" value="add-file"/>
                    <div class="card border-success shadow mb-3">
                        <div class="card-body p-3">
                            <h5 class="card-title">
                                <i class="fa-solid fa-folder-plus fa-fw"></i> {{ trans('add') }}
                            </h5>
                            <div class="mb-3">
                                <textarea name="observations" class="form-control"
                                          placeholder="{{ trans('observations') }}"></textarea>
                            </div>
                            {% for includeView in getIncludeViews('DocFiles', 'formAddBody') %}
                                {% include includeView['path'] %}
                            {% endfor %}
                            <div class="row align-items-end">
                                <div class="col">
                                    <p class="text-muted mb-2">
                                        {{ trans('help-server-accepts-filesize', {'%size%': currentView.model.getMaxFileUpload()}) }}
                                    </p>
                                    <input type="file" name="new-files[]" class="form-control" multiple required/>
                                </div>
                                <div class="col-auto">
                                    <button type="submit" class="btn btn-success">
                                        <i class="fa-solid fa-save fa-fw" aria-hidden="true"></i> {{ trans('save') }}
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            {% endif %}

            <div class="row row-cols-1 row-cols-md-2 row-cols-lg-3 g-3">
                {% for docfile in currentView.cursor %}
                    {% set file = docfile.getFile() %}
                    <div class="col">
                        <form action="{{ doc.url() }}" method="post" enctype="multipart/form-data"
                              onsubmit="animateSpinner('add')">
                            {{ formToken() }}
                            <input type="hidden" name="activetab" value="{{ currentView.getViewName() }}"/>
                            <input type="hidden" name="id" value="{{ docfile.id }}"/>
                            <input type="hidden" name="action" value=""/>
                            <div class="card shadow h-100">
                                {% if file.isImage() %}
                                    <a href="{{ file.url('download-permanent') }}" target="_blank">
                                        <img src="{{ file.url('download') }}" class="card-img-top"
                                             alt="{{ file.filename }}" loading="lazy">
                                    </a>
                                {% else %}
                                    <div class="p-3">
                                        <a href="{{ file.url('download-permanent') }}" target="_blank"
                                           class="btn w-100 btn-lg btn-secondary" aria-label="{{ trans('download') }} {{ file.filename }}">
                                            {% if file.isPdf() %}
                                                <i class="fa-regular fa-file-pdf fa-fw" aria-hidden="true"></i>
                                            {% elseif file.isVideo() %}
                                                <i class="fa-regular fa-file-video fa-fw" aria-hidden="true"></i>
                                            {% elseif file.isArchive() %}
                                                <i class="fa-regular fa-file-archive fa-fw" aria-hidden="true"></i>
                                            {% else %}
                                                <i class="fa-regular fa-file fa-fw" aria-hidden="true"></i>
                                            {% endif %}
                                            <span class="text-break">{{ file.filename | raw }}</span>
                                        </a>
                                    </div>
                                {% endif %}
                                <div class="card-body p-3">
                                    <div class="mb-3">
                                        <label for="observations-{{ docfile.id }}" class="visually-hidden">{{ trans('observations') }}</label>
                                        <textarea name="observations" id="observations-{{ docfile.id }}" class="form-control"
                                                  placeholder="{{ trans('observations') }}">{{ docfile.observations | raw }}</textarea>
                                    </div>
                                    {% for includeView in getIncludeViews('DocFiles', 'formEditBody') %}
                                        {% include includeView['path'] %}
                                    {% endfor %}
                                    <p class="card-text text-muted small">
                                        {% if docfile.nick %}
                                            <i class="fa-solid fa-user" aria-hidden="true"></i> {{ docfile.nick }}
                                        {% endif %}
                                        <i class="fa-solid fa-calendar-alt ms-3" aria-hidden="true"></i> {{ docfile.creationdate }}
                                    </p>
                                </div>
                                <div class="card-footer p-2">
                                    <div class="d-flex justify-content-between align-items-center">
                                        {% if fsc.permissions.allowDelete %}
                                            <div class="dropdown">
                                                <button class="btn btn-sm btn-outline-danger dropdown-toggle" type="button"
                                                        data-bs-toggle="dropdown" aria-expanded="false"
                                                        aria-label="{{ trans('delete-options') }}">
                                                    <i class="fa-solid fa-trash-alt" aria-hidden="true"></i>
                                                </button>
                                                <ul class="dropdown-menu">
                                                    <li>
                                                        <button type="button"
                                                                onclick="this.form.action.value='unlink-file';this.form.onsubmit();this.form.submit();"
                                                                class="dropdown-item">
                                                            <i class="fa-solid fa-unlink fa-fw" aria-hidden="true"></i> {{ trans('unlink-file') }}
                                                        </button>
                                                    </li>
                                                    <li><hr class="dropdown-divider"></li>
                                                    <li>
                                                        <button type="button"
                                                                onclick="if(confirm('{{ trans('confirm-delete') }}')) { this.form.action.value='delete-file';this.form.submit(); }"
                                                                class="dropdown-item text-danger">
                                                            <i class="fa-regular fa-trash-alt fa-fw" aria-hidden="true"></i> {{ trans('delete-file') }}
                                                        </button>
                                                    </li>
                                                </ul>
                                            </div>
                                        {% endif %}
                                        {% if fsc.permissions.allowUpdate %}
                                            <button type="button" class="btn btn-sm btn-primary"
                                                    onclick="this.form.action.value='edit-file';this.form.onsubmit();this.form.submit();">
                                                <i class="fa-solid fa-save fa-fw" aria-hidden="true"></i> {{ trans('save') }}
                                            </button>
                                        {% endif %}
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                {% endfor %}
            </div>
        </div>
    </div>
</div>