{#
    Individual kanban stage card partial for pipeline view.
    Expected variables:
      - deal: Deal entity
      - context: array with companyName, ownerName, contacts
      - canEditDeal: boolean
      - stages: array of DealStage entities in the pipeline
      - searchValue: current search query string
      - daysInStage: int days since deal entered current stage
      - healthColor: string ('green', 'yellow', 'red')
#}
{% set shortAmount = include('@DealFlow/Deal/_amount.html.twig', {amount: deal.getAmount(), currency: deal.getCurrency(), compact: true}, false)|trim %}

<article
    class="dfp-card"
    draggable="{{ canEditDeal ? 'true' : 'false' }}"
    data-deal-card
    data-deal-id="{{ deal.getId() }}"
    data-deal-amount="{{ deal.getAmount() ?? 0 }}"
    data-current-stage-id="{{ deal.getStage() ? deal.getStage().getId() : '' }}"
    data-view-url="{{ path('mautic_dealflow_view', {'objectId': deal.getId()}) }}"
    tabindex="0"
    role="link"
    aria-label="Open {{ deal.getTitle() }}"
>
    <div class="dfp-card__time">
        <svg viewBox="0 0 16 16" fill="none"><circle cx="8" cy="8" r="6.5" stroke="currentColor" stroke-width="1.2"/><path d="M8 5v3.5l2.5 1.5" stroke="currentColor" stroke-width="1.2" stroke-linecap="round"/></svg>
        Entered {{ deal.getDateAdded()|date('M j') }}
    </div>

    <a class="dfp-card__title" href="{{ path('mautic_dealflow_view', {'objectId': deal.getId()}) }}" data-toggle="ajax" draggable="false">{{ deal.getTitle() }}</a>

    <div class="dfp-card__company">{{ context.companyName ?: 'No company linked' }}</div>

    <div class="dfp-card__meta">
        <span class="dfp-card__amount">{{ shortAmount }}</span>
        <div class="dfp-card__health-wrap">
            <span class="dfp-card__health dfp-card__health--{{ healthColor }}" title="{{ healthColor|title }} health"></span>
            {% if deal.getStatus() == 'won' %}
                <span class="dfp-card__status dfp-card__status--won">Won</span>
            {% elseif deal.getStatus() == 'lost' %}
                <span class="dfp-card__status dfp-card__status--lost">Lost</span>
            {% endif %}
        </div>
    </div>

    <div class="dfp-card__days">
        <svg viewBox="0 0 16 16" fill="none"><path d="M8 3v5l3 2" stroke="currentColor" stroke-width="1.2" stroke-linecap="round"/><circle cx="8" cy="8" r="6.5" stroke="currentColor" stroke-width="1.2"/></svg>
        {{ daysInStage }} day{{ daysInStage == 1 ? '' : 's' }} in stage
    </div>

    {% if canEditDeal %}
        <form class="dfp-card__move" method="post" action="{{ path('mautic_dealflow_move_stage', {'objectId': deal.getId()}) }}" data-stage-form hidden>
            <input type="hidden" name="_token" value="{{ csrf_token('dealflow_move_stage_' ~ deal.getId()) }}">
            <input type="hidden" name="return_url" value="{{ searchValue ? path('mautic_dealflow_pipeline', {'search': searchValue}) : path('mautic_dealflow_pipeline') }}">
            <div class="input-group input-group-sm">
                <select name="stage_id" class="form-control" data-stage-select>
                    {% for stage in stages %}
                        <option value="{{ stage.getId() }}" {{ deal.getStage() and stage.getId() == deal.getStage().getId() ? 'selected' : '' }}>
                            {{ stage.getName() }}
                        </option>
                    {% endfor %}
                </select>
                <span class="input-group-btn">
                    <button class="btn btn-default" type="submit">Move</button>
                </span>
            </div>
        </form>
    {% endif %}
</article>
