{% extends "base.html" %}

{% block title %}Git Contributions - {{ project.name }}{% endblock %}

{% block content %}
<link rel="stylesheet" href="/static/css/project-git.css?v=7">


{% include "_project_subnav.html" %}

<div class="git-header">
    <div class="project-info">
        <h1>{{ project.name }} — Changes</h1>
        <div class="path-chip">{{ project.path }}</div>
    </div>
    <div class="sync-controls">
        <span id="last-sync-time">Loading sync status...</span>
        <button id="sync-btn" class="btn btn-primary">
            <span class="icon">⇄</span>
            <span class="text">Sync Now</span>
        </button>
    </div>
</div>

<div class="stats-row">
    <div class="stat-card">
        <span class="stat-value" id="stat-open-prs">0</span>
        <span class="stat-label">Open PRs</span>
    </div>
    <div class="stat-card">
        <span class="stat-value" id="stat-merged-prs">0</span>
        <span class="stat-label">Merged PRs</span>
    </div>
    <div class="stat-card">
        <span class="stat-value" id="stat-open-issues">0</span>
        <span class="stat-label">Open Issues</span>
    </div>
    <div class="stat-card">
        <span class="stat-value" id="stat-commits">0</span>
        <span class="stat-label">Commits</span>
    </div>
</div>

<div class="filter-tabs">
    <button class="filter-btn active" data-filter="all">All</button>
    <button class="filter-btn" data-filter="pull_request">Pull Requests</button>
    <button class="filter-btn" data-filter="issue">Issues</button>
    <button class="filter-btn" data-filter="commit">Commits</button>
</div>

<div id="contribution-container" class="contribution-list">
    <div class="empty-state">Fetching contributions...</div>
</div>

<div id="toast-container"></div>

<script>
window.PROJECT_ID = {{ project.id }};
window.CURRENT_ENTITY_ID = {{ current_entity.id if current_entity else 'null' }};
</script>
<script src="/static/js/project-git.js?v=7"></script>
{% endblock %}