@dexteel/mesf-core 4.23.1 → 4.24.0

package/dist/index.esm.js

@@ -1,9 +1,9 @@
 export { LicenseManager } from 'ag-grid-enterprise';
-import { withStyles, DialogTitle as DialogTitle$1, DialogContent as DialogContent$1, DialogActions as DialogActions$1, createStyles, Grid, Button, alpha, makeStyles, Dialog as Dialog$1, SvgIcon, Collapse, Typography as Typography$1, Checkbox, TextField, InputAdornment, IconButton as IconButton$1, MenuItem, Select, Card, CardContent, CardActions, Snackbar, CircularProgress, Paper, InputLabel, FormHelperText, DialogContentText, FormControlLabel, Badge, useTheme, FormControl, Input, Chip, Tooltip, ListItemIcon, MenuList, Divider, Box, debounce, List, ListItem, ListItemText } from '@material-ui/core';
+import { withStyles, DialogTitle as DialogTitle$1, DialogContent as DialogContent$1, DialogActions as DialogActions$1, createStyles, Grid, Button, alpha, makeStyles, Dialog as Dialog$1, SvgIcon, Collapse, Typography as Typography$1, Checkbox, TextField, InputAdornment, IconButton as IconButton$1, MenuItem, Select, Card, CardContent, CardActions, Snackbar, CircularProgress, Paper, InputLabel, FormHelperText, DialogContentText, FormControlLabel, Badge, useTheme, FormControl, Input, Chip, Tooltip, ListItemIcon, Box, List, ListItem, ListItemText, MenuList, Divider, debounce } from '@material-ui/core';
 import { get as get$1, isNil as isNil$1, isEmpty, values, round, isNaN, isNumber } from 'lodash-es';
 import * as React from 'react';
 import React__default, { useState, useRef, useEffect, useMemo, Component, createContext, useContext, useCallback, lazy, Suspense } from 'react';
-import { ArrowRight, ArrowBackRounded, ArrowForwardRounded, SkipNext, ChevronLeft, ChevronRight } from '@material-ui/icons';
+import { ArrowRight, ArrowBackRounded, ArrowForwardRounded, SkipNext, ChevronLeft, ChevronRight, Send } from '@material-ui/icons';
 import { DatePicker } from '@mui/x-date-pickers/DatePicker';
 import { Outlet, useParams, useNavigate, useSearchParams, Link, Navigate, Routes, Route, BrowserRouter } from 'react-router-dom';
 import { Alert as Alert$1, Modal as Modal$1, Navbar, Container, Nav, NavDropdown } from 'react-bootstrap';
@@ -22,15 +22,17 @@ import moment$4 from 'moment';
 import EditIcon from '@material-ui/icons/Edit';
 import PlaylistAddIcon from '@material-ui/icons/PlaylistAdd';
 import { isNil, get } from 'lodash';
+import { HubConnectionBuilder, LogLevel as LogLevel$1 } from '@microsoft/signalr';
+import { Alert as Alert$3, Autocomplete } from '@material-ui/lab';
+import { useForm, Controller } from 'react-hook-form';
+import 'ag-grid-community/styles/ag-theme-material.min.css';
 import DeleteIcon from '@material-ui/icons/Delete';
 import FormatListBulletedSharpIcon from '@material-ui/icons/FormatListBulletedSharp';
-import { useForm, Controller } from 'react-hook-form';
 import axios from 'axios';
 import { _adapters, Chart, CategoryScale, LinearScale, PointElement, LineElement, Title, Tooltip as Tooltip$1, Legend, TimeScale } from 'chart.js';
 import zoomPlugin from 'chartjs-plugin-zoom';
 import LockIcon from '@material-ui/icons/Lock';
 import SaveIcon from '@material-ui/icons/Save';
-import { Alert as Alert$3, Autocomplete } from '@material-ui/lab';
 import Button$1 from '@material-ui/core/Button';
 import Popover from '@material-ui/core/Popover';
 import CreateIcon from '@material-ui/icons/Create';
@@ -573,7 +575,7 @@ var ModalTreeFilterControl = function (props) {
             React__default.createElement(Button, { onClick: handleOk, color: "primary" }, "OK"))));
 };
 
