@hipay/hipay-material-ui 1.0.0-beta.23 → 1.0.0-beta.25

package/HiTable/BodyCellBuilder.js

@@ -12,6 +12,10 @@ var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProp
 
 var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
 
+var _stringify = require('babel-runtime/core-js/json/stringify');
+
+var _stringify2 = _interopRequireDefault(_stringify);
+
 var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
 
 var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
@@ -57,8 +61,8 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 /**
  * Construit la cellule correspondante au type demandé
  */
-var BodyCellBuilder = function (_React$PureComponent) {
-    (0, _inherits3.default)(BodyCellBuilder, _React$PureComponent);
+var BodyCellBuilder = function (_React$Component) {
+    (0, _inherits3.default)(BodyCellBuilder, _React$Component);
 
     function BodyCellBuilder(props) {
         (0, _classCallCheck3.default)(this, BodyCellBuilder);
@@ -69,16 +73,21 @@ var BodyCellBuilder = function (_React$PureComponent) {
         return _this;
     }
 
-    /**
-     * CollecContextMenuDatas
-     *
-     * définit les données utilisées par le context menu (lookup, exclude, copy, redirect)
-     * - value : valeur sur laquelle on filtre
-     * - label : label de la value (traduite)
-     */
+    (0, _createClass3.default)(BodyCellBuilder, [{
+        key: 'shouldComponentUpdate',
+        value: function shouldComponentUpdate(nextProps, nextState) {
+            return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
+        }
 
+        /**
+         * CollecContextMenuDatas
+         *
+         * définit les données utilisées par le context menu (lookup, exclude, copy, redirect)
+         * - value : valeur sur laquelle on filtre
+         * - label : label de la value (traduite)
+         */
 
-    (0, _createClass3.default)(BodyCellBuilder, [{
+    }, {
         key: 'collectContextMenuDatas',
         value: function collectContextMenuDatas() {
             var _props$data = this.props.data,
@@ -205,7 +214,8 @@ var BodyCellBuilder = function (_React$PureComponent) {
                             locale: dateLocale,
                             view: view,
                             displayTime: props.displayTime,
-                            sticky: sticky
+                            sticky: sticky,
+                            formatShort: this.props.formatShort
                         });
                         break;
 
@@ -315,7 +325,7 @@ var BodyCellBuilder = function (_React$PureComponent) {
         }
     }]);
     return BodyCellBuilder;
-}(_react2.default.PureComponent);
+}(_react2.default.Component);
 
 BodyCellBuilder.defaultProps = {
     ellipsis: 'right',

package/HiTable/BodyCells/CellAccount.js

@@ -5,6 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.styles = undefined;
 
+var _stringify = require('babel-runtime/core-js/json/stringify');
+
+var _stringify2 = _interopRequireDefault(_stringify);
+
 var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
 
 var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
@@ -56,8 +60,8 @@ var styles = exports.styles = function styles(theme) {
  */
 
 
-var CellAccount = function (_React$PureComponent) {
-    (0, _inherits3.default)(CellAccount, _React$PureComponent);
+var CellAccount = function (_React$Component) {
+    (0, _inherits3.default)(CellAccount, _React$Component);
 
     function CellAccount() {
         (0, _classCallCheck3.default)(this, CellAccount);
@@ -65,6 +69,11 @@ var CellAccount = function (_React$PureComponent) {
     }
 
     (0, _createClass3.default)(CellAccount, [{
+        key: 'shouldComponentUpdate',
+        value: function shouldComponentUpdate(nextProps, nextState) {
+            return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
+        }
+    }, {
         key: 'render',
         value: function render() {
             var _props = this.props,
@@ -80,7 +89,7 @@ var CellAccount = function (_React$PureComponent) {
         }
     }]);
     return CellAccount;
-}(_react2.default.PureComponent);
+}(_react2.default.Component);
 
 CellAccount.defaultProps = {};
 CellAccount.propTypes = process.env.NODE_ENV !== "production" ? {

package/HiTable/BodyCells/CellAccountNumber.js

@@ -5,6 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.styles = undefined;
 
+var _stringify = require('babel-runtime/core-js/json/stringify');
+
+var _stringify2 = _interopRequireDefault(_stringify);
+
 var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
 
 var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
@@ -86,8 +90,8 @@ var styles = exports.styles = function styles(theme) {
  * Le tooltip affiche les informations complémentaires (country, expiration date..)
  */
 
-var CellAccountNumber = function (_React$PureComponent) {
-    (0, _inherits3.default)(CellAccountNumber, _React$PureComponent);
+var CellAccountNumber = function (_React$Component) {
+    (0, _inherits3.default)(CellAccountNumber, _React$Component);
 
     function CellAccountNumber() {
         (0, _classCallCheck3.default)(this, CellAccountNumber);
@@ -95,6 +99,11 @@ var CellAccountNumber = function (_React$PureComponent) {
     }
 
     (0, _createClass3.default)(CellAccountNumber, [{
+        key: 'shouldComponentUpdate',
+        value: function shouldComponentUpdate(nextProps, nextState) {
+            return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
+        }
+    }, {
         key: 'render',
         value: function render() {
             var _this2 = this;
@@ -180,7 +189,7 @@ var CellAccountNumber = function (_React$PureComponent) {
         }
     }]);
     return CellAccountNumber;
-}(_react2.default.PureComponent);
+}(_react2.default.Component);
 
 CellAccountNumber.propTypes = process.env.NODE_ENV !== "production" ? {
     /**

package/HiTable/BodyCells/CellAddress.js

@@ -5,6 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.styles = undefined;
 
+var _stringify = require('babel-runtime/core-js/json/stringify');
+
+var _stringify2 = _interopRequireDefault(_stringify);
+
 var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
 
 var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
@@ -74,8 +78,8 @@ var styles = exports.styles = function styles(theme) {
  * - tous les champs définis sont affichés dans le tooltip
  */
 
-var CellAddress = function (_React$PureComponent) {
-    (0, _inherits3.default)(CellAddress, _React$PureComponent);
+var CellAddress = function (_React$Component) {
+    (0, _inherits3.default)(CellAddress, _React$Component);
 
     function CellAddress() {
         (0, _classCallCheck3.default)(this, CellAddress);
@@ -83,6 +87,11 @@ var CellAddress = function (_React$PureComponent) {
     }
 
     (0, _createClass3.default)(CellAddress, [{
+        key: 'shouldComponentUpdate',
+        value: function shouldComponentUpdate(nextProps, nextState) {
+            return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
+        }
+    }, {
         key: 'render',
         value: function render() {
             var _props = this.props,
@@ -157,7 +166,7 @@ var CellAddress = function (_React$PureComponent) {
         }
     }]);
     return CellAddress;
-}(_react2.default.PureComponent);
+}(_react2.default.Component);
 
 CellAddress.defaultProps = {
     view: 'l'

package/HiTable/BodyCells/CellCountry.js

@@ -5,6 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.styles = undefined;
 
+var _stringify = require('babel-runtime/core-js/json/stringify');
+
+var _stringify2 = _interopRequireDefault(_stringify);
+
 var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
 
 var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
@@ -94,8 +98,8 @@ var styles = exports.styles = function styles(theme) {
  *
  */
 
-var CellCountry = function (_React$PureComponent) {
-    (0, _inherits3.default)(CellCountry, _React$PureComponent);
+var CellCountry = function (_React$Component) {
+    (0, _inherits3.default)(CellCountry, _React$Component);
 
     function CellCountry() {
         (0, _classCallCheck3.default)(this, CellCountry);
@@ -103,6 +107,11 @@ var CellCountry = function (_React$PureComponent) {
     }
 
     (0, _createClass3.default)(CellCountry, [{
+        key: 'shouldComponentUpdate',
+        value: function shouldComponentUpdate(nextProps, nextState) {
+            return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
+        }
+    }, {
         key: 'render',
         value: function render() {
             var _props = this.props,
@@ -120,7 +129,7 @@ var CellCountry = function (_React$PureComponent) {
         }
     }]);
     return CellCountry;
-}(_react2.default.PureComponent);
+}(_react2.default.Component);
 
 CellCountry.propTypes = process.env.NODE_ENV !== "production" ? {
     /**

package/HiTable/BodyCells/CellDate.js

@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.styles = undefined;
 
-var _extends2 = require('babel-runtime/helpers/extends');
+var _stringify = require('babel-runtime/core-js/json/stringify');
 
-var _extends3 = _interopRequireDefault(_extends2);
+var _stringify2 = _interopRequireDefault(_stringify);
 
 var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
 
@@ -37,6 +37,12 @@ var _propTypes = require('prop-types');
 
 var _propTypes2 = _interopRequireDefault(_propTypes);
 
+var _moment = require('moment');
+
+var _moment2 = _interopRequireDefault(_moment);
+
+require('moment/locale/fr');
+
 var _withStyles = require('../../styles/withStyles');
 
 var _withStyles2 = _interopRequireDefault(_withStyles);
@@ -73,11 +79,25 @@ var CellDate = function (_React$Component) {
     (0, _inherits3.default)(CellDate, _React$Component);
 
     function CellDate() {
+        var _ref;
+
+        var _temp, _this, _ret;
+
         (0, _classCallCheck3.default)(this, CellDate);
-        return (0, _possibleConstructorReturn3.default)(this, (CellDate.__proto__ || (0, _getPrototypeOf2.default)(CellDate)).apply(this, arguments));
+
+        for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+            args[_key] = arguments[_key];
+        }
+
+        return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = CellDate.__proto__ || (0, _getPrototypeOf2.default)(CellDate)).call.apply(_ref, [this].concat(args))), _this), _this.formatLong = 'dddd DD MMMM YYYY HH:mm:ss', _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
     }
 
     (0, _createClass3.default)(CellDate, [{
+        key: 'shouldComponentUpdate',
+        value: function shouldComponentUpdate(nextProps, nextState) {
+            return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
+        }
+    }, {
         key: 'render',
         value: function render() {
             var _props = this.props,
@@ -85,44 +105,19 @@ var CellDate = function (_React$Component) {
                 displayTime = _props.displayTime,
                 value = _props.value,
                 locale = _props.locale,
-                view = _props.view;
-
-
-            var date = new Date(value);
-
-            var options = (0, _extends3.default)({
-                weekday: 'long',
-                year: 'numeric',
-                month: 'long',
-                day: '2-digit'
-            }, displayTime && {
-                hour: '2-digit',
-                minute: '2-digit',
-                second: '2-digit'
-            });
-            var titleValue = date.toLocaleString(locale, options);
+                view = _props.view,
+                formatShort = _props.formatShort;
+
+
+            var date = (0, _moment2.default)(value);
+            _moment2.default.locale(locale);
+
+            var titleValue = displayTime ? date.format(this.formatLong) : date.format(this.formatLong.replace('HH:mm:ss', ''));
             var displayedValue = titleValue;
             if (view === cst.VIEWS.SMALL) {
-                options = (0, _extends3.default)({
-                    year: '2-digit',
-                    month: '2-digit',
-                    day: '2-digit'
-                }, displayTime && {
-                    hour: '2-digit',
-                    minute: '2-digit'
-                });
-                displayedValue = date.toLocaleString(locale, options);
+                displayedValue = displayTime ? date.format(formatShort.replace('YYYY', 'YY') + ' HH:mm:ss') : date.format(formatShort.replace('YYYY', 'YY'));
             } else if (view === cst.VIEWS.MEDIUM) {
-                options = (0, _extends3.default)({
-                    year: 'numeric',
-                    month: '2-digit',
-                    day: '2-digit'
-                }, displayTime && {
-                    hour: '2-digit',
-                    minute: '2-digit',
-                    second: '2-digit'
-                });
-                displayedValue = date.toLocaleString(locale, options);
+                displayedValue = displayTime ? date.format(formatShort + ' HH:mm:ss') : date.format(formatShort);
             }
 
             if (view === cst.VIEWS.LARGE) {
@@ -149,8 +144,9 @@ var CellDate = function (_React$Component) {
 
 CellDate.defaultProps = {
     displayTime: false,
-    locale: 'en-EN',
-    view: 'l'
+    locale: 'en',
+    view: 'l',
+    formatShort: 'DD/MM/YYYY'
 };
 CellDate.propTypes = process.env.NODE_ENV !== "production" ? {
     /**
@@ -162,11 +158,16 @@ CellDate.propTypes = process.env.NODE_ENV !== "production" ? {
      */
     displayTime: _propTypes2.default.bool,
     /**
-     * Locale BCP 47
+     * Format de la date en vue small (ex: DD/MM/YYYY)
+     * @see https://momentjs.com/docs/#/parsing/string-format/
+     */
+    formatShort: _propTypes2.default.string.isRequired,
+    /**
+     * Locale moment
      */
     locale: _propTypes2.default.string,
     /**
-     * Volume/Amount
+     * Date as string
      */
     value: _propTypes2.default.string.isRequired,
     /**

package/HiTable/BodyCells/CellIcon.js

@@ -5,6 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.styles = undefined;
 
+var _stringify = require('babel-runtime/core-js/json/stringify');
+
+var _stringify2 = _interopRequireDefault(_stringify);
+
 var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
 
 var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
@@ -75,8 +79,8 @@ var styles = exports.styles = {
  * En vue small (s) elle affiche uniquement l'icône avec une largeur fixe.
  */
 
-var CellIcon = function (_React$PureComponent) {
-    (0, _inherits3.default)(CellIcon, _React$PureComponent);
+var CellIcon = function (_React$Component) {
+    (0, _inherits3.default)(CellIcon, _React$Component);
 
     function CellIcon() {
         (0, _classCallCheck3.default)(this, CellIcon);
@@ -84,6 +88,11 @@ var CellIcon = function (_React$PureComponent) {
     }
 
     (0, _createClass3.default)(CellIcon, [{
+        key: 'shouldComponentUpdate',
+        value: function shouldComponentUpdate(nextProps, nextState) {
+            return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
+        }
+    }, {
         key: 'render',
         value: function render() {
             var _props = this.props,
@@ -124,7 +133,7 @@ var CellIcon = function (_React$PureComponent) {
         }
     }]);
     return CellIcon;
-}(_react2.default.PureComponent);
+}(_react2.default.Component);
 
 CellIcon.defaultProps = {
     icon: '',

package/HiTable/BodyCells/CellImage.js

@@ -5,6 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.styles = undefined;
 
+var _stringify = require('babel-runtime/core-js/json/stringify');
+
+var _stringify2 = _interopRequireDefault(_stringify);
+
 var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
 
 var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
@@ -93,8 +97,8 @@ var styles = exports.styles = function styles(theme) {
  * En vue small (s) elle affiche uniquement l'image avec une largeur fixe.
  */
 
-var CellImage = function (_React$PureComponent) {
-    (0, _inherits3.default)(CellImage, _React$PureComponent);
+var CellImage = function (_React$Component) {
+    (0, _inherits3.default)(CellImage, _React$Component);
 
     function CellImage() {
         (0, _classCallCheck3.default)(this, CellImage);
@@ -102,6 +106,11 @@ var CellImage = function (_React$PureComponent) {
     }
 
     (0, _createClass3.default)(CellImage, [{
+        key: 'shouldComponentUpdate',
+        value: function shouldComponentUpdate(nextProps, nextState) {
+            return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
+        }
+    }, {
         key: 'render',
         value: function render() {
             var _props = this.props,
@@ -168,7 +177,7 @@ var CellImage = function (_React$PureComponent) {
         }
     }]);
     return CellImage;
-}(_react2.default.PureComponent);
+}(_react2.default.Component);
 
 CellImage.defaultProps = {
     size: 24

package/HiTable/BodyCells/CellNumeric.js

@@ -5,6 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.styles = undefined;
 
+var _stringify = require('babel-runtime/core-js/json/stringify');
+
+var _stringify2 = _interopRequireDefault(_stringify);
+
 var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
 
 var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
@@ -63,8 +67,8 @@ var styles = exports.styles = function styles(theme) {
  * Cette cellule permet d'afficher un volume ou un montant avec devise
  */
 
-var CellNumeric = function (_React$PureComponent) {
-    (0, _inherits3.default)(CellNumeric, _React$PureComponent);
+var CellNumeric = function (_React$Component) {
+    (0, _inherits3.default)(CellNumeric, _React$Component);
 
     function CellNumeric() {
         (0, _classCallCheck3.default)(this, CellNumeric);
@@ -72,6 +76,11 @@ var CellNumeric = function (_React$PureComponent) {
     }
 
     (0, _createClass3.default)(CellNumeric, [{
+        key: 'shouldComponentUpdate',
+        value: function shouldComponentUpdate(nextProps, nextState) {
+            return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
+        }
+    }, {
         key: 'render',
         value: function render() {
             var _props = this.props,
@@ -109,7 +118,7 @@ var CellNumeric = function (_React$PureComponent) {
         }
     }]);
     return CellNumeric;
-}(_react2.default.PureComponent);
+}(_react2.default.Component);
 
 CellNumeric.propTypes = process.env.NODE_ENV !== "production" ? {
     /**

package/HiTable/BodyCells/CellRate.js

@@ -9,6 +9,10 @@ var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
 
 var _defineProperty3 = _interopRequireDefault(_defineProperty2);
 
+var _stringify = require('babel-runtime/core-js/json/stringify');
+
+var _stringify2 = _interopRequireDefault(_stringify);
+
 var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
 
 var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
@@ -99,8 +103,8 @@ var styles = exports.styles = function styles(theme) {
  * avec une icône d'évolution (optionnelle) et un indicateur du type de données représentées (optionnel)
  */
 
-var CellRate = function (_React$PureComponent) {
-    (0, _inherits3.default)(CellRate, _React$PureComponent);
+var CellRate = function (_React$Component) {
+    (0, _inherits3.default)(CellRate, _React$Component);
 
     function CellRate() {
         (0, _classCallCheck3.default)(this, CellRate);
@@ -108,6 +112,11 @@ var CellRate = function (_React$PureComponent) {
     }
 
     (0, _createClass3.default)(CellRate, [{
+        key: 'shouldComponentUpdate',
+        value: function shouldComponentUpdate(nextProps, nextState) {
+            return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
+        }
+    }, {
         key: 'render',
         value: function render() {
             var _classNames, _classNames2;
@@ -159,7 +168,7 @@ var CellRate = function (_React$PureComponent) {
         }
     }]);
     return CellRate;
-}(_react2.default.PureComponent);
+}(_react2.default.Component);
 
 CellRate.defaultProps = {
     isPositive: true

package/HiTable/BodyCells/CellSentinel.js

@@ -9,18 +9,22 @@ var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
 
 var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
 
-var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
+var _stringify = require('babel-runtime/core-js/json/stringify');
 
-var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
+var _stringify2 = _interopRequireDefault(_stringify);
 
-var _createClass2 = require('babel-runtime/helpers/createClass');
+var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
 
-var _createClass3 = _interopRequireDefault(_createClass2);
+var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
 
 var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
 
 var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
 
+var _createClass2 = require('babel-runtime/helpers/createClass');
+
+var _createClass3 = _interopRequireDefault(_createClass2);
+
 var _inherits2 = require('babel-runtime/helpers/inherits');
 
 var _inherits3 = _interopRequireDefault(_inherits2);
@@ -68,8 +72,14 @@ var styles = exports.styles = {
  * Cette cellule permet d'afficher le résultat de Sentinel (score & fraudResult & smartDecision)
  */
 
-var CellSentinel = function (_React$PureComponent) {
-    (0, _inherits3.default)(CellSentinel, _React$PureComponent);
+var CellSentinel = function (_React$Component) {
+    (0, _inherits3.default)(CellSentinel, _React$Component);
+    (0, _createClass3.default)(CellSentinel, [{
+        key: 'shouldComponentUpdate',
+        value: function shouldComponentUpdate(nextProps, nextState) {
+            return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
+        }
+    }]);
 
     function CellSentinel(props) {
         (0, _classCallCheck3.default)(this, CellSentinel);
@@ -184,7 +194,7 @@ var CellSentinel = function (_React$PureComponent) {
         }
     }]);
     return CellSentinel;
-}(_react2.default.PureComponent);
+}(_react2.default.Component);
 
 CellSentinel.defaultProps = {
     hideFraudResult: false

package/HiTable/BodyCells/CellStatus.js

@@ -5,6 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.styles = undefined;
 
+var _stringify = require('babel-runtime/core-js/json/stringify');
+
+var _stringify2 = _interopRequireDefault(_stringify);
+
 var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
 
 var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
@@ -63,8 +67,8 @@ var styles = exports.styles = function styles(theme) {
     };
 };
 
-var CellStatus = function (_React$PureComponent) {
-    (0, _inherits3.default)(CellStatus, _React$PureComponent);
+var CellStatus = function (_React$Component) {
+    (0, _inherits3.default)(CellStatus, _React$Component);
 
     function CellStatus() {
         (0, _classCallCheck3.default)(this, CellStatus);
@@ -72,6 +76,11 @@ var CellStatus = function (_React$PureComponent) {
     }
 
     (0, _createClass3.default)(CellStatus, [{
+        key: 'shouldComponentUpdate',
+        value: function shouldComponentUpdate(nextProps, nextState) {
+            return (0, _stringify2.default)(this.props) !== (0, _stringify2.default)(nextProps) || (0, _stringify2.default)(this.state) !== (0, _stringify2.default)(nextState);
+        }
+    }, {
         key: 'render',
         value: function render() {
             var _props = this.props,
@@ -106,7 +115,7 @@ var CellStatus = function (_React$PureComponent) {
         }
     }]);
     return CellStatus;
-}(_react2.default.PureComponent);
+}(_react2.default.Component);
 
 CellStatus.defaultProps = {
     nbOperations: 0