tg-core-components 6.1.9-intl-test.0 → 6.2.0-alpha.0

package/lib/widgets/BonusOffers/Actions.js

@@ -0,0 +1,182 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _extends = Object.assign || 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; };
+
+var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
+
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _Button = require('../../components/Button');
+
+var _Button2 = _interopRequireDefault(_Button);
+
+var _reactIntl = require('react-intl');
+
+var _classnames = require('classnames');
+
+var _classnames2 = _interopRequireDefault(_classnames);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
+
+function _asyncToGenerator(fn) { return function () { var gen = fn.apply(this, arguments); return new Promise(function (resolve, reject) { function step(key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { return Promise.resolve(value).then(function (value) { step("next", value); }, function (err) { step("throw", err); }); } } return step("next"); }); }; }
+
+var Actions = function Actions(_ref) {
+  var bonus = _ref.bonus,
+      onClaim = _ref.onClaim,
+      onCancel = _ref.onCancel,
+      onReject = _ref.onReject,
+      onTriggerByPromoCode = _ref.onTriggerByPromoCode,
+      status = _ref.status,
+      promotionCode = _ref.promotionCode,
+      onOther = _ref.onOther,
+      onSuccess = _ref.onSuccess;
+
+  var _useState = (0, _react.useState)([{
+    conditions: status === 'active' || bonus.State === 'PreWager',
+    onClick: onOther,
+    isLoading: false,
+    disabled: false,
+    type: 'primary',
+    translation: 'action.other-bonus',
+    name: 'other',
+    args: [bonus, promotionCode]
+  }, {
+    conditions: bonus.State === 'Initiated',
+    onClick: onClaim,
+    isLoading: false,
+    disabled: false,
+    type: 'primary',
+    translation: 'action.claim',
+    name: 'claim',
+    args: [bonus]
+  }, {
+    conditions: status === 'available' && bonus.State !== 'Initiated' && bonus.State !== 'PreWager' && promotionCode,
+    onClick: onTriggerByPromoCode,
+    isLoading: false,
+    isDisabled: false,
+    type: 'primary',
+    translation: 'action.claim',
+    name: 'trigger',
+    args: [promotionCode]
+  }, {
+    conditions: bonus.State === 'Initiated',
+    onClick: onReject,
+    isLoading: false,
+    disabled: false,
+    type: 'tertiary',
+    translation: 'action.reject',
+    name: 'reject',
+    args: [bonus]
+  }, {
+    conditions: status === 'active',
+    onClick: onCancel,
+    isLoading: false,
+    disabled: false,
+    type: 'tertiary',
+    translation: 'action.cancel',
+    name: 'cancel',
+    args: [bonus.Id]
+  }]),
+      _useState2 = _slicedToArray(_useState, 2),
+      buttons = _useState2[0],
+      setButtons = _useState2[1];
+
+  var actionWrapper = function () {
+    var _ref2 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(action, name) {
+      for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+        args[_key - 2] = arguments[_key];
+      }
+
+      var res;
+      return regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              setButtons([].concat(_toConsumableArray(buttons.map(function (b) {
+                if (b.name === name) {
+                  return _extends({}, b, {
+                    isLoading: true,
+                    disabled: true
+                  });
+                }
+
+                return b;
+              }))));
+
+              _context.next = 3;
+              return action.apply(undefined, _toConsumableArray(args));
+
+            case 3:
+              res = _context.sent;
+
+
+              if (res && res.payload && res.payload.isNetworkException || res && res.payload && res.payload === 0) {
+                setButtons([].concat(_toConsumableArray(buttons.map(function (b) {
+                  if (b.name === name) {
+                    return _extends({}, b, {
+                      isLoading: false,
+                      disabled: false
+                    });
+                  }
+
+                  return b;
+                }))));
+              } else {
+                onSuccess();
+
+                setButtons([].concat(_toConsumableArray(buttons.map(function (b) {
+                  if (b.name === name) {
+                    return _extends({}, b, {
+                      isLoading: false,
+                      disabled: true
+                    });
+                  }
+
+                  return b;
+                }))));
+              }
+
+            case 5:
+            case 'end':
+              return _context.stop();
+          }
+        }
+      }, _callee, undefined);
+    }));
+
+    return function actionWrapper(_x, _x2) {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+
+  return _react2.default.createElement(
+    'div',
+    { className: 'Actions' },
+    buttons && buttons.filter(function (b) {
+      return b.conditions;
+    }).map(function (b) {
+      return _react2.default.createElement(
+        _Button2.default,
+        {
+          key: b.name,
+          isLoading: b.isLoading,
+          disabled: b.disabled,
+          className: (0, _classnames2.default)('button small', b.type),
+          onClick: function onClick() {
+            return actionWrapper.apply(undefined, [b.onClick, b.name].concat(_toConsumableArray(b.args)));
+          } },
+        _react2.default.createElement(_reactIntl.FormattedMessage, { id: b.translation })
+      );
+    })
+  );
+};
+
+exports.default = Actions;

