import React, { useState, useEffect } from 'react';
import { NotificationService, EVENTS } from './notification-service';
import { NotificationPopup } from './notification-popup';
import { useTranslation } from '../hooks/use-translation';
import { jsx as _jsx } from "react/jsx-runtime";
export function NotificationPopupContainer({
  closeButtonText,
  retryText: retryTextParams
}) {
  const {
    t
  } = useTranslation();
  const retryText = retryTextParams ?? t('Retry');
  const [shownNotifications, setShownNotifications] = useState([]);
  function handleShowNotification(customNotification) {
    const newNotification = {
      ...customNotification,
      title: customNotification.retry ? customNotification.title ?? retryText : customNotification.title
    };
    if (!newNotification) {
      return;
    }
    setShownNotifications(existingNotifications => {
      const messageAlreadyShown = existingNotifications.some(notification => notification.message === newNotification.message);
      return messageAlreadyShown ? existingNotifications : [newNotification, ...existingNotifications];
    });
  }
  useEffect(() => {
    const subscriptions = [NotificationService.subscribe(EVENTS.NOTIFICATION_SHOW, handleShowNotification), NotificationService.subscribe(EVENTS.NOTIFICATIONS_DISMISS_ALL, () => setShownNotifications([]))];
    return () => subscriptions.forEach(subscription => subscription.cancel());
  }, []);
  function onNotificationHidden(hiddenNotification) {
    setShownNotifications(existingNotifications => {
      return existingNotifications.filter(notification => {
        return notification.message !== hiddenNotification.message;
      });
    });
  }
  return /*#__PURE__*/_jsx("div", {
    className: "notification-popup-container",
    "test-id": "notification-popup-container",
    children: shownNotifications.map(notification => {
      return /*#__PURE__*/_jsx(NotificationPopup, {
        notification: notification,
        onHidden: onNotificationHidden,
        closeButtonText: closeButtonText ?? t('Close')
      }, notification.message);
    })
  });
}