NotBigGhostandClaude Opus 5
3587fc8af2
Многие тосты повторяли то, что пользователь и так видит сразу после действия: новую фракцию или аватар в профиле, переход на страницу партии, исчезнувшую карточку приглашения, закрывшийся редактор. Такой шум приучает не читать всплывашки, в том числе ошибки. Убраны 19 таких тостов в профиле, группах, партиях и админке. Остались ошибки, предупреждения (лимит фото, повторы фракций, конфликт правок, «вы не в группе») и сообщения о действиях без видимого следа: приглашение отправлено, дополнения сохранены, вступление в группу, пароль задан. Сохранение текстового поля, где заметна только погасшая кнопка, тоже осталось. По просьбе владельца оставшиеся тосты показываются не нижней «таблеткой», а всплывашкой сверху, как входящие уведомления. ToastProvider держит одну стопку на всё приложение: show — обычное сообщение, error — ошибка с красной полосой (держится 5 с), notify — уведомление с переходом по клику. Одинаковое сообщение не копится, а заменяет прежнее; клик по карточке закрывает её. NotificationToaster больше не рисует свою стопку, а отдаёт новые уведомления в общую, поэтому они не наезжают на сообщения. Все вызовы с ApiError и отказы (лимит фото, партия изменилась на другом устройстве) переведены на toast.error. Нижний класс .toast удалён. #41 Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01XfTsytzT6TojfmprRDKiV6
37 lines
1.6 KiB
TypeScript
37 lines
1.6 KiB
TypeScript
import { useEffect, useRef } from "react";
|
|
import { useNavigate } from "react-router-dom";
|
|
|
|
import { useToast } from "../context/ToastContext";
|
|
import { useNotifications } from "../hooks/notifications";
|
|
|
|
/** Всплывашки сверху экрана в момент прихода новых уведомлений (push-to-invalidate → pull).
|
|
* Первый снимок списка не всплывает (чтобы не спамить при загрузке) — только новые id.
|
|
* Показывает их общая стопка ToastProvider — там же, где сообщения приложения. */
|
|
export function NotificationToaster({ enabled }: { enabled: boolean }) {
|
|
const { data } = useNotifications(enabled);
|
|
const navigate = useNavigate();
|
|
const toast = useToast();
|
|
const seen = useRef<Set<number> | null>(null);
|
|
|
|
useEffect(() => {
|
|
if (!data) return;
|
|
const items = data.items;
|
|
if (seen.current === null) {
|
|
seen.current = new Set(items.map((n) => n.id)); // первая загрузка — запомнить, не всплывать
|
|
return;
|
|
}
|
|
const fresh = items.filter((n) => !seen.current!.has(n.id));
|
|
fresh.forEach((n) => seen.current!.add(n.id));
|
|
// Стопка добавляет новое наверх, поэтому идём с конца: первое в списке окажется сверху.
|
|
[...fresh].reverse().forEach((n) =>
|
|
toast.notify({
|
|
title: n.title,
|
|
body: n.body,
|
|
onClick: n.link ? () => navigate(n.link!) : undefined,
|
|
}),
|
|
);
|
|
}, [data, toast, navigate]);
|
|
|
|
return null;
|
|
}
|