{% extends "repository/repo_layout.html" %}
{% set active_tab = 'code' %}

{% block repo_content %}
<div class="space-y-8 flex-1 flex flex-col">
    {# Control Bar #}
    <div class="flex items-center justify-between gap-3 px-1">
        <div class="flex items-center gap-3">
            <button id="branch-select-btn"
                class="flex items-center gap-2 px-3 py-2 rounded-lg bg-white/5 border border-white/10 hover:border-blue-500/50 hover:bg-white/10 transition-all text-sm font-medium text-zinc-300 hover:text-white group shadow-sm">
                <i data-lucide="git-branch" class="h-4 w-4 text-blue-400"></i>
                <span id="current-branch-display">{{ branch }}</span>
            </button>
        </div>

        <div class="flex items-center gap-3">
            {% if repo.can_write %}
            <button id="new-btn"
                class="flex items-center px-4 py-2 rounded-lg bg-blue-600 hover:bg-blue-500 text-white font-bold text-sm shadow-lg shadow-blue-500/20 transition-all duration-300 hover:shadow-blue-500/40">
                <i data-lucide="plus" class="h-4 w-4"></i> <span class="repo-action-label">Add File</span>
            </button>
            {% endif %}

            <button type="button" id="code-dropdown-btn"
                onclick="openModalAnimation(document.getElementById('clone-repo-modal'))"
                class="flex items-center px-4 py-2 rounded-lg bg-emerald-600 hover:bg-emerald-500 text-white font-bold text-sm transition-colors">
                <i data-lucide="download-cloud" class="h-4 w-4"></i>
                <span class="repo-action-label ml-1.5">Code</span>
            </button>

            <button id="commit-history-btn"
                class="flex items-center p-2 sm:pl-3.5 sm:pr-5 py-2 rounded-repo-history bg-white/5 hover:bg-white/10 border border-white/10 hover:border-blue-500/50 transition-all duration-300 group shadow-2xl">
                <i data-lucide="history"
                    class="h-5 w-5 text-zinc-400 group-hover:text-blue-400 transition-all duration-300"></i>
                <span id="repo-commit-count"
                    class="repo-badge items-center justify-center text-[11px] font-black text-blue-400 bg-black/40 backdrop-blur-md px-2.5 py-1 rounded-repo-badge border border-blue-500/20 shadow-[inset_0_0_10px_rgba(var(--theme-r),var(--theme-g),var(--theme-b),0.1)] group-hover:border-blue-500/40 transition-all">{{
                    commit_count }}</span>
            </button>
        </div>
    </div>

    {# File Tree #}
    <div id="file-tree-container" class="file-tree-container rounded-xl overflow-hidden shadow-2xl relative">
        <table class="w-full text-left border-collapse">
            <thead class="bg-white/5 text-xs uppercase tracking-widest font-bold text-zinc-500">
                <tr>
                    <th class="px-4 py-4 border-b border-white/5 w-10 checkbox-column">
                        <div class="flex items-center justify-center">
                            <input type="checkbox" id="select-all-checkbox"
                                class="w-4 h-4 rounded border-zinc-700 bg-zinc-900 text-blue-600 focus:ring-blue-500/20 focus:ring-offset-0 transition-all cursor-pointer">
                        </div>
                    </th>
                    <th class="px-6 py-4 border-b border-white/5 w-auto">Name</th>
                    <th class="px-6 py-4 border-b border-white/5 w-1/2 hidden md:table-cell">Last commit</th>
                    <th class="px-6 py-4 border-b border-white/5 w-auto text-right">Date</th>
                </tr>
            </thead>
            <tbody id="file-tree-body" class="divide-y divide-white/5 text-sm"></tbody>
        </table>
    </div>

    {# README #}
    {% if readme_content %}
    <div class="readme-container rounded-xl overflow-hidden shadow-2xl border border-white/5 hidden opacity-0">
        <div
            class="bg-white/5 px-6 py-4 border-b border-white/5 flex items-center gap-2 sticky top-0 backdrop-blur-md z-10">
            <i data-lucide="book-open" class="h-4 w-4 text-orange-400"></i>
            <span class="text-xs font-bold text-zinc-400 uppercase tracking-widest">README.md</span>
        </div>
        <div class="p-8 md:p-12 bg-black/20">
            <article id="readme-rendered-content" class="markdown-body max-w-none">
                <div class="hidden" id="readme-raw-content">{{ readme_content }}</div>
            </article>
        </div>
    </div>
    {% endif %}
</div>

{# Bulk Actions Positioning #}
<div id="top-actions-container"
    class="fixed top-8 left-1/2 -translate-x-1/2 w-full max-w-lg z-[200] flex flex-col items-stretch px-4 pointer-events-none">
    <div id="bulk-actions-floating-container" class="w-full pointer-events-auto flex flex-col items-stretch">
        <div id="bulk-actions-bar"
            class="bulk-floating-bar bulk-floating-bar-inactive hidden p-4 px-5 flex items-center justify-between w-full">
            <div class="flex items-center gap-4">
                <div
                    class="p-2 rounded-lg bg-blue-500/10 border border-blue-500/20 text-blue-400 min-w-[40px] text-center">
                    <span id="selected-count" class="text-sm font-bold">0</span>
                </div>
                <div class="flex flex-col">
                    <span class="text-sm font-bold text-white">Bulk Actions</span>
                    <span class="text-[10px] font-black text-zinc-500 uppercase tracking-widest">Items Selected</span>
                </div>
            </div>
            <div class="flex items-center gap-2">
                <div class="h-8 w-px bg-white/5 mr-2"></div>
                <button id="bulk-delete-btn"
                    class="flex items-center gap-2 px-3 py-2 rounded-xl hover:bg-red-500/10 text-red-500 transition-all group">
                    <i data-lucide="trash-2" class="h-4 w-4 transition-transform"></i>
                    <span class="text-xs font-bold uppercase tracking-widest">Delete</span>
                </button>
                <button id="clear-selection-btn"
                    class="px-3 py-2 rounded-xl hover:bg-white/5 text-zinc-500 hover:text-zinc-300 transition-all text-xs font-bold uppercase tracking-tight">Cancel</button>
            </div>
        </div>
    </div>
</div>

{# Templates - must be inside repo-content-area for SPA innerHTML replacement to preserve template.content #}
<div class="hidden">
    {% include 'repository_modals/file_tree_row_template.html' %}
    {% include 'repository_modals/breadcrumb_item_template.html' %}
    {% include 'repository_modals/upload_file_row_template.html' %}
    {% include 'repository_modals/commit_history_row_template.html' %}
    {% include 'repository_modals/pull_request_item_template.html' %}
    {% include 'repository_modals/branch_item_template.html' %}
    {% include 'repository_modals/contributor_row_template.html' %}
</div>
{% endblock %}

{% block repo_modals %}
{{ super() }}
<div id="clone-repo-modal"
    class="hidden modal-hidden fixed inset-0 flex items-center justify-center z-[105] p-4 text-white">
    <div class="modal-backdrop fixed inset-0 bg-black/60 modal-transition z-[104]"
        onclick="closeModalAnimation(document.getElementById('clone-repo-modal'))"></div>
    <div
        class="modal-content glass-modal modal-radius-lg w-full max-w-lg max-h-[90vh] flex flex-col modal-content-transition relative z-[105] border border-white/10 overflow-hidden">
        <div class="p-5 border-b border-white/5 flex items-center justify-between flex-shrink-0 bg-white/[0.02]">
            <div class="flex items-center gap-3 min-w-0">
                <div class="p-2.5 bg-emerald-500/10 rounded-xl border border-emerald-500/20">
                    <i data-lucide="download-cloud" class="h-5 w-5 text-emerald-400"></i>
                </div>
                <div class="min-w-0">
                    <h3 class="text-lg font-bold text-white leading-tight">Clone repository</h3>
                    <p class="text-[10px] font-bold uppercase tracking-widest text-zinc-500 mt-0.5">{{ repo_owner }}/{{ repo_name }}</p>
                </div>
            </div>
            <button type="button"
                onclick="closeModalAnimation(document.getElementById('clone-repo-modal'))"
                class="flex-shrink-0 p-2.5 bg-white/[0.03] hover:bg-white/10 border border-white/5 hover:border-white/10 rounded-2xl text-zinc-500 hover:text-white transition-colors"
                aria-label="Close">
                <i data-lucide="x" class="h-5 w-5"></i>
            </button>
        </div>
        <div class="flex-1 overflow-y-auto p-5 space-y-4 custom-scrollbar min-h-0">
            {% set gs = g.settings %}
            {% set clone_pref = gs.get('git_clone_url_preference', 'both') %}
            {% set http_git_on = gs.get('git_transport_http_enabled', '1') == '1' %}
            {% set ssh_git_on = gs.get('git_transport_ssh_enabled', '1') == '1' %}
            {% set ssh_host = clone_ssh_hostname() %}
            {% set ssh_port = (gs.get('git_ssh_listen_port', '2222') or '2222')|int %}
            {% set https_clone_url = (request.host_url.rstrip('/') ~ '/' ~ repo_owner ~ '/' ~ repo_name ~ '.git') %}
            {% if ssh_port == 22 %}
                {% set ssh_clone_url = 'git@' ~ ssh_host ~ ':' ~ repo_owner ~ '/' ~ repo_name ~ '.git' %}
            {% else %}
                {% set ssh_clone_url = 'ssh://git@' ~ ssh_host ~ ':' ~ ssh_port|string ~ '/' ~ repo_owner ~ '/' ~ repo_name ~ '.git' %}
            {% endif %}
            {% set show_https_clone = http_git_on and clone_pref in ('https', 'both') %}
            {% set show_ssh_clone = ssh_git_on and clone_pref in ('ssh', 'both') and ssh_host %}
            {% if show_https_clone %}
            <div>
                <h4 class="text-[10px] font-bold uppercase tracking-widest text-zinc-500 mb-2 block">Clone via HTTPS</h4>
                <div class="flex items-center bg-black/50 rounded-xl border border-white/10 p-1 focus-within:border-white/20 transition-colors">
                    <div class="px-3 text-zinc-500">
                        <i data-lucide="terminal" class="h-4 w-4"></i>
                    </div>
                    <input type="text" value="{{ https_clone_url }}" readonly
                        class="bg-transparent border-none text-xs font-mono text-zinc-300 w-full focus:ring-0 p-0 outline-none select-all placeholder-zinc-700">
                    <button type="button"
                        class="p-2 ml-1 hover:bg-white/10 rounded-lg text-zinc-400 hover:text-white transition-colors"
                        onclick="navigator.clipboard.writeText(this.previousElementSibling.value); window.createToast(Date.now(), 'Copied', 'HTTPS clone URL copied', true);"
                        title="Copy URL">
                        <i data-lucide="copy" class="h-4 w-4"></i>
                    </button>
                </div>
            </div>
            {% endif %}
            {% if show_ssh_clone %}
            <div class="{% if show_https_clone %}pt-3 border-t border-white/5{% endif %}">
                <h4 class="text-[10px] font-bold uppercase tracking-widest text-zinc-500 mb-2 block">Clone via SSH</h4>
                <p class="text-[10px] text-zinc-500 mb-2">Add your public key in User Settings. Non-default port uses <code class="text-zinc-400">ssh://</code> form.</p>
                <div class="flex items-center bg-black/50 rounded-xl border border-white/10 p-1 focus-within:border-white/20 transition-colors">
                    <div class="px-3 text-zinc-500">
                        <i data-lucide="key" class="h-4 w-4"></i>
                    </div>
                    <input type="text" value="{{ ssh_clone_url }}" readonly
                        class="bg-transparent border-none text-xs font-mono text-zinc-300 w-full focus:ring-0 p-0 outline-none select-all placeholder-zinc-700">
                    <button type="button"
                        class="p-2 ml-1 hover:bg-white/10 rounded-lg text-zinc-400 hover:text-white transition-colors"
                        onclick="navigator.clipboard.writeText(this.previousElementSibling.value); window.createToast(Date.now(), 'Copied', 'SSH clone URL copied', true);"
                        title="Copy URL">
                        <i data-lucide="copy" class="h-4 w-4"></i>
                    </button>
                </div>
            </div>
            {% endif %}
            {% if not show_https_clone and not show_ssh_clone %}
            <p class="text-xs text-zinc-500">Git clone over HTTP(S) and SSH are disabled in System Settings, or the SSH host could not be determined from this request.</p>
            {% endif %}
            <div class="pt-2 border-t border-white/5 space-y-1">
                <a id="download-zip-link"
                    href="{{ url_for('git.download_repo_zip', repo_owner=repo_owner, repo_name=repo_name, branch=branch) }}"
                    onclick="closeModalAnimation(document.getElementById('clone-repo-modal'))"
                    class="flex items-center gap-3 w-full px-4 py-3 rounded-xl hover:bg-white/5 text-sm text-zinc-300 hover:text-white transition-all group/link">
                    <div class="bg-orange-500/10 p-2 rounded-lg group-hover/link:bg-orange-500/20 transition-colors">
                        <i data-lucide="file-archive" class="h-4 w-4 text-orange-400"></i>
                    </div>
                    <div class="flex flex-col">
                        <span class="font-bold text-white leading-none">Download ZIP</span>
                        <span class="text-[10px] text-zinc-500 mt-1">Download repository source code</span>
                    </div>
                </a>
            </div>
        </div>
        <div class="p-4 border-t border-white/5 flex-shrink-0 bg-white/[0.02]">
            <button type="button"
                onclick="closeModalAnimation(document.getElementById('clone-repo-modal'))"
                class="w-full glass-button py-3 rounded-xl text-[10px] font-black uppercase tracking-widest text-zinc-400 hover:text-white transition-colors">
                Close
            </button>
        </div>
    </div>
</div>
{% include 'repository_modals/add_file_modal.html' %}
{% include 'repository_modals/create_file_modal.html' %}
{% include 'repository_modals/upload_files_modal.html' %}
{% include 'repository_modals/upload_progress_modal.html' %}
{% include 'repository_modals/policy_blocked_modal.html' %}
{% include 'repository_modals/code_editor_modal.html' %}
{% include 'repository_modals/delete_file_modal.html' %}
{% include 'repository_modals/commit_details_modal.html' %}
{% include 'repository_modals/commit_history_modal.html' %}
{% include 'repository_modals/pull_requests_modal.html' %}
{% include 'repository_modals/create_pr_modal.html' %}
{% include 'repository_modals/view_pr_modal.html' %}
{% include 'repository_modals/branches_modal.html' %}
{% include 'repository_modals/create_branch_modal.html' %}
{% include 'repository_modals/delete_branch_modal.html' %}
{% include 'repository_modals/bulk_delete_modal.html' %}
{% include 'repository_modals/bulk_move_modal.html' %}
{% include 'repository_modals/contributors_modal.html' %}
{% include 'repository_modals/revert_commit_modal.html' %}
{% include 'repository_modals/hard_revert_modal.html' %}
{% if is_admin | default(false) %}
{% include 'repository_modals/ollama_commit_debug_modal.html' %}
{% endif %}
{% endblock %}

{% block scripts %}
{% set max_upload_mb = (g.settings.get('max_upload_size_mb') | default(10)) | int %}
{% set repo_config_js = {
'currentRepoPath': current_repo_path or '',
'canWrite': repo.can_write or false,
'isOwner': repo.is_owner or false,
'isAdmin': is_admin | default(false),
'repoOwner': repo_owner or '',
'repoName': repo_name or '',
'branch': branch or '',
'ollama_enabled': g.settings.get('ollama_enabled', '0') == '1',
'username': session.get('username') or '',
'urls': {
'apiBase': url_for('git.get_repo_tree_data', repo_owner=repo_owner, repo_name=repo_name, full_path=branch) ~ '/',
'repoBase': url_for('git.view_repository', repo_owner=repo_owner, repo_name=repo_name) ~ '/',
'createFile': url_for('git.create_file', repo_owner=repo_owner, repo_name=repo_name),
'uploadFiles': url_for('git.upload_files', repo_owner=repo_owner, repo_name=repo_name),
'previewUploadDiff': url_for('git.preview_upload_diff', repo_owner=repo_owner, repo_name=repo_name),
'getFile': url_for('git.get_file_content', repo_owner=repo_owner, repo_name=repo_name, full_path='__FILE_PATH__'),
'updateFile': url_for('git.update_file', repo_owner=repo_owner, repo_name=repo_name),
'bulkDelete': '/' ~ repo_owner ~ '/' ~ repo_name ~ '/delete_files',
'moveFiles': '/' ~ repo_owner ~ '/' ~ repo_name ~ '/move_files',
'downloadFile': url_for('git.download_file', repo_owner=repo_owner, repo_name=repo_name, file_path='__FILE_PATH__'),
'revertCommit': '/' ~ repo_owner ~ '/' ~ repo_name ~ '/revert_commit/__COMMIT_SHA__',
'commitsAhead': '/' ~ repo_owner ~ '/' ~ repo_name ~ '/commits_ahead/__COMMIT_SHA__',
'resetHard': '/' ~ repo_owner ~ '/' ~ repo_name ~ '/reset_hard/__COMMIT_SHA__',
'commitBase': url_for('git.get_commit_details', repo_owner=repo_owner, repo_name=repo_name, path='__COMMIT_SHA__'),
'rawFileBase': '/' ~ repo_owner ~ '/' ~ repo_name ~ '/raw/' ~ branch ~ '/',
'getAllCommits': '/' ~ repo_owner ~ '/' ~ repo_name ~ '/get_all_commits',
'getUserRepos': '/api/get_user_repos',
'createPr': '/' ~ repo_owner ~ '/' ~ repo_name ~ '/pulls',
'forkRepo': '/' ~ repo_owner ~ '/' ~ repo_name ~ '/fork',
'previewDiff': url_for('git.preview_diff', repo_owner=repo_owner, repo_name=repo_name),
'credits_create_branch_cost': g.settings.credits_create_branch_cost or '5',
'ollamaGenerateCommit': url_for('ollama_generate_commit')
}
} %}
<script>window.REPO_CONFIG = {{ repo_config_js | tojson | safe }}; window.REPO_CONFIG.max_upload_size_mb = {{ max_upload_mb }};</script>
{% endblock %}