{% extends "base.html" %}
{# The outreach bot's page (spec part 04, hermitcrm/outreach.py). Nothing here is
   ever sent: you send it yourself, then log it (logging it marks the item sent). #}
{% block title %}Outreach{% endblock %}
{% block content %}
{% from "macros.html" import fix_with_ai, hint, more as row_more %}
<h1>Outreach</h1>
{% if send_on %}
<p class="small">Your AI CLI researches and drafts first touches; you review each one before anything goes out.
  {%- call hint('outreach-sending-help', 'How approved messages go out') %} Approved email goes out from here, now or spaced over the working day. LinkedIn is a session where you click Send yourself. Nothing is sent that you did not approve.{% endcall %}
  <a href="/help/outreach">How it works</a> &middot; <a href="/help/sending">Sending</a></p>
{% else %}
<p class="small">Your AI CLI researches and drafts first touches; you review each one and send it yourself. Nothing is sent from here.
  {%- call hint('outreach-sending-help', 'What logging a message does') %} Logging the message on the contact marks its item sent.{% endcall %}
  <a href="/help/outreach">How it works</a></p>
{% endif %}
{% if since_line %}<p class="small outreach-since"><strong>Since last time:</strong> {{ since_line }}. <a href="/learning">Learning</a></p>{% endif %}

{% if gate %}
<p class="warning-box">The outreach bot will not run yet: {{ gate }}. <a href="/settings/playbook">Settings &gt; Playbook</a></p>
{% elif ai_problem %}
<p class="warning-box">{{ ai_problem }}</p>
{% endif %}

{% if gen %}{% set gc = gen.contact %}
<section id="generate" class="outreach-generate">
  <h2>Generate for {{ gc.first_name or gc.name }}</h2>
  <p class="small">{{ gc.name }}{% if gc.title %}, {{ gc.title }}{% endif %} at <a href="/companies/{{ gen.company.slug }}">{{ gen.company.name }}</a>. Nothing runs until you press Generate; the draft appears under Drafts to review.</p>
  {% if gen.open_item %}
  <p>{{ gc.first_name or gc.name }} already has a {{ gen.open_item.kind | replace('-', ' ') }} by {{ gen.open_item.channel }} that is <strong>{{ gen.open_item.state }}</strong>. <a href="/outreach?tab={{ gen.open_tab }}#item-{{ gen.open_item.id }}">Open it</a></p>
  <form method="post" action="/outreach/note" id="gen-form">
    <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
    <input type="hidden" name="contact" value="{{ gen.record }}">
    <input type="hidden" name="back" value="/outreach?contact={{ gen.record }}">
  </form>
  {% else %}
  <form method="post" action="/outreach/build" class="outreach-generate-form" id="gen-form">
    <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
    <input type="hidden" name="contact" value="{{ gen.record }}">
    <input type="hidden" name="back" value="/outreach?contact={{ gen.record }}">
    <label>Draft type <select name="kind"><option value="first-touch"{% if gen.kind == 'first-touch' %} selected{% endif %}>first touch</option><option value="reply-to-interest"{% if gen.kind == 'reply-to-interest' %} selected{% endif %}>reply to interest</option><option value="follow-up"{% if gen.kind == 'follow-up' %} selected{% endif %}>follow-up</option></select></label>
    <label>Channel <select name="channel">{% for c in channels %}<option value="{{ c }}"{% if c == 'email' %} selected{% endif %}>{{ c }}</option>{% endfor %}</select></label>
    <label>Research <select name="research">{% for l in levels %}{% set off = l not in built_levels or (l == 'ai-web' and ai_web_problem) %}<option value="{{ l }}"{% if l == form.research %} selected{% endif %}{% if off %} disabled{% endif %}>{{ l }}{% if l == 'ai-web' and ai_web_problem %} (Claude Code only){% endif %}</option>{% endfor %}</select></label> <span class="small quiet">scrape, then ai-web automatically if it finds nothing</span>
    <label class="check"><input type="checkbox" name="strong" value="1"> stronger model</label>
    <label>Signal (check <a href="{{ (gen.company.linkedin | href) ~ '/insights/' if gen.company.linkedin | href else 'https://www.linkedin.com/company/' ~ gen.company.slug ~ '/insights/' }}" target="_blank" rel="noopener">LinkedIn insights</a>)
      <select name="signal">{% for sg in signals %}<option value="{{ sg }}">{{ signal_labels[sg] }}</option>{% endfor %}</select></label>
    <label>Language <select name="language"><option value="">{{ language_names[gen.language] }} (default)</option>{% for code, name in language_names.items() %}<option value="{{ code }}">{{ name }}</option>{% endfor %}</select></label>
    <button type="submit" data-busy="Generating&hellip;"{% if gate or ai_problem %} disabled{% endif %}>Generate</button>
  </form>
  {% endif %}
  <h3>Notes the draft will use ({{ gen.notes | length }})</h3>
  {% if gen.notes %}<ol class="outreach-note-list small">{% for r in gen.notes %}
    <li>{{ r.text }} <span class="quiet">&middot; {{ fmt_date(r.note.date) }} &middot; {% if r.source_url %}<a href="{{ r.source_url }}" target="_blank" rel="noopener">{{ r.source_url | replace('https://', '') | truncate(40) }}</a>{% else %}{{ 'company' if r.origin == 'company' else 'you' }}{% endif %}</span></li>{% endfor %}
  </ol>{% else %}<p class="small quiet">None yet. Research adds what it finds as notes, and anything you write here or on their page counts too.</p>{% endif %}
  <div class="outreach-add">
    <input name="note" form="gen-form" id="gen-note" placeholder="add a note: something you know about them, or one thing from their site" aria-label="Add a note" autocomplete="off">
    <button type="submit" form="gen-form" formaction="/outreach/note" class="secondary" id="gen-add-note">Add note</button>
  </div>
  <p class="small quiet">Saved as a note when you press Add note (or Enter){% if not gen.open_item %} or Generate{% endif %}, and the draft uses it. {% if gen.company.website %}One thing worth noting may be on <a href="{{ gen.company.website | href }}" target="_blank" rel="noopener">their site</a>.{% endif %}</p>
</section>
{% endif %}

<section class="send-strip" aria-label="Sending" id="send-strip">
{% if send_on %}
  <div class="send-line">
    <strong>Email:</strong>
    {% if send.paused %}<span class="tag warn">paused</span> {{ send.paused_by }}{% else %}on{% endif %}
    &middot; {{ send.sent_today }}/{{ send.cap }} today &middot; {{ send.queued }} queued{% if send.next and not send.paused %} &middot; next {{ send.next.strftime('%a %H:%M') }}{% endif %}
    &middot; {{ send.days | day_span }} {{ send.window | replace('-', '–') }}
    <form method="post" action="/outreach/send/{{ 'resume' if send.paused else 'pause' }}" class="inline">
      <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
      <button type="submit"{% if not send.paused %} class="secondary" title="The kill switch: nothing goes out from the next tick"{% endif %}>{{ 'Resume' if send.paused else 'Pause' }}</button>
    </form>
  </div>
  {% if send.missing %}<p class="warning-box">Sending cannot start: {{ send.missing }} <a href="/settings#send">Settings &gt; Sending</a></p>{% endif %}
  {% if send.overdue %}<p class="small warning">{{ send.overdue }} queued {{ 'email is' if send.overdue == 1 else 'emails are' }} overdue (the Mac may have been asleep). The next tick plans them again, one at a time.</p>{% endif %}
{% else %}
  <p class="small">Email sending is off. <a href="/settings#send">Turn it on in Settings &gt; Sending</a>.</p>
{% endif %}
{% if li.ok %}
  <p class="send-line"><strong>LinkedIn:</strong> invites {{ li.invites_today }}/{{ li.invites_per_day }} today &middot; {{ li.invites_week }}/{{ li.invites_per_week }} this week &middot; messages {{ li.messages_today }}/{{ li.messages_per_day }} today &middot; {{ li.queue }} waiting
    <a class="button secondary" href="/outreach/linkedin">LinkedIn session</a></p>
{% endif %}
</section>

<details class="outreach-build-box"{% if form.left or preview or preview_error %} open{% endif %}>
<summary>Build a batch</summary>
<form class="outreach-build" method="post" action="/outreach/build" id="outreach-build">
  <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
  <input type="hidden" name="batch" value="{{ form.batch }}">
  <input type="hidden" name="left" value="{{ form.left or '' }}">
  <label>Who <input name="where" value="{{ form.where }}" placeholder="stage=prospect; country=DE" size="32"></label>
  <label>Draft type <select name="kind"><option value="first-touch"{% if form.kind == 'first-touch' %} selected{% endif %}>first touch</option><option value="follow-up"{% if form.kind == 'follow-up' %} selected{% endif %}>follow-up</option></select></label>
  <label>Channel <select name="channel">{% for c in channels %}<option value="{{ c }}"{% if c == form.channel %} selected{% endif %}>{{ c }}</option>{% endfor %}</select></label>
  <label>Batch size <input name="limit" type="number" min="1" max="50" value="{{ form.limit }}"></label>
  <label>Approach <select name="approach"><option value="">the best fit per company</option>{% for a in approaches %}<option value="{{ a }}"{% if a == form.approach %} selected{% endif %}>{{ a }}</option>{% endfor %}{% if form.approach and form.approach not in approaches %}<option value="{{ form.approach }}" selected>{{ form.approach }}</option>{% endif %}</select></label>
  <label>Research <select name="research">{% for l in levels %}{% set off = l not in built_levels or (l == 'ai-web' and ai_web_problem) %}<option value="{{ l }}"{% if l == form.research %} selected{% endif %}{% if off %} disabled{% endif %}{% if l == 'ai-web' and ai_web_problem %} title="{{ ai_web_problem }}"{% endif %}>{{ l }}{% if l not in built_levels %} (later){% elif l == 'ai-web' and ai_web_problem %} (Claude Code only){% endif %}</option>{% endfor %}</select></label>
  <label class="check"><input type="checkbox" name="strong" value="1"{% if form.strong %} checked{% endif %}> stronger model</label>
  <button type="submit" formmethod="get" formaction="/outreach" name="preview" value="1" class="secondary">Preview</button>
  <button type="submit" data-busy="Building…"{% if gate or ai_problem %} disabled{% endif %}>{% if form.left %}Build the next one{% else %}Build queue{% endif %}</button>
  {% if form.left %}<a href="/outreach" class="small" id="outreach-stop">Stop</a> <span class="small">Building: {{ form.left }} left</span>{% endif %}
</form>
</details>

{% if preview_error %}<p class="error">{{ preview_error }} {{ fix_with_ai(fix_request) }}</p>{% endif %}
{% if preview %}
<section class="outreach-preview">
  <h2>Preview: {{ preview.picked | length }} would get a draft</h2>
  {% for note in preview.notes %}<p class="warning-box">{{ note }} {{ fix_with_ai(note_requests[loop.index0]) }}</p>
  {% endfor %}
  <p class="small">No AI was run and nothing was written. High-fit companies ({{ preview.fit_field }} &ge; {{ preview.high_fit_threshold }}) never contacted: {{ preview.high_fit_untouched }} of {{ preview.high_fit }}.</p>
  {% if preview.picked %}<ol>{% for c in preview.picked %}
    <li>{{ c.who }} &middot; {% if c.fit is not none %}fit {{ c.fit }}{% else %}no fit score{% endif %} &middot; {{ c.approach or 'no approach' }}{% if c.flags %} <span class="small">({{ c.flags | join('; ') }})</span>{% endif %}</li>
  {% endfor %}</ol>{% endif %}
  {% if preview.over_limit %}<p class="small">Over this batch's limit: {{ preview.over_limit | map(attribute='who') | join(', ') }}</p>{% endif %}
  {% if preview.excluded %}<details><summary>Not this time ({{ preview.excluded | length }})</summary><ul>
    {% for c in preview.excluded %}<li>{{ c.who }}: {{ c.reason }}</li>{% endfor %}
  </ul></details>{% endif %}
  {% if preview.duplicates %}<p class="small">Likely duplicates: {% for a, b, why in preview.duplicates %}<a href="/companies/{{ a }}/merge">{{ a }} / {{ b }}</a> ({{ why }}){% if not loop.last %}; {% endif %}{% endfor %}</p>{% endif %}
</section>
{% endif %}

<nav class="outreach-tabs" aria-label="Outreach items">
  {% for t, label, count in tabs %}<a href="/outreach?tab={{ t }}"{% if t == tab %} aria-current="page" class="on"{% endif %}>{{ label }} ({{ count }})</a>{% if not loop.last %} &middot; {% endif %}{% endfor %}
</nav>

{% if tab == 'drafts' and replies_waiting %}
<p class="small"><a href="/outreach?tab=replies">{{ replies_waiting }} repl{{ 'y' if replies_waiting == 1 else 'ies' }} to interest</a> wait{{ 's' if replies_waiting == 1 }} for an answer.</p>
{% endif %}

{% if tab == 'replies' %}
<section class="outreach-replies">
  <p class="small">Replies you owe an answer. The draft offers your first step and asks one question: no time slot, link or price.
    {%- call hint('replies-help', 'Where these replies come from') %} From the follow-up radar. A reply logged with the outcome <b>interested</b> is listed as it is; for the others, <b>Check replies</b> asks your AI CLI once per reply (no web, no tools) and you confirm what it says.{% endcall %}</p>
  <form method="post" action="/outreach/replies/check" class="inline">
    <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
    <button type="submit" class="secondary" data-busy="Checking replies&hellip;"{% if ai_problem or not replies_unchecked %} disabled{% endif %} title="{% if ai_problem %}{{ ai_problem }}{% else %}{{ replies_unchecked }} not checked yet{% endif %}">Check replies ({{ replies_unchecked }})</button>
  </form>
  {% if reply_rows %}
  <ul class="outreach-reply-list">
  {% for row in reply_rows %}{% set r = row.reply %}{% set it = r.interaction %}
    <li id="reply-{{ it.id }}" class="outreach-reply{% if r.verdict == 'not-interested' %} quiet{% endif %}">
      <p><a href="/companies/{{ r.company.slug }}/contacts/{{ r.contact.slug }}">{{ r.contact.name }}</a> <span class="small">{{ r.company.name }} &middot; {{ it.label }} &middot; {{ fmt_date(it.date) }}{% if r.days %}, {{ r.days }} day{{ "s" if r.days != 1 }} ago{% endif %}</span>
      {% if r.logged %}<span class="tag">interested (logged)</span>
      {% elif r.verdict == 'interested' and r.by == 'you' %}<span class="tag">interested (you)</span>
      {% elif r.verdict == 'interested' %}<span class="tag">AI: interested?</span>
      {% elif r.verdict %}<span class="tag">{{ r.verdict }}{% if r.by == 'you' %} (you){% else %} (AI){% endif %}</span>
      {% else %}<span class="tag">not checked</span>{% endif %}</p>
      <blockquote class="small">{% if it.subject %}<strong>{{ it.subject }}</strong><br>{% endif %}{{ (it.body or '') | truncate(400) }}</blockquote>
      {% if r.why %}<p class="small">AI: {{ r.why }}</p>{% endif %}
      <div class="draft-actions">
      {% if r.interested %}
        <form method="post" action="/outreach/build" class="inline">
          <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
          <input type="hidden" name="contact" value="{{ r.record }}">
          <input type="hidden" name="kind" value="reply-to-interest">
          <input type="hidden" name="back" value="/outreach?tab=replies">
          <select name="channel" aria-label="Reply channel">{% for c in channels %}<option value="{{ c }}"{% if c == it.channel %} selected{% endif %}>{{ c }}</option>{% endfor %}</select>
          <button type="submit" data-busy="Drafting&hellip;"{% if gate or ai_problem %} disabled{% endif %}>Draft a reply</button>
        </form>
      {% endif %}
      {% set can_verdict = not r.logged and (r.verdict != 'interested' or r.by != 'you') %}
      {% if can_verdict and r.to_confirm %}
        <form method="post" action="/outreach/replies/confirm" class="inline">
          <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
          <input type="hidden" name="reply" value="{{ r.key }}">
          <button type="submit" name="answer" value="yes" class="secondary">Confirm: interested</button>
          {% if r.verdict != 'not-interested' %}<button type="submit" name="answer" value="no" class="secondary">Not interested</button>{% endif %}
        </form>
      {% endif %}
      {% if r.contact.email or (can_verdict and not r.to_confirm) %}
      {% call row_more() %}
      {% if can_verdict and not r.to_confirm %}
        <form method="post" action="/outreach/replies/confirm" class="inline">
          <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
          <input type="hidden" name="reply" value="{{ r.key }}">
          <button type="submit" name="answer" value="yes" class="secondary">Interested</button>
          {% if r.verdict != 'not-interested' %}<button type="submit" name="answer" value="no" class="secondary">Not interested</button>{% endif %}
        </form>
      {% endif %}
      {% if r.contact.email %}
        <form method="post" action="/companies/{{ r.company.slug }}/contacts/{{ r.contact.slug }}/opt-out" class="inline">
          <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
          <input type="hidden" name="back" value="/outreach?tab=replies">
          <button type="submit" class="secondary" title="They asked not to be written to: {{ r.contact.email }} goes on the suppression list and their open outreach items are skipped" onclick="return confirm({{ ('Put ' ~ r.contact.email ~ ' on the suppression list? Nothing more is sent to it.') | tojson | forceescape }})">Opted out</button>
        </form>
      {% endif %}
      {% endcall %}
      {% endif %}
      </div>
    </li>
  {% endfor %}
  </ul>
  {% elif not cards %}
  <p class="empty">No replies owed. A reply you log on a contact shows up here until you answer it.</p>
  {% endif %}
</section>
{% endif %}

{% if tab == 'follow-ups' %}
<section class="outreach-followups">
  <p class="small">Messages of yours with no answer after {{ nudge_days }} days.
    {%- call hint('followups-help', 'How follow-ups work') %} From the follow-up radar (Settings: <code>followup_nudge_days</code>). A follow-up is short, has no calendar invite and gives an easy way out; the bot does no research for it. A batch makes one per silence and then lets that person go; draft from their row or the Generate panel to write another, on any channel.{% endcall %}</p>
  {% if due_rows %}
  <ul class="outreach-reply-list">
  {% for f in due_rows %}{% set it = f.interaction %}
    <li id="due-{{ it.id }}" class="outreach-reply">
      <p><a href="/companies/{{ f.company.slug }}/contacts/{{ f.contact.slug }}">{{ f.contact.name }}</a> <span class="small">{{ f.company.name }} &middot; {{ it.label }} &middot; {{ fmt_date(it.date) }}, {{ f.days }} day{{ "s" if f.days != 1 }} ago</span></p>
      <blockquote class="small">{% if it.subject %}<strong>{{ it.subject }}</strong><br>{% endif %}{{ (it.body or '') | truncate(400) }}</blockquote>
      <div class="draft-actions">
        <form method="post" action="/outreach/build" class="inline">
          <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
          <input type="hidden" name="contact" value="{{ f.company.slug }}/{{ f.contact.slug }}">
          <input type="hidden" name="kind" value="follow-up">
          <input type="hidden" name="back" value="/outreach?tab=follow-ups">
          <select name="channel" aria-label="Follow-up channel">{% for c in channels %}<option value="{{ c }}"{% if c == it.channel %} selected{% endif %}>{{ c }}</option>{% endfor %}</select>
          <button type="submit" class="secondary" data-busy="Drafting&hellip;"{% if gate or ai_problem %} disabled{% endif %}>Draft follow-up</button>
        </form>
      </div>
    </li>
  {% endfor %}
  </ul>
  {% elif not cards %}
  <p class="empty">No follow-ups are due. A message you send that gets no answer shows up here after {{ nudge_days }} days.</p>
  {% endif %}
</section>
{% endif %}

{% if tab == 'ready' and send_on %}
<section class="outreach-schedule-all">
  {% if schedule_error %}<p class="error">{{ schedule_error }}</p>{% endif %}
  {% if schedule_preview %}
  <h2>Proposed times</h2>
  <p class="small">Spaced over the sending window with a little jitter, under today's cap, one company a day. Nothing is scheduled until you confirm.</p>
  {% if schedule_preview.rows %}<table class="outreach-times">
    <thead><tr><th>Goes out</th><th>To</th><th>Subject</th></tr></thead>
    <tbody>{% for row in schedule_preview.rows %}<tr><td>{% if row.at %}{{ row.at.strftime('%a') }} {{ fmt_date(row.at) }}, {{ row.at.strftime('%H:%M') }}{% else %}no free slot{% endif %}</td><td>{{ row.who }}</td><td>{{ row.item.subject }}</td></tr>{% endfor %}</tbody>
  </table>{% endif %}
  {% if schedule_preview.refused %}<details class="small"><summary>{{ schedule_preview.refused | length }} cannot be scheduled</summary><ul>{% for id, why in schedule_preview.refused %}<li>{{ id }}: {{ why }}</li>{% endfor %}</ul></details>{% endif %}
  <div class="draft-actions">
    {% if schedule_preview.rows %}<form method="post" action="/outreach/schedule-all" class="inline">
      <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
      <button type="submit">Schedule {{ schedule_preview.rows | length }} email{{ 's' if schedule_preview.rows | length != 1 }}</button>
    </form>{% endif %}
    <a class="button secondary" href="/outreach?tab=ready">Cancel</a>
  </div>
  {% elif ready_email %}
  <form method="get" action="/outreach" class="inline">
    <input type="hidden" name="tab" value="ready">
    <button type="submit" name="schedule" value="all" class="secondary">Schedule all ready email ({{ ready_email }})&hellip;</button>
  </form>
  {% endif %}
</section>
{% endif %}

{% if not cards and tab not in ('replies', 'follow-ups') %}
<p class="empty">{% if tab == 'drafts' %}No drafts to review. Preview a batch above, then build it.{% else %}Nothing here.{% endif %}</p>
{% endif %}

{% macro history(card) %}{% set i = card.item %}
{% if i.ai_body %}
  <details class="outreach-history"{% if card.steps and i.state == 'drafted' %} open{% endif %}>
    <summary>AI original{% if card.steps %} and {{ card.steps | length }} tracked edit{{ 's' if card.steps | length != 1 }}{% endif %}{% if i.earlier %}, {{ i.earlier | length }} regenerated away{% endif %}</summary>
    <p class="small quiet">The AI's original, kept as drafted. Your changes are tracked edits next to it, each with your reason.</p>
    {% if i.ai_subject %}<p class="small"><strong>{{ i.ai_subject }}</strong></p>{% endif %}
    <pre class="outreach-text outreach-original">{{ i.ai_body }}</pre>
    {% if i.ai_pitch %}<p class="small">after they accept</p><pre class="outreach-text outreach-original">{{ i.ai_pitch }}</pre>{% endif %}
    <ol class="outreach-edits">{% for step in card.steps %}{% set e = step.edit %}
      <li><span class="small"><strong>Edit {{ loop.index }}</strong> &middot; {{ ui_datetime(e.at) }} &middot; {{ e.words }} word{{ 's' if e.words != 1 }}</span>
        {% if e.note %}<p class="outreach-edit-note">{{ e.note }}</p>{% else %}<p class="small quiet">No explainer.</p>{% endif %}
        {% if step.subject %}<p class="small">Subject: {{ diff(step.subject) }}</p>{% endif %}
        <pre class="outreach-text outreach-diff">{{ diff(step.body) }}</pre>
        {% if step.pitch %}<p class="small">after they accept</p><pre class="outreach-text outreach-diff">{{ diff(step.pitch) }}</pre>{% endif %}
      </li>{% endfor %}
    </ol>
    {% for old in i.earlier %}
    <p class="small"><strong>Regenerated away</strong> ({{ ui_datetime(old.replaced) }}){% if old.why %}: {{ old.why }}{% endif %}
      &middot; {{ old.edits | length }} tracked edit{{ 's' if old.edits | length != 1 }}</p>
    <pre class="outreach-text outreach-original">{{ old.ai_body }}</pre>
    {% endfor %}
  </details>
{% endif %}
{% endmacro %}
{% macro diff(parts) %}{% for kind, text in parts %}{% if kind == 'add' %}<ins>{{ text }}</ins>{% elif kind == 'del' %}<del>{{ text }}</del>{% else %}{{ text }}{% endif %}{% endfor %}{% endmacro %}

{% macro about_line(counts) %}{% if counts %}{% set more = counts[0] > counts[1] %}<p class="small{% if more %} warning{% endif %}">About you {{ counts[0] }}, about them {{ counts[1] }}{% if more %}: more about you{% endif %}</p>{% endif %}{% endmacro %}
{% macro skip_panel(i) %}
  <form method="post" action="/outreach/{{ i.id }}/skip" class="outreach-skip" id="skip-{{ i.id }}" hidden>
    <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
    <span class="small">Why skip? Pick one to skip.</span>
    <input name="note" placeholder="note (optional, type it first)" size="26" aria-label="Skip note">
    <span class="outreach-skip-reasons">{% for r in skip_reasons %}<button type="submit" name="reason" value="{{ r }}" class="secondary">{{ r }}</button>{% endfor %}</span>
    <button type="button" class="secondary" data-skip-cancel="{{ i.id }}">Cancel</button>
  </form>
{% endmacro %}

<div class="drafts outreach-cards">
{% for card in cards %}{% set i = card.item %}{% set co = card.company %}{% set ct = card.contact %}{% set has_notes = i.kind != 'reply-to-interest' or card.notes.rows %}
<article class="draft outreach-card" id="item-{{ i.id }}">
  <p class="draft-head">
    {% if ct %}<a href="/companies/{{ i.company }}/contacts/{{ i.contact }}">{{ ct.name }}</a>{% else %}{{ i.contact }}{% endif %}
    {% if ct and ct.title %}<span class="small">{{ ct.title }}</span>{% endif %}
    {% if ct and ct.linkedin %}<a href="{{ ct.linkedin | href }}" target="_blank" rel="noopener" class="small">LinkedIn &#8599;</a>{% endif %}
    {% if ct and ct.email %}<a href="mailto:{{ ct.email }}" class="small outreach-email">{{ ct.email }}</a>{% endif %}
    <span class="tag">{{ i.channel }}</span> <span class="tag">{{ i.state }}</span>
    {% if i.kind == 'reply-to-interest' %}<span class="tag">reply to interest</span>{% endif %}
  </p>
  <p class="small">
    {% if co %}<a href="/companies/{{ i.company }}">{{ co.name }}</a> &middot; {{ co.stage }}{% else %}{{ i.company }}{% endif %}
    &middot; {% if card.fit is not none %}fit {{ card.fit }}{% else %}no fit score{% endif %}
    {% if co and co.website %}&middot; <a href="{{ co.website | href }}" target="_blank" rel="noopener">website &#8599;</a>{% endif %}
    &middot; {{ i.approach or 'no approach' }}{% if i.language %} &middot; {{ i.language }}{% endif %}
  </p>
  {% if card.followed.count %}<details class="small outreach-followed"><summary>Followed {{ card.followed.count }} lesson{{ 's' if card.followed.count != 1 }}</summary>
    {% if card.followed.texts %}<ul>{% for t in card.followed.texts %}<li>{{ t }}</li>{% endfor %}</ul>{% endif %}
    {% if card.followed.texts | length < card.followed.count %}<p class="quiet">{{ card.followed.count - card.followed.texts | length }} since retired or reworded.</p>{% endif %}
    <p class="quiet">These lessons were in the prompt for this draft. <a href="/learning?approach={{ i.approach | urlencode }}">Learning</a></p></details>{% endif %}
  {% if card.modeled %}<p class="small outreach-modeled">Modeled on: {% for m in card.modeled %}<a href="{{ m.url }}">{{ m.label }}</a>{% if not loop.last %}, {% endif %}{% endfor %}. <a href="/learning?approach={{ i.approach | urlencode }}#examples">Learning</a></p>{% endif %}
  {% if i.flags %}<ul class="outreach-flags small">{% for f in i.flags %}<li>{{ f }}</li>{% endfor %}</ul>{% endif %}
  {% for key, value in card.proposals %}
  <form method="post" action="/outreach/{{ i.id }}/proposal" class="outreach-proposal small">
    <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
    <input type="hidden" name="key" value="{{ key }}">
    Research found a {{ key }} for an empty field: <strong>{{ value }}</strong>
    <button type="submit" class="secondary">Save to the record</button>
  </form>
  {% endfor %}

  {% if card.reply %}<details class="outreach-their-reply"{% if i.state == 'drafted' %} open{% endif %}><summary>Their reply, {{ fmt_date(card.reply.date) }}</summary>
    <blockquote class="small">{% if card.reply.subject %}<strong>{{ card.reply.subject }}</strong><br>{% endif %}{{ card.reply.body }}</blockquote></details>{% endif %}

  {% if has_notes %}{% set nc = card.notes %}
  <details class="outreach-notes"{% if i.state == 'drafted' %} open{% endif %}>
    <summary>Notes ({{ nc.rows | length }}{% if nc.rows %}, {{ nc.rows | selectattr('used') | list | length }} used{% endif %})</summary>
    <p class="small quiet">The draft is written from these notes, which also appear on their page and the company timeline.</p>
    {% if i.state == 'drafted' and nc.newer %}<p class="small warning">{{ nc.newer }} note{{ 's' if nc.newer != 1 }} added since this draft was written. Regenerate to use {{ 'it' if nc.newer == 1 else 'them' }}.</p>{% endif %}
    <ol class="outreach-note-list">{% for r in nc.rows %}
      <li>{{ r.text }}
        <span class="small">&middot; {{ fmt_date(r.note.date) }} &middot; {% if r.source_url %}<a href="{{ r.source_url }}" target="_blank" rel="noopener">{{ r.source_url | replace('https://', '') | truncate(40) }}</a>{% else %}{{ 'company' if r.origin == 'company' else 'you' }}{% endif %}{% if r.used %} &middot; <strong>used</strong>{% endif %}
        &middot; <a href="/companies/{{ i.company }}/contacts/{{ i.contact }}#i-{{ r.note.id }}">on the timeline</a></span>
      </li>{% endfor %}
    </ol>
    {% if nc.legacy %}<p class="small">From before notes were shared, saved as notes when you regenerate or mark ready:</p>
    <ul class="small">{% for f in nc.legacy %}<li>{{ f.text }} ({{ f.source }})</li>{% endfor %}</ul>{% endif %}
    {% if i.state == 'drafted' %}
    <form method="post" action="/outreach/{{ i.id }}/note">
      <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
      <div class="outreach-add">
      <input name="add" placeholder="add a note: something you know about them" aria-label="Add a note">
      <button type="submit" class="secondary">Add note</button>
      </div>
    </form>
    {% endif %}
    {% if i.norms %}<div class="outreach-norms small"><strong>Norms applied</strong>
      <ul>{% for n in i.norms %}<li>{{ n }}</li>{% endfor %}</ul></div>{% endif %}
  </details>
  {% endif %}

  {% if i.state == 'drafted' %}
  <form method="post" action="/outreach/{{ i.id }}/ready">
    <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
    {% if i.channel == 'email' %}<label>subject <input name="subject" value="{{ i.subject }}"></label>{% endif %}
    <textarea name="body" rows="9" spellcheck="true" aria-label="Draft for {{ ct.name if ct else i.contact }}" id="body-{{ i.id }}">{{ i.body }}</textarea>
    {% if i.channel != 'email' %}<label class="small">after they accept</label>
    <textarea name="pitch" rows="5" spellcheck="true" aria-label="Message after they accept">{{ i.pitch }}</textarea>{% endif %}
    <label class="small outreach-note">What was wrong with this draft? (optional)
      {%- call hint('why-help-' ~ i.id, 'What this note is for') %} Kept with your edit, or with the old draft if you regenerate. It helps improve the AI's next drafts.{% endcall %}
      <input name="note" maxlength="500" placeholder="e.g. too formal for a founder, or the trigger is old news"></label>
    <fieldset class="small outreach-chips" data-chips-for="{{ i.id }}" data-chip-words="{{ chip_words }}" hidden>
      <legend>Quick reasons (optional)
        {%- call hint('chips-help-' ~ i.id, 'When quick reasons count') %} Chips count for learning when you change more than {{ chip_words }} words.{% endcall %}</legend>
      {% for tag in edit_tags %}<label class="check inline-check"><input type="checkbox" name="tags" value="{{ tag }}"> {{ tag }}</label> {% endfor %}
    </fieldset>
    {% if i.checks %}<ul class="outreach-checks warning">{% for c in i.checks %}<li>{{ c }}</li>{% endfor %}</ul>{% endif %}
    {% if i.critic %}<details class="small outreach-critic" title="Scored by the AI, 1 (bad) to 5 (good). A guide, not a rule: it never blocks anything."><summary><strong>Critic {{ i.critic_score }}/5</strong></summary><p>Lowest: {% for name in critic_scores %}{{ name }} {{ i.critic[name] }}{% if not loop.last %}, {% endif %}{% endfor %}{% if i.critic_reason %}. {{ i.critic_reason }}{% endif %}</p></details>{% endif %}
    {{ about_line(about.get(i.id)) }}
    {% if i.proof_used %}<p class="small">Proof: {{ i.proof_used | join('; ') }}</p>{% endif %}
    <div class="draft-actions">
      <button type="submit" title="{% if i.checks %}Allowed with a failing check: it is kept as a warning{% else %}Approve this text{% endif %}">Mark ready</button>
      <button type="submit" formaction="/outreach/{{ i.id }}/check" class="secondary" data-busy="Checking&hellip;" title="Saves your edit, runs the checks and asks the AI critic to score it again (an AI call)">Re-check</button>
      <button type="button" class="secondary" data-skip-toggle="{{ i.id }}" aria-controls="skip-{{ i.id }}" aria-expanded="false">Skip</button>
    </div>
    <div class="draft-actions">
      <button type="submit" formaction="/outreach/{{ i.id }}/regenerate" class="secondary" data-busy="Regenerating&hellip;"{% if ai_problem %} disabled title="{{ ai_problem }}"{% else %} title="Writes a new draft from the same findings. Changes in the box above that you have not saved are not kept."{% endif %}>Regenerate</button>
      <label class="check inline-check small"><input type="checkbox" name="strong" value="1"> stronger model</label>
    </div>
  </form>
  {{ skip_panel(i) }}
  {{ history(card) }}
  {% elif i.state == 'ready' %}
  {% if i.send_note %}<p class="small warning outreach-held">Held back: {{ i.send_note }}</p>{% endif %}
  {% if i.channel == 'email' %}<p><strong>{{ i.subject }}</strong></p>{% endif %}
  <pre class="outreach-text" id="body-{{ i.id }}">{{ i.body }}</pre>
  {% if i.pitch %}<p class="small">after they accept</p><pre class="outreach-text">{{ i.pitch }}</pre>{% endif %}
  {% if i.checks %}<ul class="outreach-checks warning">{% for c in i.checks %}<li>{{ c }}</li>{% endfor %}</ul>{% endif %}
  {% if i.critic %}<details class="small outreach-critic" title="Scored by the AI, 1 (bad) to 5 (good). A guide, not a rule: it never blocks anything."><summary><strong>Critic {{ i.critic_score }}/5</strong></summary><p>Lowest: {% for name in critic_scores %}{{ name }} {{ i.critic[name] }}{% if not loop.last %}, {% endif %}{% endfor %}{% if i.critic_reason %}. {{ i.critic_reason }}{% endif %}</p></details>{% endif %}
  {{ about_line(about.get(i.id)) }}
  <div class="draft-actions">
    {% if send_on and i.channel == 'email' %}
    <form method="post" action="/outreach/{{ i.id }}/send-now" class="inline">
      <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
      <button type="submit" data-busy="Sending&hellip;" title="Send it now through your sending mailbox: for a reply to interest, or a one-off. It counts toward today's cap.">Send now</button>
    </form>
    <form method="post" action="/outreach/{{ i.id }}/schedule" class="inline">
      <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
      <button type="submit" class="secondary" title="Put it in the queue: it goes out over the working day">Schedule</button>
    </form>
    {% else %}
    <button type="button" data-copy-target="body-{{ i.id }}">Copy</button>
    {% if i.channel == 'email' and ct and ct.email %}<a class="button secondary" href="mailto:{{ ct.email }}?subject={{ i.subject | urlencode }}">Open in mail</a>{% endif %}
    {% if i.channel == 'linkedin' and ct and ct.linkedin %}<a class="button secondary" href="{{ ct.linkedin | href }}" target="_blank" rel="noopener">Open LinkedIn</a>{% endif %}
    <a class="button secondary" href="/companies/{{ i.company }}/contacts/{{ i.contact }}?channel={{ i.channel }}#quick-add">Log it</a>
    {% endif %}
    {% call row_more() %}
    {% if send_on and i.channel == 'email' %}
    <button type="button" class="secondary" data-copy-target="body-{{ i.id }}">Copy</button>
    {% if ct and ct.email %}<a class="button secondary" href="mailto:{{ ct.email }}?subject={{ i.subject | urlencode }}">Open in mail</a>{% endif %}
    <a class="button secondary" href="/companies/{{ i.company }}/contacts/{{ i.contact }}?channel={{ i.channel }}#quick-add">Log it</a>
    {% endif %}
    <form method="post" action="/outreach/{{ i.id }}/sent" class="inline">
      <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
      <button type="submit" class="secondary" title="The state only: nothing is logged">Mark sent (no log)</button>
    </form>
    <form method="post" action="/outreach/{{ i.id }}/unready" class="inline">
      <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
      <button type="submit" class="secondary" title="Take the approval back: it returns to the draft tab to edit, regenerate or skip. Nothing is sent.">Back to draft</button>
    </form>
    <button type="button" class="secondary" data-skip-toggle="{{ i.id }}" aria-controls="skip-{{ i.id }}" aria-expanded="false">Skip</button>
    {% endcall %}
  </div>
  {{ skip_panel(i) }}
  {{ history(card) }}
  {% elif i.state in ('queued', 'failed') %}
  {% if i.channel == 'email' %}<p><strong>{{ i.subject }}</strong></p>{% endif %}
  {% if i.state == 'queued' %}
  <p class="send-when"><strong>{% if i.send_at %}Goes out {{ i.send_at.strftime('%a') }} {{ fmt_date(i.send_at) }}, {{ i.send_at.strftime('%H:%M') }}{% else %}No free slot in the next 60 days{% endif %}</strong>{% if i.send_error %} <span class="small warning">last try: {{ i.send_error }}</span>{% endif %}</p>
  {% else %}
  <p class="warning-box">Not sent: {{ i.send_error }}</p>
  {% endif %}
  <pre class="outreach-text" id="body-{{ i.id }}">{{ i.body }}</pre>
  <div class="draft-actions">
    {% if send_on %}
    <form method="post" action="/outreach/{{ i.id }}/send-now" class="inline">
      <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
      <button type="submit" data-busy="Sending&hellip;" title="Send it now: it counts toward today's cap">Send now</button>
    </form>
    {% endif %}
    {% if i.state == 'queued' %}
    <form method="post" action="/outreach/{{ i.id }}/unschedule" class="inline">
      <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
      <button type="submit" class="secondary" title="Back to the Ready tab">Unschedule</button>
    </form>
    {% else %}
    <form method="post" action="/outreach/{{ i.id }}/retry" class="inline">
      <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
      <button type="submit" class="secondary" title="Back to the Ready tab, to schedule or send again">Retry</button>
    </form>
    {% endif %}
    {% call row_more() %}
    {% if i.state == 'queued' %}
    <form method="post" action="/outreach/{{ i.id }}/front" class="inline">
      <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
      <button type="submit" class="secondary" title="Make it the next to go out; the others move one slot later">Move to front</button>
    </form>
    {% endif %}
    <form method="post" action="/outreach/{{ i.id }}/sent" class="inline">
      <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
      <button type="submit" class="secondary" title="You sent it yourself: the state only, nothing is logged">Mark sent (no log)</button>
    </form>
    <button type="button" class="secondary" data-skip-toggle="{{ i.id }}" aria-controls="skip-{{ i.id }}" aria-expanded="false">Skip</button>
    {% endcall %}
  </div>
  {{ skip_panel(i) }}
  {{ history(card) }}
  {% else %}
  {% if i.channel == 'email' and i.subject %}<p><strong>{{ i.subject }}</strong></p>{% endif %}
  {% if i.body %}<details><summary>The message</summary><pre class="outreach-text">{{ i.body }}</pre></details>{% endif %}
  <p class="small">{% if i.state == 'skipped' %}Skipped: {{ i.skip_reason }}{% if i.skip_note %} ({{ i.skip_note }}){% endif %}{% if i.skipped %}, {{ fmt_datetime(i.skipped) }}{% endif %}
    {% elif i.sent %}Sent {{ fmt_datetime(i.sent) }}{% if i.sent_with %}, logged{% else %}, marked by hand{% endif %}{% endif %}
    {% if i.edit_distance is not none %} &middot; {{ i.edit_distance }} word{{ 's' if i.edit_distance != 1 }} edited{% endif %}</p>
  {% endif %}
  {% if i.state not in ('drafted', 'ready', 'queued', 'failed') %}{{ history(card) }}{% endif %}
  <p class="small quiet">{{ i.id }}{% if i.model %} &middot; {{ i.model }}{% endif %}{% if i.seconds is not none %} &middot; {{ i.seconds }}s{% endif %}{% if i.norms and not has_notes %} &middot; norms: {{ i.norms | join('; ') }}{% endif %}</p>
</article>
{% endfor %}
</div>

<script>
(function () {
  // Enter in the Generate panel's note box adds the note; the form's default button
  // is Generate, which would start a draft.
  var genNote = document.getElementById("gen-note"), genAdd = document.getElementById("gen-add-note");
  if (genNote && genAdd) genNote.addEventListener("keydown", function (e) {
    if (e.key === "Enter") { e.preventDefault(); genAdd.click(); }
  });
  // The reason chips appear only once the text differs enough from what was loaded.
  document.querySelectorAll("form[action$='/ready']").forEach(function (form) {
    var fields = form.querySelectorAll("textarea, input[name=subject]");
    function changed() {
      return Array.prototype.some.call(fields, function (f) { return f.value !== f.defaultValue; });
    }
    var chips = form.querySelector("[data-chips-for]");
    function words(text) { return (text || "").split(/\s+/).filter(Boolean); }
    // Words changed, roughly: the words that left plus the words that came, by count.
    function moved() {
      var total = 0;
      Array.prototype.forEach.call(fields, function (f) {
        var left = {}, a = words(f.defaultValue), b = words(f.value);
        a.forEach(function (w) { left[w] = (left[w] || 0) + 1; });
        b.forEach(function (w) { if (left[w]) { left[w] -= 1; } else { total += 1; } });
        Object.keys(left).forEach(function (w) { total += left[w]; });
      });
      return Math.ceil(total / 2);
    }
    function sync() {
      if (chips) chips.hidden = !changed() || moved() <= parseInt(chips.dataset.chipWords, 10);
    }
    fields.forEach(function (f) { f.addEventListener("input", sync); });
    sync();
    // Enter in the reason box would run Mark ready, which is not what typing a
    // reason for a regenerate means: the buttons are the only way to act.
    var reason = form.querySelector("input[name=note]");
    if (reason) reason.addEventListener("keydown", function (e) {
      if (e.key === "Enter") e.preventDefault();
    });
  });
  // Skip opens the reason panel under the buttons; a reason button then submits.
  function skipPanel(id, open) {
    var panel = document.getElementById("skip-" + id);
    if (!panel) return;
    panel.hidden = !open;
    document.querySelectorAll("[data-skip-toggle='" + id + "']").forEach(function (b) {
      b.setAttribute("aria-expanded", open ? "true" : "false");
    });
    if (open) { var note = panel.querySelector("input[name=note]"); if (note) note.focus(); }
  }
  document.querySelectorAll("[data-skip-toggle]").forEach(function (button) {
    button.addEventListener("click", function () {
      var id = button.getAttribute("data-skip-toggle");
      var panel = document.getElementById("skip-" + id);
      skipPanel(id, panel ? panel.hidden : false);
    });
  });
  document.querySelectorAll("[data-skip-cancel]").forEach(function (button) {
    button.addEventListener("click", function () { skipPanel(button.getAttribute("data-skip-cancel"), false); });
  });
  document.querySelectorAll("[data-copy-target]").forEach(function (button) {
    button.addEventListener("click", function () {
      var el = document.getElementById(button.getAttribute("data-copy-target"));
      var text = el ? (el.value !== undefined ? el.value : el.textContent) : "";
      function done(ok) { button.textContent = ok ? "Copied" : "Copy failed"; }
      if (navigator.clipboard && window.isSecureContext) {
        navigator.clipboard.writeText(text).then(function () { done(true); },
                                                 function () { done(false); });
      } else {
        var area = document.createElement("textarea");
        area.value = text; document.body.appendChild(area); area.select();
        var ok = false;
        try { ok = document.execCommand("copy"); } catch (e) { ok = false; }
        area.remove(); done(ok);
      }
    });
  });
  {% if form.left and not gate and not ai_problem %}
  // The batch builds one contact per request: send the next one, unless Stop.
  var stopped = false;
  var stop = document.getElementById("outreach-stop");
  if (stop) stop.addEventListener("click", function () { stopped = true; });
  window.setTimeout(function () {
    if (!stopped) document.getElementById("outreach-build").requestSubmit();
  }, 800);
  {% endif %}
})();
</script>
{% endblock %}