@dexteel/mesf-core 4.9.0 → 4.10.0

package/dist/index.esm.js

@@ -1,5 +1,5 @@
 export { LicenseManager } from 'ag-grid-enterprise';
-import { Typography, TextField, makeStyles as makeStyles$1, Button as Button$1, Grid as Grid$1, Dialog as Dialog$1, DialogTitle as DialogTitle$2, DialogContent as DialogContent$2, DialogContentText, DialogActions as DialogActions$2, FormHelperText, CircularProgress as CircularProgress$1, Badge, FormControlLabel, Checkbox, Snackbar as Snackbar$1, Paper as Paper$1, MenuItem as MenuItem$1, useTheme as useTheme$1, Tooltip, createStyles as createStyles$1, FormControl as FormControl$1, Select as Select$1, Box, Divider, IconButton as IconButton$1, debounce, List, ListItem, ListItemText } from '@material-ui/core';
+import { Typography, TextField, makeStyles as makeStyles$1, Button as Button$1, Grid as Grid$1, Dialog as Dialog$1, DialogTitle as DialogTitle$2, DialogContent as DialogContent$2, DialogContentText, DialogActions as DialogActions$2, FormHelperText, CircularProgress as CircularProgress$1, Badge, FormControlLabel, Checkbox, Snackbar as Snackbar$1, Paper as Paper$1, MenuItem as MenuItem$1, useTheme as useTheme$1, Tooltip, Box, Divider, IconButton as IconButton$1, FormControl as FormControl$1, Select as Select$1, debounce, createStyles as createStyles$1, List, ListItem, ListItemText } from '@material-ui/core';
 import { values, get, isNil as isNil$1, isEmpty, isNaN, round } from 'lodash-es';
 import * as React from 'react';
 import React__default, { useState, useRef, useEffect, useMemo, Component, createContext, useContext, useCallback, lazy, Suspense } from 'react';
@@ -9,7 +9,7 @@ import DialogContent$1 from '@material-ui/core/DialogContent';
 import DialogActions$1 from '@material-ui/core/DialogActions';
 import Dialog from '@material-ui/core/Dialog';
 import Button from '@material-ui/core/Button';
-import { Outlet, useNavigate, useSearchParams, Link, useParams, Navigate, Routes, Route, BrowserRouter } from 'react-router-dom';
+import { Outlet, useNavigate, useSearchParams, Link, useParams, Routes, Route, Navigate, BrowserRouter } from 'react-router-dom';
 import { useMsal, MsalProvider } from '@azure/msal-react';
 import { LogLevel, PublicClientApplication } from '@azure/msal-browser';
 import { useComplexState } from 'use-complex-state';
@@ -22,15 +22,11 @@ import Grid from '@material-ui/core/Grid';
 import { isNil, get as get$1 } from 'lodash';
 import { DndProvider } from 'react-dnd';
 import { HTML5Backend } from 'react-dnd-html5-backend';
-import { AgGridReact } from 'ag-grid-react';
-import { withStyles, alpha, makeStyles, createStyles, useTheme } from '@material-ui/core/styles';
-import Typography$1 from '@material-ui/core/Typography';
-import { useForm, Controller, get as get$2 } from 'react-hook-form';
-import { Alert as Alert$3, Autocomplete } from '@material-ui/lab';
 import moment from 'moment';
 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 { Alert as Alert$3, Autocomplete } from '@material-ui/lab';
 import Popover from '@material-ui/core/Popover';
 import { isAncestor, Tree, DndProvider as DndProvider$1 } from '@minoru/react-dnd-treeview';
 import FolderIcon from '@material-ui/icons/Folder';
@@ -46,6 +42,7 @@ import PersonPinCircleIcon from '@material-ui/icons/PersonPinCircle';
 import PropTypes from 'prop-types';
 import { ResponsiveBar } from '@nivo/bar';
 import Select from '@material-ui/core/Select';
+import { withStyles, alpha, makeStyles, createStyles, useTheme } from '@material-ui/core/styles';
 import Collapse from '@material-ui/core/Collapse';
 import SvgIcon from '@material-ui/core/SvgIcon';
 import Code from '@material-ui/icons/Code';
@@ -57,9 +54,11 @@ import { DataGrid, GridOverlay } from '@material-ui/data-grid';
 import Card from '@material-ui/core/Card';
 import CardActions from '@material-ui/core/CardActions';
 import CardContent from '@material-ui/core/CardContent';
+import Typography$1 from '@material-ui/core/Typography';
 import Snackbar from '@material-ui/core/Snackbar';
 import CircularProgress from '@material-ui/core/CircularProgress';
 import Alert$2 from '@material-ui/lab/Alert';
+import { AgGridReact } from 'ag-grid-react';
 import FormatListBulletedSharpIcon from '@material-ui/icons/FormatListBulletedSharp';
 import IconButton from '@material-ui/core/IconButton';
 import CloseIcon from '@material-ui/icons/Close';
@@ -67,6 +66,7 @@ import TextField$1 from '@material-ui/core/TextField';
 import { MuiPickersUtilsProvider, KeyboardDatePicker, KeyboardTimePicker } from '@material-ui/pickers';
 import MomentUtils from '@date-io/moment';
 import InputLabel from '@material-ui/core/InputLabel';
+import { useForm, Controller } from 'react-hook-form';
 import DialogContentText$1 from '@material-ui/core/DialogContentText';
 import EditIcon from '@material-ui/icons/Edit';
 import 'ag-grid-enterprise/styles/ag-grid.css';
@@ -453,7 +453,7 @@ ModalTreeFilterControl.propTypes = {
     data: PropTypes.object.isRequired
 };
 
