@agilemotion/oui-react-js 1.8.3 → 1.8.5

package/dist/components/form/GridField.js

@@ -13,6 +13,8 @@ var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
 var _InputLabel = _interopRequireDefault(require("@mui/material/InputLabel"));
 var _Toolbar = _interopRequireDefault(require("../Toolbar"));
 var _Observable = _interopRequireDefault(require("../../event/Observable"));
+var _DynamicJS = _interopRequireDefault(require("../../DynamicJS"));
+var _FormHelperText = _interopRequireDefault(require("@mui/material/FormHelperText"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function getEditorType(columnName, gridConfig) {
@@ -39,26 +41,32 @@ const GridFieldWrapper = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.de
   const base = props.base;
   const newRowIdCounter = _react.default.useRef(-1);
   const [selection, setSelection] = _react.default.useState([]);
+  const [label, setLabel] = _react.default.useState();
   const [rows, setRows] = _react.default.useState([]);
   const [crudToolstripWidth, setCrudToolstripWidth] = _react.default.useState(null);
   const [hasButtons] = _react.default.useState(_Utils.default.isNull(props.config.attributes) || _Utils.default.isNull(props.config.attributes.addDisabled) || props.config.attributes.addDisabled === false || _Utils.default.isNull(props.config.attributes.removeDisabled) || props.config.attributes.removeDisabled === false);
-  let label = _Utils.default.getComponentAttribute(props.config, 'label', '');
+  const initialValueSet = _react.default.useRef(false);
   _react.default.useEffect(() => {
     let numCrudButtons = 0;
-    if (!_Utils.default.isNull(props.config.attributes)) {
-      if (_Utils.default.isNull(props.config.attributes.addDisabled) || props.config.attributes.addDisabled === false) {
-        numCrudButtons++;
-      }
-      if (_Utils.default.isNull(props.config.attributes.removeDisabled) || props.config.attributes.removeDisabled === false) {
-        numCrudButtons++;
-      }
+    let addDisabled = props.config.attributes?.addDisabled;
+    let removeDisabled = props.config.attributes?.removeDisabled;
+    if (!addDisabled) {
+      numCrudButtons++;
+    }
+    if (!removeDisabled) {
+      numCrudButtons++;
     }
     setCrudToolstripWidth(numCrudButtons * 40 + 'px');
+    try {
+      let label = _DynamicJS.default.executeScript(props.config.id + 'label', _Utils.default.getComponentAttribute(props.config, 'label', ''), props.config.viewId, true, null, null, false);
+      setLabel(label);
+    } catch (e) {
+      setLabel(_Utils.default.getComponentAttribute(props.config, 'label', ''));
+    }
   }, []);
   _react.default.useEffect(() => {
-    if (!_Utils.default.isNull(base.value) && !props.initialValueSet) {
-      setRows(base.value);
-      props.loadCallback();
+    if (!_Utils.default.isNull(base.value) && !initialValueSet.current) {
+      setRows([].concat(base.value));
     }
   }, [base.value]);
   return /*#__PURE__*/_react.default.createElement("div", {
@@ -129,32 +137,34 @@ const GridFieldWrapper = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.de
     viewId: props.viewId,
     rows: rows,
     formValues: props.values,
-    valueChangeHandler: rows => {
+    valueChangeHandler: newRows => {
       let value = null;
-      if (!_Utils.default.isNull(rows)) {
+      if (!_Utils.default.isNull(newRows)) {
         value = [];
-        for (const row of rows) {
+        for (const row of newRows) {
           let record = createRecord(row, props.config.grid, false);
           value.push(record);
         }
       }
-      if (!props.initialValueSet) {
-        props.loadCallback();
-      }
       base.handleValueChange(value);
     },
     pagination: false,
     onSelectionChange: selection => {
       setSelection(selection);
+      initialValueSet.current = true;
     },
     filterWrapperClass: 'transferListFilterWrapper',
     hasBorder: false
-  })));
+  }), base.errorMessage && /*#__PURE__*/_react.default.createElement(_FormHelperText.default, {
+    style: {
+      margin: "8px",
+      color: "rgb(244, 67, 54)"
+    }
+  }, base.errorMessage)));
 }));
 const GridField = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.forwardRef((props, ref) => {
   const [gridHandle] = _react.default.useState({});
   const [toolHandle] = _react.default.useState(!_Utils.default.isNull(props.config.toolstrip) ? {} : null);
-  const initialValueSet = _react.default.useRef(false);
   return /*#__PURE__*/_react.default.createElement(_BaseField.BaseField, _extends({}, props, {
     handle: props.handle,
     getChildren: () => {
@@ -189,19 +199,18 @@ const GridField = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.f
             val.push(objectArrayElement);
           }
         }
-        initialValueSet.current = false;
         return val;
       }
       return value;
     },
-    clearHandler: () => gridHandle.api.clear()
+    clearHandler: () => gridHandle.api.clear(),
+    rowsHandler: () => {
+      alert(JSON.stringify(gridHandle.api.rows));
+      return gridHandle.api.rows;
+    }
   }), base => /*#__PURE__*/_react.default.createElement(GridFieldWrapper, _extends({
     gridHandle: gridHandle,
     toolstripHandle: toolHandle,
-    initialValueSet: initialValueSet.current,
-    loadCallback: () => {
-      initialValueSet.current = true;
-    },
     base: base
   }, props)));
 }));

