@stssocialst-stp/fe-payroll 0.3.5 → 0.3.6

package/dist/index.es.js

@@ -1,11 +1,11 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import React, { useState, useRef, useEffect, forwardRef } from 'react';
+import React, { useState, useRef, useEffect, forwardRef, useCallback } from 'react';
 import { PinDrop } from '@material-ui/icons';
 import MonetizationOnIcon from '@material-ui/icons/MonetizationOn';
 import { dispatchMutationResp, dispatchMutationErr, dispatchMutationReq, formatServerError, formatGraphQLError, parseData, pageInfo, decodeId, formatPageQueryWithCount, graphql, formatQuery, formatGQLString, formatMutation, withModulesManager, PublishedComponent, TextInput, FormPanel, useModulesManager, useHistory, useTranslations, journalize, Form, coreConfirm, clearConfirm, ControlledField, Searcher, Helmet, withTooltip, CustomFilterFieldStatusPicker, CustomFilterTypeStatusPicker, NumberInput, SelectInput, formatMessage as formatMessage$1, fetchCustomFilter, ConstantBasedPicker, FormattedMessage, apiHeaders, baseApiUrl, createFieldsBasedOnJSON, renderInputComponent, Contributions, useGraphqlQuery, Autocomplete } from '@stssocialst-stp/fe-core';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import { bindActionCreators } from 'redux';
-import { connect, useSelector } from 'react-redux';
+import { connect, useSelector, useDispatch } from 'react-redux';
 import { makeStyles } from '@material-ui/styles';
 import DeleteIcon from '@material-ui/icons/Delete';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
@@ -15,7 +15,7 @@ import _possibleConstructorReturn from '@babel/runtime/helpers/possibleConstruct
 import _getPrototypeOf from '@babel/runtime/helpers/getPrototypeOf';
 import _inherits from '@babel/runtime/helpers/inherits';
 import { injectIntl } from 'react-intl';
-import { Grid, FormControlLabel, Checkbox, Tooltip, IconButton, Fab, Divider, Typography, Input, Modal, Backdrop, Fade, Box, Button as Button$1, Paper, TextField, Tab, LinearProgress as LinearProgress$1 } from '@material-ui/core';
+import { Grid, FormControlLabel, Checkbox, Tooltip, IconButton, Fab, Divider, Typography, Input, Modal, Backdrop, Fade, Box, Button as Button$1, Paper, LinearProgress, TextField, Tab } from '@material-ui/core';
 import { withTheme, withStyles } from '@material-ui/core/styles';
 import AddIcon from '@material-ui/icons/Add';
 import VisibilityIcon from '@material-ui/icons/Visibility';
@@ -34,7 +34,7 @@ import { useReactToPrint } from 'react-to-print';
 import PrintIcon from '@material-ui/icons/Print';
 import DialogContentText from '@material-ui/core/DialogContentText';
 import PhotoCameraOutlinedIcon from '@material-ui/icons/PhotoCameraOutlined';
-import LinearProgress from '@material-ui/core/LinearProgress';
+import LinearProgress$1 from '@material-ui/core/LinearProgress';
 import DownloadIcon from '@material-ui/icons/CloudDownload';
 import Chip from '@material-ui/core/Chip';
 import Paper$1 from '@material-ui/core/Paper';
