render(() => {
    const [notifications, setNotifications] = React.useState([]);

    const [count, setCount] = React.useState(1);

    const getColorBadge = (num) => {
        if (num % 3 === 1) {
            return 'positive';
        } else if (num % 3 === 2) {
            return 'attention';
        } else if (num % 3 === 0) {
            return 'negative';
        }
    };

    const addNotification = () => {
        const newNotification = (
            <Notification
                badge={getColorBadge(count)}
                title={`Уведомление #${count}`}
                autoCloseDelay={3000}
                id={count.toString()}
                key={count.toString()}
                zIndex={1000 + count}
            >
                Описание уведомления
            </Notification>
        );

        setNotifications([...notifications, newNotification]);
        setCount((val) => val + 1);
    };

    const removeNotification = React.useCallback((id) => {
        /**
         * Обратите внимание, что актуальный массив нотификаций
         * нужно брать из аргументов функции обновления состояния.
         */
        setNotifications((actualNotifications) =>
            actualNotifications.filter((notification) => notification.props.id !== id),
        );
    }, []);

    return (
        <div>
            <Button onClick={addNotification}>Показать уведомление</Button>
            <NotificationManager
                notifications={notifications}
                onRemoveNotification={removeNotification}
                position='bottom' // 'top' || 'bottom
            />
        </div>
    );
});