package/lib/widgets/BonusOffers/BonusCode.js

@@ -0,0 +1,85 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
+
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _reactIntl = require('react-intl');
+
+var _classnames = require('classnames');
+
+var _classnames2 = _interopRequireDefault(_classnames);
+
+var _Input = require('../../components/Input');
+
+var _Input2 = _interopRequireDefault(_Input);
+
+var _Button = require('../../components/Button');
+
+var _Button2 = _interopRequireDefault(_Button);
+
+var _Icon = require('../../components/Icon');
+
+var _Icon2 = _interopRequireDefault(_Icon);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var BonusCode = function BonusCode(_ref) {
+  var _onSubmit = _ref.onSubmit,
+      intl = _ref.intl;
+
+  var _useState = (0, _react.useState)(''),
+      _useState2 = _slicedToArray(_useState, 2),
+      bonusCode = _useState2[0],
+      setBonusCode = _useState2[1];
+
+  var _useState3 = (0, _react.useState)(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      showInput = _useState4[0],
+      setShowInput = _useState4[1];
+
+  return _react2.default.createElement(
+    'div',
+    { className: (0, _classnames2.default)('BonusCode', { 'BonusCode--active': showInput }) },
+    _react2.default.createElement(
+      'span',
+      { onClick: function onClick() {
+          return setShowInput(!showInput);
+        } },
+      _react2.default.createElement(_reactIntl.FormattedMessage, {
+        id: 'message.have_bonus_code',
+        defaultMessage: 'Do you have a bonus code?'
+      })
+    ),
+    showInput && _react2.default.createElement(
+      'form',
+      {
+        onSubmit: function onSubmit(e) {
+          e.preventDefault();
+          _onSubmit(bonusCode);
+        } },
+      _react2.default.createElement(_Input2.default, {
+        onChange: function onChange(e) {
+          return setBonusCode(e.target.value);
+        },
+        placeholder: intl.formatMessage({ id: 'cashier.bonus_code' })
+      }),
+      _react2.default.createElement(
+        _Button2.default,
+        {
+          className: 'button secondary',
+          type: 'submit',
+          disabled: bonusCode.trim() === '' },
+        _react2.default.createElement(_Icon2.default, { icon: 'chevron-right' })
+      )
+    )
+  );
+};
+
+exports.default = (0, _reactIntl.injectIntl)(BonusCode);

package/lib/widgets/BonusOffers/Details.js

@@ -0,0 +1,157 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _marked = require('marked');
+
+var _marked2 = _interopRequireDefault(_marked);
+
+var _Icon = require('../../components/Icon');
+
+var _Icon2 = _interopRequireDefault(_Icon);
+
+var _Notice = require('../CashierAccordion/Payment/Notice');
+
+var _Notice2 = _interopRequireDefault(_Notice);
+
+var _get = require('lodash/get');
+
+var _get2 = _interopRequireDefault(_get);
+
+var _Actions = require('./Actions');
+
+var _Actions2 = _interopRequireDefault(_Actions);
+
+var _selectUnit = require('../../lib/utils/selectUnit');
+
+var _reactIntl = require('react-intl');
+
+var _Translate = require('../../components/Translate');
+
+var _Translate2 = _interopRequireDefault(_Translate);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var Details = function Details(_ref) {
+  var bonus = _ref.bonus,
+      content = _ref.content,
+      defaultImage = _ref.defaultImage,
+      status = _ref.status,
+      wageringProgress = _ref.wageringProgress,
+      onBack = _ref.onBack,
+      onClaim = _ref.onClaim,
+      onReject = _ref.onReject,
+      onTriggerByPromoCode = _ref.onTriggerByPromoCode,
+      selectBonus = _ref.selectBonus,
+      alert = _ref.alert;
+
+  return _react2.default.createElement(
+    'div',
+    { className: 'Details' },
+    _react2.default.createElement(
+      'div',
+      {
+        className: 'Details__banner',
+        style: {
+          backgroundImage: 'url(' + (0, _get2.default)(content, 'image.file.url', defaultImage) + ')'
+        } },
+      _react2.default.createElement(
+        'div',
+        { className: 'Details__banner__back', onClick: onBack },
+        _react2.default.createElement(_Icon2.default, { icon: 'chevron-left' }),
+        _react2.default.createElement(_Translate2.default, { id: 'action.back', defaultMessage: 'Back' })
+      )
+    ),
+    _react2.default.createElement(
+      'div',
+      { className: 'Details__content' },
+      alert && _react2.default.createElement(_Notice2.default, {
+        level: alert.level,
+        icon: alert.level === 'success' ? _react2.default.createElement(_Icon2.default, { icon: 'check' }) : _react2.default.createElement(_Icon2.default, { icon: 'stop-circle' }),
+        header: _react2.default.createElement(_Translate2.default, { id: 'label.bonus-offers.' + alert.type })
+      }),
+      _react2.default.createElement(
+        'div',
+        { className: 'Details__content__name' },
+        (0, _get2.default)(content, 'name') || bonus.Name
+      ),
+      _react2.default.createElement(
+        'div',
+        { className: 'Details__content__summary' },
+        (0, _get2.default)(content, 'summary') || bonus.Description
+      ),
+      _react2.default.createElement(_Actions2.default, {
+        bonus: bonus,
+        onClaim: onClaim,
+        onReject: onReject,
+        onTriggerByPromoCode: onTriggerByPromoCode,
+        status: status,
+        promotionCode: (0, _get2.default)(content, 'promotionCode'),
+        onSuccess: function onSuccess() {
+          return selectBonus(null);
+        }
+      }),
+      _react2.default.createElement(
+        'div',
+        { className: 'Details__content__statistics' },
+        _react2.default.createElement(
+          'ul',
+          null,
+          wageringProgress && _react2.default.createElement(
+            'li',
+            null,
+            status === 'available' ? _react2.default.createElement(_Translate2.default, {
+              id: 'label.bonus-offers.prewager',
+              defaultMessage: 'Progress'
+            }) : _react2.default.createElement(_Translate2.default, {
+              id: 'label.bonus-offers.wager',
+              defaultMessage: 'Progress'
+            }),
+            _react2.default.createElement(
+              'span',
+              null,
+              wageringProgress,
+              '%'
+            )
+          ),
+          _react2.default.createElement(
+            'li',
+            null,
+            _react2.default.createElement(_Translate2.default, { id: 'label.expires.bonus', defaultMessage: 'Expires' }),
+            _react2.default.createElement(_reactIntl.FormattedRelativeTime, (0, _selectUnit.selectUnit)(new Date(bonus.Expires + '+00:00'), true))
+          ),
+          bonus.Amount > 0 && _react2.default.createElement(
+            'li',
+            null,
+            _react2.default.createElement(_Translate2.default, { id: 'label.amount', defaultMessage: 'Amount' }),
+            _react2.default.createElement(_reactIntl.FormattedNumber, {
+              value: bonus.Amount,
+              style: bonus.Type === 'Freespins' ? 'decimal' : 'currency',
+              currency: bonus.Currency
+            })
+          )
+        )
+      ),
+      _react2.default.createElement('div', {
+        className: 'Details__content__description',
+        dangerouslySetInnerHTML: {
+          __html: (0, _marked2.default)((0, _get2.default)(content, 'content') || '')
+        }
+      }),
+      _react2.default.createElement('div', {
+        className: 'Details__content__tac',
+        dangerouslySetInnerHTML: {
+          __html: (0, _marked2.default)((0, _get2.default)(content, 'termsAndConditions') || '')
+        }
+      })
+    )
+  );
+};
+
+exports.default = Details;

package/lib/widgets/BonusOffers/Finished.js

@@ -0,0 +1,31 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _BonusWidget = require('../BonusWidget');
+
+var _BonusWidget2 = _interopRequireDefault(_BonusWidget);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var Finished = function Finished(_ref) {
+  var bonuses = _ref.bonuses;
+
+  return _react2.default.createElement(
+    'div',
+    { className: 'Finished' },
+    _react2.default.createElement(_BonusWidget2.default, {
+      bonuses: bonuses,
+      exclude: ['available', 'active'],
+      disableBonusCodeForm: true
+    })
+  );
+};
+
+exports.default = Finished;

package/lib/widgets/BonusOffers/List.js

@@ -0,0 +1,104 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _marked = require('marked');
+
+var _marked2 = _interopRequireDefault(_marked);
+
+var _get = require('lodash/get');
+
+var _get2 = _interopRequireDefault(_get);
+
+var _reactIntl = require('react-intl');
+
+var _AccordionWidget = require('../AccordionWidget');
+
+var _AccordionWidget2 = _interopRequireDefault(_AccordionWidget);
+
+var _bonus = require('../../lib/utils/bonus');
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var Item = function Item(_ref) {
+  var bonus = _ref.bonus,
+      content = _ref.content,
+      status = _ref.status,
+      defaultImage = _ref.defaultImage;
+  return _react2.default.createElement(
+    'div',
+    { className: 'List__Item' },
+    _react2.default.createElement(
+      'div',
+      {
+        className: 'List__Item__image',
+        style: {
+          backgroundImage: 'url(' + (0, _get2.default)(content, 'image.file.url', defaultImage) + ')'
+        } },
+      status === 'active' && _react2.default.createElement(
+        'span',
+        { className: 'List__Item__image__badge' },
+        _react2.default.createElement(_reactIntl.FormattedMessage, { id: 'label.' + bonus.State.toLowerCase() })
+      )
+    ),
+    _react2.default.createElement(
+      'div',
+      { className: 'List__Item__content' },
+      _react2.default.createElement(
+        'div',
+        { className: 'List__Item__content__name' },
+        (0, _get2.default)(content, 'name') || bonus.Name
+      ),
+      _react2.default.createElement(
+        'div',
+        { className: 'List__Item__content__summary' },
+        (0, _get2.default)(content, 'summary') || bonus.Description
+      ),
+      _react2.default.createElement('div', {
+        className: 'List__Item__content__disclaimer',
+        dangerouslySetInnerHTML: {
+          __html: (0, _marked2.default)((0, _get2.default)(content, 'disclaimer') || '')
+        }
+      })
+    )
+  );
+};
+
+var List = function List(_ref2) {
+  var bonuses = _ref2.bonuses,
+      content = _ref2.content,
+      defaultImage = _ref2.defaultImage,
+      selectBonus = _ref2.selectBonus;
+
+  return _react2.default.createElement(
+    'div',
+    { className: 'List' },
+    _react2.default.createElement(_AccordionWidget2.default, {
+      onClickHeader: function onClickHeader(e, key, item) {
+        return selectBonus(item.item);
+      },
+      items: bonuses.map(function (b, i) {
+        return {
+          customClass: (0, _bonus.getStatus)(b),
+          item: b,
+          header: _react2.default.createElement(Item, {
+            bonus: b,
+            status: (0, _bonus.getStatus)(b),
+            content: content.find(function (c) {
+              return c.identifier === b.Identifier;
+            }),
+            defaultImage: defaultImage
+          })
+        };
+      })
+    })
+  );
+};
+
+exports.default = List;

package/lib/widgets/BonusOffers/Overview.js

@@ -0,0 +1,77 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _reactIntl = require('react-intl');
+
+var _Icon = require('../../components/Icon');
+
+var _Icon2 = _interopRequireDefault(_Icon);
+
+var _Notice = require('../CashierAccordion/Payment/Notice');
+
+var _Notice2 = _interopRequireDefault(_Notice);
+
+var _List = require('./List.js');
+
+var _List2 = _interopRequireDefault(_List);
+
+var _BonusCode = require('./BonusCode.js');
+
+var _BonusCode2 = _interopRequireDefault(_BonusCode);
+
+var _Finished = require('./Finished');
+
+var _Finished2 = _interopRequireDefault(_Finished);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
+
+var Overview = function Overview(_ref) {
+  var bonuses = _ref.bonuses,
+      content = _ref.content,
+      defaultImage = _ref.defaultImage,
+      selectBonus = _ref.selectBonus,
+      onPreClaim = _ref.onPreClaim,
+      alert = _ref.alert;
+
+  var availableBonuses = [].concat(_toConsumableArray(bonuses.active), _toConsumableArray(bonuses.available));
+  var finishedBonuses = bonuses.finished;
+
+  return _react2.default.createElement(
+    'div',
+    { className: 'Overview' },
+    alert && _react2.default.createElement(_Notice2.default, {
+      level: alert.level,
+      icon: alert.level === 'success' ? _react2.default.createElement(_Icon2.default, { icon: 'check' }) : _react2.default.createElement(_Icon2.default, { icon: 'stop-circle' }),
+      header: _react2.default.createElement(_reactIntl.FormattedMessage, { id: 'label.bonus-offers.' + alert.type })
+    }),
+    _react2.default.createElement(_reactIntl.FormattedMessage, {
+      id: 'label.bonus-offers.overview-title',
+      defaultMessage: 'My Offers',
+      tagName: 'h3'
+    }),
+    availableBonuses.length === 0 && _react2.default.createElement(_reactIntl.FormattedMessage, {
+      id: 'label.bonus-offers.overview-no-offers',
+      defaultMessage: 'No bonus offers available...',
+      tagName: 'p'
+    }),
+    availableBonuses.length > 0 && _react2.default.createElement(_List2.default, {
+      bonuses: availableBonuses,
+      content: content,
+      defaultImage: defaultImage,
+      selectBonus: selectBonus
+    }),
+    _react2.default.createElement(_BonusCode2.default, { onSubmit: onPreClaim }),
+    finishedBonuses.length > 0 && _react2.default.createElement(_Finished2.default, { bonuses: finishedBonuses })
+  );
+};
+
+exports.default = Overview;