package/dist/components/form/LookupField.js

@@ -70,15 +70,15 @@ const LookupFieldComponent = exports.LookupFieldComponent = /*#__PURE__*/_react.
   };
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "w-100 lookup row no-margin no-padding",
-    style: {
+    style: _Utils.default.mergeStyles({
       width: width,
       minWidth: minWidth,
       margin: margin,
       height: height,
       marginBottom: base.hasError ? '20px' : '4px',
       marginTop: '8px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("div", {
+    }, props.config)
+  }, !base.disabled && /*#__PURE__*/_react.default.createElement("div", {
     className: 'col-*-*',
     style: {
       width: '72px',
@@ -101,7 +101,8 @@ const LookupFieldComponent = exports.LookupFieldComponent = /*#__PURE__*/_react.
     }
   }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
     style: {
-      marginTop: '0'
+      marginTop: '0',
+      width: props.config.attributes?.style?.width || 'calc(100% - 2px)'
     },
     id: props.id,
     required: base.required,

package/dist/components/form/RadioGroup.js

@@ -11,6 +11,8 @@ var _FormControlLabel = _interopRequireDefault(require("@mui/material/FormContro
 var _FormLabel = _interopRequireDefault(require("@mui/material/FormLabel"));
 var _BaseField = require("./BaseField");
 var _Utils = _interopRequireDefault(require("../../Utils"));
+var _FormHelperText = _interopRequireDefault(require("@mui/material/FormHelperText"));
+var _FormControl = _interopRequireDefault(require("@mui/material/FormControl"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 const RadioGroupWrapper = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.forwardRef((props, ref) => {
@@ -24,23 +26,29 @@ const RadioGroupWrapper = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.d
       setValue(base.value);
     }
   }, [base.value]);
-  return /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      marginTop: '16px'
-    }
+  return /*#__PURE__*/_react.default.createElement(_FormControl.default, {
+    error: base.hasError,
+    style: _Utils.default.mergeStyles({
+      marginTop: '8px'
+    }, props.config)
   }, label !== null ? /*#__PURE__*/_react.default.createElement(_FormLabel.default, {
     component: "legend"
-  }, label) : null, /*#__PURE__*/_react.default.createElement(_RadioGroup.default, {
+  }, base.required ? label + '*' : label) : null, /*#__PURE__*/_react.default.createElement(_RadioGroup.default, {
     row: true,
     defaultValue: props.defaultValue,
     "aria-label": "",
     name: "radios",
     required: base.required,
-    helperText: base.errorMessage,
+    style: base.hasError ? {
+      border: '1px solid #f44336',
+      borderRadius: '4px',
+      padding: '8px 4px 4px 8px'
+    } : {
+      padding: '8px 4px 4px 8px'
+    },
     onChange: e => {
       base.handleValueChange(e.target.value);
-    },
-    error: base.hasError
+    }
   }, options.map((option, index) => {
     return /*#__PURE__*/_react.default.createElement(_FormControlLabel.default, {
       key: index,
@@ -51,7 +59,12 @@ const RadioGroupWrapper = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.d
       }),
       label: option.label
     });
-  })));
+  })), base.errorMessage && /*#__PURE__*/_react.default.createElement(_FormHelperText.default, {
+    style: {
+      margin: "4px 0",
+      color: "rgb(244, 67, 54)"
+    }
+  }, base.errorMessage));
 }));
 const RadioGroup = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.forwardRef((props, ref) => {
   const defaultValue = _Utils.default.getComponentAttribute(props.config, 'defaultValue', null);

package/dist/components/form/SelectItem.js

@@ -15,7 +15,7 @@ var _Observable = _interopRequireDefault(require("../../event/Observable"));
 var _EventType = _interopRequireDefault(require("../../event/EventType"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-const SelectItemComponent = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.forwardRef((props, ref) => {
+const SelectItemComponent = props => {
   const base = props.base;
   const [optionsLoaded, setOptionsLoaded] = _react.default.useState(false);
   const [loadFullOptionList, setLoadFullOptionList] = _react.default.useState(false);
@@ -40,7 +40,7 @@ const SelectItemComponent = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react
         viewId: props.viewId
       }).then(result => {
         let options = [];
-        if (_Utils.default.isNull(props.validator) || props.validator.nullable) {
+        if (_Utils.default.isNull(props.config.validator) || _Utils.default.evaluateBooleanExpression(props.config.validator.nullable, props.config.id)) {
           options.push({
             id: '_EMPTY_VALUE'
           });
@@ -56,12 +56,11 @@ const SelectItemComponent = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react
       });
       setOptionsLoaded(true);
     }
-  }, [loadFullOptionList]);
+  }, [loadFullOptionList, props.refreshData]);
   return /*#__PURE__*/_react.default.createElement(_TextField.default, {
     select: true,
     InputProps: props.InputProps,
     id: props.id,
-    reference: ref,
     disabled: base.disabled,
     required: base.required,
     label: !_Utils.default.isNull(props.config.attributes) ? props.config.attributes['label'] : null,
@@ -94,14 +93,19 @@ const SelectItemComponent = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react
     key: option.id,
     value: option.id
   }, _Utils.default.isNull(option.dataRecordDescription) ? '' : option.dataRecordDescription.trim())));
