{% include 'Settings/diagnostic-results.css.twig' %}
{% include 'Settings/diagnostic-results.js.twig' %}

<div class="diagnostic-console__container">
    <h3>Diagnostic Output</h3>

    <div id="diagnostic-console" class="diagnostic-console">
        <button class="diagnostic-console__copy-button" onClick="copyResultsToClipboard()">Copy to clipboard</button>
        {% for line in results %}
            <div class="diagnostic-message__container">
                <span class="diagnostic-message__date">{{ "now" | date('Y/m/d H:i:s') }}</span>
                <span class="diagnostic-message__{{line.type}}">
                    {% if line.type == 'success' %}
                        [✓]
                    {% elseif line.type == 'info' %}
                        [i]
                    {% elseif line.type == 'warning' %}
                        [!]
                    {% elseif line.type == 'error' %}
                        [✗]
                    {% endif %}
                </span>

                <span>{{ line.message }}</span>
            </div>
        {% endfor %}
    </div>
</div>
