@sis-cc/dotstatsuite-visions 10.28.1 → 11.0.0

package/es/TablePreview/TablePreview.js

@@ -5,30 +5,28 @@ import * as R from 'ramda';
 import Table from '@material-ui/core/Table';
 import TableRow from '@material-ui/core/TableRow';
 import TableCell from '@material-ui/core/TableCell';
+import Lens from '@material-ui/icons/Lens';
 import { withBlank } from '../utils';
 import { useStyles } from './styles';
-import { getMaxValuesLength, getEmptyValues, getLabel, getEqualLengthValues, getEnhancedSections } from './lib';
+import { getMaxValuesLength, getEmptyValues, getLabel, valueLabel, maxCount } from './lib';
 
 var patern = {
   id: PropTypes.string,
   label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
-  values: PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.string,
-    label: PropTypes.oneOfType([PropTypes.string, PropTypes.element])
-  }))
+  count: PropTypes.number
 };
 
 var Header = function Header(_ref) {
   var header = _ref.header,
-      colSpan = _ref.colSpan;
+      colSpan = _ref.colSpan,
+      valuesSpan = _ref.valuesSpan;
 
   var classes = useStyles();
 
   return R.map(function (_ref2) {
     var id = _ref2.id,
         label = _ref2.label,
-        _ref2$values = _ref2.values,
-        values = _ref2$values === undefined ? [] : _ref2$values;
+        count = _ref2.count;
     return React.createElement(
       TableRow,
       { key: id, className: cx(classes.header, classes.border) },
@@ -43,43 +41,41 @@ var Header = function Header(_ref) {
         },
         label
       ),
-      R.map(function (_ref3) {
-        var id = _ref3.id,
-            label = _ref3.label;
+      R.times(function (index) {
         return React.createElement(
           TableCell,
           {
-            key: id,
+            key: id + '-' + index,
             className: cx(classes.border, classes.cell, classes.headerCell),
-            title: label,
             scope: 'col'
           },
-          label
+          index < count ? valueLabel : ''
         );
-      })(values)
+      }, valuesSpan)
     );
   })(header);
 };
 
 Header.propTypes = process.env.NODE_ENV !== "production" ? {
   header: PropTypes.array,
-  colSpan: PropTypes.number
+  colSpan: PropTypes.number,
+  valuesSpan: PropTypes.number
 } : {};
 
