compose_preview.html.twig

<li class="page-composer__container__child"
    data-block-id="{{ child.id }}"
    data-parent-block-id="{{ container.id }}"
    data-block-enabled="{{ child.enabled|default('0') }}"
    data-block-type="{{ child.type }}"
>
    {% set service = attribute(blockServices, child.type) ?? null %}

    {% if service %}
    <a
        class="page-composer__container__child__edit"
        href="{{ blockAdmin.generateUrl('edit', { 'id': child.id, 'composer': true }) }}"
    >
    {% else %}
    <div class="page-composer__container__child__error">
    {% endif %}
        {% if service %}
            {% set metadataTitle = service.metadata.title|trans({}, service.metadata.domain|default('SonataPageBundle')) %}
            {% set blockTitle = child.name|default(metadataTitle) %}
            {% set blockImage = service.metadata.image ? asset(service.metadata.image) : null %}
            {% set blockClass = service.metadata.option('class') %}
        {% else %}
            {% set metadataTitle = child.type %}
            {% set blockTitle = child.name %}
            {% set blockImage = null %}
            {% set blockClass = null %}
        {% endif %}

        <h4 class="page-composer__container__child__name">{{ blockTitle }}</h4>

        {% if blockImage %}
            <img src="{{ blockImage }}" style="max-height: 20px; max-width: 100px;"/>
        {% elseif blockClass %}
            <i class="{{ blockClass }}" ></i>
        {% endif %}

        <small>{{ metadataTitle }}</small>

        {% if service %}
            <span class="page-composer__container__child__toggle">
                <i class="fa fa-chevron-down"></i>
                <i class="fa fa-chevron-up"></i>
            </span>
        {% endif %}
    {% if service %}
    </a>
    {% else %}
    </div>
    {% endif %}

    <div class="page-composer__container__child__right">
        <div class="page-composer__container__child__remove">
            <a class="badge" href="{{ blockAdmin.generateUrl('delete', { 'id': child.id }) }}">{{ 'composer.remove'|trans({}, 'SonataPageBundle') }} <i class="fa fa-times"></i> </a>
        </div>

        <div
            class="page-composer__container__child__switch-enabled"
            data-label-enable="{{ ('composer.enable'|trans({}, 'SonataPageBundle') ~ ' <i class="fa fa-toggle-on"></i>')|e }}"
            data-label-disable="{{ ('composer.disable'|trans({}, 'SonataPageBundle') ~ ' <i class="fa fa-toggle-off"></i>')|e }}"
        >
            <a
                class="badge bg-{{ child.enabled ? 'yellow' : 'green' }}"
                href="{{ path('sonata_admin_set_object_field_value', {
                    'objectId': child.id,
                    'context': 'list',
                    'field': 'enabled',
                    '_sonata_admin': 'sonata.page.admin.block'
                }) }}"
            >
                    {% if child.enabled %}{{ 'composer.disable'|trans({}, 'SonataPageBundle') }}
                        <i class="fa fa-toggle-off"></i>
                    {% else %}
                        {{ 'composer.enable'|trans({}, 'SonataPageBundle') }}
                        <i class="fa fa-toggle-on"></i>
                    {% endif %}
            </a>
        </div>

        <div class="page-composer__container__child__enabled">
            <small class="badge bg-{{ child.enabled ? 'green' : 'yellow' }}"><i class="fa fa-{{ child.enabled ? 'check' : 'times' }}"></i></small>
        </div>
    </div>

    <div class="page-composer__container__child__content"></div>

    <div class="page-composer__container__child__loader">
        <span>{{ 'loading'|trans({}, 'SonataPageBundle') }}</span>
    </div>
</li>