{% if subscriptions %}
<form>
    <div>
        <ul class="list thick">
            <li>
                <span class="primary icon gray">
                    <i class="material-symbols">circle_notifications</i>
                </span>
                <div>
                    <p>{{ __('notificationconfig.push_subscriptions') }}</p>
                    <p>{{ __('notificationconfig.push_subscriptions_text') }}</p>
                </div>
            </li>
        </ul>
        <ul class="list middle divided">
            {% for value in subscriptions %}
                <li>
                    <span class="primary icon {% if value.self %}green{% else %}gray{% endif %}">
                        <i class="material-symbols">notifications</i>
                    </span>
                    <span class="control">
                        <div class="checkbox">
                            <input type="checkbox" id="pushsubscription_state_{{ value.id }}" name="pushsubscription_state_{{ value.id }}"
                                {% if value.enabled %}checked{% endif %}
                                onchange="NotificationConfig_ajaxTogglePushConfig({{ value.id }}, this.checked)"/>
                            <label for="pushsubscription_state_{{ value.id }}"></label>
                        </div>
                    </span>
                    <div>
                        <p>
                            <span class="info">{{ __('omemo.last_activity') }}: {{ value.activity }}</span>
                            {{ value.host }}
                        </p>
                        <p>{% if value.self %}{{ __('clients.this_device') }}{% else %}{{ __('notificationconfig.unknown_platform') }}{% endif %}</p>
                    </div>
                </li>
            {% endfor %}
        </ul>
    </div>
</form>
{% else %}
<div class="placeholder">
    <i class="material-symbols">notifications</i>
    <h1>{{ __('notificationconfig.push_subscriptions') }}</h1>
</div>
{% endif %}