{% extends "base.html" %}
{% from "_macros.html" import bar_chart %}
{% block title %}Parent dashboard{% endblock %}
{% block content %}
<section class="hero dashboard-hero">
  <div class="hero-copy">
  <p class="eyebrow">PARENT WORKSPACE</p>
  <h1>Welcome back, {{ parent.full_name }}</h1>
  <p>Track introduction requests and manage placement terms with your nanny.</p>
  </div>
  <div class="hero-actions">
    <a class="btn" href="{{ url_for('index') }}">Find a nanny <span aria-hidden="true">→</span></a>
    <a class="btn subtle" href="{{ url_for('parent_ai_tutor') }}">Online AI tutor</a>
    <a class="btn subtle" href="{{ url_for('account_profile') }}">Profile picture</a>
    <a class="btn subtle" href="{{ url_for('account_password') }}">Account settings</a>
  </div>
</section>

<section class="dashboard-summary">
  <article class="card">
    <span class="metric-label">Search access</span>
    <strong class="status-pill {% if parent.paid_at %}status-approved{% else %}status-pending{% endif %}">
      {% if parent.paid_at %}Active{% else %}Payment required{% endif %}
    </strong>
    {% if parent.paid_at %}
    <p class="metric-foot">Access confirmed {{ parent.paid_at }} UTC</p>
    {% else %}
    <p class="metric-foot">KES 3,000 search access fee</p>
    <a href="{{ url_for('parent_paywall', next=url_for('parent_account')) }}">Continue to payment →</a>
    {% endif %}
  </article>
  <article class="card">
    <span class="metric-label">Introduction requests</span>
    <strong class="dashboard-number">{{ inquiries|length }}</strong>
    <p class="metric-foot">Requests submitted for your family</p>
  </article>
  <article class="card">
    <span class="metric-label">Active placements</span>
    <strong class="dashboard-number">{{ placements|selectattr('status', 'equalto', 'active')|list|length }}</strong>
    <p class="metric-foot">Agreements active with your family</p>
  </article>
</section>

<section class="chart-grid" aria-label="Your activity charts">
  {{ bar_chart("Introduction requests", "Your requests received over the last six months.", inquiry_activity) }}
  {{ bar_chart("Placement status", "Your current and past placement agreements.", placement_status) }}
</section>

<section class="dashboard-section">
  <div class="section-heading">
    <div><h2>Your introduction requests</h2><p>Keep track of nanny searches and next steps.</p></div>
    <a href="{{ url_for('index') }}">Browse matches →</a>
  </div>
  {% if not inquiries %}
  <div class="card empty-state">
    <p>You have not requested an introduction yet.</p>
    <a class="btn small" href="{{ url_for('index') }}">Start a nanny search</a>
  </div>
  {% else %}
  <div class="stack">
    {% for inquiry in inquiries %}
    {% set existing_placement = namespace(active=false, proposed=false) %}
    {% for placement in placements %}
      {% if placement.inquiry_id == inquiry.id and placement.status == 'active' %}
        {% set existing_placement.active = true %}
      {% elif placement.inquiry_id == inquiry.id and placement.status == 'proposed' %}
        {% set existing_placement.proposed = true %}
      {% endif %}
    {% endfor %}
    <article class="card request-card">
      <div class="nanny-top">
        <div>
          <h3>{{ inquiry.nanny_name }}</h3>
          <p class="muted">{{ inquiry.nanny_area }} · Requested {{ inquiry.created_at }} UTC</p>
          {% if inquiry.message %}<p class="bio">{{ inquiry.message }}</p>{% endif %}
        </div>
        <strong class="status-pill {% if existing_placement.active %}status-approved{% elif inquiry.status == 'handled' %}status-handled{% else %}status-pending{% endif %}">
          {% if existing_placement.active %}Hired{% elif existing_placement.proposed %}Placement in progress{% elif inquiry.hired_at %}Past placement{% elif inquiry.status == 'handled' %}Introduction handled{% else %}Requested{% endif %}
        </strong>
      </div>
      {% if parent.paid_at and not existing_placement.active and not existing_placement.proposed %}
      <a class="btn small" href="{{ url_for('parent_propose_placement', inquiry_id=inquiry.id) }}">Propose placement terms</a>
      {% endif %}
    </article>
    {% endfor %}
  </div>
  {% endif %}
</section>

<section class="dashboard-section">
  <div class="section-heading">
    <div><h2>Placements and agreements</h2><p>Agreed terms and contract status in one place. Keep a signed employment contract separately.</p></div>
  </div>
  <div data-placement-live data-fragment-url="{{ url_for('placement_fragment') }}">
    <p class="alert" data-live-notice role="status" hidden></p>
    <div data-placement-cards>{% include "placement_cards.html" %}</div>
  </div>
</section>
<div class="dashboard-section" data-attendance-live data-fragment-url="{{ url_for('attendance_fragment') }}">
  <p class="alert" data-attendance-notice role="status" hidden></p>
  <div data-attendance-panel>{% include "attendance_panel.html" %}</div>
</div>
<script src="{{ url_for('static', filename='socket.io.min.js') }}" defer></script>
<script src="{{ url_for('static', filename='placement-live.js') }}" defer></script>
{% endblock %}