-}));
+};
 const SelectItem = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.forwardRef((props, ref) => {
+  const [refreshData, setRefreshData] = _react.default.useState(false);
   return /*#__PURE__*/_react.default.createElement(_BaseField.BaseField, _extends({}, props, {
     handle: props.handle,
     valueParser: value => {
       return value;
+    },
+    loadDataHandler: () => {
+      setRefreshData(!refreshData);
     }
   }), base => /*#__PURE__*/_react.default.createElement(SelectItemComponent, _extends({
+    refreshData: refreshData,
     base: base
   }, props)));
 }));

package/dist/components/form/TransferList.js

@@ -171,8 +171,8 @@ const TransferList = /*#__PURE__*/_react.default.memo((props, ref) => {
       component: props.handle,
       viewId: props.viewId
     }).then(result => {
-      let data = props.config.dataService.type === 'rpc' ? result.data : result;
-      setData(data);
+      console.log("\n\n\n\n\nRESULTS : ", result);
+      setData(result);
     }).catch(e => {
       console.error(e);
       _Utils.default.publishErrorMessage(e, props.viewId);

package/dist/components/layout/CollapsiblePanel.css

@@ -1,9 +1,9 @@
-.coll-panel-container {
-    font-family: sans-serif;
-    text-align: center;
-}
-
-.coll-panel-btn:focus {
-    outline: 0;
-    box-shadow: none;
-}
+.coll-panel-container {
+    font-family: sans-serif;
+    text-align: center;
+}
+
+.coll-panel-btn:focus {
+    outline: 0;
+    box-shadow: none;
+}

package/dist/components/layout/View.css

@@ -1,68 +1,68 @@
-.view {
-    padding: 0 32px;
-    background-color: #ffffff;
-    border-radius: 4px;
-}
-
-.window-unpinned .view {
-    width: 0 !important;;
-}
-
-.window-pinned .view {
-    padding: 0 8px;
-}
-
-.no-margin {
-    margin-left: 0 !important;
-    margin-right: 0 !important;
-}
-
-.no-padding {
-    padding-left: 0 !important;
-    padding-right: 0 !important;
-}
-
-.centered-flex-box {
-    display: flex;
-    align-Items: center;
-    justify-content: center
-}
-
-/* Smartphones (landscape); */
-@media only screen and (min-device-width : 361px) and (max-device-width : 480px) {
-    .view {
-        padding: 0 16px;
-    }
-}
-
-/* Smartphones (portrait); */
-@media only screen and (min-device-width : 280px) and (max-device-width : 360px) {
-    .view {
-        padding: 0 16px;
-    }
-}
-
-/* iPads (portrait and landscape); */
-@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
-    .view {
-        padding: 0 24px;
-    }
-}
-
-/* iPad 3 */
-@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
-    .view {
-        padding: 0 24px;
-    }
-}
-
-/* small desktop screens */
-@media only screen and (max-width : 600px) {
-}
-
-/* low resolution desktop */
-@media only screen and (max-width : 1200px) {
-    .view {
-
-    }
-}
+.view {
+    padding: 0 32px;
+    background-color: #ffffff;
+    border-radius: 4px;
+}
+
+.window-unpinned .view {
+    width: 0 !important;;
+}
+
+.window-pinned .view {
+    padding: 0 8px;
+}
+
+.no-margin {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+}
+
+.no-padding {
+    padding-left: 0 !important;
+    padding-right: 0 !important;
+}
+
+.centered-flex-box {
+    display: flex;
+    align-Items: center;
+    justify-content: center
+}
+
+/* Smartphones (landscape); */
+@media only screen and (min-device-width : 361px) and (max-device-width : 480px) {
+    .view {
+        padding: 0 16px;
+    }
+}
+
+/* Smartphones (portrait); */
+@media only screen and (min-device-width : 280px) and (max-device-width : 360px) {
+    .view {
+        padding: 0 16px;
+    }
+}
+
+/* iPads (portrait and landscape); */
+@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
+    .view {
+        padding: 0 24px;
+    }
+}
+
+/* iPad 3 */
+@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
+    .view {
+        padding: 0 24px;
+    }
+}
+
+/* small desktop screens */
+@media only screen and (max-width : 600px) {
+}
+
+/* low resolution desktop */
+@media only screen and (max-width : 1200px) {
+    .view {
+
+    }
+}

