@gridsuite/commons-ui 0.20.5 → 0.22.1

package/lib/components/MuiVirtualizedTable/MuiVirtualizedTable.js

@@ -211,13 +211,14 @@ var MuiVirtualizedTable = /*#__PURE__*/function (_React$PureComponent) {
     });
 
     _defineProperty(_assertThisInitialized(_this), "getRowClassName", function (_ref2) {
-      var _clsx;
+      var _rowGetter, _clsx;
 
-      var index = _ref2.index;
+      var index = _ref2.index,
+          rowGetter = _ref2.rowGetter;
       var _this$props2 = _this.props,
           classes = _this$props2.classes,
           onRowClick = _this$props2.onRowClick;
-      return (0, _clsx3["default"])(classes.tableRow, classes.flexContainer, index % 2 === 0 && classes.rowBackgroundDark, index % 2 !== 0 && classes.rowBackgroundLight, (_clsx = {}, _clsx[classes.tableRowHover] = index !== -1 && onRowClick != null, _clsx));
+      return (0, _clsx3["default"])(classes.tableRow, classes.flexContainer, index % 2 === 0 && classes.rowBackgroundDark, index % 2 !== 0 && classes.rowBackgroundLight, ((_rowGetter = rowGetter(index)) === null || _rowGetter === void 0 ? void 0 : _rowGetter.notClickable) === true && classes.noClick, (_clsx = {}, _clsx[classes.tableRowHover] = index !== -1 && onRowClick != null, _clsx));
     });
 
     _defineProperty(_assertThisInitialized(_this), "cellRenderer", function (_ref3) {
@@ -429,11 +430,11 @@ var MuiVirtualizedTable = /*#__PURE__*/function (_React$PureComponent) {
       return index < reorderedIndex.length ? reorderedIndex[index] : 0;
     };
 
-    var _rowGetter = function rowGetter(index) {
+    var _rowGetter2 = function rowGetter(index) {
       return _this2.props.rows[getIndexFor(index)];
     };
 
-    var sizes = this.sizes(this.props.columns, this.props.rows, _rowGetter);
+    var sizes = this.sizes(this.props.columns, this.props.rows, _rowGetter2);
     var csvHeaders = this.csvHeaders(this.props.columns, this.props.exportCSVDataKeys);
     return /*#__PURE__*/_react["default"].createElement("div", {
       style: {
@@ -474,14 +475,20 @@ var MuiVirtualizedTable = /*#__PURE__*/function (_React$PureComponent) {
         className: classes.table
       }, tableProps, {
         rowCount: reorderedIndex.length,
-        rowClassName: _this2.getRowClassName,
-        rowGetter: function rowGetter(_ref6) {
+        rowClassName: function rowClassName(_ref6) {
           var index = _ref6.index;
-          return _rowGetter(index);
+          return _this2.getRowClassName({
+            index: index,
+            rowGetter: _rowGetter2
+          });
+        },
+        rowGetter: function rowGetter(_ref7) {
+          var index = _ref7.index;
+          return _rowGetter2(index);
         }
-      }), columns.map(function (_ref7, index) {
-        var dataKey = _ref7.dataKey,
-            other = _objectWithoutPropertiesLoose(_ref7, _excluded2);
+      }), columns.map(function (_ref8, index) {
+        var dataKey = _ref8.dataKey,
+            other = _objectWithoutPropertiesLoose(_ref8, _excluded2);
 
         return /*#__PURE__*/_react["default"].createElement(_reactVirtualized.Column, _extends({
           key: dataKey,

package/lib/components/OverflowableText/overflowable-text.js

@@ -62,7 +62,7 @@ var OverflowableText = function OverflowableText(_ref) {
   }, [setOverflowed, element]);
   (0, _react.useEffect)(function () {
     checkOverflow();
-  }, [checkOverflow]);
+  }, [checkOverflow, text]);
   return /*#__PURE__*/_react["default"].createElement(_material.Tooltip, {
     title: text || '',
     disableHoverListener: !overflowed,

package/lib/components/TopBar/TopBar.js

@@ -87,7 +87,8 @@ var useStyles = (0, _makeStyles["default"])(function (theme) {
   return {
     grow: {
       flexGrow: 1,
-      display: 'flex'
+      display: 'flex',
+      overflow: 'hidden'
     },
     logo: {
       flexShrink: 0,
@@ -227,6 +228,7 @@ var TopBar = function TopBar(_ref) {
       onEquipmentLabellingClick = _ref.onEquipmentLabellingClick,
       equipmentLabelling = _ref.equipmentLabelling,
       withElementsSearch = _ref.withElementsSearch,
+      searchDisabled = _ref.searchDisabled,
       searchingLabel = _ref.searchingLabel,
       onSearchTermChange = _ref.onSearchTermChange,
       _onSelectionChange = _ref.onSelectionChange,
@@ -331,15 +333,20 @@ var TopBar = function TopBar(_ref) {
   };
 
   (0, _react.useEffect)(function () {
-    if (user && withElementsSearch) {
-      document.addEventListener('keydown', function (e) {
+    if (user && withElementsSearch && !searchDisabled) {
+      var openSearch = function openSearch(e) {
         if (e.ctrlKey && e.key === 'f') {
           e.preventDefault();
           setDialogSearchOpen(true);
         }
-      });
+      };
+
+      document.addEventListener('keydown', openSearch);
+      return function () {
+        return document.removeEventListener('keydown', openSearch);
+      };
     }
-  }, [user, withElementsSearch]);
+  }, [user, withElementsSearch, searchDisabled]);
   return /*#__PURE__*/_react["default"].createElement(_AppBar["default"], {
     position: "static",
     color: "default",
@@ -383,7 +390,8 @@ var TopBar = function TopBar(_ref) {
     renderElement: renderElement
   }), /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
     color: "inherit",
-    onClick: handleClickElementSearch
+    onClick: handleClickElementSearch,
+    disabled: searchDisabled
   }, /*#__PURE__*/_react["default"].createElement(_Search["default"], null)))), user && /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
     "aria-controls": "apps-menu",
     "aria-haspopup": "true",
@@ -616,6 +624,7 @@ TopBar.propTypes = process.env.NODE_ENV !== "production" ? {
   onEquipmentLabellingClick: _propTypes["default"].func,
   equipmentLabelling: _propTypes["default"].bool,
   withElementsSearch: _propTypes["default"].bool,
+  searchDisabled: _propTypes["default"].bool,
   searchingLabel: _propTypes["default"].string,
   onSearchTermChange: _propTypes["default"].func,
   onSelectionChange: _propTypes["default"].func,

package/lib/utils/AuthService.js

@@ -41,6 +41,8 @@ function initializeAuthenticationDev(dispatch, isSilentRenew) {
   return Promise.resolve(userManager);
 }
 
+var accessTokenExpiringNotificationTime = 60; // seconds
+
 function initializeAuthenticationProd(dispatch, isSilentRenew, idpSettings) {
   return idpSettings.then(function (r) {
     return r.json();
@@ -74,10 +76,23 @@ function initializeAuthenticationProd(dispatch, isSilentRenew, idpSettings) {
             var expires_in = parseInt(matched_expires[0].split('=')[1]);
             var now = parseInt(Date.now() / 1000);
             var exp = decoded.exp;
+            var idTokenExpiresIn = exp - now;
+            var minAccesstokenOrIdtokenOrIdpSettingsExpiresIn = expires_in;
+            var newExpireReplaceReason;
+
+            if (idTokenExpiresIn < minAccesstokenOrIdtokenOrIdpSettingsExpiresIn) {
+              minAccesstokenOrIdtokenOrIdpSettingsExpiresIn = idTokenExpiresIn;
+              newExpireReplaceReason = 'idtoken.exp is earlier';
+            }
+
+            if (idpSettings.maxExpiresIn && idpSettings.maxExpiresIn < minAccesstokenOrIdtokenOrIdpSettingsExpiresIn) {
+              minAccesstokenOrIdtokenOrIdpSettingsExpiresIn = idpSettings.maxExpiresIn;
+              newExpireReplaceReason = 'idpSettings.maxExpiresIn is smaller';
+            }
 
-            if (exp < now + expires_in) {
-              var newhash = window.location.hash.replace(matched_expires[0], 'expires_in=' + (exp - now));
-              console.debug('Replacing expires_in in window.location.hash because idtoken.exp is earlier. Before: ', window.location.hash, 'after: ', newhash);
+            if (newExpireReplaceReason) {
+              var newhash = window.location.hash.replace(matched_expires[0], 'expires_in=' + minAccesstokenOrIdtokenOrIdpSettingsExpiresIn);
+              console.debug('Replacing expires_in in window.location.hash to ' + minAccesstokenOrIdtokenOrIdpSettingsExpiresIn + ' because ' + newExpireReplaceReason + '. ', 'debug:', 'original expires_in: ' + expires_in + ', ', 'idTokenExpiresIn: ' + idTokenExpiresIn + '(idtoken exp: ' + exp + '), ', 'idpSettings maxExpiresIn: ' + idpSettings.maxExpiresIn);
               window.location.hash = newhash;
             }
           }
@@ -96,9 +111,10 @@ function initializeAuthenticationProd(dispatch, isSilentRenew, idpSettings) {
       response_type: 'id_token token',
       scope: idpSettings.scope,
       automaticSilentRenew: !isSilentRenew,
-      accessTokenExpiringNotificationTime: 60
+      accessTokenExpiringNotificationTime: accessTokenExpiringNotificationTime
     };
     var userManager = new _oidcClient.UserManager(settings);
+    userManager.idpSettings = idpSettings; //store our settings in there as well to use it later
 
     if (!isSilentRenew) {
       handleUser(dispatch, userManager);
@@ -119,7 +135,11 @@ function logout(dispatch, userManagerInstance) {
   dispatch((0, _actions.setLoggedUser)(null));
   sessionStorage.removeItem(hackauthoritykey); //To remove when hack is removed
 
-  return userManagerInstance.signoutRedirect().then(function () {
+  return userManagerInstance.signoutRedirect({
+    extraQueryParams: {
+      TargetResource: userManagerInstance.settings.post_logout_redirect_uri
+    }
+  }).then(function () {
     return console.debug('logged out');
   });
 }
@@ -160,8 +180,40 @@ function handleUser(dispatch, userManager) {
     dispatchUser(dispatch, userManager);
   });
   userManager.events.addSilentRenewError(function (error) {
-    console.debug(error);
-    logout(dispatch, userManager);
+    console.debug(error); // wait for accessTokenExpiringNotificationTime so that the user is expired
+    // otherwise the library tries to signin immediately when we do getUser()
+
+    window.setTimeout(function () {
+      userManager.getUser().then(function (user) {
+        var now = parseInt(Date.now() / 1000);
+        var exp = (0, _jwtDecode["default"])(user.id_token).exp;
+        var idTokenExpiresIn = exp - now;
+
+        if (idTokenExpiresIn < 0) {
+          console.log('Error in silent renew, idtoken expired: ' + idTokenExpiresIn + ' => Logging out.', error); // TODO here allow to continue to use the app but in some kind of frozen state because we can't make API calls anymore
+
+          return logout(dispatch, userManager);
+        } else if (userManager.idpSettings.maxExpiresIn) {
+          if (idTokenExpiresIn < userManager.idpSettings.maxExpiresIn) {
+            // TODO here attempt last chance login ? snackbar to notify the user ? Popup ?
+            // for now we do the same thing as in the else block
+            console.log('Error in silent renew, but idtoken ALMOST expiring (expiring in' + idTokenExpiresIn + ') => last chance' + userManager.idpSettings.maxExpiresIn, error);
+            user.expires_in = userManager.idpSettings.maxExpiresIn;
+            userManager.storeUser(user).then(function () {
+              userManager.getUser();
+            });
+          } else {
+            console.log('Error in silent renew, but idtoken NOT expiring (expiring in' + idTokenExpiresIn + ') => postponing expiration to' + userManager.idpSettings.maxExpiresIn, error);
+            user.expires_in = userManager.idpSettings.maxExpiresIn;
+            userManager.storeUser(user).then(function () {
+              userManager.getUser();
+            });
+          }
+        } else {
+          console.log('Error in silent renew, unsupported configuration: token still valid for ' + idTokenExpiresIn + ' but maxExpiresIn is not configured:' + userManager.idpSettings.maxExpiresIn, error);
+        }
+      });
+    }, accessTokenExpiringNotificationTime * 1000);
   });
   console.debug('dispatch user');
   dispatchUser(dispatch, userManager);

package/package.json

@@ -1,7 +1,11 @@
 {
     "name": "@gridsuite/commons-ui",
-    "version": "0.20.5",
+    "version": "0.22.1",
     "description": "common react components for gridsuite applications",
+    "engines": {
+        "npm": "<=6",
+        "node": "<=14"
+    },
     "main": "lib/index.js",
     "files": [
         "css",