<%

  var st = !!locals.showStaff;
  var label = function (s) { return (!st && lb.STAGE_CLIENT[s]) || lb.STAGE[s] || s; };
  var n = lb.latest(p);
  var latestV = (p.versions || []).find(function (v) { return v.n === n; });
  var _ord = lb.orderOf(p);
  var at = _ord.indexOf(p.stage);
  var approvedNow = n && p.approvedVersion === n;
  var needApproval = cfg.requireContentApproval;
  var today = new Date().toISOString().slice(0, 10);
%>
<%- include('../partials/lb-shell') %>

<p class="claim-sub" style="margin-top:4px"><b style="color:var(--ink-2)"><%= p.domain %></b> · <%= plinks.length %> link<%= plinks.length === 1 ? '' : 's' %> to <%= brand %></p>
<ul class="lb-plinks"><% plinks.forEach(function (k) { %><li><a href="<%= k.targetUrl %>" target="_blank" rel="noopener"><%= lb.path(k.targetUrl) %></a><% if (k.anchor) { %> · “<%= k.anchor %>”<% } %></li><% }) %></ul>
<style>.lb-plinks{margin:6px 0 0; padding-left:18px; font-size:13.5px; color:var(--ink-2); display:flex; flex-direction:column; gap:3px}</style>
<% if (p.stage !== 'cancelled') { %><div class="lb-pipe" style="margin-top:10px"><% _ord.forEach(function (k, i) { if (k === 'changes' && p.stage !== 'changes') return; if (k === 'site_approval' && !cfg.requireSiteApproval && p.stage !== 'site_approval') return; %><span class="<%= k === p.stage ? (k === 'changes' ? 'bad' : 'now') : (i < at ? 'done' : '') %>"><%= label(k) %></span><% }) %></div><% } else { %><span class="rp-lab sc-dismissed" style="margin-top:10px">Cancelled</span><% } %>

