{% extends "base.html" %}
{% block title %}Review Item #{{ item.id }} — NFR{% endblock %}

{% block content %}
<div class="page-header flex-between">
  <div>
    <h1>Review Item #{{ item.id }}</h1>
    <p class="subtitle">
      {% if ingest_record %}{{ ingest_record.original_filename }}{% endif %}
    </p>
  </div>
  <a href="/review" class="btn btn-outline btn-sm">&larr; Review Queue</a>
</div>

{% if item.operator_status != "pending" %}
<div class="alert alert-warning">
  This item has already been actioned:
  <strong>{{ item.operator_status }}</strong>
  by {{ item.operator_id or "operator" }}
  on {{ item.operator_action_at.strftime("%Y-%m-%d %H:%M") if item.operator_action_at else "—" }}
  {% if item.operator_notes %} — "{{ item.operator_notes }}"{% endif %}
</div>
{% endif %}

<div class="grid-2">

  {# ── File details ─────────────────────────────────────────────────────── #}
  <div class="card">
    <div class="card-title">File Details</div>
    <table style="width:100%">
      <tr><td class="text-sm text-muted" style="width:140px">Filename</td>
          <td><strong>{{ ingest_record.original_filename if ingest_record else "—" }}</strong></td></tr>
      <tr><td class="text-sm text-muted">Source</td>
          <td><span class="badge badge-neutral">{{ ingest_record.ingest_source if ingest_record else "—" }}</span></td></tr>
      <tr><td class="text-sm text-muted">Review reason</td>
          <td><span class="badge badge-warning">{{ item.review_reason }}</span></td></tr>
      {% if item.reason_detail %}
      <tr><td class="text-sm text-muted">Detail</td><td class="text-sm">{{ item.reason_detail }}</td></tr>
      {% endif %}
      <tr><td class="text-sm text-muted">Content type</td>
          <td class="text-sm">{{ ingest_record.content_type if ingest_record else "—" }}</td></tr>
      <tr><td class="text-sm text-muted">Queued at</td>
          <td class="text-sm">{{ item.created_at.strftime("%Y-%m-%d %H:%M UTC") if item.created_at else "—" }}</td></tr>
      {% if ingest_record and ingest_record.clickup_task_id %}
      <tr><td class="text-sm text-muted">ClickUp Task</td>
          <td class="mono text-sm"><a href="https://app.clickup.com/t/{{ ingest_record.clickup_task_id }}" target="_blank" rel="noopener">{{ ingest_record.clickup_task_id }} ↗</a></td></tr>
      {% endif %}
    </table>

    {% if item.review_nas_path %}
    <div class="mt-2">
      <div class="text-sm text-muted mb-1">Review queue path:</div>
      <div class="path-text">{{ item.review_nas_path }}</div>
    </div>
    {% endif %}
  </div>

  {# ── Proposed routing ─────────────────────────────────────────────────── #}
  <div class="card">
    <div class="card-title">Proposed Routing</div>
    {% if proposed_project %}
    <div class="text-sm mb-1">
      <strong>Project:</strong>
      <a href="/projects/{{ proposed_project.id }}">
        {{ proposed_project.project_number }} — {{ proposed_project.project_name }}
      </a>
    </div>
    {% endif %}
    {% if item.proposed_destination %}
    <div class="text-sm mb-1">
      <strong>Destination subfolder:</strong>
      <span class="path-text">{{ item.proposed_destination }}</span>
    </div>
    {% endif %}
    {% if item.proposed_confidence %}
    <div class="text-sm mb-1">
      <strong>Confidence:</strong>
      {% set pct = (item.proposed_confidence * 100) | int %}
      {% if pct >= 80 %}
      <span class="badge badge-success">{{ pct }}%</span>
      {% elif pct >= 60 %}
      <span class="badge badge-warning">{{ pct }}%</span>
      {% else %}
      <span class="badge badge-danger">{{ pct }}%</span>
      {% endif %}
    </div>
    {% endif %}

    {# ── Routing reasoning ── #}
    <div style="margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--border);">
      <div class="text-xs text-muted text-uppercase" style="letter-spacing:.04em;font-weight:600;margin-bottom:.5rem;">Why this routing?</div>

      {# Match signal from IngestRecord #}
      {% if ingest_record and ingest_record.match_signal %}
      <div class="text-sm mb-1">
        <strong>Project match signal:</strong>
        <span class="badge badge-neutral">{{ ingest_record.match_signal }}</span>
        {% if ingest_record.match_confidence %}
        <span class="text-muted">({{ (ingest_record.match_confidence * 100) | int }}% confidence)</span>
        {% endif %}
      </div>
      {% endif %}

      {# Sender info #}
      {% if ingest_record and ingest_record.sender_type %}
      <div class="text-sm mb-1">
        <strong>Sender identified as:</strong>
        {{ ingest_record.sender_type }}
        {% if ingest_record.sender_type_signal %}
        <span class="text-muted">(via {{ ingest_record.sender_type_signal }})</span>
        {% endif %}
      </div>
      {% endif %}

      {# RoutingDecision details #}
      {% if routing_decision %}
      {% if routing_decision.winning_rule %}
      <div class="text-sm mb-1">
        <strong>Winning rule:</strong>
        <code>{{ routing_decision.winning_rule }}</code>
        {% if routing_decision.winning_layer %}
        <span class="text-muted">(layer: {{ routing_decision.winning_layer }})</span>
        {% endif %}
      </div>
      {% endif %}

      {% if routing_decision.ai_used %}
      <div class="text-sm mb-1">
        <strong>AI used:</strong> Yes
        {% if routing_decision.ai_model %}
        <span class="text-muted">({{ routing_decision.ai_model }})</span>
        {% endif %}
      </div>
      {% endif %}

      {% if routing_decision.rules_evaluated %}
      <details style="margin-top:.5rem;">
        <summary class="text-xs text-muted" style="cursor:pointer;">Rules evaluated ({{ routing_decision.rules_evaluated | length }})</summary>
        <pre class="mono text-xs" style="overflow-x:auto;white-space:pre-wrap;margin-top:.25rem;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:.5rem;max-height:300px;overflow-y:auto;">{{ routing_decision.rules_evaluated | tojson(indent=2) }}</pre>
      </details>
      {% endif %}
      {% endif %}

      {# No routing info at all #}
      {% if not (ingest_record and ingest_record.match_signal) and not routing_decision %}
      <div class="text-sm text-muted">No routing reasoning data available for this item.</div>
      {% endif %}
    </div>

    {% if item.candidate_projects %}
    <details style="margin-top:.75rem;">
      <summary class="text-xs text-muted" style="cursor:pointer;">Other candidate projects</summary>
      <pre class="mono text-xs" style="overflow-x:auto;white-space:pre-wrap;margin-top:.25rem;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:.5rem;max-height:200px;overflow-y:auto;">{{ item.candidate_projects | tojson(indent=2) }}</pre>
    </details>
    {% endif %}
  </div>

</div>

{# ── File preview ───────────────────────────────────────────────────────────── #}
<div class="card" style="margin-top:1rem;">
  <div class="card-title flex-between">
    <span>File Preview</span>
    <a href="/review/{{ item.id }}/preview" target="_blank" class="btn btn-outline btn-sm" download>Download</a>
  </div>
  {% set ct = ingest_record.content_type if ingest_record else '' %}
  {% if ct and ct.startswith('application/pdf') %}
  <iframe src="/review/{{ item.id }}/preview" style="width:100%;height:600px;border:none;border-radius:var(--radius);"></iframe>
  {% elif ct and ct.startswith('image/') %}
  <div style="text-align:center;padding:1rem;">
    <img src="/review/{{ item.id }}/preview" style="max-width:100%;max-height:600px;border-radius:var(--radius);" alt="{{ ingest_record.original_filename }}" />
  </div>
  {% else %}
  <div style="padding:1.5rem;text-align:center;">
    <p class="text-muted">Preview not available for this file type ({{ ct or 'unknown' }}).</p>
    <a href="/review/{{ item.id }}/preview" class="btn btn-outline" download>Download file</a>
  </div>
  {% endif %}
</div>

{% if item.operator_status == "pending" %}
{# ── Action forms ─────────────────────────────────────────────────────────── #}
<div class="grid-3">

  {# Accept #}
  {% if item.proposed_destination and item.proposed_project_id %}
  <div class="card">
    <div class="card-title">Accept Proposed Routing</div>
    <p class="text-sm mb-2">Write file to proposed NAS destination. Requires confirmation.</p>
    <form method="post" action="/review/{{ item.id }}/accept"
          onsubmit="return confirm('Accept proposed routing?\n\n{{ ingest_record.original_filename if ingest_record else '' }}\n→ {{ item.proposed_destination }}\n\n{% if settings.DRY_RUN_MODE %}NOTE: DRY RUN MODE is active — file will NOT actually be written.{% endif %}')">
      <div class="form-group">
        <label class="form-label">Operator notes <span style="color:var(--color-danger)">*</span></label>
        <textarea class="form-control" name="operator_notes" required
                  placeholder="Brief note on why this routing is correct…"></textarea>
      </div>
      <input type="hidden" name="operator_id" value="operator" />
      <button type="submit" class="btn btn-success">Accept routing</button>
    </form>
  </div>
  {% endif %}

  {# Reroute #}
  <div class="card">
    <div class="card-title">Choose Different Project / Folder</div>
    <p class="text-sm mb-2">Override the proposed routing with a custom project and subfolder.</p>
    <form method="post" action="/review/{{ item.id }}/reroute"
          onsubmit="return confirm('Reroute this file to the selected project and folder?\n\n{% if settings.DRY_RUN_MODE %}NOTE: DRY RUN MODE is active — file will NOT actually be written.{% endif %}')">
      <div class="form-group">
        <label class="form-label">Target project <span style="color:var(--color-danger)">*</span></label>
        <select class="form-control" name="project_id" required>
          <option value="">— Select project —</option>
          {% for p in all_projects %}
          <option value="{{ p.id }}">{{ p.project_number }} — {{ p.project_name[:60] }}</option>
          {% endfor %}
        </select>
      </div>
      <div class="form-group">
        <label class="form-label">Subfolder (relative) <span style="color:var(--color-danger)">*</span></label>
        <input class="form-control" name="destination_subfolder" type="text" required
               placeholder="e.g. 7- surveillance/1- Dessins d'atelier"
               value="{{ item.proposed_destination or '' }}" />
      </div>
      <div class="form-group">
        <label class="form-label">Operator notes <span style="color:var(--color-danger)">*</span></label>
        <textarea class="form-control" name="operator_notes" required
                  placeholder="Brief note on why this routing was chosen…"></textarea>
      </div>
      <input type="hidden" name="operator_id" value="operator" />
      <button type="submit" class="btn btn-warning">Reroute</button>
    </form>
  </div>

  {# Reject #}
  <div class="card">
    <div class="card-title">Reject</div>
    <p class="text-sm mb-2">Mark item as rejected. The file is not deleted from the review queue path.</p>
    <form method="post" action="/review/{{ item.id }}/reject"
          onsubmit="return confirm('Reject this review item? The file will remain on the NAS review queue path.')">
      <div class="form-group">
        <label class="form-label">Reason for rejection <span style="color:var(--color-danger)">*</span></label>
        <textarea class="form-control" name="operator_notes" required
                  placeholder="Explain why this file is being rejected…"></textarea>
      </div>
      <input type="hidden" name="operator_id" value="operator" />
      <button type="submit" class="btn btn-danger">Reject</button>
    </form>
  </div>

</div>
{% endif %}

{# ── ClickUp task context ────────────────────────────────────────────────── #}
{% if clickup_task %}
<div class="card" style="margin-top:1.5rem;">
  <div class="card-title flex-between">
    <span>ClickUp Task Context</span>
    <a href="https://app.clickup.com/t/{{ clickup_task.id }}" target="_blank" rel="noopener" class="btn btn-outline btn-sm">Open in ClickUp ↗</a>
  </div>

  {# Task name #}
  <div style="margin-bottom:1rem;">
    <div class="text-xs text-muted text-uppercase" style="letter-spacing:.04em;font-weight:600;margin-bottom:.25rem;">Task Name</div>
    <div style="font-size:1.05rem;font-weight:600;">{{ clickup_task.name or '—' }}</div>
  </div>

  {# List / Folder info #}
  <div style="display:flex;gap:2rem;flex-wrap:wrap;margin-bottom:1rem;">
    {% if clickup_task.list %}
    <div>
      <span class="text-xs text-muted">List:</span>
      <span class="text-sm">{{ clickup_task.list.name or clickup_task.list.id }}</span>
    </div>
    {% endif %}
    {% if clickup_task.folder %}
    <div>
      <span class="text-xs text-muted">Folder:</span>
      <span class="text-sm">{{ clickup_task.folder.name or clickup_task.folder.id }}</span>
    </div>
    {% endif %}
    {% if clickup_task.status %}
    <div>
      <span class="text-xs text-muted">Status:</span>
      <span class="badge badge-neutral">{{ clickup_task.status.status if clickup_task.status is mapping else clickup_task.status }}</span>
    </div>
    {% endif %}
    {% if clickup_task.tags %}
    <div>
      <span class="text-xs text-muted">Tags:</span>
      {% for tag in clickup_task.tags %}
      <span class="badge badge-neutral" style="margin-left:.25rem;">{{ tag.name if tag is mapping else tag }}</span>
      {% endfor %}
    </div>
    {% endif %}
  </div>

  {# Description #}
  {% if clickup_task.description %}
  <div style="margin-bottom:1rem;">
    <div class="text-xs text-muted text-uppercase" style="letter-spacing:.04em;font-weight:600;margin-bottom:.25rem;">Description</div>
    <pre style="white-space:pre-wrap;word-break:break-word;font-family:inherit;font-size:.875rem;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:.75rem;max-height:400px;overflow-y:auto;">{{ clickup_task.description }}</pre>
  </div>
  {% endif %}

  {# Assignees #}
  {% if clickup_task.assignees %}
  <div style="margin-bottom:1rem;">
    <span class="text-xs text-muted">Assignees:</span>
    {% for a in clickup_task.assignees %}
    <span class="text-sm" style="margin-left:.25rem;">{{ a.username or a.email or a.id }}{% if not loop.last %},{% endif %}</span>
    {% endfor %}
  </div>
  {% endif %}

  {# Comments #}
  {% if clickup_comments %}
  <div style="margin-top:1rem;">
    <div class="text-xs text-muted text-uppercase" style="letter-spacing:.04em;font-weight:600;margin-bottom:.5rem;">Comments ({{ clickup_comments|length }})</div>
    {% for comment in clickup_comments %}
    <div style="border:1px solid var(--border);border-radius:var(--radius);padding:.75rem;margin-bottom:.5rem;background:var(--card-bg);">
      <div style="display:flex;justify-content:space-between;margin-bottom:.25rem;">
        <span class="text-sm" style="font-weight:600;">{{ comment.user.username if comment.user else 'Unknown' }}</span>
        <span class="text-xs text-muted">{{ comment.date | int // 1000 | int }}</span>
      </div>
      <div class="text-sm" style="white-space:pre-wrap;word-break:break-word;">
        {%- set comment_text = [] -%}
        {%- for item in (comment.comment or []) -%}
          {%- if item is mapping and item.text is defined -%}
            {%- if comment_text.append(item.text) -%}{%- endif -%}
          {%- endif -%}
        {%- endfor -%}
        {{ comment_text | join('') or '(no text content)' }}
      </div>
    </div>
    {% endfor %}
  </div>
  {% endif %}
</div>
{% endif %}

{% endblock %}