-var RowHeader = function RowHeader(_ref4) {
-  var _ref4$id = _ref4.id,
-      id = _ref4$id === undefined ? 'rowHeader' : _ref4$id,
-      rows = _ref4.rows,
-      emptyValues = _ref4.emptyValues;
+var RowHeader = function RowHeader(_ref3) {
+  var _ref3$id = _ref3.id,
+      id = _ref3$id === undefined ? 'rowHeader' : _ref3$id,
+      rows = _ref3.rows,
+      emptyValues = _ref3.emptyValues;
 
   var classes = useStyles();
 
   return React.createElement(
     TableRow,
     null,
-    R.map(function (_ref5) {
-      var id = _ref5.id,
-          label = _ref5.label;
+    R.map(function (_ref4) {
+      var id = _ref4.id,
+          label = _ref4.label;
       return React.createElement(
         TableCell,
         {
@@ -107,9 +103,9 @@ RowHeader.propTypes = process.env.NODE_ENV !== "production" ? {
   emptyValues: PropTypes.array
 } : {};
 
-var Sections = function Sections(_ref6) {
-  var sections = _ref6.sections,
-      colSpan = _ref6.colSpan;
+var Sections = function Sections(_ref5) {
+  var sections = _ref5.sections,
+      colSpan = _ref5.colSpan;
 
   var classes = useStyles();
 
@@ -119,11 +115,9 @@ var Sections = function Sections(_ref6) {
     React.createElement(
       TableCell,
       { tabIndex: 0, className: cx(classes.border, classes.sections), colSpan: colSpan },
-      R.map(function (_ref7) {
-        var id = _ref7.id,
-            label = _ref7.label,
-            values = _ref7.values,
-            Icon = _ref7.Icon;
+      R.addIndex(R.map)(function (_ref6, index) {
+        var id = _ref6.id,
+            label = _ref6.label;
         return React.createElement(
           Fragment,
           { key: id },
@@ -135,8 +129,8 @@ var Sections = function Sections(_ref6) {
           React.createElement(
             'span',
             { className: classes.sectionsCell },
-            values,
-            R.isNil(Icon) ? null : React.createElement(Icon, { className: classes.icon })
+            valueLabel,
+            index === sections.length - 1 ? null : React.createElement(Lens, { className: classes.icon })
           )
         );
       })(sections)
@@ -149,41 +143,41 @@ Sections.propTypes = process.env.NODE_ENV !== "production" ? {
   colSpan: PropTypes.number
 } : {};
 
-var RowValues = function RowValues(_ref8) {
-  var _ref8$id = _ref8.id,
-      id = _ref8$id === undefined ? 'rowValues' : _ref8$id,
-      rows = _ref8.rows,
-      emptyValues = _ref8.emptyValues;
+var RowValues = function RowValues(_ref7) {
+  var _ref7$id = _ref7.id,
+      id = _ref7$id === undefined ? 'rowValues' : _ref7$id,
+      rows = _ref7.rows,
+      emptyValues = _ref7.emptyValues;
 
   var classes = useStyles();
-  var rowValues = R.pipe(R.map(function (_ref9) {
-    var _ref9$values = _ref9.values,
-        values = _ref9$values === undefined ? [] : _ref9$values;
-    return R.map(R.identity)(values);
-  }), R.transpose)(rows);
-  return R.addIndex(R.map)(function (values, rowIndex) {
+
+  var totalMaxCount = R.min(maxCount, R.reduce(R.max, 0, R.pluck('count', rows)));
+
+  return R.times(function (rowIndex) {
     return React.createElement(
       TableRow,
       { key: id + '-' + rowIndex },
-      R.map(function (_ref10) {
-        var id = _ref10.id,
-            label = _ref10.label;
+      R.map(function (_ref8) {
+        var id = _ref8.id,
+            count = _ref8.count;
         return React.createElement(
           TableCell,
           {
-            key: id,
-            className: cx(classes.rows, classes.border, classes.cell),
-            title: label
+            key: id + '-' + rowIndex,
+            className: cx(classes.rows, classes.border, classes.cell)
           },
-          label
+          rowIndex < count ? valueLabel : ''
         );
-      })(values),
+      })(rows),
       React.createElement(TableCell, { className: cx(classes.separatorValues, classes.separatorSize, classes.border) }),
-      R.addIndex(R.map)(function (value, valueIndex) {
-        return React.createElement(TableCell, { key: rowIndex + '-' + valueIndex, className: cx(classes.border, classes.cell) });
-      })(emptyValues)
+      R.times(function (columnIndex) {
+        return React.createElement(TableCell, {
+          key: rowIndex + '-header-' + columnIndex,
+          className: cx(classes.border, classes.cell)
+        });
+      })(emptyValues.length)
     );
-  })(rowValues);
+  }, totalMaxCount);
 };
 
 RowValues.propTypes = process.env.NODE_ENV !== "production" ? {
@@ -192,26 +186,25 @@ RowValues.propTypes = process.env.NODE_ENV !== "production" ? {
   emptyValues: PropTypes.array
 } : {};
 
-var MyTable = function MyTable(_ref11) {
-  var _ref11$header = _ref11.header,
-      header = _ref11$header === undefined ? [] : _ref11$header,
-      _ref11$sections = _ref11.sections,
-      sections = _ref11$sections === undefined ? [] : _ref11$sections,
-      _ref11$rows = _ref11.rows,
-      rows = _ref11$rows === undefined ? [] : _ref11$rows,
-      _ref11$labelRenderer = _ref11.labelRenderer,
-      labelRenderer = _ref11$labelRenderer === undefined ? R.prop('name') : _ref11$labelRenderer;
+var MyTable = function MyTable(_ref9) {
+  var _ref9$header = _ref9.header,
+      header = _ref9$header === undefined ? [] : _ref9$header,
+      _ref9$sections = _ref9.sections,
+      sections = _ref9$sections === undefined ? [] : _ref9$sections,
+      _ref9$rows = _ref9.rows,
+      rows = _ref9$rows === undefined ? [] : _ref9$rows,
+      _ref9$labelRenderer = _ref9.labelRenderer,
+      labelRenderer = _ref9$labelRenderer === undefined ? R.prop('name') : _ref9$labelRenderer;
 
   var classes = useStyles();
   var nbShowedValuesHeader = getMaxValuesLength(header);
-  var nbShowedValuesRows = getMaxValuesLength(rows);
 
   var emptyValues = getEmptyValues(nbShowedValuesHeader);
-  var nbColumns = R.max(R.length(header) + nbShowedValuesHeader, R.length(rows) + nbShowedValuesRows) + 2;
+  var nbColumns = R.length(rows) + R.max(nbShowedValuesHeader, 1) + 1;
   var nbColumnRows = R.length(rows) + 1;
-  var enhancedHeader = R.pipe(getLabel(labelRenderer), getEqualLengthValues(nbShowedValuesHeader))(header);
-  var enhancedRows = R.pipe(getLabel(labelRenderer), getEqualLengthValues(nbShowedValuesRows))(rows);
-  var enhancedSections = R.pipe(getLabel(labelRenderer), getEnhancedSections(R.length(sections)))(sections);
+  var enhancedHeader = R.pipe(getLabel(labelRenderer))(header);
+  var enhancedRows = R.pipe(getLabel(labelRenderer))(rows);
+  var enhancedSections = R.pipe(getLabel(labelRenderer))(sections);
 
   return React.createElement(
     Table,
@@ -223,7 +216,11 @@ var MyTable = function MyTable(_ref11) {
     React.createElement(
       'tbody',
       null,
-      R.isEmpty(enhancedHeader) ? null : React.createElement(Header, { colSpan: nbColumnRows, header: enhancedHeader }),
+      R.isEmpty(enhancedHeader) ? null : React.createElement(Header, {
+        colSpan: nbColumnRows,
+        header: enhancedHeader,
+        valuesSpan: nbShowedValuesHeader
+      }),
       React.createElement(RowHeader, { rows: enhancedRows, emptyValues: emptyValues }),
       R.isEmpty(enhancedSections) ? null : React.createElement(Sections, { colSpan: nbColumns, sections: enhancedSections }),
       React.createElement(RowValues, { rows: enhancedRows, emptyValues: emptyValues })
@@ -238,10 +235,10 @@ MyTable.propTypes = process.env.NODE_ENV !== "production" ? {
   labelRenderer: PropTypes.func
 } : {};
 
-export default withBlank(function (_ref12) {
-  var _ref12$rows = _ref12.rows,
-      rows = _ref12$rows === undefined ? [] : _ref12$rows,
-      isBlank = _ref12.isBlank;
+export default withBlank(function (_ref10) {
+  var _ref10$rows = _ref10.rows,
+      rows = _ref10$rows === undefined ? [] : _ref10$rows,
+      isBlank = _ref10.isBlank;
   return {
     isBlank: R.or(isBlank, R.isEmpty(rows))
   };

package/es/TablePreview/lib.js

@@ -1,12 +1,11 @@
 import * as R from 'ramda';
 import Lens from '@material-ui/icons/Lens';
 
-export var getMaxValuesLength = function getMaxValuesLength(lists) {
-  return Math.max.apply(Math, R.map(function (_ref) {
-    var _ref$values = _ref.values,
-        values = _ref$values === undefined ? [] : _ref$values;
-    return R.length(values);
-  })(lists));
+export var valueLabel = 'Xxxx';
+export var maxCount = 3;
+
+export var getMaxValuesLength = function getMaxValuesLength(items) {
+  return Math.min(Math.max.apply(Math, R.pluck('count', items)), maxCount);
 };
 export var getEmptyValues = R.ifElse(R.flip(R.lte)(0), R.always(['']), R.times(R.always('')));
 export var getLabel = function getLabel(itemRenderer) {

package/lib/ShortUrls/ShortUrls.js

@@ -34,6 +34,18 @@ var _useMediaQuery = require('@material-ui/core/useMediaQuery');
 
 var _useMediaQuery2 = _interopRequireDefault(_useMediaQuery);
 
+var _IconButton = require('@material-ui/core/IconButton');
+
+var _IconButton2 = _interopRequireDefault(_IconButton);
+
+var _Collapse = require('@material-ui/core/Collapse');
+
+var _Collapse2 = _interopRequireDefault(_Collapse);
+
+var _Close = require('@material-ui/icons/Close');
+
+var _Close2 = _interopRequireDefault(_Close);
+
 var _ = require('../');
 
 var _core = require('@material-ui/core');
@@ -67,12 +79,16 @@ var ShortUrls = function ShortUrls(_ref) {
   var labels = _ref.labels,
       onClick = _ref.onClick,
       isLoading = _ref.isLoading,
-      contentValue = _ref.contentValue;
+      contentValue = _ref.contentValue,
+      _ref$isNotifOpen = _ref.isNotifOpen,
+      isNotifOpen = _ref$isNotifOpen === undefined ? false : _ref$isNotifOpen,
+      setIsNotifOpen = _ref.setIsNotifOpen;
 
   var isNarrow = (0, _useMediaQuery2.default)(function (theme) {
     return theme.breakpoints.down('sm');
   });
   var classes = useStyles();
+
   return _react2.default.createElement(
     _Grid2.default,
     { className: classes.container },
@@ -119,6 +135,29 @@ var ShortUrls = function ShortUrls(_ref) {
           value: contentValue
         })
       )
+    ),
+    _react2.default.createElement(
+      _Collapse2.default,
+      { 'in': isNotifOpen },
+      _react2.default.createElement(
+        _.Alert,
+        {
+          severity: 'error',
+          action: _react2.default.createElement(
+            _IconButton2.default,
+            {
+              'aria-label': 'close',
+              color: 'inherit',
+              size: 'small',
+              onClick: function onClick() {
+                setIsNotifOpen(false);
+              }
+            },
+            _react2.default.createElement(_Close2.default, { fontSize: 'inherit' })
+          )
+        },
+        R.prop('errorMessage', labels)
+      )
     )
   );
 };
@@ -126,6 +165,8 @@ ShortUrls.propTypes = process.env.NODE_ENV !== "production" ? {
   onClick: _propTypes2.default.func,
   isLoading: _propTypes2.default.bool,
   contentValue: _propTypes2.default.string,
+  isNotifOpen: _propTypes2.default.bool,
+  setIsNotifOpen: _propTypes2.default.func,
   labels: _propTypes2.default.shape({
     generateUrl: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.element]),
     title: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.element]),

package/lib/TableHtml5/TableHtml5.js

@@ -135,8 +135,6 @@ var TableHtml5 = function TableHtml5(_ref) {
   var headerRef = (0, _react.useRef)(null);
   var subHeadCellsRef = (0, _react.useRef)([]);
 
-  var cellValueAccessorHandler = (0, _react.useCallback)(cellValueAccessor, []);
-
   (0, _react.useEffect)(function () {
     setHeaderHeight(R.pathOr(0, ['current', 'clientHeight'], headerRef));
     setSubHeadCellsWidth(getCellsWidth(R.prop('current', subHeadCellsRef)));
@@ -219,7 +217,7 @@ var TableHtml5 = function TableHtml5(_ref) {
         SideIcon: SideIcon,
         subHeadCellsWidth: subHeadCellsWidth,
         HTMLRenderer: HTMLRenderer,
-        cellValueAccessor: cellValueAccessorHandler,
+        cellValueAccessor: cellValueAccessor,
         labelAccessor: labelAccessor,
         isNoWrap: isNoWrap,
         textAlign: textAlign