{% extends 'layout/app.html.twig' %}

{% block title %}{{ sourcingRequest.title }} - {{ 'app.portal'|trans }}{% endblock %}
{% block breadcrumb %}<a href="{{ path('app_home') }}" class="hover:underline">{{ 'request.back'|trans }}</a> / {{ sourcingRequest.externalReference }}{% endblock %}

{% block app_content %}
    <p class="font-structure text-xs text-pepite-ink/50">{{ 'request.reference'|trans }} {{ sourcingRequest.externalReference }}</p>
    <h1 class="mt-0.5 font-display text-2xl text-pepite-ink">{{ sourcingRequest.title }}</h1>

    {# Où en est MA proposition : jamais celle d'un autre sourceur. #}
    {% set lastDecision = proposal and proposal.latestVersion ? proposal.latestVersion.latestDecision : null %}
    <section data-role="proposal-panel" class="mt-4 max-w-4xl rounded-md border border-gray-200 bg-white p-4">
        <div class="flex flex-wrap items-center justify-between gap-3">
            <div class="flex flex-wrap items-center gap-3">
                <h2 class="font-structure text-sm font-semibold text-pepite-ink">{{ 'proposal.mine'|trans }}</h2>
                {% if proposal %}
                    {% include 'proposal/_state.html.twig' with { state: proposal.state, audience: 'sourcer' } only %}
                {% else %}
                    <span data-role="state" data-state="none" class="inline-block rounded-full bg-amber-100 px-2.5 py-0.5 font-structure text-xs font-semibold text-amber-900">{{ 'proposal.state.none'|trans }}</span>
                {% endif %}
            </div>
            <div class="flex flex-wrap gap-3">
                {% if proposal %}
                    <a href="{{ path('app_proposal_show', { id: proposal.id }) }}" class="rounded-md border border-gray-300 px-4 py-2 font-structure text-sm text-pepite-ink/80 hover:bg-gray-50">{{ 'proposal.view'|trans }}</a>
                {% endif %}
                {% if canSubmit %}
                    <a href="{{ path('app_proposal_submit', { id: sourcingRequest.id }) }}" class="rounded-md bg-pepite-navy px-4 py-2 font-structure text-sm font-medium text-white hover:bg-pepite-navy-light">{{ proposal ? 'proposal.submit_next'|trans : 'proposal.submit_first'|trans }}</a>
                {% endif %}
            </div>
        </div>
        {% if lastDecision and lastDecision.kind.value == 'adjustment_requested' %}
            <div class="mt-3 rounded-md border-l-4 border-orange-400 bg-orange-50 px-4 py-3 text-sm text-pepite-ink">
                <p class="font-structure text-xs font-bold uppercase tracking-wide text-orange-900">{{ 'proposal.adjustment_title'|trans }}</p>
                <p class="mt-1 whitespace-pre-line">{{ lastDecision.comment }}</p>
            </div>
        {% endif %}
        {% if proposal and proposal.state.value == 'accepted' %}
            <p class="mt-3 text-xs text-pepite-ink/60">{{ 'proposal.not_an_order'|trans }}</p>
        {% endif %}
        {% if not canSubmit and not (proposal and proposal.state.frozen) %}
            <p class="mt-3 text-sm text-pepite-ink/70">{{ 'proposal.read_only'|trans }}</p>
        {% endif %}
    </section>

    <div class="mt-6 max-w-4xl">
        {% include 'request/_sheet.html.twig' with { sheet: sourcingRequest } only %}
    </div>
{% endblock %}