@hipay/hipay-material-ui 2.3.1-rc2 → 2.3.1-rc4

package/HiPaymentMeans/HiPaymentMeans.js

@@ -1,33 +1,14 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.styles = void 0;
-
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/createClass"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/possibleConstructorReturn"));
-
-var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/esm/getPrototypeOf"));
-
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/assertThisInitialized"));
-
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/inherits"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _classnames = _interopRequireDefault(require("classnames"));
-
-var _styles = require("@material-ui/core/styles");
-
-var styles = function styles(theme) {
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
+import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import React from 'react';
+import classNames from 'classnames';
+import { withStyles } from '@material-ui/core/styles';
+export var styles = function styles(theme) {
   return {
     bankCard: {
       position: 'relative',
@@ -282,26 +263,25 @@ var styles = function styles(theme) {
   };
 };
 
-exports.styles = styles;
-
 var HiPaymentMeans =
 /*#__PURE__*/
 function (_React$Component) {
-  (0, _inherits2.default)(HiPaymentMeans, _React$Component);
+  _inherits(HiPaymentMeans, _React$Component);
 
   function HiPaymentMeans() {
     var _getPrototypeOf2;
 
     var _this;
 
-    (0, _classCallCheck2.default)(this, HiPaymentMeans);
+    _classCallCheck(this, HiPaymentMeans);
 
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
 
-    _this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(HiPaymentMeans)).call.apply(_getPrototypeOf2, [this].concat(args)));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "buildPaymentLayoutByType", function () {
+    _this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(HiPaymentMeans)).call.apply(_getPrototypeOf2, [this].concat(args)));
+
+    _defineProperty(_assertThisInitialized(_this), "buildPaymentLayoutByType", function () {
       var _classNames;
 
       var _this$props = _this.props,
@@ -358,10 +338,10 @@ function (_React$Component) {
         creditDebit = (credit ? translations.credit : translations.debit).toUpperCase();
       }
 
-      var imgComponent = _react.default.createElement("img", {
+      var imgComponent = React.createElement("img", {
         src: brandLogo,
         alt: '',
-        className: (0, _classnames.default)(classes.logo, (_classNames = {}, (0, _defineProperty2.default)(_classNames, classes.logoLeft, ['ewallet', 'open-invoice', 'payment-reference', 'credit-consumption', 'realtime-banking'].indexOf(type) >= 0), (0, _defineProperty2.default)(_classNames, classes.logoRight, ['ewallet', 'open-invoice', 'payment-reference', 'credit-consumption', 'realtime-banking'].indexOf(type) < 0), _classNames)),
+        className: classNames(classes.logo, (_classNames = {}, _defineProperty(_classNames, classes.logoLeft, ['ewallet', 'open-invoice', 'payment-reference', 'credit-consumption', 'realtime-banking'].indexOf(type) >= 0), _defineProperty(_classNames, classes.logoRight, ['ewallet', 'open-invoice', 'payment-reference', 'credit-consumption', 'realtime-banking'].indexOf(type) < 0), _classNames)),
         onError: function onError(e) {
           if (fallbackImage) {
             e.target.src = "".concat(fallbackImage);
@@ -370,86 +350,85 @@ function (_React$Component) {
           }
         }
       });
-
       var cardLayout;
 
       switch (type) {
         case 'ewallet':
-          cardLayout = _react.default.createElement("div", {
+          cardLayout = React.createElement("div", {
             style: {
               backgroundImage: "url(\"".concat(svgPath, "Wallet_shape.svg\")")
             },
             className: classes.walletShadow
-          }, _react.default.createElement("div", {
+          }, React.createElement("div", {
             style: {
               background: "linear-gradient(".concat(color1, ", ").concat(color2 || color1, ")"),
               WebkitMask: "url(\"".concat(svgPath, "Wallet_shape.svg\")")
             },
             className: classes.wallet
-          }, _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.labelLarge, classes.userNameWallet)
-          }, username), _react.default.createElement("span", {
-            className: (0, _classnames.default)(classes.stripe, classes.stripeBottomLeft)
-          }, imgComponent), _react.default.createElement("span", {
-            className: (0, _classnames.default)(classes.stripeGradient, classes.stripeBottomLeft, classes.stripeGradientBottomLeft)
+          }, React.createElement("div", {
+            className: classNames(classes.labelLarge, classes.userNameWallet)
+          }, username), React.createElement("span", {
+            className: classNames(classes.stripe, classes.stripeBottomLeft)
+          }, imgComponent), React.createElement("span", {
+            className: classNames(classes.stripeGradient, classes.stripeBottomLeft, classes.stripeGradientBottomLeft)
           })));
           break;
 
         case 'credit-card':
         case 'debit-card':
-          cardLayout = _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.bankCard, classes.shadow),
+          cardLayout = React.createElement("div", {
+            className: classNames(classes.bankCard, classes.shadow),
             style: {
               background: "linear-gradient(".concat(color1, ", ").concat(color2 || color1, ")")
             }
-          }, _react.default.createElement("span", {
-            className: (0, _classnames.default)(classes.stripe, classes.stripeTopRight)
-          }, imgComponent), _react.default.createElement("span", {
-            className: (0, _classnames.default)(classes.stripeGradient, classes.stripeTopRight, classes.stripeGradientTopRight)
-          }), _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.number, classes.cardNumber)
-          }, formatNumber), cardNumber && _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.labelMedium, classes.cardNumberLabel)
-          }, "Card number"), _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.labelLarge, classes.userNameCard)
-          }, username), _react.default.createElement("div", {
+          }, React.createElement("span", {
+            className: classNames(classes.stripe, classes.stripeTopRight)
+          }, imgComponent), React.createElement("span", {
+            className: classNames(classes.stripeGradient, classes.stripeTopRight, classes.stripeGradientTopRight)
+          }), React.createElement("div", {
+            className: classNames(classes.number, classes.cardNumber)
+          }, formatNumber), cardNumber && React.createElement("div", {
+            className: classNames(classes.labelMedium, classes.cardNumberLabel)
+          }, "Card number"), React.createElement("div", {
+            className: classNames(classes.labelLarge, classes.userNameCard)
+          }, username), React.createElement("div", {
             className: classes.dateValid
-          }, cardValidity), cardValidity && _react.default.createElement("div", {
+          }, cardValidity), cardValidity && React.createElement("div", {
             className: classes.validThru
           }, "Valid Thru"));
           break;
 
         case 'corporate':
