@gridsuite/commons-ui 0.28.0 → 0.29.0

package/lib/components/MuiVirtualizedTable/MuiVirtualizedTable.js

@@ -217,22 +217,32 @@ var MuiVirtualizedTable = /*#__PURE__*/function (_React$PureComponent) {
     });
 
     _defineProperty(_assertThisInitialized(_this), "getRowClassName", function (_ref2) {
-      var _rowGetter, _clsx;
+      var _rowGetter, _rowGetter2, _clsx;
 
       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, ((_rowGetter = rowGetter(index)) === null || _rowGetter === void 0 ? void 0 : _rowGetter.notClickable) === true && classes.noClick, (_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 && !(((_rowGetter2 = rowGetter(index)) === null || _rowGetter2 === void 0 ? void 0 : _rowGetter2.notClickable) === true), _clsx));
     });
 
-    _defineProperty(_assertThisInitialized(_this), "cellRenderer", function (_ref3) {
-      var _clsx2;
+    _defineProperty(_assertThisInitialized(_this), "onClickableRowClick", function (_ref3) {
+      var e = _ref3.e,
+          index = _ref3.index,
+          rowData = _ref3.rowData;
 
-      var cellData = _ref3.cellData,
-          columnIndex = _ref3.columnIndex,
-          rowIndex = _ref3.rowIndex;
+      if (!((rowData === null || rowData === void 0 ? void 0 : rowData.notClickable) === true)) {
+        _this.props.onRowClick(e, index, rowData);
+      }
+    });
+
+    _defineProperty(_assertThisInitialized(_this), "cellRenderer", function (_ref4) {
+      var _rows$rowIndex, _rows$rowIndex2, _clsx2;
+
+      var cellData = _ref4.cellData,
+          columnIndex = _ref4.columnIndex,
+          rowIndex = _ref4.rowIndex;
       var _this$props3 = _this.props,
           columns = _this$props3.columns,
           classes = _this$props3.classes,
@@ -244,7 +254,7 @@ var MuiVirtualizedTable = /*#__PURE__*/function (_React$PureComponent) {
 
       return /*#__PURE__*/_react["default"].createElement(_TableCell["default"], {
         component: "div",
-        className: (0, _clsx3["default"])(classes.tableCell, classes.flexContainer, (_clsx2 = {}, _clsx2[classes.noClick] = displayedValue === undefined || onCellClick == null || columns[columnIndex].clickable === undefined || !columns[columnIndex].clickable, _clsx2[classes.tableCellColor] = displayedValue === undefined || onCellClick !== null && columns[columnIndex].clickable !== undefined && columns[columnIndex].clickable, _clsx2)),
+        className: (0, _clsx3["default"])(classes.tableCell, classes.flexContainer, (_clsx2 = {}, _clsx2[classes.noClick] = displayedValue === undefined || ((_rows$rowIndex = rows[rowIndex]) === null || _rows$rowIndex === void 0 ? void 0 : _rows$rowIndex.notClickable) === true || onCellClick == null || columns[columnIndex].clickable === undefined || !columns[columnIndex].clickable, _clsx2[classes.tableCellColor] = displayedValue === undefined || onCellClick !== null && !((_rows$rowIndex2 = rows[rowIndex]) === null || _rows$rowIndex2 === void 0 ? void 0 : _rows$rowIndex2.notClickable) === true && columns[columnIndex].clickable !== undefined && columns[columnIndex].clickable, _clsx2)),
         variant: "body",
         style: {
           height: rowHeight,
@@ -252,7 +262,9 @@ var MuiVirtualizedTable = /*#__PURE__*/function (_React$PureComponent) {
         },
         align: columnIndex != null && columns[columnIndex].numeric || false ? 'right' : 'left',
         onClick: function onClick() {
-          if (onCellClick) {
+          var _rows$rowIndex3;
+
+          if (onCellClick && columns[columnIndex].clickable !== undefined && !((_rows$rowIndex3 = rows[rowIndex]) === null || _rows$rowIndex3 === void 0 ? void 0 : _rows$rowIndex3.notClickable) === true && columns[columnIndex].clickable) {
             onCellClick(rows[rowIndex], columns[columnIndex]);
           }
         }
@@ -262,9 +274,9 @@ var MuiVirtualizedTable = /*#__PURE__*/function (_React$PureComponent) {
       }));
     });
 
-    _defineProperty(_assertThisInitialized(_this), "headerRenderer", function (_ref4) {
-      var label = _ref4.label,
-          columnIndex = _ref4.columnIndex;
+    _defineProperty(_assertThisInitialized(_this), "headerRenderer", function (_ref5) {
+      var label = _ref5.label,
+          columnIndex = _ref5.columnIndex;
       var _this$props4 = _this.props,
           columns = _this$props4.columns,
           classes = _this$props4.classes;
@@ -434,17 +446,21 @@ var MuiVirtualizedTable = /*#__PURE__*/function (_React$PureComponent) {
         enableExportCSV = _this$props5.enableExportCSV,
         tableProps = _objectWithoutPropertiesLoose(_this$props5, _excluded);
 
+    if (tableProps.onRowClick) {
+      tableProps.onRowClick = this.onClickableRowClick;
+    }
+
     var reorderedIndex = this.reorderIndex(this.state.key, this.state.direction, this.props.filter, this.props.rows);
 
     var getIndexFor = function getIndexFor(index) {
       return index < reorderedIndex.length ? reorderedIndex[index] : 0;
     };
 
-    var _rowGetter2 = function rowGetter(index) {
+    var _rowGetter3 = function rowGetter(index) {
       return _this2.props.rows[getIndexFor(index)];
     };
 
-    var sizes = this.sizes(this.props.columns, this.props.rows, _rowGetter2);
+    var sizes = this.sizes(this.props.columns, this.props.rows, _rowGetter3);
     var csvHeaders = this.csvHeaders(this.props.columns, this.props.exportCSVDataKeys);
     return /*#__PURE__*/_react["default"].createElement("div", {
       style: {
@@ -471,9 +487,9 @@ var MuiVirtualizedTable = /*#__PURE__*/function (_React$PureComponent) {
       style: {
         flexGrow: 1
       }
-    }, /*#__PURE__*/_react["default"].createElement(_reactVirtualized.AutoSizer, null, function (_ref5) {
-      var height = _ref5.height,
-          width = _ref5.width;
+    }, /*#__PURE__*/_react["default"].createElement(_reactVirtualized.AutoSizer, null, function (_ref6) {
+      var height = _ref6.height,
+          width = _ref6.width;
       return /*#__PURE__*/_react["default"].createElement(_reactVirtualized.Table, _extends({
         height: height,
         width: width,
@@ -485,20 +501,20 @@ var MuiVirtualizedTable = /*#__PURE__*/function (_React$PureComponent) {
         className: classes.table
       }, tableProps, {
         rowCount: reorderedIndex.length,
-        rowClassName: function rowClassName(_ref6) {
-          var index = _ref6.index;
+        rowClassName: function rowClassName(_ref7) {
+          var index = _ref7.index;
           return _this2.getRowClassName({
             index: index,
-            rowGetter: _rowGetter2
+            rowGetter: _rowGetter3
           });
         },
-        rowGetter: function rowGetter(_ref7) {
-          var index = _ref7.index;
-          return _rowGetter2(index);
+        rowGetter: function rowGetter(_ref8) {
+          var index = _ref8.index;
+          return _rowGetter3(index);
         }
-      }), columns.map(function (_ref8, index) {
-        var dataKey = _ref8.dataKey,
-            other = _objectWithoutPropertiesLoose(_ref8, _excluded2);
+      }), columns.map(function (_ref9, index) {
+        var dataKey = _ref9.dataKey,
+            other = _objectWithoutPropertiesLoose(_ref9, _excluded2);
 
         return /*#__PURE__*/_react["default"].createElement(_reactVirtualized.Column, _extends({
           key: dataKey,

package/lib/components/ReportViewer/log-report-item.js

@@ -28,9 +28,10 @@ var LogReportItem = /*#__PURE__*/function () {
     });
   };
 
-  function LogReportItem(jsonReport) {
+  function LogReportItem(jsonReport, reportId) {
     this.key = jsonReport.reportKey;
     this.log = LogReportItem.resolveTemplateMessage(jsonReport.defaultMessage, jsonReport.values);
+    this.reportId = reportId;
     this.severity = this.initSeverity(jsonReport.values.reportSeverity);
   }
 
@@ -40,6 +41,10 @@ var LogReportItem = /*#__PURE__*/function () {
     return this.log;
   };
 
+  _proto.getReportId = function getReportId() {
+    return this.reportId;
+  };
+
   _proto.getSeverity = function getSeverity() {
     return this.severity;
   };

package/lib/components/ReportViewer/log-report.js

@@ -16,12 +16,13 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "d
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 var LogReport = /*#__PURE__*/function () {
-  function LogReport(jsonReporter) {
+  function LogReport(jsonReporter, parentReportId) {
     this.id = (0, _uuid.v4)();
     this.key = jsonReporter.taskKey;
     this.title = _logReportItem["default"].resolveTemplateMessage(jsonReporter.defaultName, jsonReporter.taskValues);
     this.subReports = [];
     this.logs = [];
+    this.parentReportId = parentReportId;
     this.init(jsonReporter);
   }
 
@@ -53,10 +54,10 @@ var LogReport = /*#__PURE__*/function () {
     var _this = this;
 
     jsonReporter.subReporters.map(function (value) {
-      return _this.subReports.push(new LogReport(value));
+      return _this.subReports.push(new LogReport(value, _this.id));
     });
     jsonReporter.reports.map(function (value) {
-      return _this.logs.push(new _logReportItem["default"](value));
+      return _this.logs.push(new _logReportItem["default"](value, _this.id));
     });
   };
 

package/lib/components/ReportViewer/log-table.js

@@ -13,6 +13,8 @@ var _TableCell = _interopRequireDefault(require("@mui/material/TableCell"));
 
 var _MuiVirtualizedTable = _interopRequireDefault(require("../MuiVirtualizedTable"));
 
+var _styles = require("@mui/material/styles");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -51,8 +53,14 @@ var styles = function styles(theme) {
 var VirtualizedTable = (0, _withStyles["default"])(styles)(_MuiVirtualizedTable["default"]);
 
 var LogTable = function LogTable(_ref) {
-  var logs = _ref.logs;
+  var logs = _ref.logs,
+      onRowClick = _ref.onRowClick;
   var intl = (0, _reactIntl.useIntl)();
+  var theme = (0, _styles.useTheme)();
+
+  var _useState = (0, _react.useState)(-1),
+      selectedRowIndex = _useState[0],
+      setSelectedRowIndex = _useState[1];
 
   var severityCellRender = function severityCellRender(cellData) {
     return /*#__PURE__*/_react["default"].createElement(_TableCell["default"], {
@@ -95,16 +103,41 @@ var LogTable = function LogTable(_ref) {
       return {
         severity: log.getSeverityName(),
         message: log.getLog(),
-        backgroundColor: log.getColorName()
+        backgroundColor: log.getColorName(),
+        reportId: log.getReportId()
       };
     });
   };
 
-  return /*#__PURE__*/_react["default"].createElement(VirtualizedTable, {
-    columns: generateTableColumns(),
-    rows: generateTableRows(),
-    sortable: false
-  });
+  var handleRowClick = function handleRowClick(event, index, data) {
+    setSelectedRowIndex(index);
+    onRowClick(data);
+  };
+
+  var rowStyleFormat = function rowStyleFormat(row) {
+    if (row.index < 0) return;
+
+    if (selectedRowIndex === row.index) {
+      return {
+        backgroundColor: theme.palette.action.selected
+      };
+    }
+  };
+
+  (0, _react.useEffect)(function () {
+    setSelectedRowIndex(-1);
+  }, [logs]);
+  return (
+    /*#__PURE__*/
+    //TODO do we need to useMemo/useCallback these props to avoid rerenders ?
+    _react["default"].createElement(VirtualizedTable, {
+      columns: generateTableColumns(),
+      rows: generateTableRows(),
+      sortable: false,
+      onRowClick: handleRowClick,
+      rowStyle: rowStyleFormat
+    })
+  );
 };
 
 var _default = (0, _react.memo)(LogTable);

package/lib/components/ReportViewer/report-item.js

@@ -3,7 +3,7 @@
 exports.__esModule = true;
 exports["default"] = void 0;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
@@ -15,10 +15,16 @@ var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
 
 var _Label = _interopRequireDefault(require("@mui/icons-material/Label"));
 
+var _reportTreeViewContext = _interopRequireDefault(require("./report-tree-view-context"));
+
 var _excluded = ["labelText", "labelIconColor"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -65,6 +71,12 @@ var useReportItemStyles = (0, _makeStyles["default"])(function (theme) {
       alignItems: 'center',
       padding: theme.spacing(0.5, 0)
     },
+    labelRootHighlighted: {
+      display: 'flex',
+      alignItems: 'center',
+      padding: theme.spacing(0.5, 0),
+      backgroundColor: theme.palette.action.selected
+    },
     labelIcon: {
       marginRight: theme.spacing(1)
     },
@@ -76,6 +88,11 @@ var useReportItemStyles = (0, _makeStyles["default"])(function (theme) {
 });
 
 var ReportItem = function ReportItem(props) {
+  // using a context because TreeItem uses useMemo on this. See report-viewer.js for the provider
+  var _useContext = (0, _react.useContext)(_reportTreeViewContext["default"]),
+      isHighlighted = _useContext.isHighlighted;
+
+  var highlighted = isHighlighted ? isHighlighted(props.nodeId) : false;
   var classes = useReportItemStyles();
 
   var labelText = props.labelText,
@@ -92,7 +109,7 @@ var ReportItem = function ReportItem(props) {
       label: classes.label
     },
     label: /*#__PURE__*/_react["default"].createElement("div", {
-      className: classes.labelRoot
+      className: highlighted ? classes.labelRootHighlighted : classes.labelRoot
     }, /*#__PURE__*/_react["default"].createElement(_Label["default"], {
       htmlColor: labelIconColor,
       className: classes.labelIcon

package/lib/components/ReportViewer/report-tree-view-context.js

@@ -0,0 +1,22 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _react = require("react");
+
+/**
+ * Copyright (c) 2022, RTE (http://www.rte-france.com)
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+var ReportTreeViewContext = (0, _react.createContext)({});
+
+if (process.env.NODE_ENV !== 'production') {
+  ReportTreeViewContext.displayName = 'ReportTreeViewContext';
+}
+
+var _default = ReportTreeViewContext;
+exports["default"] = _default;
+module.exports = exports.default;

package/lib/components/ReportViewer/report-viewer.js

@@ -21,6 +21,8 @@ var _Grid = _interopRequireDefault(require("@mui/material/Grid"));
 
 var _logTable = _interopRequireDefault(require("./log-table"));
 
+var _reportTreeViewContext = _interopRequireDefault(require("./report-tree-view-context"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -62,6 +64,10 @@ function ReportViewer(_ref) {
       logs = _useState3[0],
       setLogs = _useState3[1];
 
+  var _useState4 = (0, _react.useState)(),
+      highlightedReportId = _useState4[0],
+      setHighlightedReportId = _useState4[1];
+
   var rootReport = (0, _react.useRef)(null);
   var allReports = (0, _react.useRef)({});
   var treeView = (0, _react.useRef)(null);
@@ -108,7 +114,39 @@ function ReportViewer(_ref) {
     if (selectedNode !== nodeId) {
       setSelectedNode(nodeId);
       setLogs(allReports.current[nodeId].getAllLogs());
+      setHighlightedReportId(null);
     }
+  }; // The MUI TreeView/TreeItems use useMemo on our items, so it's important to avoid changing the context
+
+
+  var isHighlighted = (0, _react.useMemo)(function () {
+    return {
+      isHighlighted: function isHighlighted(reportId) {
+        return highlightedReportId === reportId;
+      }
+    };
+  }, [highlightedReportId]);
+
+  var onRowClick = function onRowClick(data) {
+    setExpandedNodes(function (previouslyExpandedNodes) {
+      var nodesToExpand = [];
+      var reportId = data.reportId;
+
+      while ((_allReports$current$r = allReports.current[reportId]) === null || _allReports$current$r === void 0 ? void 0 : _allReports$current$r.parentReportId) {
+        var _allReports$current$r;
+
+        var parentReportId = allReports.current[reportId].parentReportId;
+
+        if (!previouslyExpandedNodes.includes(parentReportId)) {
+          nodesToExpand.push(parentReportId);
+        }
+
+        reportId = parentReportId;
+      }
+
+      if (nodesToExpand.length > 0) return nodesToExpand.concat(previouslyExpandedNodes);else return previouslyExpandedNodes;
+    });
+    setHighlightedReportId(data.reportId);
   };
 
   return rootReport.current && /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
@@ -124,6 +162,8 @@ function ReportViewer(_ref) {
       height: '95%',
       borderRight: '1px solid rgba(81, 81, 81, 1)'
     }
+  }, /*#__PURE__*/_react["default"].createElement(_reportTreeViewContext["default"].Provider, {
+    value: isHighlighted
   }, /*#__PURE__*/_react["default"].createElement(_TreeView["default"], {
     className: classes.treeView,
     defaultCollapseIcon: /*#__PURE__*/_react["default"].createElement(_ArrowDropDown["default"], null),
@@ -137,7 +177,7 @@ function ReportViewer(_ref) {
     onNodeSelect: handleSelectNode,
     selected: selectedNode,
     expanded: expandedNodes
-  }, treeView.current)), /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
+  }, treeView.current))), /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
     item: true,
     xs: 12,
     sm: 9,
@@ -145,7 +185,8 @@ function ReportViewer(_ref) {
       height: '95%'
     }
   }, /*#__PURE__*/_react["default"].createElement(_logTable["default"], {
-    logs: logs
+    logs: logs,
+    onRowClick: onRowClick
   })));
 }
 

package/lib/hooks/useIntlRef.js

@@ -0,0 +1,27 @@
+"use strict";
+
+exports.__esModule = true;
+exports.useIntlRef = useIntlRef;
+
+var _react = require("react");
+
+var _reactIntl = require("react-intl");
+
+/**
+ * Copyright (c) 2021, RTE (http://www.rte-france.com)
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+//This useEffect must be at the beginning to be executed before other useEffects which use intlRef.
+//This ref is used to avoid redoing other useEffects when the language (intl) is changed for things that produce temporary messages using the snackbar.
+//The drawback to this custom hook is that a ref and a useEffect are created in each component that needs this hook.
+//Can we avoid this overhead ?
+function useIntlRef() {
+  var intl = (0, _reactIntl.useIntl)();
+  var intlRef = (0, _react.useRef)();
+  (0, _react.useEffect)(function () {
+    intlRef.current = intl;
+  }, [intl]);
+  return intlRef;
+}

package/lib/hooks/useSnackMessage.js

@@ -0,0 +1,98 @@
+"use strict";
+
+exports.__esModule = true;
+exports.useSnackMessage = useSnackMessage;
+
+var _react = require("react");
+
+var _notistack = require("notistack");
+
+var _useIntlRef = require("./useIntlRef");
+
+/**
+ * Copyright (c) 2021, RTE (http://www.rte-france.com)
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+function useSnackMessage() {
+  var intlRef = (0, _useIntlRef.useIntlRef)();
+
+  var _useSnackbar = (0, _notistack.useSnackbar)(),
+      enqueueSnackbar = _useSnackbar.enqueueSnackbar;
+  /*
+      There is two kind of messages : the message itself (bottom of snackbar), and the header (top of snackbar).
+      As inputs, you can give either a text message, or an ID with optional values (for translation with intl).
+        snackInputs: {
+            messageTxt,
+            messageId,
+            messageValues,
+            headerTxt,
+            headerId,
+            headerValues,
+          }
+  */
+
+
+  var snackError = (0, _react.useCallback)(function (snackInputs) {
+    return makeSnackbar(snackInputs, intlRef, enqueueSnackbar, 'error', true);
+  }, [enqueueSnackbar, intlRef]);
+  /* see snackError */
+
+  var snackWarning = (0, _react.useCallback)(function (snackInputs) {
+    return makeSnackbar(snackInputs, intlRef, enqueueSnackbar, 'warning', true);
+  }, [enqueueSnackbar, intlRef]);
+  /* see snackError */
+
+  var snackInfo = (0, _react.useCallback)(function (snackInputs) {
+    return makeSnackbar(snackInputs, intlRef, enqueueSnackbar, 'info', false);
+  }, [enqueueSnackbar, intlRef]);
+  return {
+    snackError: snackError,
+    snackInfo: snackInfo,
+    snackWarning: snackWarning
+  };
+}
+
+function makeSnackbar(snackInputs, intlRef, enqueueSnackbar, level, persistent) {
+  var message = checkAndTranslateIfNecessary(snackInputs.messageTxt, snackInputs.messageId, snackInputs.messageValues, intlRef);
+  var header = checkAndTranslateIfNecessary(snackInputs.headerTxt, snackInputs.headerId, snackInputs.headerValues, intlRef);
+  displayMessageWithSnackbar(message, header, enqueueSnackbar, level, persistent);
+}
+
+function checkAndTranslateIfNecessary(txt, id, values, intlRef) {
+  checkInputs(txt, id, values);
+  return txt !== null && txt !== void 0 ? txt : id ? intlRef.current.formatMessage({
+    id: id
+  }, values) : null;
+}
+
+function checkInputs(txt, id, values) {
+  if (txt && (id || values)) {
+    console.warn('Snack inputs should be [*Txt] OR [*Id, *Values]');
+  }
+}
+
+function displayMessageWithSnackbar(message, header, enqueueSnackbar, level, persistent) {
+  var fullMessage = '';
+
+  if (header) {
+    fullMessage += header;
+  }
+
+  if (message) {
+    if (header) {
+      fullMessage += '\n\n';
+    }
+
+    fullMessage += message;
+  }
+
+  enqueueSnackbar(fullMessage, {
+    variant: level,
+    persist: persistent,
+    style: {
+      whiteSpace: 'pre-line'
+    }
+  });
+}

package/lib/index.js

@@ -1,7 +1,7 @@
 "use strict";
 
 exports.__esModule = true;
-exports.useImportExportParams = exports.treeview_finder_fr = exports.treeview_finder_en = exports.top_bar_fr = exports.top_bar_en = exports.table_fr = exports.table_en = exports.setSignInCallbackError = exports.setShowAuthenticationRouterLogin = exports.setLoggedUser = exports.report_viewer_fr = exports.report_viewer_en = exports.logout = exports.login_fr = exports.login_en = exports.initializeAuthenticationProd = exports.initializeAuthenticationDev = exports.getPreLoginPath = exports.getFileIcon = exports.getEquipmentsInfosForSearchBar = exports.equipment_search_fr = exports.equipment_search_en = exports.equipmentStyles = exports.element_search_fr = exports.element_search_en = exports.elementType = exports.dispatchUser = exports.card_error_boundary_fr = exports.card_error_boundary_en = exports.USER_VALIDATION_ERROR = exports.USER = exports.UNAUTHORIZED_USER_INFO = exports.TreeViewFinder = exports.TopBar = exports.TagRenderer = exports.SnackbarProvider = exports.SIGNIN_CALLBACK_ERROR = exports.SHOW_AUTH_INFO_LOGIN = exports.ReportViewerDialog = exports.ReportViewer = exports.OverflowableText = exports.MuiVirtualizedTable = exports.LOGOUT_ERROR = exports.LIGHT_THEME = exports.LANG_SYSTEM = exports.LANG_FRENCH = exports.LANG_ENGLISH = exports.EquipmentItem = exports.ElementSearchDialog = exports.EQUIPMENT_TYPE = exports.DEFAULT_ROW_HEIGHT = exports.DEFAULT_HEADER_HEIGHT = exports.DEFAULT_CELL_PADDING = exports.DARK_THEME = exports.CardErrorBoundary = exports.AuthenticationRouter = void 0;
+exports.useSnackMessage = exports.useIntlRef = exports.useImportExportParams = exports.treeview_finder_fr = exports.treeview_finder_en = exports.top_bar_fr = exports.top_bar_en = exports.table_fr = exports.table_en = exports.setSignInCallbackError = exports.setShowAuthenticationRouterLogin = exports.setLoggedUser = exports.report_viewer_fr = exports.report_viewer_en = exports.logout = exports.login_fr = exports.login_en = exports.initializeAuthenticationProd = exports.initializeAuthenticationDev = exports.getPreLoginPath = exports.getFileIcon = exports.getEquipmentsInfosForSearchBar = exports.equipment_search_fr = exports.equipment_search_en = exports.equipmentStyles = exports.element_search_fr = exports.element_search_en = exports.elementType = exports.dispatchUser = exports.card_error_boundary_fr = exports.card_error_boundary_en = exports.USER_VALIDATION_ERROR = exports.USER = exports.UNAUTHORIZED_USER_INFO = exports.TreeViewFinder = exports.TopBar = exports.TagRenderer = exports.SnackbarProvider = exports.SIGNIN_CALLBACK_ERROR = exports.SHOW_AUTH_INFO_LOGIN = exports.ReportViewerDialog = exports.ReportViewer = exports.OverflowableText = exports.MuiVirtualizedTable = exports.LOGOUT_ERROR = exports.LIGHT_THEME = exports.LANG_SYSTEM = exports.LANG_FRENCH = exports.LANG_ENGLISH = exports.EquipmentItem = exports.ElementSearchDialog = exports.EQUIPMENT_TYPE = exports.DEFAULT_ROW_HEIGHT = exports.DEFAULT_HEADER_HEIGHT = exports.DEFAULT_CELL_PADDING = exports.DARK_THEME = exports.CardErrorBoundary = exports.AuthenticationRouter = void 0;
 
 var _TreeViewFinder = _interopRequireDefault(require("./components/TreeViewFinder"));
 
@@ -161,6 +161,14 @@ var _useImportExportParams = require("./hooks/useImportExportParams");
 
 exports.useImportExportParams = _useImportExportParams.useImportExportParams;
 
+var _useIntlRef = require("./hooks/useIntlRef");
+
+exports.useIntlRef = _useIntlRef.useIntlRef;
+
+var _useSnackMessage = require("./hooks/useSnackMessage");
+
+exports.useSnackMessage = _useSnackMessage.useSnackMessage;
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@gridsuite/commons-ui",
-    "version": "0.28.0",
+    "version": "0.29.0",
     "description": "common react components for gridsuite applications",
     "engines": {
         "npm": "<=6",