Группировка уведомлений

Библиотека iziToast предоставляет гибкую систему для создания уведомлений в веб-приложениях. Одной из мощных возможностей является группировка уведомлений, позволяющая объединять сообщения по типу, теме или идентификатору, что улучшает визуальное восприятие и контроль над потоками уведомлений.

Использование свойства `group`

Ключевой механизм группировки — свойство group. Оно позволяет идентифицировать уведомления, которые должны быть отображены совместно. Все уведомления с одинаковым значением group будут замещать друг друга, если в настройках указано соответствующее поведение.

Пример базовой группировки:

iziToast.show({
    title: 'Информация',
    message: 'Первое уведомление группы "info"',
    group: 'info',
    position: 'topRight'
});

iziToast.show({
    title: 'Информация',
    message: 'Второе уведомление группы "info"',
    group: 'info',
    position: 'topRight'
});

В этом случае второе уведомление заменит первое, так как они принадлежат одной группе.

Настройка поведения замещения

По умолчанию, уведомления с одной группой замещают друг друга. Для управления этим поведением используются параметры:

override — логическое значение. Если true, новое уведомление заменяет текущее с той же группой.
resetOnHover — при true таймер исчезновения уведомления сбрасывается при наведении мыши.

Пример с использованием override:

iziToast.show({
    title: 'Ошибка',
    message: 'Произошла ошибка №1',
    group: 'error',
    override: true,
    position: 'bottomLeft'
});

iziToast.show({
    title: 'Ошибка',
    message: 'Произошла ошибка №2',
    group: 'error',
    override: true,
    position: 'bottomLeft'
});

В этом случае уведомление о второй ошибке полностью заменяет первое.

Создание нескольких уведомлений одной группы

Если необходимо, чтобы уведомления не заменяли друг друга, а накладывались, используется различные значения group для каждого сообщения или не указывается group. Пример:

iziToast.show({
    title: 'Напоминание',
    message: 'Событие A',
    group: 'reminderA',
    position: 'topRight'
});

iziToast.show({
    title: 'Напоминание',
    message: 'Событие B',
    group: 'reminderB',
    position: 'topRight'
});

Таким образом, каждое уведомление отображается независимо.

Динамическое обновление уведомлений

Группировка позволяет обновлять существующие уведомления, а не создавать новые. Для этого можно использовать метод iziToast.update:

// Создание уведомления с идентификатором группы
iziToast.show({
    title: 'Статус загрузки',
    message: '0% выполнено',
    group: 'upload',
    position: 'topCenter',
    timeout: false
});

// Обновление сообщения
iziToast.update({
    group: 'upload',
    message: '50% выполнено'
});

iziToast.update({
    group: 'upload',
    message: '100% выполнено',
    color: 'green',
    title: 'Загрузка завершена'
});

Использование групп позволяет не создавать лишние уведомления, а изменять существующие в реальном времени.

Комбинирование групп и позиций

Группы работают независимо от позиции на экране. Это позволяет, например, создать разные потоки уведомлений для разных областей интерфейса:

iziToast.show({
    title: 'Уведомление',
    message: 'Группа A, верхний правый угол',
    group: 'A',
    position: 'topRight'
});

iziToast.show({
    title: 'Уведомление',
    message: 'Группа A, нижний левый угол',
    group: 'A',
    position: 'bottomLeft'
});

В этом случае уведомления с одной группой будут контролироваться независимо в каждой позиции.

Практические сценарии использования

Статус загрузки — уведомление с прогрессом, обновляемое через group.
Ошибки и предупреждения — замещение предыдущих сообщений одной категории для уменьшения визуального хаоса.
Сообщения чата — отдельные группы для каждого пользователя или канала, чтобы уведомления не смешивались.
Информационные панели — объединение всех уведомлений одного типа, например «новости» или «события», с автоматическим обновлением.