-          cardLayout = _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.bankCard, classes.shadow),
+          cardLayout = React.createElement("div", {
+            className: classNames(classes.bankCard, classes.shadow),
             style: {
               background: "linear-gradient(".concat(color1, ", ").concat(color2 || color1, ")")
             }
-          }, _react.default.createElement("span", {
-            className: (0, _classnames.default)(classes.stripe, classes.stripeTopRight)
-          }, imgComponent), _react.default.createElement("span", {
-            className: (0, _classnames.default)(classes.stripeGradient, classes.stripeTopRight, classes.stripeGradientTopRight)
-          }, _react.default.createElement("div", {
+          }, React.createElement("span", {
+            className: classNames(classes.stripe, classes.stripeTopRight)
+          }, imgComponent), React.createElement("span", {
+            className: classNames(classes.stripeGradient, classes.stripeTopRight, classes.stripeGradientTopRight)
+          }, React.createElement("div", {
             className: classes.corporateLabel,
             style: {
               color: color1
             }
-          }, "CORPORATE")), cardNumber && _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.labelMedium, classes.corporateNumberLabel)
-          }, "Card number"), _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.number, classes.corporateNumber)
-          }, cardNumber), yearMember && _react.default.createElement("div", {
+          }, "CORPORATE")), cardNumber && React.createElement("div", {
+            className: classNames(classes.labelMedium, classes.corporateNumberLabel)
+          }, "Card number"), React.createElement("div", {
+            className: classNames(classes.number, classes.corporateNumber)
+          }, cardNumber), yearMember && React.createElement("div", {
             className: classes.memberSince
-          }, "Member Since"), _react.default.createElement("div", {
+          }, "Member Since"), React.createElement("div", {
             className: classes.yearMember
-          }, yearMember), _react.default.createElement("div", {
+          }, yearMember), React.createElement("div", {
             className: classes.dateValid
-          }, cardValidity), cardValidity && _react.default.createElement("div", {
+          }, cardValidity), cardValidity && React.createElement("div", {
             className: classes.validThru
-          }, "Valid Thru"), _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.labelLarge, classes.userNameCorporate)
-          }, cardUser), _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.labelLarge, classes.businessName)
+          }, "Valid Thru"), React.createElement("div", {
+            className: classNames(classes.labelLarge, classes.userNameCorporate)
+          }, cardUser), React.createElement("div", {
+            className: classNames(classes.labelLarge, classes.businessName)
           }, businessName));
           break;
 
