{% extends "base.html" %}

{% block title %}Files - {{ home_name }}{% endblock %}

{% set active_tab = 'files' %}

{% block content %}
<div class="file-browser">
    {% if rel_path %}
    <div class="breadcrumbs">
        <a href="/files" class="breadcrumb">🏠 {{ home_name }}</a>
        {% for part in rel_path.split('/') %}
        <span class="breadcrumb-sep">›</span>
        {% set cumulative = (cumulative | default('')) ~ '/' ~ part %}
        <a href="/files{{ cumulative }}" class="breadcrumb">{{ part }}</a>
        {% endfor %}
    </div>
    {% endif %}

    <div class="page-header">
        <h1>
            {% if rel_path %}
            {{ rel_path.split('/')[-1] }}
            {% else %}
            {{ home_name }} Home
            {% endif %}
        </h1>
        <p>{{ items | length }} item{{ 's' if items | length != 1 }}</p>
    </div>

    {% if not rel_path %}
    <form class="upload-form" method="POST" action="/upload" enctype="multipart/form-data">
        <label>
            <input type="file" name="file" required>
            Choose file to upload
        </label>
        <input type="hidden" name="path" value="{{ rel_path }}">
        <input type="submit" value="Upload" class="btn">
    </form>
    {% endif %}

    <div class="file-list">
        {% if not items %}
        <div class="empty-state">
            <div class="empty-icon">📁</div>
            <h3>Empty directory</h3>
            <p>No files or folders here yet.</p>
        </div>
        {% else %}
        {% for item in items %}
        <div class="file-row">
            {% if item.thumbnail %}
            <div class="file-thumbnail">
                <img src="{{ item.thumbnail }}" alt="{{ item.name }}" loading="lazy">
            </div>
            {% else %}
            <div class="file-icon">{{ item.icon }}</div>
            {% endif %}
            <div class="file-name">
                {% if item.is_dir %}
                <a href="/files/{{ item.path }}">{{ item.name }}</a>
                {% elif item.is_text %}
                <a href="/view/{{ item.path }}">{{ item.name }}</a>
                {% else %}
                <a href="/download/{{ item.path }}">{{ item.name }}</a>
                {% endif %}
            </div>
            <div class="file-size">
                {% if not item.is_dir %}{{ item.size_str }}{% endif %}
            </div>
            <div class="file-date">{{ item.mtime_str }}</div>
        </div>
        {% endfor %}
        {% endif %}
    </div>
</div>
{% endblock %}