@finos/legend-application
Version:
Legend application core
83 lines • 5.3 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
/**
* Copyright (c) 2020-present, Goldman Sachs
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { observer } from 'mobx-react-lite';
import { useApplicationStore } from './ApplicationStoreProvider.js';
import { Notification, NotificationContent, ChevronDownIcon, ChevronUpIcon, TimesIcon, ExclamationTriangleIcon, TimesCircleIcon, CheckCircleIcon, InfoCircleIcon, BugIcon, clsx, } from '@finos/legend-art';
import { useState } from 'react';
import { DEFAULT_NOTIFICATION_HIDE_TIME, NOTIFCATION_SEVERITY, } from '../stores/NotificationService.js';
export const NotificationManager = observer(() => {
const applicationStore = useApplicationStore();
const notification = applicationStore.notificationService.notification;
const isOpen = Boolean(notification);
const message = notification?.message ?? '';
const severity = notification?.severity ?? NOTIFCATION_SEVERITY.INFO;
const [isExpanded, setIsExpanded] = useState(false);
let notificationIcon = (_jsx("div", { className: "notification__message__content__icon notification__message__content__icon--info", children: _jsx(InfoCircleIcon, {}) }));
switch (severity) {
case NOTIFCATION_SEVERITY.ILEGAL_STATE:
notificationIcon = (_jsx("div", { className: "notification__message__content__icon notification__message__content__icon--error", children: _jsx(BugIcon, {}) }));
break;
case NOTIFCATION_SEVERITY.ERROR:
notificationIcon = (_jsx("div", { className: "notification__message__content__icon notification__message__content__icon--error", children: _jsx(TimesCircleIcon, {}) }));
break;
case NOTIFCATION_SEVERITY.WARNING:
notificationIcon = (_jsx("div", { className: "notification__message__content__icon notification__message__content__icon--warning", children: _jsx(ExclamationTriangleIcon, {}) }));
break;
case NOTIFCATION_SEVERITY.SUCCESS:
notificationIcon = (_jsx("div", { className: "notification__message__content__icon notification__message__content__icon--success", children: _jsx(CheckCircleIcon, {}) }));
break;
default:
break;
}
const handleClose = () => {
applicationStore.notificationService.setNotification(undefined);
setIsExpanded(false);
};
const handleCopy = applicationStore.guardUnhandledError(() => applicationStore.clipboardService.copyTextToClipboard(message));
const toggleExpansion = () => setIsExpanded(!isExpanded);
const onSnackbarAutoHideOrClickAway = (event, reason) => {
// NOTE: we only should not allow dismissing the notification on click-away. First of call, this might not be desirable
// second, this clashes with modal that traps focus, e.g. when we have another modal open and want to show a notification
// the notification focus is stolen by the modal leading to the notification immediately gets clicked-away and closed
if (reason === 'timeout') {
handleClose();
}
};
return (_jsx(Notification, { classes: {
root: 'notification',
anchorOriginBottomRight: 'notification__position',
}, anchorOrigin: {
vertical: 'bottom',
horizontal: 'right',
}, open: isOpen,
// setting the auto-hide duration to null will stop it from hiding automatically
autoHideDuration: notification
? (notification.autoHideDuration ?? null)
: DEFAULT_NOTIFICATION_HIDE_TIME, onClose: onSnackbarAutoHideOrClickAway, children: _jsx(NotificationContent, { classes: {
root: 'notification__content',
message: 'notification__message',
action: 'notification__actions',
}, message: _jsxs("div", { className: "notification__message__content", children: [notificationIcon, _jsx("div", { className: clsx('notification__message__content__text', {
'notification__message__content__text--expanded': isExpanded,
}), onClick: handleCopy, title: "Click to Copy", children: message })] }), action: [
_jsx("button", { className: "notification__action", onClick: toggleExpansion, tabIndex: -1, title: isExpanded ? 'Collapse' : 'Expand', children: isExpanded ? _jsx(ChevronDownIcon, {}) : _jsx(ChevronUpIcon, {}) }, "expand"),
_jsx("button", { className: "notification__action", onClick: handleClose, tabIndex: -1, title: "Dismiss", children: _jsx(TimesIcon, {}) }, "close"),
] }) }, typeof message === 'string' || typeof message === 'number'
? message
: ''));
});
//# sourceMappingURL=NotificationManager.js.map