{% extends "base.html" %}
{% block title %}{{ contact.name }} - Narad{% endblock %}
{% block content %}
<section class="grid two">
  <div>
    <p><a href="/contacts">Contacts</a></p>
    <h1>{{ contact.name }}</h1>
    <dl class="facts">
      {% if contact.organization_name %}<div><dt>Company</dt><dd>{{ contact.organization_name }}</dd></div>{% endif %}
      {% if contact.title %}<div><dt>Title</dt><dd>{{ contact.title }}</dd></div>{% endif %}
      {% if contact.email %}<div><dt>Email</dt><dd>{{ contact.email }}</dd></div>{% endif %}
      {% if contact.phone %}<div><dt>Phone</dt><dd>{{ contact.phone }}</dd></div>{% endif %}
      {% if contact.source %}<div><dt>Source</dt><dd>{{ contact.source }}</dd></div>{% endif %}
      {% if contact.tag_names %}<div><dt>Tags</dt><dd>{{ contact.tag_names }}</dd></div>{% endif %}
    </dl>

    <h2>Affiliations</h2>
    <div class="list">
      {% for affiliation in affiliations %}
        <article class="row">
          <div>
            <strong>{{ affiliation.organization_name }}</strong>
            {% if affiliation.note %}<p>{{ affiliation.note }}</p>{% endif %}
          </div>
          <span>{% if affiliation.is_current %}current{% endif %}</span>
        </article>
      {% else %}
        <p class="muted">No affiliations yet.</p>
      {% endfor %}
    </div>

    <h2>Tasks</h2>
    {% include "_task_list.html" with context %}

    <h2>Timeline</h2>
    <div class="list">
      {% for item in interactions %}
        <article class="row">
          <div>
            <strong>{{ item.kind }}{% if item.channel %} / {{ item.channel }}{% endif %}</strong>
            <p>{{ item.body }}</p>
          </div>
          <span>{{ item.occurred_at }}</span>
        </article>
      {% else %}
        <p class="muted">No notes yet.</p>
      {% endfor %}
    </div>
  </div>

  <aside>
    <h2>Edit Contact</h2>
    <form class="stack" method="post" action="/contacts/{{ contact.id }}/edit">
      <label>Name *<input name="name" value="{{ contact.name }}" required></label>
      <label>Company<input name="company" value="{{ contact.organization_name or '' }}"></label>
      <label>Title<input name="title" value="{{ contact.title or '' }}"></label>
      <label>Email<input name="email" type="email" value="{{ contact.email or '' }}"></label>
      <label>Phone<input name="phone" value="{{ contact.phone or '' }}"></label>
      <label>Location<input name="location" value="{{ contact.location or '' }}"></label>
      <label>Source<input name="source" value="{{ contact.source or '' }}"></label>
      <label>Tags<input name="tags" value="{{ contact.tag_names or '' }}"></label>
      <button type="submit">Save contact</button>
    </form>

    <h2>Add Note</h2>
    <form class="stack" method="post" action="/contacts/{{ contact.id }}/notes">
      <label>Kind<input name="kind" value="note"></label>
      <label>Channel<input name="channel" placeholder="call, whatsapp, linkedin"></label>
      <label>Note *<textarea name="body" required rows="5"></textarea></label>
      <button type="submit">Save note</button>
    </form>

    <h2>Add Task</h2>
    <form class="stack" method="post" action="/contacts/{{ contact.id }}/tasks">
      <label>Task *<input name="title" required></label>
      <label>Due<input name="due" placeholder="today, tomorrow, YYYY-MM-DD"></label>
      <button type="submit">Save task</button>
    </form>
  </aside>
</section>
{% endblock %}