@@ -457,75 +436,76 @@ function (_React$Component) {
         case 'payment-reference':
         case 'credit-consumption':
         case 'realtime-banking':
-          cardLayout = _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.sepa, classes.shadow),
+          cardLayout = React.createElement("div", {
+            className: classNames(classes.sepa, classes.shadow),
             style: {
               background: "linear-gradient(".concat(color1, ", ").concat(color2 || color1, ")")
             }
-          }, _react.default.createElement("span", {
-            className: (0, _classnames.default)(classes.stripe, classes.stripeTopLeft)
-          }, imgComponent), _react.default.createElement("span", {
-            className: (0, _classnames.default)(classes.stripeGradient, classes.stripeTopLeft, classes.stripeGradientTopLeft)
-          }), cardNumber && _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.labelMedium, classes.ibanLabel)
-          }, "IBAN"), _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.number, classes.ibanNumber)
-          }, formatNumber), _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.labelLarge, classes.userNameSepa)
-          }, username), _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.labelLarge, classes.labelDebitCredit)
+          }, React.createElement("span", {
+            className: classNames(classes.stripe, classes.stripeTopLeft)
+          }, imgComponent), React.createElement("span", {
+            className: classNames(classes.stripeGradient, classes.stripeTopLeft, classes.stripeGradientTopLeft)
+          }), cardNumber && React.createElement("div", {
+            className: classNames(classes.labelMedium, classes.ibanLabel)
+          }, "IBAN"), React.createElement("div", {
+            className: classNames(classes.number, classes.ibanNumber)
+          }, formatNumber), React.createElement("div", {
+            className: classNames(classes.labelLarge, classes.userNameSepa)
+          }, username), React.createElement("div", {
+            className: classNames(classes.labelLarge, classes.labelDebitCredit)
           }, creditDebit));
           break;
 
         case 'prepaid-card':
-          cardLayout = _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.bankCard, classes.shadow),
+          cardLayout = React.createElement("div", {
+            className: classNames(classes.bankCard, classes.shadow),
             style: {
               background: "url(\"".concat(svgPath, "Gift_shape.svg\"), linear-gradient(").concat(color1, ",\n                         ").concat(color2 || color1, ")")
             }
-          }, _react.default.createElement("span", {
-            className: (0, _classnames.default)(classes.stripe, classes.stripeTopRight)
-          }, imgComponent), _react.default.createElement("span", {
-            className: (0, _classnames.default)(classes.stripeGradient, classes.stripeTopRight, classes.stripeGradientTopRight)
-          }, _react.default.createElement("img", {
+          }, React.createElement("span", {
+            className: classNames(classes.stripe, classes.stripeTopRight)
+          }, imgComponent), React.createElement("span", {
+            className: classNames(classes.stripeGradient, classes.stripeTopRight, classes.stripeGradientTopRight)
+          }, React.createElement("img", {
             src: logoMerchant,
             alt: '',
-            className: (0, _classnames.default)(classes.logo, classes.logoMerchant)
-          })), cardNumber && _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.labelMedium, classes.giftCardNumberLabel)
-          }, "Card number"), _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.number, classes.giftCardNumber)
-          }, cardNumber), _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.labelLarge, classes.labelDebitCredit)
+            className: classNames(classes.logo, classes.logoMerchant)
+          })), cardNumber && React.createElement("div", {
+            className: classNames(classes.labelMedium, classes.giftCardNumberLabel)
+          }, "Card number"), React.createElement("div", {
+            className: classNames(classes.number, classes.giftCardNumber)
+          }, cardNumber), React.createElement("div", {
+            className: classNames(classes.labelLarge, classes.labelDebitCredit)
           }, translations.gift_card));
           break;
 
         default:
-          cardLayout = _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.bankCard, classes.shadow),
+          cardLayout = React.createElement("div", {
+            className: classNames(classes.bankCard, classes.shadow),
             style: {
               background: "linear-gradient(".concat(color1, ", ").concat(color2 || color1, ")")
             }
-          }, _react.default.createElement("span", {
-            className: (0, _classnames.default)(classes.stripe, classes.stripeTopRight)
-          }, imgComponent), _react.default.createElement("span", {
-            className: (0, _classnames.default)(classes.stripeGradient, classes.stripeTopRight, classes.stripeGradientTopRight)
-          }), _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.number, classes.cardNumber)
-          }, cardNumber), cardNumber && _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.labelMedium, classes.cardNumberLabel)
-          }, "Card number"), _react.default.createElement("div", {
-            className: (0, _classnames.default)(classes.labelLarge, classes.userNameCard)
-          }, username), _react.default.createElement("div", {
+          }, React.createElement("span", {
+            className: classNames(classes.stripe, classes.stripeTopRight)
+          }, imgComponent), React.createElement("span", {
+            className: classNames(classes.stripeGradient, classes.stripeTopRight, classes.stripeGradientTopRight)
+          }), React.createElement("div", {
+            className: classNames(classes.number, classes.cardNumber)
+          }, cardNumber), cardNumber && React.createElement("div", {
+            className: classNames(classes.labelMedium, classes.cardNumberLabel)
+          }, "Card number"), React.createElement("div", {
+            className: classNames(classes.labelLarge, classes.userNameCard)
+          }, username), React.createElement("div", {
             className: classes.dateValid
-          }, cardValidity), cardValidity && _react.default.createElement("div", {
+          }, cardValidity), cardValidity && React.createElement("div", {
             className: classes.validThru
           }, "Valid Thru"));
       }
 
       return cardLayout;
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "formatCardNumber", function (cardNumber) {
+
+    _defineProperty(_assertThisInitialized(_this), "formatCardNumber", function (cardNumber) {
       if (cardNumber.search(/X/g) >= 0) {
         cardNumber = cardNumber.replace(/X/g, '*');
       }
@@ -536,26 +516,29 @@ function (_React$Component) {
 
       return cardNumber;
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "formatIBANNumber", function (cardNumber) {
+
+    _defineProperty(_assertThisInitialized(_this), "formatIBANNumber", function (cardNumber) {
       if (cardNumber.search(' ') < 0) {
         cardNumber = "".concat(cardNumber.substring(0, 4), " ").concat(cardNumber.substring(4, 8), " ").concat(cardNumber.substring(8, 12), "\n             ").concat(cardNumber.substring(12, 16), " ").concat(cardNumber.substring(16, 20), " ").concat(cardNumber.substring(20, 26));
       }
 
       return cardNumber;
     });
+
     return _this;
   }
 
-  (0, _createClass2.default)(HiPaymentMeans, [{
+  _createClass(HiPaymentMeans, [{
     key: "render",
     value: function render() {
       return this.buildPaymentLayoutByType();
     }
   }]);
+
   return HiPaymentMeans;
-}(_react.default.Component);
+}(React.Component);
 
-(0, _defineProperty2.default)(HiPaymentMeans, "defaultProps", {
+_defineProperty(HiPaymentMeans, "defaultProps", {
   cardUserGender: 'U',
   credit: true,
   translations: {
@@ -567,10 +550,8 @@ function (_React$Component) {
   }
 });
 
-var _default = (0, _styles.withStyles)(styles, {
+export default withStyles(styles, {
   hiComponent: true,
   name: 'HmuiHiPaymentMean',
   withTheme: true
-})(HiPaymentMeans);
-
-exports.default = _default;
+})(HiPaymentMeans);

package/HiPaymentMeans/HiPaymentMeans.test.js

@@ -0,0 +1,162 @@
+import React from 'react';
+import { createMount, createShallow, getClasses } from '../test-utils';
+import HiPaymentMeans from './HiPaymentMeans';
+import { assert } from 'chai';
+describe('<HiPaymentMeans />', function () {
+  var shallow;
+  var classes;
+  var mount;
+  var translations;
+  before(function () {
+    translations = {
+      credit: 'credit',
+      debit: 'debit',
+      gift_card: 'GIFT CARD',
+      gender_female: 'Mrs',
+      gender_male: 'Mr'
+    };
+    shallow = createShallow({
+      dive: true
+    });
+    classes = getClasses(React.createElement(HiPaymentMeans, {
+      logo: '/static/hmu/images/payment-means/sans_logo full.svg',
+      cardNumber: '55555',
+      cardUser: 'Lulu Rouget',
+      cardUserGender: 'F',
+      cardValidity: '2019',
+      colorPrimary: '#fff',
+      colorSecondary: '#000',
+      logoMerchant: 'logoMerchant',
+      type: 'credit-card',
+      translations: translations,
+      credit: false
+    }));
+    mount = createMount();
+  });
+  after(function () {
+    mount.cleanUp();
+  });
+  describe('Should render bank card template', function () {
+    var wrapper;
+    before(function () {
+      wrapper = shallow(React.createElement(HiPaymentMeans, {
+        logo: '/static/hmu/images/payment-means/sans_logo full.svg',
+        cardNumber: '55555',
+        cardUser: 'Lulu Rouget',
+        cardUserGender: 'F',
+        cardValidity: '2019',
+        colorPrimary: '#fff',
+        colorSecondary: '#000',
+        logoMerchant: 'logoMerchant',
+        type: 'credit-card',
+        translations: translations
+      }));
+    });
+    it('Should render the bank card template', function () {
+      assert.strictEqual(wrapper.hasClass(classes.bankCard), true);
+      assert.strictEqual(wrapper.find('span').at(1).hasClass(classes.stripeTopRight), true);
+      assert.strictEqual(wrapper.find('span').find('img').hasClass(classes.logoRight), true);
+      assert.strictEqual(wrapper.find('div').at(2).hasClass(classes.cardNumberLabel), true);
+      assert.strictEqual(wrapper.find('div').at(5).hasClass(classes.validThru), true);
+    });
+  });
+  describe('Should render default card template', function () {
+    var wrapper;
+    before(function () {
+      wrapper = shallow(React.createElement(HiPaymentMeans, {
+        logo: '/static/hmu/images/payment-means/sans_logo full.svg',
+        type: 'wrongType',
+        translations: translations
+      }));
+    });
+    it('Should render default card template with just the logo', function () {
+      assert.strictEqual(wrapper.hasClass(classes.bankCard), true);
+      assert.strictEqual(wrapper.find('span').at(1).hasClass(classes.stripeTopRight), true);
+      assert.strictEqual(wrapper.find('span').find('img').hasClass(classes.logoRight), true);
+      assert.strictEqual(wrapper.find('div').at(2).hasClass(classes.cardNumberLabel), false);
+      assert.strictEqual(wrapper.find('div').at(5).exists(), false);
+    });
+  });
+  describe('Should render gift card template', function () {
+    var wrapper;
+    before(function () {
+      wrapper = shallow(React.createElement(HiPaymentMeans, {
+        logo: '/static/hmu/images/payment-means/sans_logo full.svg',
+        logoMerchant: '/static/hmu/images/payment-means/sans_logo full.svg',
+        type: 'prepaid-card',
+        translations: translations
+      }));
+    });
+    it('Should render default gift template with the logo merchant', function () {
+      assert.strictEqual(wrapper.hasClass(classes.bankCard), true);
+      assert.strictEqual(wrapper.find('span').at(0).find('img').hasClass(classes.logoRight), true);
+      assert.strictEqual(wrapper.find('span').at(1).hasClass(classes.stripeTopRight), true);
+      assert.strictEqual(wrapper.find('span').at(1).find('img').hasClass(classes.logoMerchant), true);
+    });
+  });
+  describe('Should render sepa card template', function () {
+    var wrapper;
+    before(function () {
+      wrapper = shallow(React.createElement(HiPaymentMeans, {
+        logo: '/static/hmu/images/payment-means/sans_logo full.svg',
+        cardNumber: '652568248',
+        bic: 'QJFOQJOIZEI',
+        type: 'credit-consumption',
+        creditDebit: translations.creditDebit,
+        translations: translations
+      }));
+    });
+    it('Should render sepa card template with iban, bic and debit label', function () {
+      assert.strictEqual(wrapper.hasClass(classes.sepa), true, '1');
+      assert.strictEqual(wrapper.find('span').at(1).hasClass(classes.stripeTopLeft), true, '2');
+      assert.strictEqual(wrapper.find('span').find('img').hasClass(classes.logoLeft), true, '3');
+      assert.strictEqual(wrapper.find('div').at(1).hasClass(classes.ibanLabel), true, '4');
+      assert.strictEqual(wrapper.find('div').at(3).hasClass(classes.userNameSepa), true, '5');
+      assert.strictEqual(wrapper.find('div').at(4).text(), 'CREDIT', '6');
+    });
+  });
+  describe('Should render corporate card template', function () {
+    var wrapper;
+    before(function () {
+      wrapper = shallow(React.createElement(HiPaymentMeans, {
+        logo: '/static/hmu/images/payment-means/sans_logo full.svg',
+        type: 'corporate',
+        cardNumber: '6536587525',
+        cardUser: 'Joe Quaie',
+        businessName: 'Canne à son',
+        translations: translations,
+        yearMember: '2000',
+        cardValidity: '12/20'
+      }));
+    });
+    it('Should render corporate card template with all infos', function () {
+      assert.strictEqual(wrapper.hasClass(classes.bankCard), true, '1');
+      assert.strictEqual(wrapper.find('span').at(1).hasClass(classes.stripeTopRight), true, '2');
+      assert.strictEqual(wrapper.find('span').find('img').hasClass(classes.logoRight), true, '3');
+      assert.strictEqual(wrapper.find('span').find('div').text(), 'CORPORATE', '3');
+      assert.strictEqual(wrapper.find('div').at(2).hasClass(classes.corporateNumberLabel), true, '4');
+      assert.strictEqual(wrapper.find('div').at(4).hasClass(classes.memberSince), true, '5');
+      assert.strictEqual(wrapper.find('div').at(7).hasClass(classes.validThru), true, '6');
+      assert.strictEqual(wrapper.find('div').at(8).text(), 'Joe Quaie', '7');
+      assert.strictEqual(wrapper.find('div').at(9).text(), 'Canne à son', '8');
+    });
+  });
+  describe('Should render wallet card template', function () {
+    var wrapper;
+    before(function () {
+      wrapper = shallow(React.createElement(HiPaymentMeans, {
+        logo: '/static/hmu/images/payment-means/sans_logo full.svg',
+        type: 'ewallet',
+        cardUser: 'Sarah Courssi',
+        cardUserGender: 'F',
+        translations: translations
+      }));
+    });
+    it('Should render wallet card template with user and logo', function () {
+      assert.strictEqual(wrapper.hasClass(classes.walletShadow), true, '1');
+      assert.strictEqual(wrapper.find('div').at(1).hasClass(classes.wallet), true, '2');
+      assert.strictEqual(wrapper.find('div').at(2).text(), 'Mrs Sarah Courssi', '3');
+      assert.strictEqual(wrapper.find('div').find('span').find('img').hasClass(classes.logoLeft), true, '4');
+    });
+  });
+});

package/HiPaymentMeans/index.js

@@ -1,15 +1 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function get() {
-    return _HiPaymentMeans.default;
-  }
-});
-
-var _HiPaymentMeans = _interopRequireDefault(require("./HiPaymentMeans"));
+export { default } from './HiPaymentMeans';