@@ -718,7 +718,12 @@ var messages_en = {
 	"payroll.bistp.status.pending": "Sent to Bank",
 	"payroll.bistp.status.skippedNib": "No NIB",
 	"payroll.bistp.status.sendFailed": "Send Failed",
+	"payroll.bistp.status.enviados": "Sent to BISTP",
 	"payroll.bistp.progress": "BISTP Progress",
+	"payroll.async.generating": "Generating beneficiaries in background...",
+	"payroll.async.createdSoFar": "{benefitCount} created so far",
+	"payroll.async.note": "This process may take a few minutes. You can close this page - the process continues in the background.",
+	"payroll.async.timedOut": "The background generation process took too long. Please refresh this page to check the current status.",
 	"payroll.route.beneficiariesManagement": "Beneficiary Management",
 	"payroll.beneficiaries.management.title": "Beneficiary Management",
 	"payroll.beneficiaries.management.noPermission": "You do not have permission to manage beneficiaries.",
@@ -3167,6 +3172,99 @@ var mapDispatchToProps$b = function mapDispatchToProps(dispatch) {
 };
 var PaymentApproveForPaymentSummary = connect(mapStateToProps$b, mapDispatchToProps$b)(PaymentApproveForPaymentDialog);
 
+var POLL_INTERVAL_MS = 5000;
+var TIMEOUT_MS = 600000;
+var COUNT_QUERY = function COUNT_QUERY(payrollUuid) {
+  return "\n  {\n    benefitConsumptionByPayroll(payrollUuid: \"".concat(payrollUuid, "\", first: 0, isDeleted: false) {\n      totalCount\n    }\n  }\n");
+};
+function useAsyncPayrollProgress(_ref) {
+  var payrollUuid = _ref.payrollUuid,
+    payrollStatus = _ref.payrollStatus;
+  var dispatch = useDispatch();
+  var _useState = useState(0),
+    _useState2 = _slicedToArray(_useState, 2),
+    benefitCount = _useState2[0],
+    setBenefitCount = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    isGenerating = _useState4[0],
+    setIsGenerating = _useState4[1];
+  var _useState5 = useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    timedOut = _useState6[0],
+    setTimedOut = _useState6[1];
+  var pollRef = useRef(null);
+  var startTimeRef = useRef(null);
+  var prevCountRef = useRef(0);
+  var stableCountRounds = useRef(0);
+  var stopPolling = useCallback(function () {
+    if (pollRef.current) {
+      clearInterval(pollRef.current);
+      pollRef.current = null;
+    }
+  }, []);
+  var fetchCount = useCallback(function () {
+    if (!payrollUuid) return;
+    dispatch(graphql(COUNT_QUERY(payrollUuid), 'POLL_BENEFIT_COUNT')).then(function (response) {
+      var _response$payload$dat, _response$payload;
+      var count = (_response$payload$dat = response === null || response === void 0 || (_response$payload = response.payload) === null || _response$payload === void 0 || (_response$payload = _response$payload.data) === null || _response$payload === void 0 || (_response$payload = _response$payload.benefitConsumptionByPayroll) === null || _response$payload === void 0 ? void 0 : _response$payload.totalCount) !== null && _response$payload$dat !== void 0 ? _response$payload$dat : 0;
+      if (count === 0) {
+        setBenefitCount(count);
+        setIsGenerating(true);
+        stableCountRounds.current = 0;
+        prevCountRef.current = count;
+        return;
+      }
+      setBenefitCount(count);
+      if (count === prevCountRef.current) {
+        stableCountRounds.current += 1;
+      } else {
+        stableCountRounds.current = 0;
+      }
+      prevCountRef.current = count;
+      if (stableCountRounds.current >= 2) {
+        setIsGenerating(false);
+        stopPolling();
+      }
+    })["catch"](function () {
+      setBenefitCount(function (c) {
+        return Math.max(c, 0);
+      });
+    });
+  }, [payrollUuid, dispatch, stopPolling]);
+  useEffect(function () {
+    var shouldPoll = payrollUuid && payrollStatus === 'PENDING_APPROVAL';
+    if (shouldPoll && !pollRef.current) {
+      setTimedOut(false);
+      startTimeRef.current = Date.now();
+      stableCountRounds.current = 0;
+      prevCountRef.current = 0;
+      fetchCount();
+      pollRef.current = setInterval(function () {
+        if (Date.now() - startTimeRef.current >= TIMEOUT_MS) {
+          setIsGenerating(false);
+          setTimedOut(true);
+          stopPolling();
+          return;
+        }
+        fetchCount();
+      }, POLL_INTERVAL_MS);
+    }
+    if (!shouldPoll && pollRef.current) {
+      setIsGenerating(false);
+      stopPolling();
+    }
+    return function () {
+      return stopPolling();
+    };
+  }, [payrollUuid, payrollStatus, fetchCount, stopPolling]);
+  return {
+    isGenerating: isGenerating,
+    benefitCount: benefitCount,
+    timedOut: timedOut
+  };
+}
+
 var useStyles$b = makeStyles(function (theme) {
   return {
     paper: theme.paper.paper,
@@ -3213,12 +3311,64 @@ function PayrollTab(_ref) {
   var modulesManager = useModulesManager();
   var _useTranslations = useTranslations(MODULE_NAME, modulesManager),
     formatMessage = _useTranslations.formatMessage;
+  var _useAsyncPayrollProgr = useAsyncPayrollProgress({
+      payrollUuid: payrollUuid,
+      payrollStatus: payroll === null || payroll === void 0 ? void 0 : payroll.status
+    }),
+    isGenerating = _useAsyncPayrollProgr.isGenerating,
+    benefitCount = _useAsyncPayrollProgr.benefitCount,
+    timedOut = _useAsyncPayrollProgr.timedOut;
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    generationComplete = _useState4[0],
+    setGenerationComplete = _useState4[1];
+  var _useState5 = useState(0),
+    _useState6 = _slicedToArray(_useState5, 2),
+    refreshBenefitsKey = _useState6[0],
+    setRefreshBenefitsKey = _useState6[1];
+  useEffect(function () {
+    if (!isGenerating && benefitCount > 0 && !generationComplete) {
+      setGenerationComplete(true);
+      setRefreshBenefitsKey(function (k) {
+        return k + 1;
+      });
+    }
+  }, [isGenerating, benefitCount, generationComplete]);
   var downloadPayrollData = function downloadPayrollData(payrollUuid, payrollName) {
     downloadPayroll(payrollUuid, payrollName);
   };
   return /*#__PURE__*/React.createElement(Paper, {
     className: classes.paper
+  }, (isGenerating || timedOut) && payrollUuid && !isPayrollFromFailedInvoices && /*#__PURE__*/React.createElement(Grid, {
+    container: true,
+    spacing: 2,
+    style: {
+      padding: '16px'
+    }
   }, /*#__PURE__*/React.createElement(Grid, {
+    item: true,
+    xs: 12
+  }, /*#__PURE__*/React.createElement(Typography, {
+    variant: "body1"
+  }, timedOut ? formatMessage('payroll.async.timedOut') : formatMessage('payroll.async.generating')), !timedOut && /*#__PURE__*/React.createElement(LinearProgress, {
+    variant: "indeterminate",
+    style: {
+      marginTop: '8px'
+    }
+  }), /*#__PURE__*/React.createElement(Typography, {
+    variant: "caption",
+    style: {
+      display: 'block',
+      marginTop: '4px'
+    }
+  }, !timedOut && formatMessage('payroll.async.createdSoFar', {
+    benefitCount: benefitCount
+  })), /*#__PURE__*/React.createElement(Typography, {
+    variant: "caption",
+    style: {
+      display: 'block'
+    }
+  }, !timedOut && formatMessage('payroll.async.note')))), /*#__PURE__*/React.createElement(Grid, {
     container: true,
     className: "".concat(classes.tableTitle, " ").concat(classes.tabs)
   }, /*#__PURE__*/React.createElement("div", {
@@ -3269,7 +3419,8 @@ function PayrollTab(_ref) {
     payrollUuid: payrollUuid,
     isInTask: isInTask,
     isPayrollFromFailedInvoices: isPayrollFromFailedInvoices,
-    payroll: payroll
+    payroll: payroll,
+    refreshBenefitsKey: refreshBenefitsKey
   }));
 }
 
@@ -3686,7 +3837,7 @@ function PayrollSearcher(_ref) {
         gap: 8,
         minWidth: 120
       }
-    }, /*#__PURE__*/React.createElement(LinearProgress, {
+    }, /*#__PURE__*/React.createElement(LinearProgress$1, {
       variant: "determinate",
       value: progress,
       style: {
@@ -4056,7 +4207,7 @@ function PayrollSearcherApproved(_ref) {
         gap: 8,
         minWidth: 120
       }
-    }, /*#__PURE__*/React.createElement(LinearProgress, {
+    }, /*#__PURE__*/React.createElement(LinearProgress$1, {
       variant: "determinate",
       value: progress,
       style: {
@@ -4465,7 +4616,7 @@ function PayrollSearcherReconciled(_ref) {
         gap: 8,
         minWidth: 120
       }
-    }, /*#__PURE__*/React.createElement(LinearProgress, {
+    }, /*#__PURE__*/React.createElement(LinearProgress$1, {
       variant: "determinate",
       value: progress,
       style: {
@@ -5662,13 +5813,15 @@ function BenefitConsumptionsTabPanel(_ref2) {
   var value = _ref2.value,
     rights = _ref2.rights,
     payrollUuid = _ref2.payrollUuid,
-    isPayrollFromFailedInvoices = _ref2.isPayrollFromFailedInvoices;
+    isPayrollFromFailedInvoices = _ref2.isPayrollFromFailedInvoices,
+    refreshBenefitsKey = _ref2.refreshBenefitsKey;
   return /*#__PURE__*/React.createElement(PublishedComponent, {
     pubRef: "policyHolder.TabPanel",
     module: "payroll",
     index: BENEFIT_CONSUMPTION_LIST_TAB_VALUE,
     value: value
   }, rights.includes(RIGHT_PAYROLL_SEARCH) && payrollUuid && /*#__PURE__*/React.createElement(BenefitConsumptionSearcher$1, {
+    key: refreshBenefitsKey,
     rights: rights,
     payrollUuid: payrollUuid,
     isPayrollFromFailedInvoices: isPayrollFromFailedInvoices
@@ -5891,7 +6044,7 @@ function BistpPaymentStatusPanel(_ref3) {
     className: classes.progress
   }, /*#__PURE__*/React.createElement(Typography, {
     variant: "body2"
-  }, formatMessage('payroll.bistp.progress'), ": ", confirmados, "/", total), /*#__PURE__*/React.createElement(LinearProgress$1, {
+  }, formatMessage('payroll.bistp.progress'), ": ", confirmados, "/", total), /*#__PURE__*/React.createElement(LinearProgress, {
     variant: "determinate",
     value: progress
   })))));
@@ -6168,7 +6321,7 @@ function PayrollSearcherPending(_ref) {
         gap: 8,
         minWidth: 120
       }
-    }, /*#__PURE__*/React.createElement(LinearProgress, {
+    }, /*#__PURE__*/React.createElement(LinearProgress$1, {
       variant: "determinate",
       value: progress,
       style: {