{% extends "layouts/base.html" %}
{% block title %}My Notes - TryoutPro{% endblock %}
{% block page_title %}My Notes{% endblock %}
{% block breadcrumb %}<span class="breadcrumb">Home / One on One / My Notes</span>{% endblock %}

{% block content %}
<div class="dashboard-grid">
    <!-- Personal Notes Section -->
    <div class="card" style="grid-column: 1 / -1;">
        <div class="card-header">
            <h3><i class="fas fa-user"></i> Personal Notes</h3>
            {% if org_team %}
            <span class="badge badge-coach">Team: {{ org_team.name }}</span>
            {% endif %}
        </div>
        <div class="card-body">
            {% if personal_notes %}
            {% for note in personal_notes %}
            <div class="detail-grid mt-4">
                <div class="detail-item full-width">
                    <span class="detail-label">
                        <i class="fas fa-sticky-note"></i> Note from {{ note.coach.full_name if note.coach else 'Unknown Coach' }}
                    </span>
                    <span class="detail-value">{{ note.content | nl2br }}</span>
                    <div class="mt-2">
                        {% if note.match_id and note.match %}
                        <span class="badge badge-info" title="From match">
                            <i class="fas fa-futbol"></i> Match: {{ note.match.title }}
                        </span>
                        {% endif %}
                        {% if note.team_id and note.team %}
                        <span class="badge badge-warning" title="From team">
                            <i class="fas fa-users"></i> Team: {{ note.team.name }}
                        </span>
                        {% endif %}
                        {% if note.tryout_id and note.tryout %}
                        <span class="badge badge-success" title="From tryout">
                            <i class="fas fa-calendar-alt"></i> Tryout: {{ note.tryout.title }}
                        </span>
                        {% endif %}
                    </div>
                </div>
            </div>
            <p class="text-muted small mt-2">Added: {{ note.created_at.strftime('%B %d, %Y at %I:%M %p') }}</p>
            {% endfor %}
            {% else %}
            <p class="text-muted">No personal notes have been added yet. Your coach may provide individual feedback here.</p>
            {% endif %}
        </div>
    </div>

    <!-- Team Notes Section -->
    <div class="card" style="grid-column: 1 / -1;">
        <div class="card-header">
            <h3><i class="fas fa-users"></i> Team Notes</h3>
            {% if org_team %}
            <span class="badge badge-esport">{{ org_team.name }}</span>
            {% endif %}
        </div>
        <div class="card-body">
            {% if team_notes %}
            {% for note in team_notes %}
            <div class="detail-grid mt-4">
                <div class="detail-item full-width">
                    <span class="detail-label"><i class="fas fa-user"></i> Coach: {{ note.coach.full_name if note.coach else 'Unknown Coach' }}</span>
                    <span class="detail-value">{{ note.content | nl2br }}</span>
                </div>
            </div>
            <p class="text-muted small mt-2">Updated: {{ note.updated_at.strftime('%B %d, %Y at %I:%M %p') }}</p>
            {% endfor %}
            {% else %}
            <p class="text-muted">No team notes have been added yet. Your coach will post improvement suggestions here.</p>
            {% endif %}
        </div>
    </div>
</div>

<div class="card mt-4">
    <div class="card-body text-center">
        <a href="{{ url_for('users.one_on_one') }}" class="btn btn-primary">
            <i class="fas fa-calendar-check"></i> Request One on One Session
        </a>
    </div>
</div>
{% endblock %}