{% macro component(config, localized) %}
    {% embed "system/embed/table/responsive-table.html.twig" %}
        {% block heading %}
            {% embed "system/embed/table/table-header-element.html.twig" %}
                {% block content %}
                    {{ localized.table.processId | raw }}
                {% endblock %}
            {% endembed %}
            {% embed "system/embed/table/table-header-element.html.twig" %}
                {% block content %}
                    {{ localized.table.createdAt | raw }}
                {% endblock %}
            {% endembed %}
            {% embed "system/embed/table/table-header-element.html.twig" %}
                {% block content %}
                    {{ localized.table.level | raw }}
                {% endblock %}
            {% endembed %}
            {% embed "system/embed/table/table-header-element.html.twig" with {textAlign: 'bc-text-center'} %}
                {% block content %}
                    {{ localized.table.context | raw }}
                {% endblock %}
            {% endembed %}
            {% embed "system/embed/table/table-header-element.html.twig" with {textAlign: 'bc-text-center'} %}
                {% block content %}
                    {{ localized.table.backtrace | raw }}
                {% endblock %}
            {% endembed %}
            {% embed "system/embed/table/table-header-element.html.twig" %}
                {% block content %}
                    {{ localized.table.message | raw }}
                {% endblock %}
            {% endembed %}
            {% embed "system/embed/table/table-header-element.html.twig" with {textAlign: 'bc-text-center'} %}
                {% import "system/macro/icons/report.html.twig" as report_icon %}
                {% block content %}
                    {{ report_icon.component({}) }}
                {% endblock %}
            {% endembed %}
        {% endblock %}
        {% block body %}
            {% if config.logs is empty %}
                <tr>
                    <td colspan="7" class="bc-py-4 bc-text-center">
                        {{ localized.alert.noLogs | raw }}
                    </td>
                </tr>
            {% else %}
                {% for item in config.logs %}
                    {% embed "system/embed/table/table-body-row.html.twig" %}
                        {% block rowContent %}
                            {% embed "system/embed/table/table-body-element.html.twig" %}
                                {% block content %}
                                    {{ item.processId | raw }}
                                {% endblock %}
                            {% endembed %}
                            {% embed "system/embed/table/table-body-element.html.twig" %}
                                {% block content %}
                                    {{ adjustTimezone(item.createdAt).format('Y-m-d H:i:s') | raw }}
                                {% endblock %}
                            {% endembed %}
                            {% embed "system/embed/table/table-body-element.html.twig" %}
                                {% import "log/macro/log-level.html.twig" as log_level %}
                                {% block content %}
                                    {{ log_level.component({
                                        level: item.level,
                                    }, localized) }}
                                {% endblock %}
                            {% endembed %}
                            {% embed "system/embed/table/table-body-element.html.twig" with {textAlign: 'bc-text-center'} %}
                                {% import "system/macro/icons/check-circle.html.twig" as check_circle_icon %}
                                {% import "system/macro/icons/x-circle.html.twig" as x_circle_icon %}
                                {% block content %}
                                    {% if item.context is not empty %}
                                        <span class="bc-text-green-600">{{ check_circle_icon.component({}) }}</span>
                                    {% else %}
                                        {{ x_circle_icon.component({}) }}
                                    {% endif %}
                                {% endblock %}
                            {% endembed %}
                            {% embed "system/embed/table/table-body-element.html.twig" with {textAlign: 'bc-text-center'} %}
                                {% import "system/macro/icons/check-circle.html.twig" as check_circle_icon %}
                                {% import "system/macro/icons/x-circle.html.twig" as x_circle_icon %}
                                {% block content %}
                                    {% if item.backtrace is not empty %}
                                        <span class="bc-text-green-600">{{ check_circle_icon.component({}) }}</span>
                                    {% else %}
                                        {{ x_circle_icon.component({}) }}
                                    {% endif %}
                                {% endblock %}
                            {% endembed %}
                            {% embed "system/embed/table/table-body-element.html.twig" %}
                                {% block content %}
                                    {{ item.message }}
                                {% endblock %}
                            {% endembed %}
                            {% embed "system/embed/table/table-body-element.html.twig" with {textAlign: 'bc-text-center'} %}
                                {% import "system/macro/icons/report.html.twig" as report_icon %}
                                {% block content %}
                                    <a href="{{ wpNonceUrl("?page=#{config.controllerId}&action=details&id=#{item.id}", "#{config.controllerId}-#{item.id}-details") | raw }}">
                                        {{ report_icon.component({}) }}
                                    </a>
                                {% endblock %}
                            {% endembed %}
                        {% endblock %}
                    {% endembed %}
                {% endfor %}
            {% endif %}
        {% endblock %}
    {% endembed %}
{% endmacro %}