package/dist/components/layout/ViewContainer.js

@@ -4,21 +4,30 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 require("./ViewContainer.css");
 var _ApplicationManager = _interopRequireDefault(require("../../ApplicationManager"));
 var _Utils = _interopRequireDefault(require("../../Utils"));
 var _View = require("./View");
 var _reactRouterDom = require("react-router-dom");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const ViewContainer = props => {
+  const counter = (0, _react.useRef)(0);
   const params = (0, _reactRouterDom.useParams)();
   _react.default.useEffect(() => {}, []);
+  const getKey = () => {
+    if (counter.current === 100) {
+      counter.current = 0;
+    }
+    return ++counter.current;
+  };
   const renderView = () => {
     let viewId = params.id;
     let view = _ApplicationManager.default.getView(viewId);
     let element = viewId === 'dashboard' ? props.dashboard : !_Utils.default.isNull(view) && !_Utils.default.isNull(view.config) ? /*#__PURE__*/_react.default.createElement(_View.View, {
-      key: view.config.id,
+      key: view.config.id + "-" + getKey(),
       config: view.config,
       parameters: view.parameters,
       handle: view.handle

package/dist/components/layout/Window.js

@@ -101,6 +101,7 @@ const Window = props => {
       transform: 'translate(0, 0)',
       backgroundColor: '#FFFFFF',
       width: minimizeWidth + 'px',
+      maxWidth: 'unset',
       height: '500px',
       margin: '0 16px 16px 16px'
     };
@@ -110,6 +111,7 @@ const Window = props => {
       transform: 'translate(0, 0)',
       backgroundColor: '#FFFFFF',
       width: 'calc(100% - ' + props.leftOffset + ' )',
+      maxWidth: 'unset',
       height: 'calc(100% - 88px)',
       margin: '8px'
     };

package/dist/components/loader.css

@@ -1,36 +1,36 @@
-.loaderModal {
-	display: block; /* Hidden by default */
-	position: fixed; /* Stay in place */
-	z-index: 3000; /* Sit on top */
-	left: 0;
-	top: 0;
-	width: 100vw; /* Full width */
-	height: 100vh; /* Full height */
-	overflow: auto; /* Enable scroll if needed */
-	background-color: rgb(0,0,0); /* Fallback color */
-	background-color: rgba(0,0,0,0.1); /* Black w/ opacity */
-}
-
-/* Modal Content/Box */
-.modal-content {
-	background-color: transparent;
-	margin: 30% auto; /* 15% from the top and centered */
-	padding: 20px;
-	border: 1px solid #888;
-	width: 10%; /* Could be more or less, depending on screen size */
-}
-
-/* The Close Button */
-.close {
-	color: #aaa;
-	float: right;
-	font-size: 28px;
-	font-weight: bold;
-}
-
-.close:hover,
-.close:focus {
-	color: black;
-	text-decoration: none;
-	cursor: pointer;
-}
+.loaderModal {
+	display: block; /* Hidden by default */
+	position: fixed; /* Stay in place */
+	z-index: 3000; /* Sit on top */
+	left: 0;
+	top: 0;
+	width: 100vw; /* Full width */
+	height: 100vh; /* Full height */
+	overflow: auto; /* Enable scroll if needed */
+	background-color: rgb(0,0,0); /* Fallback color */
+	background-color: rgba(0,0,0,0.1); /* Black w/ opacity */
+}
+
+/* Modal Content/Box */
+.modal-content {
+	background-color: transparent;
+	margin: 30% auto; /* 15% from the top and centered */
+	padding: 20px;
+	border: 1px solid #888;
+	width: 10%; /* Could be more or less, depending on screen size */
+}
+
+/* The Close Button */
+.close {
+	color: #aaa;
+	float: right;
+	font-size: 28px;
+	font-weight: bold;
+}
+
+.close:hover,
+.close:focus {
+	color: black;
+	text-decoration: none;
+	cursor: pointer;
+}

package/dist/components/media/TrainingRoom.js

@@ -275,6 +275,7 @@ const TrainingRoom = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.defaul
     _VCEventManager.default.addSubscriptions(eventHandler, _VCEventType.VCEventType.REQUEST_TO_JOIN_MEETING, _VCEventType.VCEventType.USER_JOINED, _VCEventType.VCEventType.USER_LEFT_MEETING, _VCEventType.VCEventType.SYSTEM_EVENT, _VCEventType.VCEventType.SOCKET_CONNECT, _VCEventType.VCEventType.SOCKET_DISCONNECT, _VCEventType.VCEventType.RAISE_HAND, _VCEventType.VCEventType.LOWER_HAND, _VCEventType.VCEventType.PEER_DISCONNECT, _VCEventType.VCEventType.CONSUMER_TRANSPORT_FAILED, _VCEventType.VCEventType.CREATE_TRANSPORT_FAILED, _VCEventType.VCEventType.SHARING_STOPPED, _VCEventType.VCEventType.END_SESSION, _VCEventType.VCEventType.CHAT_MESSAGE, _VCEventType.VCEventType.AUDIO_VISUAL_SETTINGS_CHANGED);
     document.addEventListener('sideBarToggleEvent', handleSidebarToggle);
     _ApplicationManager.default.setHasActiveMeeting(true);
+    _ApplicationManager.default.setActiveMeetingKey(props.calendarEvent.key);
     return () => {
       _VCEventManager.default.removeSubscriptions(eventHandler);
       _Observable.default.removeApplicationContextSubscriptions('training-room');
@@ -282,11 +283,13 @@ const TrainingRoom = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.defaul
       if (_ApplicationManager.default.hasActiveMeeting()) {
         _SocketManager.default.leaveMeeting(props.calendarEvent.id);
         _ApplicationManager.default.setHasActiveMeeting(false);
+        _ApplicationManager.default.setActiveMeetingKey(null);
       }
     };
   }, []);
   _react.default.useEffect(() => {
     _ApplicationManager.default.setHasActiveMeeting(true);
+    _ApplicationManager.default.setActiveMeetingKey(props.calendarEvent.key);
     let userFullName;
     if (props.calendarEvent.host.username === _ApplicationManager.default.getUserDetails().username) {
       userFullName = props.calendarEvent.host.name;
@@ -310,6 +313,7 @@ const TrainingRoom = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.defaul
     }
     return () => {
       _ApplicationManager.default.setHasActiveMeeting(false);
+      _ApplicationManager.default.setActiveMeetingKey(null);
     };
   }, []);
   function addUserToParticipants(user) {
@@ -365,6 +369,7 @@ const TrainingRoom = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.defaul
       if (result === true) {
         _SocketManager.default.endSession(props.calendarEvent.id);
         _ApplicationManager.default.setHasActiveMeeting(false);
+        _ApplicationManager.default.setActiveMeetingKey(null);
         _ApplicationManager.default.removeLoadedGraph(false);
         setSideBarOpen(false);
         setSideBarTab('');

package/dist/components/media/Video.css

@@ -1,4 +1,4 @@
-.user-video {
-    min-width: 280px;
-    height: 280px;
-}
+.user-video {
+    min-width: 280px;
+    height: 280px;
+}