2021-07-08 07:46:59 +02:00
|
|
|
import { FC, useCallback, useState } from 'react';
|
|
|
|
import { NotificationCenterAlertEvent } from '../../events';
|
2021-06-22 11:52:47 +02:00
|
|
|
import { useUiEvent } from '../../hooks/events';
|
2021-06-22 18:40:28 +02:00
|
|
|
import { NotificationCenterMessageHandler } from './NotificationCenterMessageHandler';
|
2021-06-22 11:52:47 +02:00
|
|
|
import { NotificationCenterViewProps } from './NotificationCenterView.types';
|
2021-07-08 07:46:59 +02:00
|
|
|
import { NotificationCenterBroadcastMessageView } from './views/broadcast-message/NotificationCenterBroadcastMessageView';
|
2021-06-22 11:52:47 +02:00
|
|
|
|
|
|
|
export const NotificationCenterView: FC<NotificationCenterViewProps> = props =>
|
|
|
|
{
|
2021-07-08 07:46:59 +02:00
|
|
|
const [ alerts, setAlerts ] = useState<NotificationCenterAlertEvent[]>([]);
|
2021-06-22 11:52:47 +02:00
|
|
|
|
2021-08-05 19:32:09 +02:00
|
|
|
|
|
|
|
|
2021-07-08 07:46:59 +02:00
|
|
|
const onNotificationCenterAlertEvent = useCallback((event: NotificationCenterAlertEvent) =>
|
2021-06-22 11:52:47 +02:00
|
|
|
{
|
2021-07-08 07:46:59 +02:00
|
|
|
setAlerts(prevValue =>
|
|
|
|
{
|
|
|
|
return [ ...prevValue, event ];
|
|
|
|
});
|
2021-06-22 11:52:47 +02:00
|
|
|
}, []);
|
|
|
|
|
2021-07-08 07:46:59 +02:00
|
|
|
useUiEvent(NotificationCenterAlertEvent.HOTEL_ALERT, onNotificationCenterAlertEvent);
|
2021-06-22 20:14:41 +02:00
|
|
|
|
2021-07-08 07:46:59 +02:00
|
|
|
const closeAlert = useCallback((alert: NotificationCenterAlertEvent) =>
|
2021-06-22 20:14:41 +02:00
|
|
|
{
|
2021-07-08 07:46:59 +02:00
|
|
|
setAlerts(prevValue =>
|
2021-06-22 20:14:41 +02:00
|
|
|
{
|
2021-07-08 07:46:59 +02:00
|
|
|
const newAlerts = [ ...prevValue ];
|
|
|
|
const index = newAlerts.findIndex(value => (alert === value));
|
2021-06-22 20:14:41 +02:00
|
|
|
|
2021-07-08 07:46:59 +02:00
|
|
|
if(index >= 0) newAlerts.splice(index, 1);
|
|
|
|
|
|
|
|
return newAlerts;
|
2021-06-22 20:14:41 +02:00
|
|
|
});
|
2021-07-08 07:46:59 +02:00
|
|
|
}, []);
|
2021-06-22 11:52:47 +02:00
|
|
|
|
|
|
|
return (
|
2021-07-08 07:46:59 +02:00
|
|
|
<>
|
2021-06-22 18:40:28 +02:00
|
|
|
<NotificationCenterMessageHandler />
|
2021-07-08 07:46:59 +02:00
|
|
|
{ (alerts.length > 0) && alerts.map((alert, index) =>
|
|
|
|
{
|
|
|
|
switch(alert.type)
|
|
|
|
{
|
|
|
|
case NotificationCenterAlertEvent.HOTEL_ALERT:
|
|
|
|
default:
|
|
|
|
return <NotificationCenterBroadcastMessageView key={ index } notification={ alert } onClose={ () => closeAlert(alert) } />;
|
|
|
|
}
|
|
|
|
})}
|
|
|
|
</>
|
2021-06-22 11:52:47 +02:00
|
|
|
);
|
|
|
|
}
|