@adaptabletools/adaptable-cjs
Version:
Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements
56 lines (55 loc) • 2.9 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.AlertStatusPanel = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const react_redux_1 = require("react-redux");
const AdaptableContext_1 = require("../AdaptableContext");
const getAlertButtonStyle_1 = require("./Utilities/getAlertButtonStyle");
const StatusBarPanel_1 = require("../StatusBar/StatusBarPanel");
const ModuleConstants = tslib_1.__importStar(require("../../Utilities/Constants/ModuleConstants"));
const ActiveAlertsPanel_1 = require("./ActiveAlertsPanel");
const initialStyle = { color: '', background: '' };
const AlertStatusPanel = () => {
const adaptableApi = (0, AdaptableContext_1.useAdaptable)().api;
const [style, setStyle] = React.useState(initialStyle);
const module = adaptableApi.internalApi
.getModuleService()
.getModuleById(ModuleConstants.AlertModuleId);
const statusbarHighlightDuration = adaptableApi.optionsApi.getAlertOptions().statusbarHighlightDuration;
/**
* Using a selector to so the component updates each time an alert is triggered.
*/
const alerts = (0, react_redux_1.useSelector)((state) => state.Internal.AdaptableAlerts);
const text = alerts.length == 0 ? '0 Alerts' : alerts.length == 1 ? '1 Alert' : alerts.length + ' Alerts';
const handleAction = React.useCallback(() => adaptableApi.alertApi.openAlertSettingsPanel(), []);
// blinking logic
const previousAlerts = React.useRef(alerts);
const timeoutId = React.useRef(null);
React.useEffect(() => {
const noNewAlerts = previousAlerts.current.length === alerts.length;
previousAlerts.current = alerts;
if (!alerts.length) {
return;
}
if (noNewAlerts) {
return;
}
const { color, background } = (0, getAlertButtonStyle_1.getAlertButtonStyle)(alerts);
setStyle({ color, background });
if (timeoutId.current) {
clearTimeout(timeoutId.current);
timeoutId.current = null;
}
/**
* Cannot clear timeout in the useEffect cleanup function, because this logic is not
* called for each case. e.g. it is skipped for when alerts are not added.
*/
timeoutId.current = setTimeout(() => {
setStyle(initialStyle);
}, statusbarHighlightDuration);
}, [alerts]);
let alertsPanel = React.createElement(ActiveAlertsPanel_1.ActiveAlertsPanel, null);
return (React.createElement(StatusBarPanel_1.StatusBarPanel, { tooltip: module.moduleInfo.ModuleName, "data-name": module.moduleInfo.ModuleName, color: style.color, backgroundColor: style.background, onAction: handleAction, icon: module.moduleInfo.Glyph, popover: alerts.length ? alertsPanel : null, content: text }));
};
exports.AlertStatusPanel = AlertStatusPanel;