@itilite/iui-user-management 1.5.0-beta-4 → 1.5.0-beta-5

package/dist/index.modern.js

@@ -2,7 +2,7 @@ import { IUIAsyncSelect, IUIBox, IUILabel, IUIFileUpload, IUICheckboxButton, IUI
 import React, { useState, useEffect, Fragment as Fragment$1, memo, useRef } from 'react';
 import { configs, services, utilUrls } from '@itilite/utils';
 import axios from 'axios';
-import { IconButton, Menu, MenuItem, Popper, Grow, Paper, ClickAwayListener, MenuList, Typography, Box } from '@material-ui/core';
+import { Tooltip, IconButton, Menu, MenuItem, Popper, Grow, Paper, ClickAwayListener, MenuList, Typography, Box } from '@material-ui/core';
 import { useDispatch, useSelector, Provider } from 'react-redux';
 import { combineReducers, createStore, applyMiddleware } from 'redux';
 import thunk from 'redux-thunk';
@@ -10,7 +10,7 @@ import moment from 'moment';
 import { composeWithDevTools } from 'redux-devtools-extension';
 import { useParams, useHistory, useLocation } from 'react-router-dom';
 import { withStyles, makeStyles } from '@material-ui/core/styles';
-import Tooltip from '@material-ui/core/Tooltip';
+import Tooltip$1 from '@material-ui/core/Tooltip';
 import Switch from '@material-ui/core/Switch';
 import MoreHorizIcon from '@material-ui/icons/MoreHoriz';
 import Button from '@material-ui/core/Button';
@@ -842,7 +842,7 @@ var UserRole = function UserRole(_ref) {
 
 var styles$1 = {"defaultLabel":"_smjc4","card":"_3_S9J","cardNumber":"_36E9M","cardDigit":"_2pm-T","expiryDate":"_2tBnF","cardImage":"_3QvZh","visa":"_1IpBm","mastercard":"_2x6IX","amex":"_2a38S","discover":"_2vksl","diners":"_2kQRs","jcb":"_2bO1f","unionpay":"_2_jfu","is_nothing":"_1Lrzs","addCard":"_3711U","cardDeleteBtn":"_7Da2t","cardLabel":"_PQTex","defaultBtn":"_1_ArA","cursonPointer":"_1L115","sectionWrapper":"_VpUCK","margin":"_1Fs_D","minGridWidth":"_1hl-Z","firstRowMargin":"_1WZZj","firstChildMargin":"_IT_O_","paddingTop":"_Mhnl7","dividerColor":"_3ltFd"};
 
-var classes = {"disabledCard":"_3MVKj","expiredLabel":"_2_sgJ","expiresoonLabel":"_3G7La","sectionHeader":"_2d_OH","myCardsSection":"_3MNHj","companyCardsSection":"_34lN6","disabledNotice":"_1yV0j","cardsGrid":"_1oHGu","card":"_3ZTQc","moreIcon":"_3utA0","personal":"_duePd","corporate":"_3O33a","company":"_180_L","cardHeader":"_1eF61","cardTitleSection":"_2c40W","cardMaskedNumber":"_2Vlhq","cardName":"_bp-Mt","cardAlias":"_19m4v","cardType":"_3l4HZ","menuButton":"_3TTEn","lockIcon":"_1S27X","cardDetails":"_IP2rg","cardNumber":"_7FOPe","cardExpiry":"_CI_p2","cardCvv":"_3Gzqu","cardUnhide":"_ivgBf","cardFooter":"_1WgPL","brandLogo":"_EV0l8","addCardButton":"_1oaCc","plusIcon":"_w9L5L"};
+var classes = {"disabledCard":"_3MVKj","expiredLabel":"_2_sgJ","invalidLabel":"_1Oqzs","expiresoonLabel":"_3G7La","sectionHeader":"_2d_OH","myCardsSection":"_3MNHj","companyCardsSection":"_34lN6","disabledNotice":"_1yV0j","cardsGrid":"_1oHGu","card":"_3ZTQc","moreIcon":"_3utA0","personal":"_duePd","corporate":"_3O33a","company":"_180_L","cardHeader":"_1eF61","cardTitleSection":"_2c40W","cardMaskedNumber":"_2Vlhq","cardName":"_bp-Mt","cardAlias":"_19m4v","cardType":"_3l4HZ","menuButton":"_3TTEn","lockIcon":"_1S27X","cardDetails":"_IP2rg","cardNumber":"_7FOPe","cardExpiry":"_CI_p2","cardCvv":"_3Gzqu","cardUnhide":"_ivgBf","cardFooter":"_1WgPL","brandLogo":"_EV0l8","addCardButton":"_1oaCc","plusIcon":"_w9L5L"};
 
 var SHOW_LOADER = 'SHOW_LOADER';
 var STOP_LOADER = 'STOP_LOADER';
@@ -2663,6 +2663,12 @@ var Visa = function Visa(props) {
   }))));
 };
 
+var CARDS_DISABLED = {
+  DISABLED: '0',
+  EXPIRED: '2',
+  INVALID: '3'
+};
+
 var IUILocalStorageService$3 = services.IUILocalStorageService;
 var env$3 = configs.env,
   paymentApi$1 = configs.paymentApi;