-var useStyles$A = makeStyles(function (theme) { return ({
+var useStyles$t = makeStyles(function (theme) { return ({
     root: {
         width: "100%",
         backgroundColor: theme.palette.background.paper,
@@ -470,7 +470,7 @@ var useStyles$A = makeStyles(function (theme) { return ({
     }
 }); });
 var TreePickerControl = function (props) {
-    var classes = useStyles$A();
+    var classes = useStyles$t();
     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 other = __rest(props, ["onSelect", "value", "styleLabel", "dataSource", "inputTitle", "showPath"]);
     var _c = React__default.useState(false), open = _c[0], setOpen = _c[1];
     var handleClickListItem = function (e) {
@@ -1062,7 +1062,7 @@ var LazyLoading = function () {
             React__default.createElement("div", null))));
 };
 
-var useStyles$z = makeStyles$1(function (theme) { return ({
+var useStyles$s = makeStyles$1(function (theme) { return ({
     buttons: {
         opacity: 0,
         transition: "opacity 0.1s ease-in-out",
@@ -1080,7 +1080,7 @@ var useStyles$z = makeStyles$1(function (theme) { return ({
 var useJobsTableData = function (_a) {
     var setRowSelected = _a.setRowSelected;
     var _b = useJobsContext().state, jobsData = _b.jobsData, blockButtons = _b.blockButtons;
-    var classes = useStyles$z();
+    var classes = useStyles$s();
     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 ({
@@ -1449,7 +1449,7 @@ var OnEnableJob = function (_a) {
         React__default.createElement(ErrorModal, { error: error, onHide: function () { return setError(""); } })));
 };
 
-var useStyles$y = makeStyles(function (theme) { return ({
+var useStyles$r = makeStyles(function (theme) { return ({
     root: {
         "& .MuiDataGrid-row": {
             cursor: "pointer"
@@ -1510,7 +1510,7 @@ var useStyles$y = makeStyles(function (theme) { return ({
     }
 }); });
 var TableJobs = function () {
-    var classes = useStyles$y();
+    var classes = useStyles$r();
     var _a = useState(""), error = _a[0], setError = _a[1];
     var _b = useState(true), loading = _b[0], setLoading = _b[1];
     var _c = useState(null), rowSelected = _c[0], setRowSelected = _c[1];
@@ -1739,7 +1739,7 @@ var LOG_TYPE_CODES = [
     { id: "E", description: "Error" },
 ];
 
-var useStyles$x = makeStyles$1(function (theme) { return ({
+var useStyles$q = makeStyles$1(function (theme) { return ({
     buttons: {
         opacity: 0,
         transition: "opacity 0.1s ease-in-out",
@@ -1757,7 +1757,7 @@ var useStyles$x = makeStyles$1(function (theme) { return ({
 var useLogTableData = function () {
     var _a;
     var state = useLogsContext().state;
-    var classes = useStyles$x();
+    var classes = useStyles$q();
     var formatTime = function (nowTime) {
         return (nowTime.toLocaleDateString("en-US") + " " + nowTime.toLocaleTimeString());
     };
@@ -1906,7 +1906,7 @@ var useGetLogsFromAPI = function (_a) {
     return update;
 };
 
-var useStyles$w = makeStyles(function (theme) { return ({
+var useStyles$p = makeStyles(function (theme) { return ({
     title: {
         fontSize: 15
     },
@@ -1923,7 +1923,7 @@ var formatTime = function (nowTime) {
 };
 var ModalLogSelected = function (_a) {
     var show = _a.show, onHide = _a.onHide, selectedLog = _a.selectedLog;
-    var classes = useStyles$w();
+    var classes = useStyles$p();
     return (React__default.createElement(Grid, { container: true, justifyContent: "center", alignItems: "center" },
         React__default.createElement(Modal$1, __assign({}, { show: show }, { onHide: function () { return onHide(false); }, size: "lg", "aria-labelledby": "contained-modal-title-vcenter", centered: true }),
             React__default.createElement(Modal$1.Header, { closeButton: true, style: { padding: "10px 30px" } },
@@ -2021,7 +2021,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$o = makeStyles(function (theme) { return ({
     root: {
         "& .MuiDataGrid-row": {
             cursor: "pointer"
@@ -2082,7 +2082,7 @@ var useStyles$v = makeStyles(function (theme) { return ({
 }); });
 var TableLogs = function () {
     var _a = useLogsContext(), _b = _a.state.searchData, Start = _b.Start, End = _b.End, Search = _b.Search, LogTypeCode = _b.LogTypeCode, _c = _a.actions, setStartFilter = _c.setStartFilter, setEndFilter = _c.setEndFilter, setSearchFilter = _c.setSearchFilter, setLogTypeCodeFilter = _c.setLogTypeCodeFilter, resetFilters = _c.resetFilters;
-    var classes = useStyles$v();
+    var classes = useStyles$o();
     var gridStyle = useMemo(function () { return ({ height: "100%", width: "100%" }); }, []);
     var gridRef = useRef(null);
     var _d = useState(false), showLogModal = _d[0], setShowLogModal = _d[1];
@@ -2360,7 +2360,7 @@ var deleteProfile = function (profileId) { return __awaiter(void 0, void 0, void
     });
 }); };
 
-var useStyles$u = makeStyles(function (theme) { return ({
+var useStyles$n = makeStyles(function (theme) { return ({
     title: {
         fontSize: 15
     },
@@ -2383,7 +2383,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$u();
+    var classes = useStyles$n();
     var _g = useForm({ defaultValues: INITIAL_VALUES$2 }), 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;
@@ -2522,7 +2522,7 @@ var DeleteProfile = function (_a) {
         React__default.createElement(ErrorModal, { error: error, onHide: function () { return setError(""); } })));
 };
 
-var useStyles$t = makeStyles$1(function (theme) { return ({
+var useStyles$m = makeStyles$1(function (theme) { return ({
     buttons: {
         opacity: 0,
         transition: "opacity 0.1s ease-in-out",
@@ -2540,7 +2540,7 @@ var useStyles$t = makeStyles$1(function (theme) { return ({
 var useTableData$2 = function (_a) {
     var setProfileForEdit = _a.setProfileForEdit, setModalProceduresProfile = _a.setModalProceduresProfile, setProfileForDelete = _a.setProfileForDelete, setModalDeleteProfile = _a.setModalDeleteProfile;
     var state = useProfilesContext().state;
-    var classes = useStyles$t();
+    var classes = useStyles$m();
     var rows = state.profiles.map(function (_a) {
         var ProfileId = _a.ProfileId, ProfileName = _a.ProfileName;
         return ({
@@ -2713,7 +2713,7 @@ var DataTable = function (_a) {
         React__default.createElement(ErrorModal, { error: error, onHide: function () { return setError(""); } })));
 };
 
-var useStyles$s = makeStyles$1(function (theme) { return ({
+var useStyles$l = makeStyles$1(function (theme) { return ({
     root: {
         "& .MuiFormLabel-asterisk": {
             display: "none"
@@ -2722,7 +2722,7 @@ var useStyles$s = makeStyles$1(function (theme) { return ({
 }); });
 var ActionsOfProfile = function (_a) {
     var profileForEdit = _a.profileForEdit, show = _a.show, onHide = _a.onHide;
-    var classes = useStyles$s();
+    var classes = useStyles$l();
     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];
@@ -2850,7 +2850,7 @@ var ActionsOfProfile = function (_a) {
         React.createElement(ErrorModal, { error: nameError, onHide: function () { return setNameError(""); } })));
 };
 
-var useStyles$r = makeStyles(function (theme) { return ({
+var useStyles$k = makeStyles(function (theme) { return ({
     root: {
         "& .ag-icon-menu": {
             display: "none"
@@ -2922,7 +2922,7 @@ var TableProfiles = function (_a) {
     var _f = useState(null), profileForDelete = _f[0], setProfileForDelete = _f[1];
     var gridStyle = useMemo(function () { return ({ height: "100%", width: "100%" }); }, []);
     var _g = useState(null), gridApi = _g[0], setGridApi = _g[1];
-    var classes = useStyles$r();
+    var classes = useStyles$k();
     var loadingOverlayComponent = useMemo(function () {
         return LazyLoading;
     }, []);
@@ -3175,7 +3175,7 @@ var DeleteShiftParameters = function (PatternStart) { return __awaiter(void 0, v
     });
 }); };
 
-var useStyles$q = makeStyles(function (theme) { return ({
+var useStyles$j = makeStyles(function (theme) { return ({
     title: {
         fontSize: 15
     },
@@ -3201,7 +3201,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$q();
+    var classes = useStyles$j();
     var shiftTableData = useShiftsCrewsContext().state.shiftTableData;
     var _g = useForm({
         defaultValues: shiftTableData ? shiftTableData : INITIAL_VALUES$1
@@ -3405,7 +3405,7 @@ var CreateShift = function (_a) {
             React.createElement(Alert, { severity: "success", onClose: handleClose }, "The shift was created successfully"))));
 };
 
-var useStyles$p = makeStyles(function (theme) { return ({
+var useStyles$i = makeStyles(function (theme) { return ({
     title: {
         fontSize: 15
     },
@@ -3431,7 +3431,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$p();
+    var classes = useStyles$i();
     var shiftTableData = useShiftsCrewsContext().state.shiftTableData;
     var _f = useState(""), error = _f[0], setError = _f[1];
     var _g = useForm({ defaultValues: INITIAL_VALUES$1 }), control = _g.control, setValue = _g.setValue, reset = _g.reset, watch = _g.watch, errors = _g.formState.errors;
@@ -3572,7 +3572,7 @@ var DeleteShift = function (_a) {
             React.createElement(Alert, { severity: "warning", onClose: handleClose }, "The shift was deleted successfully"))));
 };
 
-var useStyles$o = makeStyles(function (theme) { return ({
+var useStyles$h = makeStyles(function (theme) { return ({
     title: {
         fontSize: 15
     },
@@ -3599,7 +3599,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$o();
+    var classes = useStyles$h();
     var shiftTableData = useShiftsCrewsContext().state.shiftTableData;
     var _g = useForm({ defaultValues: INITIAL_VALUES$1 }), control = _g.control, setValue = _g.setValue, handleSubmit = _g.handleSubmit, reset = _g.reset, watch = _g.watch, errors = _g.formState.errors;
     // Progress bar
@@ -3816,7 +3816,7 @@ var EditShift = function (_a) {
             React.createElement(Alert, { severity: "success", onClose: handleClose }, "The shift was created successfully"))));
 };
 
-var useStyles$n = makeStyles$1(function (theme) { return ({
+var useStyles$g = makeStyles$1(function (theme) { return ({
     root: {
         opacity: 0,
         transition: "opacity 0.1s ease-in-out",
@@ -3835,7 +3835,7 @@ var useTableData$1 = function (_a) {
     var _b;
     var setOpenModalEditShift = _a.setOpenModalEditShift, setOpenModalDeleteShift = _a.setOpenModalDeleteShift;
     var _c = useShiftsCrewsContext(), state = _c.state, actions = _c.actions;
-    var classes = useStyles$n();
+    var classes = useStyles$g();
     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 ({
@@ -3929,7 +3929,7 @@ var useTableData$1 = function (_a) {
     return { rows: rows, columnDefs: columnDefs };
 };
 
-var useStyles$m = makeStyles(function (theme) { return ({
+var useStyles$f = makeStyles(function (theme) { return ({
     root: {
         "& .ag-icon-menu": {
             display: "none"
@@ -3978,7 +3978,7 @@ var useStyles$m = makeStyles(function (theme) { return ({
 }); });
 var TableShiftsCrews = function (_a) {
     _a.isLoading; var getShiftsCrewsFromAPI = _a.getShiftsCrewsFromAPI;
-    var classes = useStyles$m();
+    var classes = useStyles$f();
     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];
@@ -4264,7 +4264,7 @@ var ConfigurationAssetProvider = function (_a) {
     return (React__default.createElement(ConfigurationAssetContext.Provider, { value: { state: state, actions: actions } }, children));
 };
 
-var useStyles$l = makeStyles$1(function (theme) { return ({
+var useStyles$e = makeStyles$1(function (theme) { return ({
     root: {
         alignItems: "center",
         display: "flex",
@@ -4311,7 +4311,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$l();
+    var classes = useStyles$e();
     var nodeClasses = "".concat(classes.customNodeRoot, " ").concat(classes.root, " ").concat(isSelected ? classes.selected : "");
     var handleClick = function (e) {
         props.onClick(e, props.node);
@@ -4366,7 +4366,7 @@ var CustomNode = function (_a) {
             React__default.createElement(Typography, { variant: "body2" }, props.node.text))));
 };
 
-var useStyles$k = makeStyles$1(function (theme) { return ({
+var useStyles$d = makeStyles$1(function (theme) { return ({
     root: {
         alignItems: "flex-start",
         backgroundColor: "#1967d2",
@@ -4398,7 +4398,7 @@ var useStyles$k = makeStyles$1(function (theme) { return ({
     }
 }); });
 var MultipleDragPreview = function (props) {
-    var classes = useStyles$k();
+    var classes = useStyles$d();
     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;
@@ -4409,7 +4409,7 @@ var MultipleDragPreview = function (props) {
         }))));
 };
 
-var useStyles$j = makeStyles$1(function (theme) { return ({
+var useStyles$c = makeStyles$1(function (theme) { return ({
     root: {
         alignItems: "center",
         backgroundColor: "#1967d2",
@@ -4434,7 +4434,7 @@ var useStyles$j = makeStyles$1(function (theme) { return ({
 }); });
 var CustomDragPreview$1 = function (props) {
     var _a;
-    var classes = useStyles$j();
+    var classes = useStyles$c();
     var item = props.monitorProps.item;
     return (React__default.createElement("div", { className: classes.root },
         React__default.createElement("div", { className: classes.icon },
@@ -4727,7 +4727,7 @@ var useAssetCodes = function () {
     return { loadFilterAssets: loadFilterAssets };
 };
 
-var useStyles$i = makeStyles(function (theme) { return ({
+var useStyles$b = makeStyles(function (theme) { return ({
     root: {
         "& .input-group-text": {
             display: "none"
@@ -4770,7 +4770,7 @@ var useStyles$i = makeStyles(function (theme) { return ({
 }); });
 var CreateNewAssetDialog = function (_a) {
     var show = _a.show, onHide = _a.onHide;
-    var classes = useStyles$i();
+    var classes = useStyles$b();
     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];
@@ -4889,7 +4889,7 @@ var CreateNewAssetDialog = function (_a) {
             React__default.createElement(Alert$2, { severity: "info", onClose: handleClose }, "Document created succesfully"))));
 };
 
-var useStyles$h = makeStyles(function (theme) { return ({
+var useStyles$a = makeStyles(function (theme) { return ({
     root: {
         "& .input-group-text": {
             display: "none"
@@ -4940,7 +4940,7 @@ var useStyles$h = makeStyles(function (theme) { return ({
 }); });
 var ViewerAssetDialog = function (_a) {
     var show = _a.show, onHide = _a.onHide;
-    var classes = useStyles$h();
+    var classes = useStyles$a();
     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;
@@ -5004,7 +5004,7 @@ var ViewerAssetDialog = function (_a) {
                                             } })))))))))));
 };
 
-var useStyles$g = makeStyles(function (theme) { return ({
+var useStyles$9 = makeStyles(function (theme) { return ({
     root: {
         "& .input-group-text": {
             display: "none"
@@ -5048,7 +5048,7 @@ var useStyles$g = makeStyles(function (theme) { return ({
 }); });
 var RemoveAssetDialog = function (_a) {
     var show = _a.show, onHide = _a.onHide;
-    var classes = useStyles$g();
+    var classes = useStyles$9();
     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];
@@ -5107,7 +5107,7 @@ var RemoveAssetDialog = function (_a) {
             React__default.createElement(Alert$2, { severity: "info", onClose: handleClose }, "Asset removed succesfully"))));
 };
 
-var useStyles$f = makeStyles(function (theme) { return ({
+var useStyles$8 = makeStyles(function (theme) { return ({
     root: {
         "& .input-group-text": {
             display: "none"
@@ -5155,7 +5155,7 @@ var useStyles$f = makeStyles(function (theme) { return ({
 }); });
 var EditAssetDialog = function (_a) {
     var show = _a.show, onHide = _a.onHide;
-    var classes = useStyles$f();
+    var classes = useStyles$8();
     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];
@@ -5275,7 +5275,7 @@ var EditAssetDialog = function (_a) {
                                 React__default.createElement(Alert$3, { severity: "info", onClose: handleClose }, "Document created succesfully")))))))));
 };
 
-var useStyles$e = makeStyles$1(function (theme) { return ({
+var useStyles$7 = makeStyles$1(function (theme) { return ({
     root: {},
     contextMenu: {
         fontSize: "14px",
@@ -5306,7 +5306,7 @@ var useStyles$e = makeStyles$1(function (theme) { return ({
 }); });
 var AssetViewComponent = function () {
     var _a = useState([]), selectedNodes = _a[0], setSelectedNodes = _a[1];
-    var classes = useStyles$e();
+    var classes = useStyles$7();
     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];
@@ -5665,7 +5665,7 @@ var setProfilesToUser = function (UserId, profileIds) { return __awaiter(void 0,
     });
 }); };
 
-var useStyles$d = makeStyles(function (theme) { return ({
+var useStyles$6 = makeStyles(function (theme) { return ({
     root: {
         "& .MuiSelect-select": {
             height: "auto",
@@ -5694,19 +5694,19 @@ var getStyles = function (profileId, profiles, theme) {
             : theme.typography.fontWeightMedium
     };
 };
-var ITEM_HEIGHT$2 = 48;
-var ITEM_PADDING_TOP$2 = 8;
-var MenuProps$2 = {
+var ITEM_HEIGHT$1 = 48;
+var ITEM_PADDING_TOP$1 = 8;
+var MenuProps$1 = {
     PaperProps: {
         style: {
-            maxHeight: ITEM_HEIGHT$2 * 4.5 + ITEM_PADDING_TOP$2,
+            maxHeight: ITEM_HEIGHT$1 * 4.5 + ITEM_PADDING_TOP$1,
             width: 250
         }
     }
 };
 var ProfilesPicker = function (_a) {
     var value = _a.value, onChange = _a.onChange, userIdForDelete = _a.userIdForDelete, setprofileError = _a.setprofileError;
-    var classes = useStyles$d();
+    var classes = useStyles$6();
     var theme = useTheme();
     var _b = useState(true), isLoading = _b[0], setIsLoading = _b[1];
     var _c = useState([]), profiles = _c[0], setProfiles = _c[1];
@@ -5743,7 +5743,7 @@ var ProfilesPicker = function (_a) {
         React__default.createElement(InputLabel, { id: "demo-mutiple-chip-label", style: value.length
                 ? { display: "flex", alignItems: "center" }
                 : { display: "flex", alignItems: "center", marginTop: 10 } }, "Profiles"),
-        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$2 }, 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))));
+        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$1 }, 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 INITIAL_VALUES = {
@@ -5759,7 +5759,7 @@ var INITIAL_VALUES = {
 };
 
 // @flow
-var useStyles$c = makeStyles$1(function (theme) { return ({
+var useStyles$5 = makeStyles$1(function (theme) { return ({
     root: {
         "& .MuiSelect-select": {
             minHeight: "40px"
@@ -5780,19 +5780,19 @@ var useStyles$c = makeStyles$1(function (theme) { return ({
         marginTop: theme.spacing(3)
     }
 }); });
-var ITEM_HEIGHT$1 = 48;
-var ITEM_PADDING_TOP$1 = 8;
-var MenuProps$1 = {
+var ITEM_HEIGHT = 48;
+var ITEM_PADDING_TOP = 8;
+var MenuProps = {
     PaperProps: {
         style: {
-            maxHeight: ITEM_HEIGHT$1 * 4.5 + ITEM_PADDING_TOP$1,
+            maxHeight: ITEM_HEIGHT * 4.5 + ITEM_PADDING_TOP,
             width: 250
         }
     }
 };
 var AuthTypeSelector = function (_a) {
     var value = _a.value, onChange = _a.onChange;
-    var classes = useStyles$c();
+    var classes = useStyles$5();
     var _b = useState([]), authTypes = _b[0], setAuthTypes = _b[1];
     var _c = useState(true), isLoading = _c[0], setIsLoading = _c[1];
     var theme = useTheme$1();
@@ -5825,10 +5825,10 @@ var AuthTypeSelector = function (_a) {
     return (React.createElement("div", { className: classes.root }, !isLoading && authTypes.length ? (React.createElement(FormControl, { className: classes.formControl },
         React.createElement(InputLabel, { id: "demo-mutiple-chip-label" }, "Auth type"),
         React.createElement(Select, { autoWidth: true, labelId: "demo-mutiple-chip-label", id: "demo-mutiple-chip", value: value, style: { padding: 0 }, onChange: onChange, input: React.createElement(Input, { id: "select-multiple-chip" }), renderValue: function (selected) { return (React.createElement("div", { className: classes.chips },
-                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))));
+                React.createElement(Chip, { key: "selected-authType-".concat(selected), label: selectedAuthTypeName, className: classes.chip }))); }, MenuProps: MenuProps }, 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$b = makeStyles(function (theme) { return ({
+var useStyles$4 = makeStyles(function (theme) { return ({
     checkbox: {
         userSelect: "none"
     },
@@ -5850,7 +5850,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$b();
+    var classes = useStyles$4();
     var _j = useForm({ defaultValues: INITIAL_VALUES }), 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") {
@@ -5942,7 +5942,7 @@ var CreateUser = function (_a) {
             React.createElement(Alert, { severity: "success", onClose: handleClose }, "The user was created successfully"))));
 };
 
-var useStyles$a = makeStyles(function (theme) { return ({
+var useStyles$3 = makeStyles(function (theme) { return ({
     checkbox: {
         userSelect: "none"
     },
@@ -5961,7 +5961,7 @@ var useStyles$a = makeStyles(function (theme) { return ({
 var EditUser = function (_a) {
     var _b, _c, _d;
     var userIdForEdit = _a.userIdForEdit, show = _a.show, onHide = _a.onHide;
-    var classes = useStyles$a();
+    var classes = useStyles$3();
     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];
@@ -6216,7 +6216,7 @@ var DeleteUser = function (_a) {
         React__default.createElement(ErrorModal, { error: profileError, onHide: function () { return setprofileError(""); } })));
 };
 
-var useStyles$9 = makeStyles$1(function (theme) { return ({
+var useStyles$2 = makeStyles$1(function (theme) { return ({
     buttons: {
         opacity: 0,
         transition: "opacity 0.1s ease-in-out",
@@ -6234,7 +6234,7 @@ var useStyles$9 = makeStyles$1(function (theme) { return ({
 var useTableData = function (_a) {
     var setUserIdForEdit = _a.setUserIdForEdit, setOpenModalEditDataUser = _a.setOpenModalEditDataUser, setUserIdForDelete = _a.setUserIdForDelete, setOpenModalDeleteUser = _a.setOpenModalDeleteUser, setOpenModalChangePasswordd = _a.setOpenModalChangePasswordd, setUserForPasswordChange = _a.setUserForPasswordChange;
     var state = useUsersContext().state;
-    var classes = useStyles$9();
+    var classes = useStyles$2();
     var onActionsClick = function (e, params) {
         params.api.contextMenuFactory.showMenu(params.node, params.column, undefined, e);
     };
@@ -6392,7 +6392,7 @@ var ChangePassword$1 = function (_a) {
     }
 };
 
-var useStyles$8 = makeStyles(function (theme) { return ({
+var useStyles$1 = makeStyles(function (theme) { return ({
     root: {
         "& .ag-icon-menu": {
             display: "none"
@@ -6462,7 +6462,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$8();
+    var classes = useStyles$1();
     var _f = useState(null), userIdForEdit = _f[0], setUserIdForEdit = _f[1];
     var _g = useState(null), userIdForDelete = _g[0], setUserIdForDelete = _g[1];
     var _h = useState(null), userForPasswordChange = _h[0], setUserForPasswordChange = _h[1];
@@ -8244,1367 +8244,46 @@ function Header$1(_a) {
         React__default.createElement(ErrorModal, { error: error, onHide: function () { return setError(""); } })));
 }
 
-var INITIAL_VALUES_MODAL = {
-    FormAssetId: null,
-    AssetId: 1,
-    AssetName: "Plant",
-    UserId: null,
-    UserName: "",
-    IsDefault: null
-};
-
-var FormsInitialState = {
-    formsList: [],
-    searchText: "",
-    firstTime: true,
-    formAssetsAndUsersList: [],
-    assetCodes: {},
-    userFormAssetData: INITIAL_VALUES_MODAL,
-    users: [],
-    FormId: null,
-    FormName: ""
-};
-var FormsReducer = createSlice({
-    name: "__",
-    initialState: FormsInitialState,
-    reducers: {
-        setFormsList: function (state, _a) {
-            var payload = _a.payload;
-            state.formsList = payload;
-        },
-        setSearchText: function (state, _a) {
-            var payload = _a.payload;
-            state.searchText = payload;
-        },
-        setFirstTime: function (state, _a) {
-            var payload = _a.payload;
-            state.firstTime = payload;
-        },
-        setFormAssetsAndUsersList: function (state, _a) {
-            var payload = _a.payload;
-            state.formAssetsAndUsersList = payload;
-        },
-        setAssetCodes: function (state, _a) {
-            var payload = _a.payload;
-            state.assetCodes = payload;
-        },
-        setUsers: function (state, _a) {
-            var payload = _a.payload;
-            state.users = payload;
-        },
-        setFormId: function (state, _a) {
-            var payload = _a.payload;
-            state.FormId = payload;
-        },
-        setFormName: function (state, _a) {
-            var payload = _a.payload;
-            state.FormName = payload;
+function Configuration() {
+    var option = useParams().option;
+    var _a = useContext(ConfigurationContext), customConfiguration = _a[0], CustomSidebar = _a[1];
+    var routes = __spreadArray([
+        {
+            path: "/",
+            sidebar: function () { return React__default.createElement("div", null, "Configuration"); },
+            main: function () { return React__default.createElement(Navigate, { to: "users" }); }
         },
-        // userFormAssetData
-        setUserFormAssetData: function (state, _a) {
-            var payload = _a.payload;
-            state.userFormAssetData = payload;
+        {
+            path: "shifts",
+            sidebar: function () { return React__default.createElement("div", null, "Shifts"); },
+            main: function () { return React__default.createElement(ShiftsCrewsPage, null); }
         },
-        setAssetId: function (state, _a) {
-            var payload = _a.payload;
-            state.userFormAssetData.AssetId = payload;
+        {
+            path: "asset",
+            sidebar: function () { return React__default.createElement("div", null, "Configuration Asset"); },
+            main: function () { return React__default.createElement(AssetPage, null); }
         },
-        setAssetName: function (state, _a) {
-            var payload = _a.payload;
-            state.userFormAssetData.AssetName = payload;
+        {
+            path: "users",
+            sidebar: function () { return React__default.createElement("div", null, "Users"); },
+            main: function () { return React__default.createElement(UsersPage, null); }
         },
-        setUserId: function (state, _a) {
-            var payload = _a.payload;
-            state.userFormAssetData.UserId = payload;
+        {
+            path: "profiles",
+            sidebar: function () { return React__default.createElement("div", null, "profiles"); },
+            main: function () { return React__default.createElement(UsersPage$1, null); }
         },
-        setIsDefault: function (state, _a) {
-            var payload = _a.payload;
-            state.userFormAssetData.IsDefault = payload;
+        {
+            path: "logs",
+            sidebar: function () { return React__default.createElement("div", null, "Logs"); },
+            main: function () { return React__default.createElement(LogsPage, null); }
         },
-        setFormAssetId: function (state, _a) {
-            var payload = _a.payload;
-            state.userFormAssetData.FormAssetId = payload;
-        }
-    }
-});
-
-var FormsContext = createContext({
-    state: FormsReducer.getInitialState(),
-    actions: FormsReducer.actions
-});
-var useFormsContext = function () { return useContext(FormsContext); };
-var FormsProvider = function (_a) {
-    var children = _a.children;
-    var _b = useComplexState({
-        initialState: FormsReducer.getInitialState(),
-        reducers: FormsReducer.caseReducers
-    }), state = _b[0], actions = _b[1];
-    return (React__default.createElement(FormsContext.Provider, { value: { state: state, actions: actions } }, children));
-};
-
-var getForms = function (SearchText) { return __awaiter(void 0, void 0, void 0, function () {
-    var apiService, parameters, resp;
-    return __generator(this, function (_a) {
-        switch (_a.label) {
-            case 0:
-                apiService = new MESApiService();
-                parameters = [];
-                parameters.push({ name: "SearchText", value: SearchText });
-                return [4 /*yield*/, apiService.callV2("[FORMS].[GetForms]", parameters)];
-            case 1:
-                resp = _a.sent();
-                return [2 /*return*/, resp];
-        }
-    });
-}); };
-var getFormAssetsAndUsers = function (FormId) { return __awaiter(void 0, void 0, void 0, function () {
-    var apiService, parameters, resp;
-    return __generator(this, function (_a) {
-        switch (_a.label) {
-            case 0:
-                apiService = new MESApiService();
-                parameters = [];
-                parameters.push({ name: "FormId", value: FormId });
-                return [4 /*yield*/, apiService.callV2("[FORMS].[GetFormAssetsAndUsers]", parameters)];
-            case 1:
-                resp = _a.sent();
-                return [2 /*return*/, resp];
-        }
-    });
-}); };
-var upsertUserFormAsset = function (FormId, AssetId, UserId, IsDefault) { return __awaiter(void 0, void 0, void 0, function () {
-    var apiService, parameters, resp;
-    return __generator(this, function (_a) {
-        switch (_a.label) {
-            case 0:
-                apiService = new MESApiService();
-                parameters = [];
-                parameters.push({ name: "FormId", value: FormId });
-                parameters.push({ name: "AssetId", value: AssetId });
-                parameters.push({ name: "UserId", value: UserId });
-                parameters.push({ name: "IsDefault", value: IsDefault });
-                return [4 /*yield*/, apiService.callV2("[FORMS].[UpsertUserFormAsset]", parameters)];
-            case 1:
-                resp = _a.sent();
-                return [2 /*return*/, resp];
-        }
-    });
-}); };
-var deleteUserFormAsset = function (FormAssetId, UserId) { return __awaiter(void 0, void 0, void 0, function () {
-    var apiService, parameters, resp;
-    return __generator(this, function (_a) {
-        switch (_a.label) {
-            case 0:
-                apiService = new MESApiService();
-                parameters = [];
-                parameters.push({ name: "FormAssetId", value: FormAssetId });
-                parameters.push({ name: "UserId", value: UserId });
-                return [4 /*yield*/, apiService.callV2("[FORMS].[DeleteUserFormAsset]", parameters)];
-            case 1:
-                resp = _a.sent();
-                return [2 /*return*/, resp];
+        {
+            path: "jobs",
+            sidebar: function () { return React__default.createElement("div", null, "Jobs"); },
+            main: function () { return React__default.createElement(JobsPage, null); }
         }
-    });
-}); };
-
-var useSearchForms = function (_a) {
-    var setIsLoading = _a.setIsLoading, setError = _a.setError;
-    var _b = useFormsContext(), searchText = _b.state.searchText, setFormsList = _b.actions.setFormsList;
-    return function () { return __awaiter(void 0, void 0, void 0, function () {
-        var res, rowsSource;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    setFormsList([]);
-                    setIsLoading(true);
-                    return [4 /*yield*/, getForms(searchText)];
-                case 1:
-                    res = _a.sent();
-                    if (res.ok) {
-                        rowsSource = get$2(res, "data.tables[0].rows", []);
-                        if (rowsSource.length) {
-                            setFormsList(rowsSource);
-                        }
-                        else {
-                            setFormsList([]);
-                        }
-                        setIsLoading(false);
-                    }
-                    else {
-                        setError(res.message);
-                        setIsLoading(false);
-                    }
-                    return [2 /*return*/];
-            }
-        });
-    }); };
-};
-
-var useSearchFormAssetsAndUsers = function (_a) {
-    var setIsLoading = _a.setIsLoading, setError = _a.setError;
-    var _b = useFormsContext(), FormId = _b.state.FormId, setFormAssetsAndUsersList = _b.actions.setFormAssetsAndUsersList;
-    return function () { return __awaiter(void 0, void 0, void 0, function () {
-        var res, rowsSource;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    setFormAssetsAndUsersList([]);
-                    setIsLoading(true);
-                    return [4 /*yield*/, getFormAssetsAndUsers(FormId)];
-                case 1:
-                    res = _a.sent();
-                    if (res.ok) {
-                        rowsSource = get$2(res, "data.tables[0].rows", []);
-                        if (rowsSource.length) {
-                            setFormAssetsAndUsersList(rowsSource);
-                        }
-                        else {
-                            setFormAssetsAndUsersList([]);
-                        }
-                        setIsLoading(false);
-                    }
-                    else {
-                        setError(res.message);
-                        setIsLoading(false);
-                    }
-                    return [2 /*return*/];
-            }
-        });
-    }); };
-};
-
-var useStyles$7 = makeStyles(function (theme) {
-    return createStyles({
-        root: {
-            "& .ag-icon-menu": {
-                display: "none"
-            },
-            "& .ag-checkbox-input-wrapper": {
-                margin: "0 10px"
-            },
-            "& .ag-cell": {
-                alignItems: "center",
-                padding: "0 !important",
-                backgroundColor: "#FFFF !important",
-                border: "unset !important"
-            },
-            "& .ag-header-cell": {
-                padding: "0px !important",
-                textAlign: "center !important",
-                fontSize: 10
-            },
-            "& .ag-root-wrapper": {
-                minHeight: "100% !important",
-                borderRadius: 3,
-                paddingBottom: 45
-            },
-            "& .ag-cell-wrapper": {
-                width: "95%",
-                textAlign: "center"
-            },
-            "& .ag-body-viewport": {
-                borderBottom: "2px solid #DDE2EB"
-            },
-            "& .ag-menu-option": {
-                cursor: "pointer"
-            }
-        }
-    });
-});
-var AssetNameColumn = function (_a) {
-    var data = _a.data;
-    var classes = useStyles$7();
-    var _b = useState(""), assetName = _b[0], setAssetName = _b[1];
-    var allAssets = useAssetContext().state.allAssets;
-    var getAssetName = function () {
-        var _a;
-        setAssetName(((_a = allAssets.find(function (asset) { return asset.AssetId === parseInt(data.AssetId); })) === null || _a === void 0 ? void 0 : _a.AssetName) || "Unknown");
-    };
-    useEffect(function () {
-        getAssetName();
-    }, []);
-    if (data) {
-        return (React__default.createElement(Grid$1, { container: true, className: classes.root, spacing: 1, style: { alignItems: "center", justifyContent: "center" } },
-            React__default.createElement(Grid$1, { item: true, style: { alignItems: "center", justifyContent: "center" } }, assetName)));
-    }
-    else {
-        return React__default.createElement(React__default.Fragment, null);
-    }
-};
-
-var TransformAssetCodeModel = function (data) {
-    var model = {
-        id: data.AssetId,
-        parentId: data.ParentAssetId,
-        name: data.AssetName,
-        isActive: true
-    };
-    return model;
-};
-
-var ITEM_HEIGHT = 48;
-var ITEM_PADDING_TOP = 8;
-var MenuProps = {
-    PaperProps: {
-        style: {
-            maxHeight: ITEM_HEIGHT * 4.5 + ITEM_PADDING_TOP,
-            width: 250
-        }
-    }
-};
-var useStyles$6 = makeStyles$1(function (theme) {
-    return createStyles$1({
-        root: {
-            "& .MuiSelect-root": {
-                backgroundColor: "#FFF"
-            }
-        },
-        inputLabel: {
-            position: "absolute",
-            top: -6,
-            left: 8,
-            fontSize: 11.3,
-            backgroundColor: "#FFF",
-            color: "#0000008A",
-            width: "auto",
-            height: "auto",
-            zIndex: 100,
-            padding: "0 3px",
-            borderRadius: 3,
-            fontWeight: 400,
-            lineHeight: "1.1876em",
-            letterSpacing: "0.04208em",
-            fontFamily: "'Roboto', 'Helvetica', 'Arial', sans-serif"
-        },
-        formControl: {
-            width: "99%",
-            marginTop: 8
-        },
-        chips: {
-            display: "flex",
-            flexWrap: "wrap"
-        },
-        chip: {
-            margin: 2
-        },
-        noLabel: {
-            marginTop: theme.spacing(3)
-        }
-    });
-});
-var UsersPicker = function (_a) {
-    var value = _a.value, onChange = _a.onChange, disabled = _a.disabled;
-    var classes = useStyles$6();
-    var _b = useState(false); _b[0]; var setIsLoading = _b[1];
-    var _c = useState(""), error = _c[0], setError = _c[1];
-    var _d = useFormsContext(), users = _d.state.users, setUsers = _d.actions.setUsers;
-    useEffect(function () {
-        var searchUsers = function () { return __awaiter(void 0, void 0, void 0, function () {
-            var res, listUsers;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        setIsLoading(true);
-                        return [4 /*yield*/, getUsers()];
-                    case 1:
-                        res = _a.sent();
-                        if (res.ok) {
-                            listUsers = get(res, "data.tables[0].rows", []);
-                            // Ordenar usuarios alfabéticamente
-                            listUsers.sort(function (a, b) { return a.UserName.localeCompare(b.UserName); });
-                            setUsers(listUsers);
-                            setIsLoading(false);
-                        }
-                        else {
-                            setError(res.message);
-                            setIsLoading(false);
-                        }
-                        return [2 /*return*/];
-                }
-            });
-        }); };
-        searchUsers();
-    }, []);
-    return (React__default.createElement("div", { className: classes.root },
-        users.length ? (React__default.createElement(FormControl$1, { className: classes.formControl, style: { position: "relative" } },
-            React__default.createElement("p", { className: classes.inputLabel }, "User"),
-            React__default.createElement(Select$1, { disabled: disabled ? disabled : false, style: { padding: "0 !important" }, variant: "outlined", margin: "dense", labelId: "demo-simple-select-label", id: "demo-simple-select", autoWidth: true, value: value, onChange: onChange, MenuProps: MenuProps }, users.map(function (user) { return (React__default.createElement(MenuItem$1, { key: "user-".concat(user.UserId), value: user.UserId },
-                React__default.createElement(Grid$1, { container: true, alignItems: "center" },
-                    React__default.createElement("div", { style: {
-                            color: "#FFF",
-                            fontWeight: 600,
-                            margin: "auto 0",
-                            lineHeight: 0
-                        } },
-                        React__default.createElement("div", { style: { marginLeft: "-40px" } }, user.UserName.charAt(0) || "")),
-                    React__default.createElement("div", null, user.UserName)))); })))) : (React__default.createElement(React__default.Fragment, null)),
-        React__default.createElement(ErrorModal, { error: error, onHide: function () { return setError(""); } })));
-};
-
-var useStyles$5 = makeStyles$1(function (theme) { return ({
-    root: {
-        "& .input-group-text": {
-            display: "none"
-        },
-        "& .MuiDialogContent-dividers": {
-            padding: 0
-        }
-    },
-    checkbox: {
-        userSelect: "none"
-    },
-    assetPicker: {
-        "& .MuiGrid-item": {
-            width: "500px"
-        }
-    },
-    modalTitle: {
-        backgroundColor: "#ced2cc",
-        color: "#495057",
-        textAlign: "center"
-    },
-    modalWarning: {
-        color: "white",
-        backgroundColor: "#dc3545",
-        textAlign: "center"
-    },
-    messageTitle: {
-        fontSize: 15,
-        fontWeight: "bold",
-        color: "#0000008A"
-    },
-    inputEditable: {
-        "& .MuiOutlinedInput-root .MuiOutlinedInput-notchedOutline": {
-            border: "2px solid #3F51B5"
-        }
-    },
-    comments: {
-        "& .MuiOutlinedInput-root .MuiOutlinedInput-notchedOutline": {
-            border: "1px solid #3F51B5"
-        }
-    }
-}); });
-var AddFormAssetAndUserModal = function (_a) {
-    var show = _a.show, onHide = _a.onHide;
-    var classes = useStyles$5();
-    var _b = useState(false), addSuccess = _b[0], setAddSuccess = _b[1];
-    var _c = useState(false), isSubmitLoading = _c[0], setIsSubmitLoading = _c[1];
-    var _d = useState(""), error = _d[0], setError = _d[1];
-    var _e = useFormsContext(), _f = _e.state, assetCodes = _f.assetCodes, FormId = _f.FormId, FormName = _f.FormName, _g = _f.userFormAssetData, AssetId = _g.AssetId, AssetName = _g.AssetName, UserId = _g.UserId, IsDefault = _g.IsDefault, _h = _e.actions, setAssetCodes = _h.setAssetCodes, setAssetId = _h.setAssetId, setAssetName = _h.setAssetName, setUserId = _h.setUserId, setIsDefault = _h.setIsDefault;
-    var allAssets = useAssetContext().state.allAssets;
-    var _j = useForm({ defaultValues: INITIAL_VALUES_MODAL, mode: "onChange" }), control = _j.control, handleSubmit = _j.handleSubmit, setValue = _j.setValue, watch = _j.watch, isValid = _j.formState.isValid, reset = _j.reset;
-    //states
-    var _k = useState(true), fullWidth = _k[0]; _k[1];
-    var _l = useState("sm"), maxWidth = _l[0]; _l[1];
-    var handleCancel = function () { return __awaiter(void 0, void 0, void 0, function () {
-        return __generator(this, function (_a) {
-            reset();
-            setAssetId(1);
-            setAssetName("Plant");
-            onHide(false);
-            return [2 /*return*/];
-        });
-    }); };
-    var buildTreeAssets = function (nodes) {
-        if (nodes === undefined)
-            return;
-        //tree build functions
-        var idMapping = nodes.reduce(function (acc, el, i) {
-            acc[el.id] = i;
-            return acc;
-        }, {});
-        var root;
-        nodes.forEach(function (el) {
-            if (el.parentId === null) {
-                root = el;
-                return;
-            }
-            var parentEl = nodes[idMapping[el.parentId]];
-            if (parentEl) {
-                parentEl.children = __spreadArray(__spreadArray([], ((parentEl === null || parentEl === void 0 ? void 0 : parentEl.children) || []), true), [el], false);
-            }
-        });
-        setAssetCodes(root);
-    };
-    var loadFilterAssets = function () {
-        var mydataSource = [];
-        allAssets.forEach(function (row) {
-            var code = TransformAssetCodeModel(row);
-            mydataSource = __spreadArray(__spreadArray([], mydataSource, true), [code], false);
-        });
-        buildTreeAssets(mydataSource);
-    };
-    var changeSearchAsset = function (value, description) {
-        setValue("AssetId", parseInt(value));
-        setAssetId(parseInt(value));
-        setAssetName(description);
-    };
-    var handleClose = function (event, reason) {
-        if (reason === "clickaway") {
-            return;
-        }
-        setAddSuccess(false);
-    };
-    var userId = watch("UserId");
-    var changeUserId = function () {
-        setUserId(userId);
-    };
-    var isDefault = watch("IsDefault");
-    var changeIsDefault = function () {
-        setIsDefault(isDefault);
-    };
-    var onSubmit = function () { return __awaiter(void 0, void 0, void 0, function () {
-        var res;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    setIsSubmitLoading(true);
-                    return [4 /*yield*/, upsertUserFormAsset(FormId, AssetId, UserId, IsDefault)];
-                case 1:
-                    res = _a.sent();
-                    if (res.ok) {
-                        setIsSubmitLoading(false);
-                        setAddSuccess(true);
-                        reset();
-                        onHide(true);
-                    }
-                    else {
-                        setIsSubmitLoading(false);
-                        setError(res.message);
-                    }
-                    return [2 /*return*/];
-            }
-        });
-    }); };
-    useEffect(function () {
-        if (show) {
-            reset();
-            setAssetId(1),
-                setAssetName('Plant'),
-                setValue("UserId", UserId);
-            setValue("IsDefault", IsDefault);
-            setIsSubmitLoading(false);
-            loadFilterAssets();
-        }
-    }, [show]);
-    useEffect(function () {
-        changeUserId();
-    }, [userId]);
-    useEffect(function () {
-        changeIsDefault();
-    }, [isDefault]);
-    return (React__default.createElement(React__default.Fragment, null,
-        React__default.createElement(Dialog$1, { fullWidth: fullWidth, maxWidth: maxWidth, open: show, onClose: function () { return handleCancel(); } },
-            React__default.createElement("form", { onSubmit: handleSubmit(onSubmit) },
-                React__default.createElement(Grid$1, { container: true, style: { padding: "15px 0 20px" } },
-                    React__default.createElement(DialogTitle$2, { style: {
-                            padding: "5px 40px 10px 24px",
-                            marginRight: 20,
-                            width: "100%"
-                        } },
-                        React__default.createElement(Grid$1, { item: true, md: 12, xs: 12 },
-                            React__default.createElement("h1", { style: { fontSize: "1em" } },
-                                "FORM: ",
-                                FormName))),
-                    React__default.createElement(Grid$1, { container: true, item: true },
-                        React__default.createElement(DialogContent$2, { dividers: true },
-                            React__default.createElement(Grid$1, { container: true },
-                                React__default.createElement(Grid$1, { item: true, md: 12, xs: 12, style: { paddingLeft: 0 }, className: classes.inputEditable },
-                                    React__default.createElement(Controller, { name: "AssetId", control: control, render: function (_a) { return (React__default.createElement(TreePickerControl, { className: classes.assetPicker, inputTitle: "Asset", title: "Choose Asset", dataSource: assetCodes, value: AssetId, description: AssetName, onSelect: changeSearchAsset, selectBranch: true, selectActive: false, selectInternal: false })); } }))),
-                            React__default.createElement(Grid$1, { container: true },
-                                React__default.createElement(Grid$1, { item: true, md: 6, xs: 12, style: { paddingLeft: 0 } },
-                                    React__default.createElement(Controller, { name: "UserId", control: control, rules: { required: 'User is required' }, render: function (_a) {
-                                            var _b = _a.field, onChange = _b.onChange, value = _b.value;
-                                            return (React__default.createElement(UsersPicker, { value: value, onChange: onChange }));
-                                        } })),
-                                React__default.createElement(Grid$1, { item: true, xs: 12, md: 6, style: { marginTop: 8, paddingLeft: "20px" } },
-                                    React__default.createElement(Controller, { name: "IsDefault", control: control, render: function (_a) {
-                                            var field = _a.field;
-                                            return (React__default.createElement(FormControlLabel, { className: classes.checkbox, control: React__default.createElement(Checkbox, { checked: field.value, onChange: field.onChange, name: "IsDefault", color: "primary" }), label: "Default for User" }));
-                                        } })))),
-                        React__default.createElement(Grid$1, { item: true, md: 12, xs: 12, justifyContent: "flex-end", style: { marginTop: "15px" } },
-                            React__default.createElement(DialogActions$2, { style: { padding: "0px 24px" } },
-                                React__default.createElement(Grid$1, { container: true, justifyContent: "flex-end", spacing: 2, style: { margin: 0 } },
-                                    React__default.createElement(Grid$1, { item: true, md: 3, xs: 4 },
-                                        React__default.createElement(Button$1, { fullWidth: true, variant: "contained", color: "default", onClick: handleCancel }, "Cancel")),
-                                    React__default.createElement(Grid$1, { item: true, md: 3, xs: 4, style: { paddingRight: 0 } },
-                                        React__default.createElement(Button$1, { fullWidth: true, startIcon: isSubmitLoading && React__default.createElement(CircularProgress$1, { size: "1rem" }), disabled: !isValid || isSubmitLoading, variant: "contained", color: "primary", type: "submit" }, "Save"))))))))),
-        React__default.createElement(Snackbar$1, { open: addSuccess, autoHideDuration: 2500, onClose: handleClose },
-            React__default.createElement(Alert$3, { severity: "info", onClose: handleClose }, "Success")),
-        React__default.createElement(ErrorModal, { error: error, onHide: function () { return setError(""); } })));
-};
-
-var useStyles$4 = makeStyles$1(function (theme) { return ({
-    root: {
-        "& .input-group-text": {
-            display: "none"
-        },
-        "& .MuiDialogContent-dividers": {
-            padding: 0
-        }
-    },
-    modalTitle: {
-        backgroundColor: "#ced2cc",
-        color: "#495057",
-        textAlign: "center"
-    },
-    modalTitleCloseWO: {
-        backgroundColor: "#28a745",
-        color: "white",
-        textAlign: "center"
-    },
-    modalWarning: {
-        color: "white",
-        backgroundColor: "#dc3545",
-        textAlign: "center"
-    },
-    messageTitle: {
-        fontSize: 15,
-        fontWeight: "bold",
-        color: "#0000008A"
-    },
-    formControl: {
-        margin: theme.spacing(2),
-        minWidth: 120
-    },
-    errorLabel: {
-        fontSize: 12,
-        color: "#F44336"
-    },
-    infoLabel: {
-        fontSize: 12,
-        color: "#757575"
-    }
-}); });
-var DeleteFormAssetAndUserModal = function (_a) {
-    var show = _a.show, onHide = _a.onHide;
-    var classes = useStyles$4();
-    var _b = useState(true), fullWidth = _b[0]; _b[1];
-    var _c = useState("sm"), maxWidth = _c[0]; _c[1];
-    var _d = useState(false), isSubmitLoading = _d[0], setIsSubmitLoading = _d[1];
-    var _e = useState(""), error = _e[0], setError = _e[1];
-    var _f = useState(false), formAssetAndUserRemovedSuccess = _f[0], setFormAssetAndUserRemovedSuccess = _f[1];
-    var _g = useFormsContext().state.userFormAssetData, FormAssetId = _g.FormAssetId, UserId = _g.UserId;
-    var handleCancel = function () {
-        setIsSubmitLoading(false);
-        onHide(false);
-    };
-    var handleClose = function (event, reason) {
-        if (reason === "clickaway") {
-            return;
-        }
-        setFormAssetAndUserRemovedSuccess(false);
-    };
-    var handleRemoveFormAssetAndUser = function () { return __awaiter(void 0, void 0, void 0, function () {
-        var res;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    setIsSubmitLoading(true);
-                    return [4 /*yield*/, deleteUserFormAsset(FormAssetId, UserId)];
-                case 1:
-                    res = _a.sent();
-                    if (res.ok) {
-                        setFormAssetAndUserRemovedSuccess(true);
-                        setIsSubmitLoading(false);
-                        onHide(true);
-                    }
-                    else {
-                        setError(res.message);
-                        setIsSubmitLoading(false);
-                    }
-                    return [2 /*return*/];
-            }
-        });
-    }); };
-    return (React__default.createElement(React__default.Fragment, null,
-        React__default.createElement(Dialog$1, { fullWidth: fullWidth, maxWidth: maxWidth, open: show, onClose: function () { return handleCancel(); }, disableEnforceFocus: true, className: classes.root },
-            React__default.createElement(DialogTitle$2, { id: "responsive-dialog-title" }, "WARNING"),
-            React__default.createElement(DialogContent$2, null,
-                React__default.createElement(DialogContentText, { style: { padding: 0, margin: 0 } }, "Be careful, once deleted you will not be able to recover this, are you sure you want to delete?")),
-            React__default.createElement(DialogActions$2, { style: { padding: "16px 24px" } },
-                React__default.createElement(Button$1, { onClick: function () { return onHide(false); }, autoFocus: true, color: "default" }, "CANCEL"),
-                React__default.createElement(Button$1, { autoFocus: true, color: "secondary", startIcon: isSubmitLoading && React__default.createElement(CircularProgress$1, { size: "1rem" }), onClick: handleRemoveFormAssetAndUser }, "Delete"))),
-        React__default.createElement(Snackbar$1, { open: formAssetAndUserRemovedSuccess, autoHideDuration: 2500, onClose: handleClose },
-            React__default.createElement(Alert$3, { severity: "info", onClose: handleClose }, "Success")),
-        React__default.createElement(ErrorModal, { error: error, onHide: function () { return setError(""); } })));
-};
-
-var useStyles$3 = makeStyles(function (theme) {
-    var _a, _b, _c, _d, _e;
-    return ({
-        root: {
-            "& h3": {
-                display: "inline-block",
-                marginTop: 0,
-                paddingBotton: 0,
-                paddingLeft: 20,
-                border: "none",
-                userSelect: "none"
-            },
-            "& .content-wrapper": {
-                border: "none"
-            },
-            "& .ag-icon-menu": {
-                display: "none"
-            },
-            "& .ag-root-wrapper": {
-                borderRadius: 3
-            },
-            "& .ag-header-cell": {
-                padding: "0px !important",
-                textAlign: "center !important",
-                fontSize: 10
-            },
-            "& .ag-header-cell-label": {
-                justifyContent: "center"
-            },
-            "& .ag-cell": {
-                padding: "0px !important",
-                textAlign: "center !important",
-                fontSize: 12,
-                lineBreak: "auto",
-                display: "flex",
-                justifyContent: "center",
-                alignItems: "center",
-                border: "0 !important",
-                wordBreak: "break-word"
-            },
-            "& .ag-comments": {
-                display: "flex",
-                justifyContent: "flex-start",
-                alignItems: "center"
-            },
-            "& .ag-selection-checkbox": {
-                marginLeft: "10px !important"
-            }
-        },
-        modalTitle: {
-            backgroundColor: "#ced2cc",
-            color: "#495057",
-            textAlign: "center"
-        },
-        modalTitleCloseWO: {
-            backgroundColor: "#28a745",
-            color: "white",
-            textAlign: "center"
-        },
-        modalWarning: {
-            color: "white",
-            backgroundColor: "#dc3545",
-            textAlign: "center"
-        },
-        messageTitle: {
-            fontSize: 15,
-            fontWeight: "bold",
-            color: "#0000008A"
-        },
-        responsive: (_a = {},
-            _a[theme.breakpoints.up("md")] = {
-                padding: "0 10px 0 0 !important",
-                marginTop: "0 !important"
-            },
-            _a),
-        responsiveTwo: (_b = {},
-            _b[theme.breakpoints.up("md")] = {
-                padding: "0 0 0 10px !important",
-                marginTop: "0 !important"
-            },
-            _b),
-        responsiveThree: (_c = {},
-            _c[theme.breakpoints.up("md")] = {
-                padding: "0 !important"
-            },
-            _c),
-        responsiveFour: (_d = {},
-            _d[theme.breakpoints.up("md")] = {
-                padding: "0 10px 0 0 !important"
-            },
-            _d),
-        responsiveFive: (_e = {},
-            _e[theme.breakpoints.up("md")] = {
-                padding: "0 0 0 10px !important"
-            },
-            _e)
-    });
-});
-var FormAssetandUsersTable = function (_a) {
-    var show = _a.show, onHide = _a.onHide;
-    var _b = useState(null), gridApi = _b[0], setGridApi = _b[1];
-    var classes = useStyles$3();
-    var gridStyle = useMemo(function () { return ({ height: "100%", width: "100%" }); }, []);
-    var _c = useState(true), fullWidth = _c[0]; _c[1];
-    var _d = useState("md"), maxWidth = _d[0]; _d[1];
-    var _e = useState([]), columnDefs = _e[0], setColumnDefs = _e[1];
-    var _f = useState(false), isLoading = _f[0], setIsLoading = _f[1];
-    var _g = useState(""), error = _g[0], setError = _g[1];
-    var searchFormAssetsAndUsers = useSearchFormAssetsAndUsers({ setIsLoading: setIsLoading, setError: setError });
-    var _h = useState(false), openAddFormAssetAndUserModal = _h[0], setOpenAddFormAssetAndUserModal = _h[1];
-    var _j = useState(false), openDeleteFormAssetAndUserModal = _j[0], setOpenDeleteFormAssetAndUserModal = _j[1];
-    var _k = useState(false), shouldUpdateWhenExit = _k[0], setShouldUpdateWhenExit = _k[1];
-    var _l = useFormsContext(), _m = _l.state, FormName = _m.FormName; _m.userFormAssetData; var formAssetsAndUsersList = _m.formAssetsAndUsersList, setUserFormAssetData = _l.actions.setUserFormAssetData;
-    var loadingOverlayComponent = useMemo(function () {
-        return LazyLoading;
-    }, []);
-    var gridOptions = {
-        overlayNoRowsTemplate: "ㅤ"
-    };
-    var handleCancel = function () {
-        onHide(shouldUpdateWhenExit);
-    };
-    var getContextMenuItems = useCallback(function (params) {
-        var _a;
-        var data = (_a = params.node) === null || _a === void 0 ? void 0 : _a.data;
-        var result = [];
-        if (data) {
-            result.push({
-                name: "New Form/Asset/User",
-                action: function () {
-                    setUserFormAssetData(data);
-                    setOpenAddFormAssetAndUserModal(true);
-                }
-            });
-        }
-        if (data) {
-            {
-                result.push("separator", {
-                    name: "Delete Form/Asset/User",
-                    action: function () {
-                        setUserFormAssetData(data);
-                        setOpenDeleteFormAssetAndUserModal(true);
-                    }
-                });
-            }
-        }
-        var addNewForm = [];
-        if (!data) {
-            addNewForm.push({
-                name: "New Form/Asset/User",
-                action: function () {
-                }
-            });
-        }
-        return data ? result : addNewForm;
-    }, [formAssetsAndUsersList]);
-    useEffect(function () {
-        if (show) {
-            setShouldUpdateWhenExit(false);
-            searchFormAssetsAndUsers();
-            setColumnDefs([]);
-            var newColumns = [];
-            newColumns.push({
-                field: "AssetId",
-                headerName: "Asset",
-                sortable: false,
-                flex: 7,
-                minWidth: 130,
-                cellRenderer: AssetNameColumn
-            }),
-                newColumns.push({
-                    field: "UserName",
-                    headerName: "User",
-                    sortable: false,
-                    flex: 4,
-                    minWidth: 130
-                }),
-                newColumns.push({
-                    field: "isDefault",
-                    headerName: "Default",
-                    sortable: false,
-                    flex: 1,
-                    minWidth: 80,
-                    valueFormatter: function (params) {
-                        return params.value ? 'Yes' : 'No';
-                    }
-                });
-            setColumnDefs(newColumns);
-        }
-    }, [show]);
-    useEffect(function () {
-        if (isLoading) {
-            gridApi === null || gridApi === void 0 ? void 0 : gridApi.showLoadingOverlay();
-        }
-        else
-            gridApi === null || gridApi === void 0 ? void 0 : gridApi.hideOverlay();
-    }, [isLoading]);
-    return (React__default.createElement(React__default.Fragment, null,
-        React__default.createElement(Dialog$1, { fullWidth: fullWidth, maxWidth: maxWidth, open: show, onClose: handleCancel, style: { margin: "20px 25%" }, className: classes.root },
-            React__default.createElement(Grid, { container: true, style: { padding: "15px 0 0" } },
-                React__default.createElement(Grid, { item: true, md: 12, xs: 12 },
-                    React__default.createElement(DialogTitle$2, { id: "max-width-dialog-title", style: { padding: "5px 24px 10px" } },
-                        "FORM NAME: ",
-                        FormName)),
-                React__default.createElement(Grid, { container: true, item: true },
-                    React__default.createElement(DialogContent$2, { dividers: true, style: { height: "65vh", paddingTop: "20px" } }, isLoading ? (React__default.createElement(Grid, { container: true, style: {
-                            height: "59vh",
-                            width: "100%",
-                            justifyContent: "center",
-                            alignItems: "center",
-                            position: "relative"
-                        } },
-                        React__default.createElement(Grid, { item: true, md: 12, xs: 12, style: {
-                                position: "absolute",
-                                top: "50%",
-                                left: "50%",
-                                transform: "translate(-50%, -50%)"
-                            } },
-                            React__default.createElement(LazyLoading, null)))) : (React__default.createElement(Grid, { item: true, md: 12, xs: 12, style: {
-                            height: "59vh",
-                            border: "4px solid #ccc",
-                            borderRadius: 10,
-                            margin: "0",
-                            padding: "0"
-                        } },
-                        React__default.createElement("div", { style: gridStyle, className: "ag-theme-alpine" },
-                            React__default.createElement(AgGridReact, { onGridReady: function (params) { return setGridApi(params.api); }, getContextMenuItems: getContextMenuItems, loadingOverlayComponent: loadingOverlayComponent, rowData: formAssetsAndUsersList, columnDefs: columnDefs, gridOptions: gridOptions, rowHeight: 45, headerHeight: 32, rowSelection: "single", animateRows: true, pagination: true })))))),
-                React__default.createElement(Grid, { item: true, md: 12, xs: 12, style: { padding: "20px 0" } },
-                    React__default.createElement(DialogActions$2, { style: { padding: "0px 24px" } },
-                        React__default.createElement(Grid, { item: true, md: 3, xs: 6 },
-                            React__default.createElement(Button, { fullWidth: true, variant: "contained", color: "default", onClick: handleCancel }, "CLOSE")),
-                        React__default.createElement(Grid, { item: true, md: 3, xs: 6 },
-                            React__default.createElement(Button, { fullWidth: true, variant: "contained", color: "primary", onClick: function () { return setOpenAddFormAssetAndUserModal(true); } }, "ADD NEW")))))),
-        React__default.createElement(AddFormAssetAndUserModal, { show: openAddFormAssetAndUserModal, onHide: function (shouldUpdate) {
-                if (shouldUpdate) {
-                    searchFormAssetsAndUsers();
-                    setShouldUpdateWhenExit(true);
-                }
-                setOpenAddFormAssetAndUserModal(false);
-            } }),
-        React__default.createElement(DeleteFormAssetAndUserModal, { show: openDeleteFormAssetAndUserModal, onHide: function (shouldUpdate) {
-                if (shouldUpdate) {
-                    searchFormAssetsAndUsers();
-                    setShouldUpdateWhenExit(true);
-                }
-                setOpenDeleteFormAssetAndUserModal(false);
-            } }),
-        React__default.createElement(ErrorModal, { error: error, onHide: function () { return setError(""); } })));
-};
-
-var useStyles$2 = makeStyles(function (theme) {
-    return createStyles({
-        root: {
-            "& .ag-icon-menu": {
-                display: "none"
-            },
-            "& .ag-checkbox-input-wrapper": {
-                margin: "0 10px"
-            },
-            "& .ag-cell": {
-                alignItems: "center",
-                padding: "0 !important",
-                border: "unset !important"
-            },
-            "& .ag-header-cell": {
-                padding: "0px !important",
-                textAlign: "center !important",
-                fontSize: 10
-            },
-            "& .ag-root-wrapper": {
-                minHeight: "100% !important",
-                borderRadius: 3,
-                paddingBottom: 45
-            },
-            "& .ag-cell-wrapper": {
-                width: "95%",
-                textAlign: "center"
-            },
-            "& .ag-body-viewport": {
-                borderBottom: "2px solid #DDE2EB"
-            },
-            "& .ag-menu-option": {
-                cursor: "pointer"
-            }
-        }
-    });
-});
-var ButtonToShowFormsAssetAndUsers = function (_a) {
-    var _b, _c, _d, _e, _f;
-    var params = _a.params, setOpenFormAssetAndUsersTable = _a.setOpenFormAssetAndUsersTable;
-    useStyles$2();
-    var _g = useFormsContext().actions, setFormId = _g.setFormId, setFormName = _g.setFormName;
-    var handleOpenAssetAndUsersTable = function () {
-        var _a, _b;
-        setOpenFormAssetAndUsersTable(true);
-        setFormId((_a = params.data) === null || _a === void 0 ? void 0 : _a.FormId);
-        setFormName((_b = params.data) === null || _b === void 0 ? void 0 : _b.FormName);
-    };
-    if (params.data) {
-        return (React__default.createElement("div", { style: {
-                display: "flex",
-                justifyContent: "center",
-                alignItems: "center",
-                height: "100%",
-                padding: 5
-            } },
-            React__default.createElement(Button$1, { style: { height: "100%", maxHeight: "27px" }, fullWidth: true, variant: ((_b = params.data) === null || _b === void 0 ? void 0 : _b.AssetCount) !== 0 ? "contained" : "outlined", color: "primary", onClick: function () { return handleOpenAssetAndUsersTable(); } }, ((_c = params.data) === null || _c === void 0 ? void 0 : _c.AssetCount) !== 0 ?
-                (((_d = params.data) === null || _d === void 0 ? void 0 : _d.AssetCount) <= 1 ? "".concat((_e = params.data) === null || _e === void 0 ? void 0 : _e.AssetCount, " ASSET") : "".concat((_f = params.data) === null || _f === void 0 ? void 0 : _f.AssetCount, " ASSETS"))
-                : "add asset")));
-    }
-    else
-        return React__default.createElement(React__default.Fragment, null);
-};
-
-makeStyles(function (theme) {
-    return createStyles({
-        root: {
-            "& .ag-icon-menu": {
-                display: "none"
-            },
-            "& .ag-checkbox-input-wrapper": {
-                margin: "0 10px"
-            },
-            "& .ag-cell": {
-                alignItems: "center",
-                padding: "0 !important",
-                border: "unset !important"
-            },
-            "& .ag-header-cell": {
-                padding: "0px !important",
-                textAlign: "center !important",
-                fontSize: 10
-            },
-            "& .ag-root-wrapper": {
-                minHeight: "100% !important",
-                borderRadius: 3,
-                paddingBottom: 45
-            },
-            "& .ag-cell-wrapper": {
-                width: "95%",
-                textAlign: "center"
-            },
-            "& .ag-body-viewport": {
-                borderBottom: "2px solid #DDE2EB"
-            },
-            "& .ag-menu-option": {
-                cursor: "pointer"
-            }
-        }
-    });
-});
-var ButtonToShowQuestions = function (_a) {
-    var _b;
-    var params = _a.params, setOpenFormQuestions = _a.setOpenFormQuestions;
-    var _c = useFormsContext().actions, setFormId = _c.setFormId, setFormName = _c.setFormName;
-    var handleOpenAssetAndUsersTable = function () {
-        var _a, _b;
-        setOpenFormQuestions(true);
-        setFormId((_a = params.data) === null || _a === void 0 ? void 0 : _a.FormId);
-        setFormName((_b = params.data) === null || _b === void 0 ? void 0 : _b.FormName);
-    };
-    if (params.data) {
-        return (React__default.createElement("div", { style: {
-                display: "flex",
-                justifyContent: "center",
-                alignItems: "center",
-                height: "100%",
-                padding: 5
-            } },
-            React__default.createElement(Button$1, { style: { height: "100%", maxHeight: "27px" }, fullWidth: true, variant: ((_b = params.data) === null || _b === void 0 ? void 0 : _b.AssetCount) !== 0 ? "contained" : "outlined", color: "primary", onClick: function () { return handleOpenAssetAndUsersTable(); }, disabled: true }, "QUESTIONS")));
-    }
-    else
-        return React__default.createElement(React__default.Fragment, null);
-};
-
-var useStyles$1 = makeStyles(function (theme) {
-    var _a, _b, _c;
-    return ({
-        root: {
-            "& .ag-icon-menu": {
-                display: "none"
-            },
-            "& .ag-header-cell-label": {
-                display: "flex",
-                alignItems: "center",
-                justifyContent: "center"
-            },
-            "& .ag-header-cell-text": {
-                textAlign: "center !important"
-            },
-            "& .ag-checkbox-input-wrapper": {
-                margin: "0 10px"
-            },
-            "& .ag-cell": {
-                alignItems: "center",
-                padding: "0 !important",
-                border: "unset !important"
-            },
-            "& .ag-header-cell": {
-                padding: "0px !important",
-                textAlign: "center !important",
-                fontSize: 10,
-                display: "flex",
-                alignItems: "center",
-                justifyContent: "center"
-            },
-            "& .ag-cell-wrapper": {
-                textAlign: "center"
-            },
-            "& .ag-menu-option": {
-                cursor: "pointer"
-            },
-            "& .MuiDataGrid-row": {
-                cursor: "pointer"
-            },
-            "& .MuiDataGrid-columnHeaderTitle, & .MuiTablePagination-caption": {
-                fontWeight: "bold",
-                fontSize: "12px"
-            },
-            "& .MuiDataGrid-columnHeaderTitleContainer": {
-                padding: "0"
-            },
-            "& .MuiDataGrid-cell--textLeft": {
-                fontSize: "12px"
-            }
-        },
-        relative: {
-            position: "relative"
-        },
-        textfield: {
-            margin: theme.spacing(2)
-        },
-        btnModal: {
-            display: "flex",
-            justifyContent: "flex-end"
-        },
-        btnSearch: (_a = {},
-            _a[theme.breakpoints.up("md")] = {
-                marginLeft: "10px !important"
-            },
-            _a),
-        buttonsFilter: (_b = {},
-            _b[theme.breakpoints.up("md")] = {
-                padding: "0 8px 8px 8px"
-            },
-            _b),
-        flexEnd: (_c = {},
-            _c[theme.breakpoints.up("md")] = {
-                justifyContent: "flex-end",
-                marginTop: "-12px"
-            },
-            _c),
-        dataTable: {
-            padding: theme.spacing(1, 2)
-        }
-    });
-});
-var FormsTable = function () {
-    var gridStyle = useMemo(function () { return ({ height: "100%", width: "100%" }); }, []);
-    var classes = useStyles$1();
-    var _a = useState(null), gridApi = _a[0], setGridApi = _a[1];
-    var _b = useState(false), isLoading = _b[0], setIsLoading = _b[1];
-    var _c = useState(""), error = _c[0], setError = _c[1];
-    var _d = useState(), columnDefs = _d[0], setColumnDefs = _d[1];
-    useNavigate();
-    var searchForms = useSearchForms({ setIsLoading: setIsLoading, setError: setError });
-    var _e = useFormsContext(), formsList = _e.state.formsList, _f = _e.actions, setFormId = _f.setFormId, setFormName = _f.setFormName;
-    var _g = useState(false), openFormAssetAndUsersTable = _g[0], setOpenFormAssetAndUsersTable = _g[1];
-    var _h = useState(false); _h[0]; var setOpenFormQuestions = _h[1];
-    // const onKeyDown = (e: any) => {
-    // 	if (e.keyCode === 13) {
-    // 		searchForms();
-    // 	}
-    // };
-    var loadingOverlayComponent = useMemo(function () {
-        return LazyLoading;
-    }, []);
-    var defaultColDef = useMemo(function () {
-        return {
-            sortable: true,
-            wrapText: true,
-            autoHeight: true,
-            wrapHeaderText: true
-        };
-    }, []);
-    var renderColumns = function () {
-        setColumnDefs([]);
-        var newColumns = [];
-        newColumns.push({
-            field: "FormName",
-            headerName: "Form Name",
-            sortable: true,
-            flex: 3,
-            minWidth: 130
-        }),
-            newColumns.push({
-                field: "IncludesComment",
-                headerName: "Includes Comment",
-                sortable: false,
-                flex: 1,
-                minWidth: 130,
-                valueFormatter: function (params) {
-                    return params.value ? 'Yes' : 'No';
-                }
-            }),
-            newColumns.push({
-                field: "LayoutCode",
-                headerName: "Layout",
-                sortable: false,
-                flex: 1,
-                minWidth: 130
-            }),
-            newColumns.push({
-                field: "IsEnabled",
-                headerName: "Is Enabled",
-                sortable: false,
-                flex: 1,
-                minWidth: 130,
-                valueFormatter: function (params) {
-                    return params.value ? 'Yes' : 'No';
-                }
-            }),
-            newColumns.push({
-                field: "Questions",
-                headerName: "Questions",
-                sortable: false,
-                flex: 3,
-                minWidth: 130,
-                cellRenderer: function (params) { return ButtonToShowQuestions({ params: params, setOpenFormQuestions: setOpenFormQuestions }); }
-            }),
-            newColumns.push({
-                field: "AssetAndUsers",
-                headerName: "Assets and Users",
-                sortable: false,
-                flex: 3,
-                minWidth: 130,
-                cellRenderer: function (params) { return ButtonToShowFormsAssetAndUsers({ params: params, setOpenFormAssetAndUsersTable: setOpenFormAssetAndUsersTable }); }
-            }),
-            setColumnDefs(newColumns);
-    };
-    var getContextMenuItems = useCallback(function (params) {
-        var _a;
-        var data = (_a = params.node) === null || _a === void 0 ? void 0 : _a.data;
-        var result = [];
-        if (data) {
-            result.push({
-                name: "View Forms Assets",
-                action: function () {
-                    setOpenFormAssetAndUsersTable(true);
-                    setFormId(data === null || data === void 0 ? void 0 : data.FormId);
-                    setFormName(data === null || data === void 0 ? void 0 : data.FormName);
-                }
-            });
-        }
-        return result;
-    }, [formsList]);
-    // const resetFilter = () => {
-    // 	navigate(`/configuration/forms`, { replace: true });
-    // };
-    useEffect(function () {
-        renderColumns();
-    }, [formsList]);
-    useEffect(function () {
-        if (isLoading) {
-            gridApi === null || gridApi === void 0 ? void 0 : gridApi.showLoadingOverlay();
-        }
-        else {
-            gridApi === null || gridApi === void 0 ? void 0 : gridApi.hideOverlay();
-        }
-    }, [isLoading, formsList, gridApi]);
-    return (React__default.createElement(Grid, { container: true, justifyContent: "center" },
-        React__default.createElement(Grid, { item: true, md: 12, xs: 12, style: { padding: "0 15px" } },
-            React__default.createElement(Typography$1, { variant: "h5", style: { margin: "20px 0 20px", fontWeight: 600 } }, "Forms")),
-        React__default.createElement(Grid, { container: true, justifyContent: "center", alignItems: "center", className: classes.root },
-            React__default.createElement(Grid, { item: true, md: 12, xs: 12, style: { padding: "0 15px" }, className: classes.relative },
-                React__default.createElement(FormAssetandUsersTable, { show: openFormAssetAndUsersTable, onHide: function (shouldUpdate) {
-                        if (shouldUpdate) {
-                            searchForms();
-                        }
-                        setOpenFormAssetAndUsersTable(false);
-                    } }),
-                React__default.createElement(Grid, { item: true, md: 12, xs: 12, style: {
-                        height: "61vh",
-                        border: "4px solid #ccc",
-                        borderRadius: 10,
-                        padding: 10,
-                        margin: "20px 0 10px"
-                    } },
-                    React__default.createElement("div", { style: gridStyle, className: "ag-theme-alpine" },
-                        React__default.createElement(AgGridReact, { rowData: formsList, columnDefs: columnDefs, defaultColDef: defaultColDef, rowHeight: 38, headerHeight: 42, loadingOverlayComponent: loadingOverlayComponent, animateRows: true, getContextMenuItems: function (e) { return getContextMenuItems(e); }, pagination: true, onRowDoubleClicked: function (event) {
-                                var _a, _b;
-                                setFormId((_a = event.data) === null || _a === void 0 ? void 0 : _a.FormId);
-                                setFormName((_b = event.data) === null || _b === void 0 ? void 0 : _b.FormName);
-                                setOpenFormAssetAndUsersTable(true);
-                            }, rowSelection: "single", onGridReady: function (params) { return setGridApi(params.api); } }))))),
-        React__default.createElement(ErrorModal, { error: error, onHide: function () { return setError(""); } })));
-};
-
-var ConfigurationFormsPage = function (prop) {
-    var _a = useState(true); _a[0]; var setIsLoading = _a[1];
-    var _b = useState(""); _b[0]; var setError = _b[1];
-    // const { state: { searchText }, actions: { setSearchText } } = useFormsContext();
-    var _c = useState(""); _c[0]; _c[1];
-    // const setupIsReady = useFilterInQuery([
-    // 	{
-    // 		key: 'search',
-    // 		value: searchText,
-    // 		setter: setSearchText
-    // 	}
-    // ])
-    var searchForms = useSearchForms({ setIsLoading: setIsLoading, setError: setError });
-    useEffect(function () {
-        searchForms();
-    }, []);
-    return (React__default.createElement(Grid, { container: true, justifyContent: "center", alignItems: "center" },
-        React__default.createElement(Grid, { item: true, md: 12, xs: 12, style: { margin: 0 } },
-            React__default.createElement(Paper, { elevation: 1, style: {
-                    width: "100%",
-                    padding: "10px 0 20px",
-                    borderRadius: "0.75rem"
-                } },
-                React__default.createElement(FormsTable, null)))));
-};
-
-var FormsPage = function () {
-    return (React__default.createElement(FormsProvider, null,
-        React__default.createElement(ConfigurationFormsPage, null)));
-};
-
-function Configuration() {
-    var option = useParams().option;
-    var _a = useContext(ConfigurationContext), customConfiguration = _a[0], CustomSidebar = _a[1];
-    var routes = __spreadArray(__spreadArray([
-        {
-            path: "/",
-            sidebar: function () { return React__default.createElement("div", null, "Configuration"); },
-            main: function () { return React__default.createElement(Navigate, { to: "users" }); }
-        },
-        {
-            path: "shifts",
-            sidebar: function () { return React__default.createElement("div", null, "Shifts"); },
-            main: function () { return React__default.createElement(ShiftsCrewsPage, null); }
-        },
-        {
-            path: "asset",
-            sidebar: function () { return React__default.createElement("div", null, "Configuration Asset"); },
-            main: function () { return React__default.createElement(AssetPage, null); }
-        },
-        {
-            path: "users",
-            sidebar: function () { return React__default.createElement("div", null, "Users"); },
-            main: function () { return React__default.createElement(UsersPage, null); }
-        },
-        {
-            path: "profiles",
-            sidebar: function () { return React__default.createElement("div", null, "profiles"); },
-            main: function () { return React__default.createElement(UsersPage$1, null); }
-        }
-    ], customConfiguration, true), [
-        {
-            path: "logs",
-            sidebar: function () { return React__default.createElement("div", null, "Logs"); },
-            main: function () { return React__default.createElement(LogsPage, null); }
-        },
-        {
-            path: "jobs",
-            sidebar: function () { return React__default.createElement("div", null, "Jobs"); },
-            main: function () { return React__default.createElement(JobsPage, null); }
-        },
-        {
-            path: "forms",
-            sidebar: function () { return React__default.createElement("div", null, "Forms"); },
-            main: function () { return React__default.createElement(FormsPage, null); }
-        },
-    ], false);
+    ], customConfiguration, true);
     return (React__default.createElement(GenericPanel, { title: "Configuration", description: "" },
         React__default.createElement("div", { className: "row", style: { display: "flex" } },
             React__default.createElement("div", { className: "col-md-2 mt-3 pt-0 pr-0 mes-div-submenu", style: { flex: "20%" } },
@@ -9626,11 +8305,7 @@ function Configuration() {
                     React__default.createElement(MenuItem, { selected: option === "logs", className: "p-0" },
                         React__default.createElement(Link, { to: "/configuration/logs", className: "nav-link" }, "Logs")),
                     React__default.createElement(MenuItem, { selected: option === "jobs", className: "p-0" },
-                        React__default.createElement(Link, { to: "/configuration/jobs", className: "nav-link" }, "Jobs"))),
-                React__default.createElement("h3", { className: "mes-menu-group" }, "Forms"),
-                React__default.createElement(MenuList, { className: "mes-submenu" },
-                    React__default.createElement(MenuItem, { selected: option === "forms", className: "p-0" },
-                        React__default.createElement(Link, { to: "/configuration/forms", className: "nav-link" }, "Form Settings")))),
+                        React__default.createElement(Link, { to: "/configuration/jobs", className: "nav-link" }, "Jobs")))),
             React__default.createElement("div", { className: "col-md-10", style: { flex: "80%" } },
                 React__default.createElement(Routes, null, routes.map(function (route, index) { return (React__default.createElement(Route, { key: "".concat(route.path), path: route.path, element: React__default.createElement(route.main, null) })); }))))));
 }
@@ -12249,5 +10924,5 @@ var areaSelector = /*#__PURE__*/Object.freeze({
     AreaSelector: AreaSelector
 });
 
-export { Account, AssetProvider, AuthContext, AuthProvider, BarChartControl, ButtonWithLoading, ChangePassword, CheckBoxControl, Configuration$1 as Configuration, 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, SimplePasswordControl, SimpleSelectorControl, SimpleTextAreaControl, SimpleTextControl, TimeFormatter, TreePickerControl, TrendingsPage, USER_LABELS, UTLSettingsProvider, UploadFileControl, UserProvider, axiosInstance, formatNumber, getCrewStyle, getError, getShiftStyle, getTokenFromLS, renewToken, useAssetContext, useToken, useUTLSettingsContext, useUserContext };
+export { Account, AssetProvider, AuthContext, AuthProvider, BarChartControl, ButtonWithLoading, ChangePassword, CheckBoxControl, Configuration$1 as Configuration, 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, SimplePasswordControl, SimpleSelectorControl, SimpleTextAreaControl, SimpleTextControl, TimeFormatter, TreePickerControl, TrendingsPage, USER_LABELS, UTLSettingsProvider, UploadFileControl, UserProvider, axiosInstance, deleteUser, formatNumber, getAuthTypes, getCrewStyle, getDataUser, getError, getProfiles, getShiftStyle, getTokenFromLS, getUsers, renewToken, setPassword, setProfilesToUser, upsertUser, useAssetContext, useToken, useUTLSettingsContext, useUserContext };
 //# sourceMappingURL=index.esm.js.map