Extract Materialize Toast controller

This commit is contained in:
Yassine Guedidi 2025-03-02 12:44:38 +01:00
parent 5f2dd66948
commit d2e864da10
5 changed files with 18 additions and 12 deletions

View file

@ -0,0 +1,12 @@
import { Controller } from '@hotwired/stimulus';
import M from '@materializecss/materialize';
export default class extends Controller {
connect() {
this.instance = M.toast({ text: this.element.innerText });
}
disconnect() {
this.instance.dismissAll();
}
}

View file

@ -4,7 +4,7 @@ import $ from 'jquery';
/* Materialize imports */
import '@materializecss/materialize/dist/css/materialize.css';
import M from '@materializecss/materialize/dist/js/materialize';
import '@materializecss/materialize/dist/js/materialize';
/* Annotations */
import annotator from 'annotator';
@ -348,10 +348,4 @@ $(document).ready(() => {
qrcode.setAttribute('src', src);
});
document.querySelectorAll('.material-toast').forEach((toast) => {
M.toast({
text: toast.innerText,
});
});
});

View file

@ -1,9 +1,9 @@
{% if nbRedisMessages is defined and nbRedisMessages > 0 %}
<p class="material-toast hidden">Messages in queue: {{ nbRedisMessages }}</p>
<p class="hidden" data-controller="materialize--toast">Messages in queue: {{ nbRedisMessages }}</p>
{% endif %}
{% if nbRabbitMessages is defined and nbRabbitMessages > 0 %}
<p class="material-toast hidden">Messages in queue: {{ nbRabbitMessages }}</p>
<p class="hidden" data-controller="materialize--toast">Messages in queue: {{ nbRabbitMessages }}</p>
{% endif %}
{% if redisNotInstalled is defined and redisNotInstalled %}

View file

@ -5,11 +5,11 @@
<div class="card-content">
{% if error %}
<p class="material-toast hidden">{{ error.messageKey|trans(error.messageData, 'security') }}</p>
<p class="hidden" data-controller="materialize--toast">{{ error.messageKey|trans(error.messageData, 'security') }}</p>
{% endif %}
{% for flash_message in app.session.flashbag.get('notice') %}
<p class="material-toast hidden">{{ flash_message }}</p>
<p class="hidden" data-controller="materialize--toast">{{ flash_message }}</p>
{% endfor %}
<div class="row">

View file

@ -35,7 +35,7 @@
{% block messages %}
{% for flash_message in app.session.flashbag.get('notice') %}
<p class="material-toast hidden">{{ flash_message|trans }}</p>
<p class="hidden" data-controller="materialize--toast">{{ flash_message|trans }}</p>
{% endfor %}
{% endblock %}