@@ -2837,14 +2843,20 @@ var CardsManagement = function CardsManagement(_ref) {
     var isCompanyCard = (card === null || card === void 0 ? void 0 : card.category) === 'Company';
     var cardClass = getCardTypeClass(card === null || card === void 0 ? void 0 : card.category);
     var isDefaultCard = !!+(card === null || card === void 0 ? void 0 : (_card$metadata = card.metadata) === null || _card$metadata === void 0 ? void 0 : _card$metadata.default_card);
-    var isExpired = card.metadata.is_enabled === '2';
-    var isDisabled = card.metadata.is_enabled === '0' || isExpired;
+    var isExpired = card.metadata.is_enabled === CARDS_DISABLED.EXPIRED;
+    var isInvalid = card.metadata.is_enabled === CARDS_DISABLED.INVALID;
+    var isDisabled = card.metadata.is_enabled === CARDS_DISABLED.DISABLED || isExpired || isInvalid;
     var currentDate = new Date();
     var cardExpDate = new Date(parseInt(card.card.exp_year, 10), parseInt(card.card.exp_month, 10) - 1);
     var timeDiff = cardExpDate.getTime() - currentDate.getTime();
     var daysToExpire = Math.ceil(timeDiff / (1000 * 3600 * 24));
     var expiresSoon = daysToExpire <= 30 && !isExpired;
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React.createElement(Tooltip, {
+      title: isInvalid ? 'This card is invalid, because you have been issued a new card.' : null,
+      disableHoverListener: !isInvalid,
+      placement: "top",
+      arrow: true
+    }, /*#__PURE__*/React.createElement("div", {
       key: card.id,
       className: clsx(classes.card, classes[cardClass], (_clsx = {}, _clsx[classes.disabledCard] = isDisabled, _clsx))
     }, /*#__PURE__*/React.createElement("div", {
@@ -2857,7 +2869,9 @@ var CardsManagement = function CardsManagement(_ref) {
       className: classes.cardAlias
     }, card === null || card === void 0 ? void 0 : card.alias), isExpired && /*#__PURE__*/React.createElement("span", {
       className: classes.expiredLabel
-    }, "Expired"), expiresSoon && /*#__PURE__*/React.createElement("span", {
+    }, "Expired"), isInvalid && /*#__PURE__*/React.createElement("span", {
+      className: classes.invalidLabel
+    }, "Invalid"), expiresSoon && !isInvalid && /*#__PURE__*/React.createElement("span", {
       className: clsx(classes.expiresoonLabel, classes.expiredLabel)
     }, "Expires Soon")), /*#__PURE__*/React.createElement("span", {
       className: classes.cardType
@@ -2884,7 +2898,7 @@ var CardsManagement = function CardsManagement(_ref) {
       className: classes.cardCvv
     }, "CVV \u2022\u2022\u2022")), /*#__PURE__*/React.createElement("div", {
       className: classes.cardFooter
-    }, /*#__PURE__*/React.createElement("div", null), getBrandLogo(card === null || card === void 0 ? void 0 : (_card$card4 = card.card) === null || _card$card4 === void 0 ? void 0 : _card$card4.brand)));
+    }, /*#__PURE__*/React.createElement("div", null), getBrandLogo(card === null || card === void 0 ? void 0 : (_card$card4 = card.card) === null || _card$card4 === void 0 ? void 0 : _card$card4.brand))));
   };
   var _url = env$3.getPaymentUrl() + ("/api/v1/auth/" + IUILocalStorageService$3.getAccessToken() + "/1/" + pg.entity_id + "/0/" + pg.vendor_id + "/1");
   var showMenuButton = cardsCount === 1 || cardsCount > 1 && !+(selectedCard === null || selectedCard === void 0 ? void 0 : (_selectedCard$metadat = selectedCard.metadata) === null || _selectedCard$metadat === void 0 ? void 0 : _selectedCard$metadat.default_card);
@@ -2969,7 +2983,7 @@ var CardsManagement = function CardsManagement(_ref) {
       vertical: 'top',
       horizontal: 'right'
     }
-  }, selectedCard && selectedCard.metadata.is_enabled !== '2' && !+selectedCard.metadata.default_card && /*#__PURE__*/React.createElement(MenuItem, {
+  }, selectedCard && selectedCard.metadata.is_enabled !== CARDS_DISABLED.DISABLED && selectedCard.metadata.is_enabled !== CARDS_DISABLED.EXPIRED && selectedCard.metadata.is_enabled !== CARDS_DISABLED.INVALID && !+selectedCard.metadata.default_card && /*#__PURE__*/React.createElement(MenuItem, {
     onClick: handleMarkAsDefault
   }, "Mark as default"), showMenuButton && /*#__PURE__*/React.createElement(MenuItem, {
     onClick: handleDeleteCard,
@@ -10340,7 +10354,7 @@ var StickyHeadTable = function StickyHeadTable(props) {
       return /*#__PURE__*/React.createElement(IUIBox, {
         component: "div",
         width: 80
-      }, row && row.has_visited === 0 ? /*#__PURE__*/React.createElement(Tooltip, {
+      }, row && row.has_visited === 0 ? /*#__PURE__*/React.createElement(Tooltip$1, {
         title: "This user hasn't logged in to the platform yet",
         arrow: true,
         classes: {