{% extends "layout.html" %}

{% block content %}
  <h3>Map board lists with pipelines stages</h3>

<pre>
// src/routes/mappings.py
pipeline = hubspot.crm.pipelines.pipelines_api.get_by_id("deals", pipeline_id)
</pre>

<pre>Note: selected Trello board list and Pipeline stage must be unique for all rows</pre>

  <form method="post">
    <table>
      <thead>
        <tr>
          <th>"{{ board.name }}" board lists</th>
          <th>"{{ pipeline.label }}" stages</th>
          <th></th>
        </tr>
      </thead>
      <tbody>
        {% for mapping in mappings %}
          <tr>
            <td>
              <select name="board_list_ids[]">
                <option disabled {% if mapping.board_list_id is none %} selected {% endif %} value>-- select trello list --</option>
                {% for list in board_lists %}
                  <option
                          value="{{ mapping.id~JOIN_SEPARATOR~list.id }}"
                          {% if list.id == mapping.board_list_id %} selected {% endif %}>
                    {{ list.name }}
                  </option>
                {% endfor %}
              </select>
            </td>
            <td>
              <select name="pipeline_stage_id[]">
                <option disabled {% if mapping.pipeline_stage_id is none %} selected {% endif %} value>-- select pipeline stage --</option>
                {% for stage in pipeline.stages %}
                  <option
                          value="{{ mapping.id~JOIN_SEPARATOR~stage.id }}"
                          {% if stage.id == mapping.pipeline_stage_id %} selected {% endif %}>
                    {{ stage.label }}
                  </option>
                {% endfor %}
              </select>
            </td>
            <td>
              {% if mapping.id %}
                <a href="{{ url_for("mappings.delete_row", board_id=board.id, pipeline_id=pipeline.id, mapping_id=mapping.id) }}">
                  <button type="button">Remove</button>
                </a>
              {% endif %}
            </td>
          </tr>
        {% endfor %}
      </tbody>
    </table>
    <button type="submit">Save</button>
  </form>
{% endblock %}