-var useStyles$z = makeStyles(function (theme) { return ({
+var useStyles$B = makeStyles(function (theme) { return ({
     root: {
         width: "100%",
         backgroundColor: theme.palette.background.paper,
@@ -589,7 +591,7 @@ var useStyles$z = makeStyles(function (theme) { return ({
     }
 }); });
 var TreePickerControl = function (props) {
-    var classes = useStyles$z();
+    var classes = useStyles$B();
     var onSelect = props.onSelect, value = props.value; props.styleLabel; var dataSource = props.dataSource, _a = props.inputTitle, inputTitle = _a === void 0 ? "Asset" : _a; props.showPath; var _c = props.multipleSelectNodes, multipleSelectNodes = _c === void 0 ? false : _c, _d = props.showClearButton, showClearButton = _d === void 0 ? false : _d, showAssetTree = props.showAssetTree, onHide = props.onHide, _e = props.listAssetDrawings, listAssetDrawings = _e === void 0 ? [] : _e, onSuccess = props.onSuccess, isLoading = props.isLoading, other = __rest(props, ["onSelect", "value", "styleLabel", "dataSource", "inputTitle", "showPath", "multipleSelectNodes", "showClearButton", "showAssetTree", "onHide", "listAssetDrawings", "onSuccess", "isLoading"]);
     var _f = useState(showAssetTree || false), open = _f[0], setOpen = _f[1];
     var handleClickListItem = function (e) {
@@ -673,7 +675,7 @@ var TreePickerControl = function (props) {
                 }, onHide: onHide, id: "modal-treeview-filter", title: props.title, keepMounted: true, open: open, onClose: handleClose, isLoading: isLoading, value: value, data: dataSource, onBackdropClick: function () { return setOpen(false); }, multipleSelectNodes: multipleSelectNodes, listAssetDrawings: listAssetDrawings, setListAssetDrawings: listAssetDrawings, onSuccess: onSuccess }, other)))));
 };
 
-var useStyles$y = makeStyles(function (theme) { return ({
+var useStyles$A = makeStyles(function (theme) { return ({
     root: {
         width: "100%",
         backgroundColor: theme.palette.background.paper
@@ -699,7 +701,7 @@ function findNameById(node, id) {
     return null;
 }
 var TreePickerControlV2 = function (props) {
-    var classes = useStyles$y();
+    var classes = useStyles$A();
     var value = props.value, onSelect = props.onSelect; props.styleLabel; var dataSource = props.dataSource; props.getOptionName; var _a = props.inputTitle, inputTitle = _a === void 0 ? "Asset" : _a; props.showPath; var _c = props.multipleSelectNodes, multipleSelectNodes = _c === void 0 ? false : _c, _d = props.showClearButton, showClearButton = _d === void 0 ? false : _d, showAssetTree = props.showAssetTree, onHide = props.onHide, _e = props.listAssetDrawings, listAssetDrawings = _e === void 0 ? [] : _e, onSuccess = props.onSuccess, isLoading = props.isLoading, _f = props.disabled, disabled = _f === void 0 ? false : _f, other = __rest(props, ["value", "onSelect", "styleLabel", "dataSource", "getOptionName", "inputTitle", "showPath", "multipleSelectNodes", "showClearButton", "showAssetTree", "onHide", "listAssetDrawings", "onSuccess", "isLoading", "disabled"]);
     var _g = useState(false), open = _g[0], setOpen = _g[1];
     var handleClickListItem = function (event) {
@@ -1352,7 +1354,7 @@ var useJobsOptionsFunctions = function (_a) {
     };
 };
 
-var useStyles$x = makeStyles(function (theme) { return ({
+var useStyles$z = makeStyles(function (theme) { return ({
     buttons: {
         opacity: 0,
         transition: "opacity 0.1s ease-in-out",
@@ -1370,7 +1372,7 @@ var useStyles$x = makeStyles(function (theme) { return ({
 var useJobsTableData = function (_a) {
     var setRowSelected = _a.setRowSelected, showContextMenu = _a.showContextMenu;
     var _b = useJobsContext().state, jobsData = _b.jobsData, blockButtons = _b.blockButtons;
-    var classes = useStyles$x();
+    var classes = useStyles$z();
     var rows = jobsData.map(function (_a) {
         var JobId = _a.JobId, sProcedure = _a.sProcedure, Running = _a.Running, LastStarted = _a.LastStarted, LastCounter = _a.LastCounter, Enabled = _a.Enabled, RestartAfterFailure = _a.RestartAfterFailure, PeriodTime = _a.PeriodTime, StartTime = _a.StartTime, NextExecutionTime = _a.NextExecutionTime;
         return ({
@@ -1655,7 +1657,7 @@ var useJobsTableData = function (_a) {
     return { rows: rows, columnDefs: columnDefs };
 };
 
-var useStyles$w = makeStyles(function (theme) { return ({
+var useStyles$y = makeStyles(function (theme) { return ({
     root: {
         "& .MuiDataGrid-row": {
             cursor: "pointer"
@@ -1718,7 +1720,7 @@ var useStyles$w = makeStyles(function (theme) { return ({
 }); });
 var TableJobs = function (_a) {
     var getJobsFromAPI = _a.getJobsFromAPI, isLoading = _a.isLoading;
-    var classes = useStyles$w();
+    var classes = useStyles$y();
     var _b = useState(null), rowSelected = _b[0], setRowSelected = _b[1];
     var _c = useState(false), snackbarLoading = _c[0], setSnackbarLoading = _c[1];
     var _d = useState(false), snackbarSuccessfulMessage = _d[0], setSnackbarSuccessfulMessage = _d[1];
@@ -1982,7 +1984,7 @@ var SearchFilter = function (_a) {
         React__default.createElement(FormHelperText, { style: { marginBottom: 10, marginTop: -15 } }, "Search by Source, Message or User")));
 };
 
-var useStyles$v = makeStyles(function (theme) { return ({
+var useStyles$x = makeStyles(function (theme) { return ({
     title: {
         fontSize: 15
     },
@@ -1999,7 +2001,7 @@ var formatTime = function (nowTime) {
 };
 var ModalLogSelected = function (_a) {
     var show = _a.show, onHide = _a.onHide, selectedLog = _a.selectedLog;
-    var classes = useStyles$v();
+    var classes = useStyles$x();
     return (React__default.createElement(Grid, { container: true, justifyContent: "center", alignItems: "center" },
         React__default.createElement(MesfModal, { title: "LOG DETAILS", open: show, handleClose: function () { return onHide(false); }, maxWidth: "md", id: "log-details-modal" },
             React__default.createElement(MesfModal.Content, { style: { padding: "15px 30px" } },
@@ -2055,7 +2057,7 @@ var ModalLogSelected = function (_a) {
                         React__default.createElement(Button, { fullWidth: true, variant: "contained", color: "default", onClick: function () { return onHide(true); } }, "Close")))))));
 };
 
-var useStyles$u = makeStyles(function (theme) { return ({
+var useStyles$w = makeStyles(function (theme) { return ({
     buttons: {
         opacity: 0,
         transition: "opacity 0.1s ease-in-out",
@@ -2073,7 +2075,7 @@ var useStyles$u = makeStyles(function (theme) { return ({
 var useLogTableData = function () {
     var _a;
     var state = useLogsContext().state;
-    var classes = useStyles$u();
+    var classes = useStyles$w();
     var formatTime = function (nowTime) {
         return (nowTime.toLocaleDateString("en-US") + " " + nowTime.toLocaleTimeString());
     };
@@ -2194,7 +2196,7 @@ var ButtonWithLoading = function (_a) {
         children));
 };
 
-var useStyles$t = makeStyles(function (theme) { return ({
+var useStyles$v = makeStyles(function (theme) { return ({
     root: {
         "& .MuiDataGrid-row": {
             cursor: "pointer"
@@ -2288,7 +2290,7 @@ var useLogsOptionsFunctions = function (_a) {
 var TableLogs = function (_a) {
     var isLoading = _a.isLoading; _a.rowData; var refreshData = _a.refreshData;
     var _b = useLogsContext(), _c = _b.state.searchData, Start = _c.Start, End = _c.End, Search = _c.Search, LogTypeCode = _c.LogTypeCode, _d = _b.actions, setLogTypeCodeFilter = _d.setLogTypeCodeFilter, setEndFilter = _d.setEndFilter, setStartFilter = _d.setStartFilter, setSearchFilter = _d.setSearchFilter;
-    var classes = useStyles$t();
+    var classes = useStyles$v();
     var gridStyle = useMemo(function () { return ({ height: "100%", width: "100%" }); }, []);
     var _e = useState(null); _e[0]; var setGridAPI = _e[1];
     var _f = useState(false), showLogModal = _f[0], setShowLogModal = _f[1];
@@ -2578,7 +2580,7 @@ var deleteProfile = function (profileId) { return __awaiter(void 0, void 0, void
     });
 }); };
 
-var useStyles$s = makeStyles(function (theme) { return ({
+var useStyles$u = makeStyles(function (theme) { return ({
     title: {
         fontSize: 15
     },
@@ -2601,7 +2603,7 @@ var CreateProfile = function (_a) {
     var _d = useState(""), message = _d[0], setMessage = _d[1];
     var _e = useState(false), isSubmitLoading = _e[0], setIsSubmitLoading = _e[1];
     var _f = useState(""), error = _f[0], setError = _f[1];
-    var classes = useStyles$s();
+    var classes = useStyles$u();
     var _g = useForm({ defaultValues: INITIAL_VALUES$3 }), register = _g.register, handleSubmit = _g.handleSubmit, reset = _g.reset, errors = _g.formState.errors;
     var onSubmit = function (data) { return __awaiter(void 0, void 0, void 0, function () {
         var res;
@@ -2836,7 +2838,7 @@ var DataTable = function (_a) {
         React__default.createElement(ErrorModal, { error: error, onHide: function () { return setError(""); } })));
 };
 
-var useStyles$r = makeStyles(function (theme) { return ({
+var useStyles$t = makeStyles(function (theme) { return ({
     root: {
         "& .MuiFormLabel-asterisk": {
             display: "none"
@@ -2845,7 +2847,7 @@ var useStyles$r = makeStyles(function (theme) { return ({
 }); });
 var ActionsOfProfile = function (_a) {
     var profileForEdit = _a.profileForEdit, show = _a.show, onHide = _a.onHide;
-    var classes = useStyles$r();
+    var classes = useStyles$t();
     var _b = useState(null), actionsOfProfile = _b[0], setActionsOfProfile = _b[1];
     var _c = useState(false), open = _c[0], setOpen = _c[1];
     var _d = useState(true), isLoading = _d[0], setIsLoading = _d[1];
@@ -3033,7 +3035,7 @@ var ProfilesProvider = function (_a) {
     return (React__default.createElement(ProfilesContext.Provider, { value: { state: state, actions: actions } }, children));
 };
 
-var useStyles$q = makeStyles(function (theme) { return ({
+var useStyles$s = makeStyles(function (theme) { return ({
     buttons: {
         opacity: 0,
         transition: "opacity 0.1s ease-in-out",
@@ -3051,7 +3053,7 @@ var useStyles$q = makeStyles(function (theme) { return ({
 var useTableData$3 = function (_a) {
     var setProfileId = _a.setProfileId, setModalProceduresProfile = _a.setModalProceduresProfile, setModalDeleteProfile = _a.setModalDeleteProfile, showContextMenu = _a.showContextMenu;
     var state = useProfilesContext().state;
-    var classes = useStyles$q();
+    var classes = useStyles$s();
     var rows = state.profiles.map(function (_a) {
         var ProfileId = _a.ProfileId, ProfileName = _a.ProfileName;
         return ({
@@ -3123,7 +3125,7 @@ var useTableData$3 = function (_a) {
     return { rows: rows, columnDefs: columnDefs };
 };
 
-var useStyles$p = makeStyles(function (theme) { return ({
+var useStyles$r = makeStyles(function (theme) { return ({
     root: {
         "& .ag-icon-menu": {
             display: "none"
@@ -3195,7 +3197,7 @@ var TableProfiles = function (_a) {
     var _e = useState(null), profile = _e[0], setProfile = _e[1];
     var gridStyle = useMemo(function () { return ({ height: "100%", width: "100%" }); }, []);
     var _f = useState(null), gridApi = _f[0], setGridApi = _f[1];
-    var classes = useStyles$p();
+    var classes = useStyles$r();
     var loadingOverlayComponent = useMemo(function () {
         return LazyLoading;
     }, []);
@@ -3434,7 +3436,7 @@ var DeleteShiftParameters = function (PatternStart) { return __awaiter(void 0, v
     });
 }); };
 
-var useStyles$o = makeStyles(function (theme) { return ({
+var useStyles$q = makeStyles(function (theme) { return ({
     title: {
         fontSize: 15
     },
@@ -3460,7 +3462,7 @@ var CreateShift = function (_a) {
     var _d = useState(false), open = _d[0], setOpen = _d[1];
     var _e = useState(false), isSubmitLoading = _e[0], setIsSubmitLoading = _e[1];
     var _f = useState(""), error = _f[0], setError = _f[1];
-    var classes = useStyles$o();
+    var classes = useStyles$q();
     var shiftTableData = useShiftsCrewsContext().state.shiftTableData;
     var _g = useForm({
         defaultValues: shiftTableData ? shiftTableData : INITIAL_VALUES$2
@@ -3662,7 +3664,7 @@ var CreateShift = function (_a) {
             React.createElement(Alert, { severity: "success", onClose: handleClose }, "The shift was created successfully"))));
 };
 
-var useStyles$n = makeStyles(function (theme) { return ({
+var useStyles$p = makeStyles(function (theme) { return ({
     title: {
         fontSize: 15
     },
@@ -3688,7 +3690,7 @@ var DeleteShift = function (_a) {
     var _c = useState(false), open = _c[0], setOpen = _c[1];
     var _d = useState(false), isSubmitLoading = _d[0], setIsSubmitLoading = _d[1];
     var _e = useState(false), deleteAlert = _e[0], setDeleteAlert = _e[1];
-    var classes = useStyles$n();
+    var classes = useStyles$p();
     var shiftTableData = useShiftsCrewsContext().state.shiftTableData;
     var _f = useState(""), error = _f[0], setError = _f[1];
     var _g = useForm({ defaultValues: INITIAL_VALUES$2 }), control = _g.control, setValue = _g.setValue, reset = _g.reset, watch = _g.watch, errors = _g.formState.errors;
@@ -3827,7 +3829,7 @@ var DeleteShift = function (_a) {
             React.createElement(Alert, { severity: "warning", onClose: handleClose }, "The shift was deleted successfully"))));
 };
 
-var useStyles$m = makeStyles(function (theme) { return ({
+var useStyles$o = makeStyles(function (theme) { return ({
     title: {
         fontSize: 15
     },
@@ -3854,7 +3856,7 @@ var EditShift = function (_a) {
     var _d = useState(""), error = _d[0], setError = _d[1];
     var _e = useState(false), isSubmitLoading = _e[0], setIsSubmitLoading = _e[1];
     var _f = useState(false), initialShiftPerDayAndCrewsNumber = _f[0], setInitialShiftPerDayAndCrewsNumber = _f[1];
-    var classes = useStyles$m();
+    var classes = useStyles$o();
     var shiftTableData = useShiftsCrewsContext().state.shiftTableData;
     var _g = useForm({ defaultValues: INITIAL_VALUES$2 }), control = _g.control, setValue = _g.setValue, handleSubmit = _g.handleSubmit, reset = _g.reset, watch = _g.watch, errors = _g.formState.errors;
     // Progress bar
@@ -4122,7 +4124,7 @@ var useShiftsOptionsFunctions = function (_a) {
     };
 };
 
-var useStyles$l = makeStyles(function (theme) { return ({
+var useStyles$n = makeStyles(function (theme) { return ({
     root: {
         opacity: 0,
         transition: "opacity 0.1s ease-in-out",
@@ -4141,7 +4143,7 @@ var useTableData$2 = function (_a) {
     var _b;
     var setOpenModalEditShift = _a.setOpenModalEditShift, setOpenModalDeleteShift = _a.setOpenModalDeleteShift, showContextMenu = _a.showContextMenu;
     var _c = useShiftsCrewsContext(), state = _c.state, actions = _c.actions;
-    var classes = useStyles$l();
+    var classes = useStyles$n();
     var rows = (_b = state.shifts) === null || _b === void 0 ? void 0 : _b.map(function (_a) {
         var PatternStart = _a.PatternStart, ShiftCodes = _a.ShiftCodes, Crews = _a.Crews, PatternDays = _a.PatternDays, CrewRotation = _a.CrewRotation, Comments = _a.Comments, CanEdit = _a.CanEdit;
         return ({
@@ -4252,7 +4254,7 @@ var useTableData$2 = function (_a) {
     return { rows: rows, columnDefs: columnDefs };
 };
 
-var useStyles$k = makeStyles(function (theme) { return ({
+var useStyles$m = makeStyles(function (theme) { return ({
     root: {
         "& .ag-icon-menu": {
             display: "none"
@@ -4302,7 +4304,7 @@ var useStyles$k = makeStyles(function (theme) { return ({
 }); });
 var TableShiftsCrews = function (_a) {
     _a.isLoading; var getShiftsCrewsFromAPI = _a.getShiftsCrewsFromAPI;
-    var classes = useStyles$k();
+    var classes = useStyles$m();
     var _b = useState(false), openModalNew = _b[0], setOpenModalNew = _b[1];
     var _c = useState(false), openModalEditShift = _c[0], setOpenModalEditShift = _c[1];
     var _d = useState(false), openModalDeleteShift = _d[0], setOpenModalDeleteShift = _d[1];
@@ -4806,7 +4808,7 @@ var useAssetCodes = function () {
     return { loadFilterAssets: loadFilterAssets };
 };
 
-var useStyles$j = makeStyles(function (theme) { return ({
+var useStyles$l = makeStyles(function (theme) { return ({
     root: {
         "& .input-group-text": {
             display: "none"
@@ -4849,7 +4851,7 @@ var useStyles$j = makeStyles(function (theme) { return ({
 }); });
 var CreateNewAssetDialog = function (_a) {
     var show = _a.show, onHide = _a.onHide;
-    var classes = useStyles$j();
+    var classes = useStyles$l();
     var _b = useState(true), fullWidth = _b[0]; _b[1];
     var _c = useState("sm"), maxWidth = _c[0]; _c[1];
     var _d = useState(false), assetCreatedSuccess = _d[0], setAssetCreatedSuccess = _d[1];
@@ -4968,7 +4970,7 @@ var CreateNewAssetDialog = function (_a) {
             React__default.createElement(Alert$2, { severity: "info", onClose: handleClose }, "Document created succesfully"))));
 };
 
-var useStyles$i = makeStyles(function (theme) { return ({
+var useStyles$k = makeStyles(function (theme) { return ({
     root: {
         "& .input-group-text": {
             display: "none"
@@ -5016,7 +5018,7 @@ var useStyles$i = makeStyles(function (theme) { return ({
 }); });
 var EditAssetDialog = function (_a) {
     var show = _a.show, onHide = _a.onHide;
-    var classes = useStyles$i();
+    var classes = useStyles$k();
     var _b = useState(true), fullWidth = _b[0]; _b[1];
     var _c = useState("sm"), maxWidth = _c[0]; _c[1];
     var _d = useState(false), assetEditedSuccess = _d[0], setAssetEditedSuccess = _d[1];
@@ -5136,7 +5138,7 @@ var EditAssetDialog = function (_a) {
                                 React__default.createElement(Alert$3, { severity: "info", onClose: handleClose }, "Document created succesfully")))))))));
 };
 
-var useStyles$h = makeStyles(function (theme) { return ({
+var useStyles$j = makeStyles(function (theme) { return ({
     root: {
         "& .input-group-text": {
             display: "none"
@@ -5180,7 +5182,7 @@ var useStyles$h = makeStyles(function (theme) { return ({
 }); });
 var RemoveAssetDialog = function (_a) {
     var show = _a.show, onHide = _a.onHide;
-    var classes = useStyles$h();
+    var classes = useStyles$j();
     var _b = useState(true), fullWidth = _b[0]; _b[1];
     var _c = useState("sm"), maxWidth = _c[0]; _c[1];
     var _d = useState(false), assetRemovedSuccess = _d[0], setAssetRemovedSuccess = _d[1];
@@ -5239,7 +5241,7 @@ var RemoveAssetDialog = function (_a) {
             React__default.createElement(Alert$2, { severity: "info", onClose: handleClose }, "Asset removed succesfully"))));
 };
 
-var useStyles$g = makeStyles(function (theme) { return ({
+var useStyles$i = makeStyles(function (theme) { return ({
     root: {
         "& .input-group-text": {
             display: "none"
@@ -5290,7 +5292,7 @@ var useStyles$g = makeStyles(function (theme) { return ({
 }); });
 var ViewerAssetDialog = function (_a) {
     var show = _a.show, onHide = _a.onHide;
-    var classes = useStyles$g();
+    var classes = useStyles$i();
     var _b = useState(true), fullWidth = _b[0]; _b[1];
     var _c = useState("sm"), maxWidth = _c[0]; _c[1];
     var _d = useConfigurationAssetContext().state, dataToCreateAsset = _d.dataToCreateAsset, assetNodeSelectedInTree = _d.assetNodeSelectedInTree;
@@ -5463,7 +5465,7 @@ var TypeIcon = function (props) {
     }
 };
 
-var useStyles$f = makeStyles(function (theme) { return ({
+var useStyles$h = makeStyles(function (theme) { return ({
     root: {
         alignItems: "center",
         backgroundColor: "#1967d2",
@@ -5488,7 +5490,7 @@ var useStyles$f = makeStyles(function (theme) { return ({
 }); });
 var CustomDragPreview$1 = function (props) {
     var _a;
-    var classes = useStyles$f();
+    var classes = useStyles$h();
     var item = props.monitorProps.item;
     return (React__default.createElement("div", { className: classes.root },
         React__default.createElement("div", { className: classes.icon },
@@ -5496,7 +5498,7 @@ var CustomDragPreview$1 = function (props) {
         React__default.createElement("div", { className: classes.label }, item.text)));
 };
 
-var useStyles$e = makeStyles(function (theme) { return ({
+var useStyles$g = makeStyles(function (theme) { return ({
     root: {
         alignItems: "center",
         display: "flex",
@@ -5543,7 +5545,7 @@ var CustomNode = function (_a) {
     var _c = useConfigurationAssetContext(), openAssets = _c.state.openAssets, setOpenAssets = _c.actions.setOpenAssets;
     var _d = props.node, id = _d.id, droppable = _d.droppable, data = _d.data;
     var indent = props.depth * 24;
-    var classes = useStyles$e();
+    var classes = useStyles$g();
     var nodeClasses = "".concat(classes.customNodeRoot, " ").concat(classes.root, " ").concat(isSelected ? classes.selected : "");
     var handleClick = function (e) {
         props.onClick(e, props.node);
@@ -5598,7 +5600,7 @@ var CustomNode = function (_a) {
             React__default.createElement(Typography$1, { variant: "body2" }, props.node.text))));
 };
 
-var useStyles$d = makeStyles(function (theme) { return ({
+var useStyles$f = makeStyles(function (theme) { return ({
     root: {
         alignItems: "flex-start",
         backgroundColor: "#1967d2",
@@ -5630,7 +5632,7 @@ var useStyles$d = makeStyles(function (theme) { return ({
     }
 }); });
 var MultipleDragPreview = function (props) {
-    var classes = useStyles$d();
+    var classes = useStyles$f();
     return (React__default.createElement(Badge, { classes: { badge: classes.badge }, color: "error", badgeContent: props.dragSources.length, anchorOrigin: { vertical: "top", horizontal: "right" } },
         React__default.createElement("div", { className: classes.root, "data-testid": "custom-drag-preview" }, props.dragSources.map(function (node) {
             var _a;
@@ -5641,7 +5643,7 @@ var MultipleDragPreview = function (props) {
         }))));
 };
 
-var useStyles$c = makeStyles(function (theme) { return ({
+var useStyles$e = makeStyles(function (theme) { return ({
     root: {},
     contextMenu: {
         backgroundColor: "#F8F8F8",
@@ -5687,7 +5689,7 @@ var useStyles$c = makeStyles(function (theme) { return ({
 }); });
 var AssetViewComponent = function () {
     var _a = useState([]), selectedNodes = _a[0], setSelectedNodes = _a[1];
-    var classes = useStyles$c();
+    var classes = useStyles$e();
     var _b = useState(false), isDragging = _b[0], setIsDragging = _b[1];
     var _c = useState(false), isCtrlPressing = _c[0], setIsCtrlPressing = _c[1];
     var _d = useState(false), isDoubleClick = _d[0], setIsDoubleClick = _d[1];
@@ -6100,7 +6102,7 @@ var INITIAL_VALUES$1 = {
     Profiles: []
 };
 
-var useStyles$b = makeStyles(function (theme) { return ({
+var useStyles$d = makeStyles(function (theme) { return ({
     root: {
         "& .MuiSelect-select": {
             minHeight: "40px"
@@ -6133,7 +6135,7 @@ var MenuProps$1 = {
 };
 var AuthTypeSelector = function (_a) {
     var value = _a.value, onChange = _a.onChange, disabled = _a.disabled;
-    var classes = useStyles$b();
+    var classes = useStyles$d();
     var _b = useState([]), authTypes = _b[0], setAuthTypes = _b[1];
     var _c = useState(true), isLoading = _c[0], setIsLoading = _c[1];
     var theme = useTheme();
@@ -6169,7 +6171,7 @@ var AuthTypeSelector = function (_a) {
                 React.createElement(Chip, { key: "selected-authType-".concat(selected), label: selectedAuthTypeName, className: classes.chip }))); }, MenuProps: MenuProps$1 }, authTypes.map(function (authType) { return (React.createElement(MenuItem, { key: "auth-".concat(authType.AuthTypeId), value: authType.AuthTypeId, style: getStyles(authType.AuthTypeId, authTypes, theme) }, authType.Name)); })))) : (React.createElement(React.Fragment, null))));
 };
 
-var useStyles$a = makeStyles(function (theme) { return ({
+var useStyles$c = makeStyles(function (theme) { return ({
     root: {
         "& .MuiSelect-select": {
             height: "auto",
@@ -6210,7 +6212,7 @@ var MenuProps = {
 };
 var ProfilesPicker = function (_a) {
     var value = _a.value, onChange = _a.onChange; _a.userIdForDelete; var setprofileError = _a.setprofileError, disabled = _a.disabled;
-    var classes = useStyles$a();
+    var classes = useStyles$c();
     var theme = useTheme();
     var _b = useState(true), isLoading = _b[0], setIsLoading = _b[1];
     var _c = useState([]), profiles = _c[0], setProfiles = _c[1];
@@ -6250,7 +6252,7 @@ var ProfilesPicker = function (_a) {
         React__default.createElement(Select, { autoWidth: true, labelId: "demo-mutiple-chip-label", id: "demo-mutiple-chip", multiple: true, value: value, onChange: onChange, input: React__default.createElement(Input, { id: "select-multiple-chip" }), renderValue: function (selected) { return (React__default.createElement("div", { className: classes.chips }, selected.map(function (profileId) { return (React__default.createElement(Chip, { key: "selected-profile-".concat(profileId), label: getProfileNameById(profileId), className: classes.chip })); }))); }, MenuProps: MenuProps }, profiles.map(function (profile) { return (React__default.createElement(MenuItem, { key: "profile-".concat(profile.ProfileId), value: profile.ProfileId, style: getStyles(profile.ProfileId, profiles, theme) }, profile.ProfileName.replaceAll("Profile", ""))); })))) : (React__default.createElement(React__default.Fragment, null))));
 };
 
-var useStyles$9 = makeStyles(function (theme) { return ({
+var useStyles$b = makeStyles(function (theme) { return ({
     checkbox: {
         userSelect: "none"
     },
@@ -6272,7 +6274,7 @@ var CreateUser = function (_a) {
     var _f = useState(false), isSubmitLoading = _f[0], setIsSubmitLoading = _f[1];
     var _g = useState(""), error = _g[0], setError = _g[1];
     var _h = useState(""), profileError = _h[0], setprofileError = _h[1];
-    var classes = useStyles$9();
+    var classes = useStyles$b();
     var _j = useForm({ defaultValues: INITIAL_VALUES$1 }), register = _j.register, control = _j.control, handleSubmit = _j.handleSubmit, reset = _j.reset, watch = _j.watch, errors = _j.formState.errors;
     var handleClose = function (event, reason) {
         if (reason === "clickaway") {
@@ -6487,7 +6489,7 @@ var DeleteUser = function (_a) {
         React__default.createElement(ErrorModal, { error: profileError, onHide: function () { return setprofileError(""); }, title: "Error Choosing Profile" })));
 };
 
-var useStyles$8 = makeStyles(function (theme) { return ({
+var useStyles$a = makeStyles(function (theme) { return ({
     checkbox: {
         userSelect: "none"
     },
@@ -6506,7 +6508,7 @@ var useStyles$8 = makeStyles(function (theme) { return ({
 var EditUser = function (_a) {
     var _b, _c, _d;
     var userId = _a.userId, show = _a.show, onHide = _a.onHide;
-    var classes = useStyles$8();
+    var classes = useStyles$a();
     var _e = useState(false), open = _e[0], setOpen = _e[1];
     var _f = useState(false), isLoading = _f[0], setIsLoading = _f[1];
     var _g = useState(false), isSubmitLoading = _g[0], setIsSubmitLoading = _g[1];
@@ -6657,7 +6659,7 @@ var UsersProvider = function (_a) {
     return (React__default.createElement(UsersContext.Provider, { value: { state: state, actions: actions } }, children));
 };
 
-var useStyles$7 = makeStyles(function (theme) { return ({
+var useStyles$9 = makeStyles(function (theme) { return ({
     buttons: {
         opacity: 0,
         transition: "opacity 0.1s ease-in-out",
@@ -6673,7 +6675,7 @@ var useStyles$7 = makeStyles(function (theme) { return ({
     }
 }); });
 var buttonsCellRenderer = function (params) {
-    var classes = useStyles$7();
+    var classes = useStyles$9();
     var setUserId = params.setUserId, setOpenModalEditDataUser = params.setOpenModalEditDataUser, setOpenModalDeleteUser = params.setOpenModalDeleteUser, setOpenModalChangePasswordd = params.setOpenModalChangePasswordd, showContextMenu = params.showContextMenu;
     return (React__default.createElement(Grid, { container: true, style: {
             height: "100%",
@@ -6872,7 +6874,7 @@ var useUsersOptionsFunctions = function (_a) {
     };
 };
 
-var useStyles$6 = makeStyles(function (theme) { return ({
+var useStyles$8 = makeStyles(function (theme) { return ({
     root: {
         "& .ag-icon-menu": {
             display: "none"
@@ -6943,7 +6945,7 @@ var TableUsers = function (_a) {
     var _c = useState(false), openModalEditDataUser = _c[0], setOpenModalEditDataUser = _c[1];
     var _d = useState(false), openModalDeleteUser = _d[0], setOpenModalDeleteUser = _d[1];
     var _e = useState(false), openModalChangePassword = _e[0], setOpenModalChangePasswordd = _e[1];
-    var classes = useStyles$6();
+    var classes = useStyles$8();
     var _f = useState(null), userId = _f[0], setUserId = _f[1];
     var _g = useState(null), gridApi = _g[0], setGridApi = _g[1];
     var loadingOverlayComponent = useMemo(function () {
@@ -7583,10 +7585,9 @@ var MESApiService = /** @class */ (function () {
                         return [2 /*return*/, { ok: true, data: response.data }];
                     case 3:
                         err_1 = _a.sent();
-                        // console.log("fromCatch", err);
                         this.hasErrors = true;
                         this.error = err_1;
-                        return [2 /*return*/, { ok: false, message: err_1.toString() }];
+                        return [2 /*return*/, { ok: false, message: getError(err_1) }];
                     case 4: return [2 /*return*/];
                 }
             });
@@ -8283,7 +8284,7 @@ var getShiftsRangeByParameters = function (period, Start, End, StartShiftId, End
     });
 };
 
-var useStyles$5 = makeStyles(function (theme) {
+var useStyles$7 = makeStyles(function (theme) {
     var _a, _b, _c;
     return ({
         container: {
@@ -8331,7 +8332,7 @@ var moment = getMomentTz();
 var ShiftPeriodNavigatorControl = function (_a) {
     var _b;
     var value = _a.value, onChange = _a.onChange, _c = _a.showShiftAndCrews, showShiftAndCrews = _c === void 0 ? true : _c, _d = _a.dateFormat, dateFormat = _d === void 0 ? "MM/DD/YYYY HH:mm a" : _d, _e = _a.periodOptions, periodOptions = _e === void 0 ? DEFAULT_PERIOD_OPTIONS : _e;
-    var classes = useStyles$5();
+    var classes = useStyles$7();
     var _f = useState(((_b = periodOptions[0]) === null || _b === void 0 ? void 0 : _b.value) || "Day"), period = _f[0], setPeriod = _f[1];
     var _g = useState(false), loadingShiftPeriodList = _g[0], setLoadingShiftPeriodList = _g[1];
     var _h = useState(""); _h[0]; var setError = _h[1];
@@ -8546,7 +8547,7 @@ var ShiftPeriodNavigatorControl = function (_a) {
                 React__default.createElement(SkipNextIcon, null)))));
 };
 
-var useStyles$4 = makeStyles(function (theme) { return ({
+var useStyles$6 = makeStyles(function (theme) { return ({
     contextMenu: {
         backgroundColor: "#fff",
         borderRadius: "2px",
@@ -8638,7 +8639,7 @@ var useContextMenuMESF = function () { return useContext(ContextMenuMESFContext)
 
 var ContextMenu$1 = function () {
     var _a = useContextMenuMESF(), show = _a.show, position = _a.position, options = _a.options;
-    var classes = useStyles$4();
+    var classes = useStyles$6();
     var menuRef = useRef(null);
     var _b = useState("0"), x = _b[0], setX = _b[1];
     var _c = useState("0"), y = _c[0], setY = _c[1];
@@ -9502,6 +9503,309 @@ function Header$1(_a) {
         React__default.createElement(ErrorModal, { error: error, onHide: function () { return setError(""); } })));
 }
 
+var useStyles$5 = makeStyles(function (theme) { return ({
+    root: {
+        width: "100%",
+        maxWidth: 800,
+        margin: "0 auto",
+        padding: theme.spacing(3)
+    },
+    messageList: {
+        height: 400,
+        overflow: "auto",
+        marginBottom: theme.spacing(2),
+        padding: theme.spacing(2),
+        backgroundColor: theme.palette.background["default"]
+    },
+    messageForm: {
+        display: "flex",
+        gap: theme.spacing(2)
+    },
+    messageInput: {
+        flexGrow: 1
+    },
+    timestamp: {
+        color: theme.palette.text.secondary,
+        fontSize: "0.8rem"
+    },
+    statusChip: {
+        marginBottom: theme.spacing(2)
+    }
+}); });
+var ChatComponent = function () {
+    var classes = useStyles$5();
+    var _a = useState("/ws"), hubUrl = _a[0]; _a[1];
+    var _b = useState(null), connection = _b[0], setConnection = _b[1];
+    var _c = useState({
+        isConnected: false
+    }), connectionState = _c[0], setConnectionState = _c[1];
+    var _d = useState([]), messages = _d[0], setMessages = _d[1];
+    var _e = useState(""), user = _e[0], setUser = _e[1];
+    var _f = useState(""), message = _f[0], setMessage = _f[1];
+    var messageEndRef = useRef(null);
+    var latestMessages = useRef([]);
+    latestMessages.current = messages;
+    var scrollToBottom = function () {
+        var _a;
+        (_a = messageEndRef.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView({ behavior: "smooth" });
+    };
+    useEffect(function () {
+        scrollToBottom();
+    }, [messages]);
+    var startConnection = useCallback(function () { return __awaiter(void 0, void 0, void 0, function () {
+        var newConnection, err_1;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    _a.trys.push([0, 2, , 3]);
+                    newConnection = new HubConnectionBuilder()
+                        .withUrl(hubUrl)
+                        .withAutomaticReconnect()
+                        .configureLogging(LogLevel$1.Information)
+                        .build();
+                    newConnection.on("ReceiveMessage", function (user, message) {
+                        var newMessage = {
+                            user: user,
+                            message: message,
+                            timestamp: new Date()
+                        };
+                        setMessages(function (prev) { return __spreadArray(__spreadArray([], prev, true), [newMessage], false); });
+                    });
+                    newConnection.on("UserConnected", function (connectionId) {
+                        console.log("User connected: ".concat(connectionId));
+                        setConnectionState(function (prev) { return (__assign(__assign({}, prev), { isConnected: true, connectionId: connectionId })); });
+                    });
+                    newConnection.on("UserDisconnected", function (connectionId) {
+                        console.log("User disconnected: ".concat(connectionId));
+                        if (connectionId === connectionState.connectionId) {
+                            setConnectionState(function (prev) { return (__assign(__assign({}, prev), { isConnected: false, connectionId: undefined })); });
+                        }
+                    });
+                    return [4 /*yield*/, newConnection.start()];
+                case 1:
+                    _a.sent();
+                    setConnection(newConnection);
+                    console.log("SignalR Connected");
+                    return [3 /*break*/, 3];
+                case 2:
+                    err_1 = _a.sent();
+                    console.error("SignalR Connection Error:", err_1);
+                    setConnectionState(function (prev) { return (__assign(__assign({}, prev), { isConnected: false, error: err_1 })); });
+                    return [3 /*break*/, 3];
+                case 3: return [2 /*return*/];
+            }
+        });
+    }); }, [hubUrl]);
+    useEffect(function () {
+        startConnection();
+        return function () {
+            connection === null || connection === void 0 ? void 0 : connection.stop();
+        };
+    }, [startConnection]);
+    var sendMessage = function (e) { return __awaiter(void 0, void 0, void 0, function () {
+        var err_2;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    e.preventDefault();
+                    if (!connection || !message || !user)
+                        return [2 /*return*/];
+                    _a.label = 1;
+                case 1:
+                    _a.trys.push([1, 3, , 4]);
+                    return [4 /*yield*/, connection.invoke("SendMessage", user, message)];
+                case 2:
+                    _a.sent();
+                    setMessage("");
+                    return [3 /*break*/, 4];
+                case 3:
+                    err_2 = _a.sent();
+                    console.error("Error sending message:", err_2);
+                    return [3 /*break*/, 4];
+                case 4: return [2 /*return*/];
+            }
+        });
+    }); };
+    return (React__default.createElement(Paper, { className: classes.root, elevation: 3 },
+        React__default.createElement(Box, { mb: 2 },
+            React__default.createElement(Chip, { label: connectionState.isConnected ? "Connected" : "Disconnected", color: connectionState.isConnected ? "primary" : "default", className: classes.statusChip }),
+            connectionState.error && (React__default.createElement(Typography$1, { color: "error" },
+                "Error: ",
+                connectionState.error.message))),
+        React__default.createElement(Paper, { className: classes.messageList, variant: "outlined" },
+            React__default.createElement(List, null,
+                messages.map(function (msg, index) { return (React__default.createElement(ListItem, { key: index },
+                    React__default.createElement(ListItemText, { primary: React__default.createElement(Typography$1, null,
+                            React__default.createElement("strong", null,
+                                msg.user,
+                                ":"),
+                            " ",
+                            msg.message), secondary: React__default.createElement("span", { className: classes.timestamp }, msg.timestamp.toLocaleTimeString()) }))); }),
+                React__default.createElement("div", { ref: messageEndRef }))),
+        React__default.createElement("form", { onSubmit: sendMessage, className: classes.messageForm },
+            React__default.createElement(TextField, { value: user, onChange: function (e) { return setUser(e.target.value); }, label: "Your name", variant: "outlined", size: "small" }),
+            React__default.createElement(TextField, { className: classes.messageInput, value: message, onChange: function (e) { return setMessage(e.target.value); }, label: "Type a message", variant: "outlined", size: "small" }),
+            React__default.createElement(Button, { type: "submit", variant: "contained", color: "primary", disabled: !connectionState.isConnected || !user || !message, endIcon: React__default.createElement(Send, null) }, "Send"))));
+};
+
+var useStyles$4 = makeStyles(function (theme) { return ({
+    root: {
+        height: "100vh",
+        padding: theme.spacing(4)
+    },
+    header: {
+        marginBottom: theme.spacing(4),
+        display: "flex",
+        justifyContent: "space-between",
+        alignItems: "center"
+    },
+    gridContainer: {
+        height: "75%",
+        width: "100%"
+    },
+    autocomplete: {
+        marginTop: theme.spacing(2),
+        marginBottom: theme.spacing(2)
+    }
+}); });
+var QueryCacheInvalidations = function () {
+    var classes = useStyles$4();
+    var _a = useState([]), rowData = _a[0], setRowData = _a[1];
+    var _b = useState([]), actions = _b[0], setActions = _b[1];
+    var _c = useState(""), modal = _c[0], setModal = _c[1];
+    var _d = useState(null); _d[0]; var setSelectedRow = _d[1];
+    var _e = useState(""); _e[0]; var setNotification = _e[1];
+    var _f = useState(false), isLoading = _f[0], setIsLoading = _f[1];
+    var _g = useForm({
+        defaultValues: {
+            source: null,
+            targets: []
+        }
+    }), control = _g.control, reset = _g.reset, handleSubmit = _g.handleSubmit; _g.setValue;
+    var columnDefs = [
+        { field: "SourceId", headerName: "Source ID" },
+        { field: "Source", headerName: "Source" },
+        { field: "TargetsCSV", headerName: "Targets" },
+        {
+            headerName: "Actions",
+            cellRenderer: function (params) { return (React__default.createElement(Box, null,
+                React__default.createElement(Button, { variant: "contained", color: "primary", onClick: function () { return handleEdit(params.data); } }, "Edit"))); }
+        },
+    ];
+    var fetchData = function () { return __awaiter(void 0, void 0, void 0, function () {
+        var api, resp, error_1;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    _a.trys.push([0, 2, , 3]);
+                    api = new MESApiService();
+                    return [4 /*yield*/, api.callV2("[SYSTEM].[GetQueryCacheInvalidations]", [])];
+                case 1:
+                    resp = _a.sent();
+                    if (resp.ok && resp.data) {
+                        setRowData(resp.data.tables[0].rows);
+                        setActions(resp.data.tables[1].rows);
+                    }
+                    else {
+                        setNotification("Failed to fetch data");
+                    }
+                    return [3 /*break*/, 3];
+                case 2:
+                    error_1 = _a.sent();
+                    setNotification("Failed to fetch data");
+                    console.error("Fetch error:", error_1);
+                    return [3 /*break*/, 3];
+                case 3: return [2 /*return*/];
+            }
+        });
+    }); };
+    useEffect(function () {
+        fetchData();
+    }, []);
+    var handleAdd = function () {
+        reset({
+            source: null,
+            targets: []
+        });
+        setModal("add");
+    };
+    var handleEdit = function (row) {
+        setSelectedRow(row);
+        var targetsIds = row.TargetsCSV.split(",").map(Number);
+        reset({
+            source: actions.find(function (a) { return a.ActionId === row.SourceId; }) || null,
+            targets: actions.filter(function (a) { return targetsIds.includes(a.ActionId); })
+        });
+        setModal("edit");
+    };
+    var onSubmit = function (data) { return __awaiter(void 0, void 0, void 0, function () {
+        var api, resp, error_2;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    if (!data.source)
+                        return [2 /*return*/];
+                    setIsLoading(true);
+                    _a.label = 1;
+                case 1:
+                    _a.trys.push([1, 3, , 4]);
+                    api = new MESApiService();
+                    return [4 /*yield*/, api.callV2("[SYSTEM].[UpsertQueryCacheInvalidations]", [
+                            {
+                                name: "SourceId",
+                                value: data.source.ActionId
+                            },
+                            {
+                                name: "TargetsCSV",
+                                value: data.targets.map(function (t) { return t.ActionId; }).join(",")
+                            },
+                        ])];
+                case 2:
+                    resp = _a.sent();
+                    if (resp.ok) {
+                        setNotification("Operation successful");
+                        setModal("");
+                        fetchData();
+                    }
+                    else {
+                        setNotification("Operation failed");
+                    }
+                    return [3 /*break*/, 4];
+                case 3:
+                    error_2 = _a.sent();
+                    setNotification("Failed to perform operation");
+                    console.error("Operation error:", error_2);
+                    return [3 /*break*/, 4];
+                case 4:
+                    setIsLoading(false);
+                    return [2 /*return*/];
+            }
+        });
+    }); };
+    return (React__default.createElement(Box, { className: classes.root },
+        React__default.createElement(Box, { className: classes.header },
+            React__default.createElement(Typography$1, { variant: "h4", component: "h2" }, "Query Cache Invalidations"),
+            React__default.createElement(Button, { variant: "contained", color: "primary", onClick: handleAdd }, "Add New")),
+        React__default.createElement(Box, { className: "".concat(classes.gridContainer, " ag-theme-material") },
+            React__default.createElement(AgGridReact, { rowData: rowData, columnDefs: columnDefs, defaultColDef: { flex: 1 } })),
+        React__default.createElement(MesfModal, { title: modal === "add" ? "Add Cache Invalidation" : "Edit Cache Invalidation", open: ["add", "edit"].includes(modal), handleClose: function () { return setModal(""); } },
+            React__default.createElement("form", { onSubmit: handleSubmit(onSubmit) },
+                React__default.createElement(MesfModal.Content, { dividers: true },
+                    React__default.createElement(Grid, { container: true, spacing: 3 },
+                        React__default.createElement(Grid, { item: true, xs: 12 },
+                            React__default.createElement(Controller, { control: control, name: "source", render: function (params) { return (React__default.createElement(Autocomplete, { options: actions, getOptionLabel: function (option) { return "".concat(option.ActionName); }, value: params.field.value, onChange: function (_, value) { return params.field.onChange(value); }, renderInput: function (params) { return (React__default.createElement(TextField, __assign({}, params, { label: "Select Source Action", variant: "outlined" }))); }, className: classes.autocomplete, disabled: modal === "edit" })); } })),
+                        React__default.createElement(Grid, { item: true, xs: 12 },
+                            React__default.createElement(Controller, { control: control, name: "targets", render: function (params) { return (React__default.createElement(Autocomplete, { multiple: true, options: actions.filter(function (a) { var _a; return a.ActionId !== ((_a = control._formValues.source) === null || _a === void 0 ? void 0 : _a.ActionId); }), getOptionLabel: function (option) { return option.ActionName; }, value: params.field.value, onChange: function (_, value) {
+                                        params.field.onChange(value);
+                                    }, renderInput: function (params) { return (React__default.createElement(TextField, __assign({}, params, { label: "Select Target Actions", variant: "outlined" }))); }, className: classes.autocomplete })); } })))),
+                React__default.createElement(MesfModal.Actions, null,
+                    React__default.createElement(Grid, { container: true, spacing: 2, justifyContent: "flex-end" },
+                        React__default.createElement(Grid, { item: true, md: 3, xs: 12, style: { margin: 0 } },
+                            React__default.createElement(Button, { fullWidth: true, variant: "contained", color: "default", onClick: function () { return setModal(""); } }, "Cancel")),
+                        React__default.createElement(Grid, { item: true, md: 3, xs: 12, style: { margin: 0 } },
+                            React__default.createElement(Button, { fullWidth: true, startIcon: isLoading && React__default.createElement(CircularProgress, { size: "1rem" }), disabled: isLoading, variant: "contained", color: "primary", type: "submit" }, "Save"))))))));
+};
+
 var SettingsInitialState = {
     settings: [],
     settingSelected: null
@@ -10282,6 +10586,16 @@ function Configuration() {
             path: "settings",
             sidebar: function () { return React__default.createElement("div", null, "Settings"); },
             main: function () { return React__default.createElement(Settings, null); }
+        },
+        {
+            path: "real-time/client",
+            sidebar: function () { return React__default.createElement("div", null, "Client"); },
+            main: function () { return React__default.createElement(ChatComponent, null); }
+        },
+        {
+            path: "real-time/config",
+            sidebar: function () { return React__default.createElement("div", null, "Config"); },
+            main: function () { return React__default.createElement(QueryCacheInvalidations, null); }
         }
     ], customConfiguration, true);
     return (React__default.createElement(GenericPanel, { title: "Configuration", description: "" },
@@ -10300,6 +10614,12 @@ function Configuration() {
                     React__default.createElement(MenuItem, { selected: option === "profiles", className: "p-0" },
                         React__default.createElement(Link, { to: "/configuration/profiles", className: "nav-link" }, "Profiles"))),
                 React__default.createElement(CustomSidebar, { option: option }),
+                React__default.createElement("h3", { className: "mes-menu-group" }, "Real Time"),
+                React__default.createElement(MenuList, { className: "mes-submenu" },
+                    React__default.createElement(MenuItem, { selected: option === "real-time", className: "p-0" },
+                        React__default.createElement(Link, { to: "/configuration/real-time/client", className: "nav-link" }, "Client")),
+                    React__default.createElement(MenuItem, { selected: option === "real-time", className: "p-0" },
+                        React__default.createElement(Link, { to: "/configuration/real-time/config", className: "nav-link" }, "Config"))),
                 React__default.createElement("h3", { className: "mes-menu-group" }, "Maintenance"),
                 React__default.createElement(MenuList, { className: "mes-submenu" },
                     React__default.createElement(MenuItem, { selected: option === "logs", className: "p-0" },
@@ -13449,5 +13769,5 @@ var areaSelector = /*#__PURE__*/Object.freeze({
     AreaSelector: AreaSelector
 });
 
-export { Account, AssetProvider, AuthContext, AuthProvider, BarChartControl, ButtonWithLoading, ChangePassword, CheckBoxControl, Configuration$1 as Configuration, ContextMenu$1 as ContextMenu, ContextMenuMESFProvider, CurrencyFormatter, DataGridControl, DateFormatter, DateTimeFormatter, ErrorModal, FetchError, FilterPanel, GenericPanel, GenericTable, GetCrewColor, GetShiftColor, HorizontalTextControl, IntegerFormatter, Login, Logout, LongFilterPanel, MESApiService, MESFMain, MESSAGE_API, MESSAGE_ERRORS, MasterDetailPanel, MesfModal, ModalTreeFilterControl, MultipleSelectorControl, NumberFormatter, NumericTextControl, ShiftDayNavigatorControl, ShiftNavigatorProvider, ShiftPeriodNavigatorControl, SimplePasswordControl, SimpleSelectorControl, SimpleTextAreaControl, SimpleTextControl, TimeFormatter, TimeService, TreePickerControl, TreePickerControlV2, TrendingsPage, USER_LABELS, UTLSettingsProvider, UploadFileControl, UserProvider, axiosInstance, deleteUser, dxtServerTimeZone, dxtToLocalServerTime, dxtToUTC, formatNumber, getAuthTypes, getCrewStyle, getDataUser, getError, getMomentTz, getProfiles, getShiftByParameters, getShiftStyle, getShiftsRangeByParameters, getTokenFromLS, getUsers, renewToken, setPassword, setProfilesToUser, upsertUser, useAssetContext, useContextMenuMESF, useShiftNavigator, useShiftNavigatorManager, useStyles$4 as useStyles, useToken, useUTLSettingsContext, useUserContext };
+export { Account, AssetProvider, AuthContext, AuthProvider, BarChartControl, ButtonWithLoading, ChangePassword, CheckBoxControl, Configuration$1 as Configuration, ContextMenu$1 as ContextMenu, ContextMenuMESFProvider, CurrencyFormatter, DataGridControl, DateFormatter, DateTimeFormatter, ErrorModal, FetchError, FilterPanel, GenericPanel, GenericTable, GetCrewColor, GetShiftColor, HorizontalTextControl, IntegerFormatter, Login, Logout, LongFilterPanel, MESApiService, MESFMain, MESSAGE_API, MESSAGE_ERRORS, MasterDetailPanel, MesfModal, ModalTreeFilterControl, MultipleSelectorControl, NumberFormatter, NumericTextControl, ShiftDayNavigatorControl, ShiftNavigatorProvider, ShiftPeriodNavigatorControl, SimplePasswordControl, SimpleSelectorControl, SimpleTextAreaControl, SimpleTextControl, TimeFormatter, TimeService, TreePickerControl, TreePickerControlV2, TrendingsPage, USER_LABELS, UTLSettingsProvider, UploadFileControl, UserProvider, axiosInstance, deleteUser, dxtServerTimeZone, dxtToLocalServerTime, dxtToUTC, formatNumber, getAuthTypes, getCrewStyle, getDataUser, getError, getMomentTz, getProfiles, getShiftByParameters, getShiftStyle, getShiftsRangeByParameters, getTokenFromLS, getUsers, renewToken, setPassword, setProfilesToUser, upsertUser, useAssetContext, useContextMenuMESF, useShiftNavigator, useShiftNavigatorManager, useStyles$6 as useStyles, useToken, useUTLSettingsContext, useUserContext };
 //# sourceMappingURL=index.esm.js.map