<div class="bento" style="margin-top:18px">
  <% if (p.content) { var cn = content ? lb.latest(content) : 0; var cok = content && content.status === 'approved' && content.approvedVersion === cn; var cv = content && (content.versions || []).find(function (x) { return x.n === cn; }); %>
  <section class="card b12 rp-sec">
    <div class="rp-sh"><div><div class="rp-kick">The article</div><h3><% if (content) { %><a href="/link-building/content/<%= content._id %>" <%- h.dirAttr(content.title) %>><%= content.title %></a><% } else { %>Not found<% } %></h3></div><% if (content) { %><span class="rp-lab sc-<%= cok ? 'approved' : lb.CSTATUS_C[content.status] %>"><%= cok ? 'Approved, version ' + content.approvedVersion : lb.CSTATUS[content.status] %></span><% } %></div>
    <div class="rp-body">
      <% if (cv && cv.docUrl) { %><a class="btn btn-sm" href="<%= cv.docUrl %>" target="_blank" rel="noopener">Open version <%= cn %> ↗</a><% } %>
      <% if (content && !cok) { %><div class="rp-why" style="margin-top:8px">It goes to the publisher once the client approves it on <a href="/link-building/content/<%= content._id %>">Content Approvals</a>.</div><% } %>
    </div>
  </section>
  <% if (st && p.stage !== 'cancelled' && p.stage !== 'verified') { %>
  <section class="card b12 rp-sec">
    <div class="rp-sh"><div><div class="rp-kick">Staff</div><h3>Next step</h3></div></div>
    <div class="rp-body" style="display:flex; flex-direction:column; gap:14px">
      <% if (['site', 'topic', 'site_approval'].includes(p.stage) && site && site.status !== 'approved' && site.status !== 'published') { %>
        <form class="js-rep rp-ctl row" method="POST" action="/api/links/posts/<%= p._id %>/stage" style="margin:0"><input type="hidden" name="to" value="site_approval"><span class="rp-help">The site <b><%= p.domain %></b> is <%= (lb.SITE[site.status] || site.status).toLowerCase() %>.</span><button class="btn btn-sm" type="submit"<%= p.stage === 'site_approval' ? ' disabled' : '' %>><%= p.stage === 'site_approval' ? 'Waiting for the client' : 'Ask the client to approve the site' %></button></form>
      <% } %>
      <div style="display:flex; gap:8px; flex-wrap:wrap; align-items:center">
        <% if (['topic', 'site_approval', 'site'].includes(p.stage)) { %><form class="js-rep" method="POST" action="/api/links/posts/<%= p._id %>/stage"><input type="hidden" name="to" value="outreach"><button class="btn btn-primary btn-sm" type="submit"<%= cok || !needApproval ? '' : ' disabled title="The article is not approved yet"' %>>Send to the publisher</button></form><% } %>
        <form class="js-rep" method="POST" action="/api/links/posts/<%= p._id %>/stage" data-confirm="Cancel this guest post? Its article becomes free to use again."><input type="hidden" name="to" value="cancelled"><button class="btn btn-sm" type="submit">Cancel</button></form>
      </div>
      <% if (['outreach', 'published'].includes(p.stage)) { %>
        <form class="js-rep rep-form" method="POST" action="/api/links/posts/<%= p._id %>/publish" id="go-live" style="margin:0; padding-top:12px; border-top:1px solid var(--line-2)">
          <div class="full"><label>It is live: the article's address</label><input name="publishedUrl" required placeholder="https://<%= p.domain %>/..." value="<%= p.publishedUrl || '' %>"></div>
          <div><label>Placed on</label><input name="placedAt" type="date" value="<%= p.placedAt ? new Date(p.placedAt).toISOString().slice(0, 10) : today %>"></div>
          <div><label>Placed by</label><input name="placedBy" value="<%= p.placedBy || (locals.currentUser && currentUser.name) || '' %>"></div>
          <div><label>Link type agreed</label><select name="rel"><option value="follow">Follow</option><option value="nofollow">Nofollow</option><option value="sponsored">Sponsored</option></select></div>
          <div><button class="btn btn-primary btn-sm" type="submit">Mark published and check <%= plinks.length === 1 ? 'the link' : 'the ' + plinks.length + ' links' %></button></div>
        </form>
      <% } %>
    </div>
  </section>
  <% } else if (st && p.stage === 'cancelled') { %>
  <section class="card b12 rp-sec"><div class="rp-body"><form class="js-rep" method="POST" action="/api/links/posts/<%= p._id %>/stage"><input type="hidden" name="to" value="reopen"><button class="btn btn-sm" type="submit">Reopen</button></form></div></section>
  <% } %>
  <% } else { %>
  <% if (p.stage === 'client_review' && latestV) { %>
  <section class="card b12 rp-sec" style="border-color:color-mix(in srgb, var(--accent-strong) 40%, var(--line))">
    <div class="rp-sh"><div><div class="rp-kick"><%= st ? 'With the client' : 'Waiting for you' %></div><h3>Version <%= n %> to approve</h3></div><div class="rp-sm">Sent <%= h.date(latestV.at) %></div></div>
    <div class="rp-body">
      <% if (latestV.docUrl) { %><p style="margin:0 0 10px"><a class="btn btn-sm" href="<%= latestV.docUrl %>" target="_blank" rel="noopener">Open the draft ↗</a></p><% } %>
      <% if (latestV.text) { %><div class="rp-box" <%- h.dirAttr(latestV.text) %>><%= latestV.text %></div><% } %>
      <% if (latestV.note) { %><div class="rp-why"><b>Note:</b> <%= latestV.note %></div><% } %>
      <div class="rp-ctl row" style="gap:10px; align-items:flex-start">
        <form class="js-rep" method="POST" action="/api/links/posts/<%= p._id %>/decision"><input type="hidden" name="version" value="<%= n %>"><input type="hidden" name="decision" value="approve"><button class="btn btn-primary btn-sm" type="submit"><%= st ? 'Record approval' : 'Approve this version' %></button></form>
        <form class="js-rep" method="POST" action="/api/links/posts/<%= p._id %>/decision" style="display:flex; gap:8px; flex:1; min-width:260px"><input type="hidden" name="version" value="<%= n %>"><input type="hidden" name="decision" value="changes"><input class="rp-in" name="note" placeholder="What would you like changed?" style="flex:1"><button class="btn btn-sm" type="submit">Ask for changes</button></form>
      </div>
      <div class="rp-why">You approve this exact version. If we change it afterwards, it comes back to you first.</div>
    </div>
  </section>
  <% } %>

  <% if (p.stage === 'changes' && p.clientNote) { %>
  <section class="card b12 rp-sec"><div class="rp-body"><p class="rp-q" style="--c:var(--neg); margin:0"><b><%= p.clientNoteBy || 'The client' %> asked for changes on <%= h.date(p.clientNoteAt) %>:</b> <%= p.clientNote %></p></div></section>
  <% } %>

  <% if (st && p.stage !== 'cancelled' && p.stage !== 'verified') { %>
  <section class="card b12 rp-sec">
    <div class="rp-sh"><div><div class="rp-kick">Staff</div><h3>Next step</h3></div></div>
    <div class="rp-body" style="display:flex; flex-direction:column; gap:14px">
      <% if (['site', 'draft', 'changes', 'site_approval'].includes(p.stage) && site && site.status !== 'approved' && site.status !== 'published') { %>
        <form class="js-rep rp-ctl row" method="POST" action="/api/links/posts/<%= p._id %>/stage" style="margin:0"><input type="hidden" name="to" value="site_approval"><span class="rp-help">The site <b><%= p.domain %></b> is <%= (lb.SITE[site.status] || site.status).toLowerCase() %>.</span><button class="btn btn-sm" type="submit"<%= p.stage === 'site_approval' ? ' disabled' : '' %>><%= p.stage === 'site_approval' ? 'Waiting for the client' : 'Ask the client to approve the site' %></button></form>
      <% } %>
      <% if (['site', 'draft', 'changes', 'client_review', 'outreach'].includes(p.stage)) { %>
        <form class="js-rep rep-form" method="POST" action="/api/links/posts/<%= p._id %>/version" style="margin:0">
          <div class="full"><label>Add version <%= n + 1 %></label><input name="docUrl" placeholder="Google Doc link"></div>
          <div class="full"><textarea name="text" rows="3" placeholder="…or paste the text"></textarea></div>
          <div class="full" style="display:flex; gap:8px"><input name="note" placeholder="What changed (optional)" style="flex:1"><button class="btn btn-sm" type="submit">Save version <%= n + 1 %></button></div>
          <% if (approvedNow) { %><div class="full rp-help">Version <%= n %> is approved. A new version goes back to the client before it can be published.</div><% } %>
        </form>
      <% } %>
      <div style="display:flex; gap:8px; flex-wrap:wrap; align-items:center">
        <% if (n && ['draft', 'changes'].includes(p.stage)) { %>
          <% if (needApproval) { %><form class="js-rep" method="POST" action="/api/links/posts/<%= p._id %>/stage"><input type="hidden" name="to" value="client_review"><button class="btn btn-primary btn-sm" type="submit">Send version <%= n %> to the client</button></form>
          <% } else { %><form class="js-rep" method="POST" action="/api/links/posts/<%= p._id %>/stage"><input type="hidden" name="to" value="outreach"><button class="btn btn-primary btn-sm" type="submit">Send to the publisher</button></form><% } %>
        <% } %>
        <% if (p.stage === 'outreach' || (!needApproval && n && ['draft'].includes(p.stage)) || (approvedNow && p.stage !== 'published')) { %>
          <% if (p.stage !== 'outreach' && approvedNow) { %><form class="js-rep" method="POST" action="/api/links/posts/<%= p._id %>/stage"><input type="hidden" name="to" value="outreach"><button class="btn btn-sm" type="submit">Mark as with the publisher</button></form><% } %>
        <% } %>
        <form class="js-rep" method="POST" action="/api/links/posts/<%= p._id %>/stage" data-confirm="Cancel this guest post?"><input type="hidden" name="to" value="cancelled"><button class="btn btn-sm" type="submit">Cancel</button></form>
      </div>
      <% if (['outreach', 'published'].includes(p.stage) || (!needApproval && n)) { %>
        <form class="js-rep rep-form" method="POST" action="/api/links/posts/<%= p._id %>/publish" id="go-live" style="margin:0; padding-top:12px; border-top:1px solid var(--line-2)">
          <div class="full"><label>It is live: the article's address</label><input name="publishedUrl" required placeholder="https://<%= p.domain %>/..." value="<%= p.publishedUrl || '' %>"></div>
          <div><label>Placed on</label><input name="placedAt" type="date" value="<%= p.placedAt ? new Date(p.placedAt).toISOString().slice(0, 10) : today %>"></div>
          <div><label>Placed by</label><input name="placedBy" value="<%= p.placedBy || (locals.currentUser && currentUser.name) || '' %>"></div>
          <div><label>Link type agreed</label><select name="rel"><option value="follow">Follow</option><option value="nofollow">Nofollow</option><option value="sponsored">Sponsored</option></select></div>
          <div><button class="btn btn-primary btn-sm" type="submit">Mark published and check <%= plinks.length === 1 ? "the link" : "the " + plinks.length + " links" %></button></div>
        </form>
      <% } %>
    </div>
  </section>
  <% } else if (st && p.stage === 'cancelled') { %>
  <section class="card b12 rp-sec"><div class="rp-body"><form class="js-rep" method="POST" action="/api/links/posts/<%= p._id %>/stage"><input type="hidden" name="to" value="reopen"><button class="btn btn-sm" type="submit">Reopen</button></form></div></section>
  <% } %>
  <% } %>

  <% if ((links || []).length) { var _l0 = links[0]; %>
  <section class="card b12 rp-sec">
    <div class="rp-sh"><div><div class="rp-kick">Live <%= links.length === 1 ? 'link' : 'links' %></div><h3><a class="lb-url" style="font-size:14px" href="<%= _l0.sourceUrl %>" target="_blank" rel="noopener"><%= _l0.sourceUrl %></a></h3></div><div class="rp-sm">Placed <%= lb.dmy(_l0.placedAt) %><%= _l0.placedBy ? ' · by ' + _l0.placedBy : '' %></div></div>
    <ul class="rp-list"><% links.forEach(function (l) { var sn = l.seen || {}; %>
      <li class="rp-item" style="grid-template-columns:minmax(0, 1fr) auto"><div><a class="rp-t" style="font-size:14px" href="/link-building/links/<%= l._id %>">→ <%= lb.path(l.targetUrl) %></a><div class="rp-why"><%= sn.found ? '“' + sn.anchor + '”, ' + sn.rel : (l.expect && l.expect.anchor ? 'agreed “' + l.expect.anchor + '”' : '') %> · last check <%= l.lastCheckedAt ? h.date(l.lastCheckedAt) + ', ' + h.time(l.lastCheckedAt) : 'not yet' %></div></div><div class="rp-side"><span class="rp-lab sc-<%= lb.STATUS_C[l.status] %>"><%= lb.STATUS[l.status] %></span></div></li>
    <% }) %></ul>
  </section>
  <% } %>

  <% if (!p.content) { %>
  <section class="card b7 rp-sec">
    <div class="rp-sh"><div><h3>Versions</h3></div></div>
    <% if (!(p.versions || []).length) { %><div class="rp-empty"><b>No draft yet</b><%= st ? 'Add the first version above.' : 'The article is being written.' %></div><% } else { %>
    <ul class="rp-list"><% p.versions.slice().reverse().forEach(function (v) { %>
      <li class="rp-item" style="grid-template-columns:40px minmax(0, 1fr) auto"><div class="rp-lead">v<%= v.n %></div><div><div class="rp-src"><%= h.date(v.at) %><%= v.by ? ' · ' + v.by : '' %></div><% if (v.docUrl) { %><a class="lb-url" href="<%= v.docUrl %>" target="_blank" rel="noopener"><%= v.docUrl %></a><% } %><% if (v.text) { %><details class="rp-det"><summary>Read the text</summary><div class="rp-box" <%- h.dirAttr(v.text) %>><%= v.text %></div></details><% } %><% if (v.note) { %><div class="rp-why"><%= v.note %></div><% } %></div><div class="rp-side"><% if (p.approvedVersion === v.n) { %><span class="rp-lab sc-approved">Approved<%= p.approvedBy ? ' by ' + p.approvedBy : '' %></span><% } %></div></li>
    <% }) %></ul>
    <% } %>
  </section>
  <% } %>

  <section class="card b5 rp-sec">
    <div class="rp-sh"><div><h3>History</h3></div></div>
    <div class="rp-body"><ul class="rep-log"><% (p.log || []).slice().reverse().forEach(function (e) { %><li><b><%= e.by %></b> <%= e.what %> <span class="rr-meta">· <%= h.date(e.at) %></span></li><% }) %></ul></div>
  </section>

  <% if (st) { %>
  <section class="card b12 rp-sec">
    <details><summary class="rp-sh" style="cursor:pointer; list-style:none"><div><div class="rp-kick">Staff</div><h3>Edit details</h3></div></summary>
    <form class="js-rep rep-form rp-body" method="POST" action="/api/links/posts/<%= p._id %>">
      <% if (p.content || !(p.versions || []).length) { %><div class="full"><label>Article</label><select name="content"><% if (!p.content) { %><option value="">No article yet: pick one…</option><% } %><% contents.forEach(function (c) { %><option value="<%= c._id %>"<%= String(c._id) === String(p.content) ? ' selected' : '' %>><%= c.title %><%= c.status === 'approved' ? '' : ' (' + (lb.CSTATUS[c.status] || c.status).toLowerCase() + ')' %></option><% }) %></select></div>
      <% } else { %><div class="full"><label>Title</label><input name="title" value="<%= p.title || '' %>"></div><% } %>
      <div><label>Site</label><select name="site"><% sites.forEach(function (s) { %><option value="<%= s._id %>"<%= String(s._id) === String(p.site) ? ' selected' : '' %>><%= s.domain %></option><% }) %></select></div>
      <div class="full"><label>Links in the article</label><%- include('../partials/lb-link-rows', { rows: plinks, targets: targets, lb: lb }) %></div>
      <div><label>Cost (internal)</label><input name="cost" type="number" min="0" value="<%= p.cost != null ? p.cost : '' %>"></div>
      <div><label>Currency</label><input name="currency" value="<%= p.currency || 'USD' %>" maxlength="5"></div>
      <div class="full"><button class="btn btn-sm" type="submit">Save</button></div>
    </form></details>
  </section>
  <% } %>
</div>
<%- include('../partials/rep-foot') %>
