@credithub/harlan-components 1.56.0 → 1.57.0

package/dist/components/protestos/protestosList.js

@@ -37,14 +37,60 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
 import { formatMoney } from '../../utils/number';
 import { formatDocument } from '../../utils/string';
 import XPathUtils from '../../utils/xpath';
-import React, { memo, useContext } from 'react';
+import React, { memo, useContext, useState, useEffect } from 'react';
 import AddItemField from '../common/addItem';
 import Button from '../common/button';
 import { ResultContent } from '../interface/result';
 import { WebService } from '../webservice';
 import { openFormThenRedirect } from '../../utils/protestosp';
+// Throttling mechanism for API requests
+var activeRequests = 0;
+var MAX_CONCURRENT_REQUESTS = 2;
+var requestQueue = [];
+var processQueue = function () {
+    if (requestQueue.length === 0 || activeRequests >= MAX_CONCURRENT_REQUESTS)
+        return;
+    // Process next request in queue
+    var nextRequest = requestQueue.shift();
+    if (nextRequest) {
+        activeRequests++;
+        nextRequest();
+    }
+};
+// Elegant three-dot loader component
+var ThreeDotsLoader = function () {
+    // CSS for the loader container
+    var loaderStyle = {
+        display: 'inline-flex',
+        alignItems: 'center',
+        marginLeft: '5px',
+        height: '10px',
+    };
+    // CSS for each dot
+    var dotStyle = function (delay) { return ({
+        width: '4px',
+        height: '4px',
+        margin: '0 2px',
+        borderRadius: '50%',
+        background: '#aaa',
+        opacity: 0.7,
+        animation: 'blink 1.4s infinite',
+        animationDelay: "".concat(delay, "s"),
+    }); };
+    // CSS animation keyframes defined as a style block
+    var keyframes = "\n    @keyframes blink {\n      0% { opacity: 0.2; }\n      20% { opacity: 0.8; }\n      100% { opacity: 0.2; }\n    }\n  ";
+    return (React.createElement("span", { style: loaderStyle },
+        React.createElement("style", null, keyframes),
+        React.createElement("span", { style: dotStyle(0) }),
+        React.createElement("span", { style: dotStyle(0.2) }),
+        React.createElement("span", { style: dotStyle(0.4) })));
+};
 export var ProtestoItem = memo(function (_a) {
     var protesto = _a.protesto;
+    var client = useContext(WebService);
+    var _b = useState(null), quemApresentou = _b[0], setQuemApresentou = _b[1];
+    var _c = useState(false), loading = _c[0], setLoading = _c[1];
+    var _d = useState(false), queued = _d[0], setQueued = _d[1];
     var getField = function (path, formatter) {
         var value = XPathUtils.select("string(".concat(path, ")"), protesto);
         return formatter ? formatter(value) : value;
@@ -52,8 +98,92 @@ export var ProtestoItem = memo(function (_a) {
     var formatBooleanField = function (value) {
         return value === 'true' ? 'Sim' : 'Não';
     };
+    // Function to fetch Quem Apresentou data
+    var fetchQuemApresentou = function (nm_chave) { return __awaiter(void 0, void 0, void 0, function () {
+        var response, error_1;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    if (!nm_chave)
+                        return [2 /*return*/];
+                    setLoading(true);
+                    _a.label = 1;
+                case 1:
+                    _a.trys.push([1, 4, 5, 6]);
+                    return [4 /*yield*/, client.request("SELECT FROM 'PDFPROTESTO'.'AI'", { nm_chave: nm_chave })];
+                case 2: return [4 /*yield*/, (_a.sent()).json()];
+                case 3:
+                    response = _a.sent();
+                    if (response && response['Quem Apresentou']) {
+                        setQuemApresentou(response['Quem Apresentou']);
+                    }
+                    return [3 /*break*/, 6];
+                case 4:
+                    error_1 = _a.sent();
+                    console.error('Error fetching Quem Apresentou:', error_1);
+                    return [3 /*break*/, 6];
+                case 5:
+                    setLoading(false);
+                    activeRequests--;
+                    processQueue(); // Process next request in queue
+                    return [7 /*endfinally*/];
+                case 6: return [2 /*return*/];
+            }
+        });
+    }); };
+    // Function to queue or execute the fetch request
+    var queueOrExecuteFetch = function (nm_chave) {
+        var executeRequest = function () {
+            fetchQuemApresentou(nm_chave);
+        };
+        if (activeRequests < MAX_CONCURRENT_REQUESTS) {
+            // Execute immediately if under threshold
+            activeRequests++;
+            executeRequest();
+        }
+        else {
+            // Queue the request
+            setQueued(true);
+            requestQueue.push(function () {
+                setQueued(false);
+                executeRequest();
+            });
+        }
+    };
+    useEffect(function () {
+        // Check if nomeCedente is empty
+        var nomeCedente = getField('./nomeCedente');
+        if (nomeCedente && nomeCedente.trim() !== '')
+            return;
+        // Get nm_chave and queue/execute the request
+        var nm_chave = getField('./nm_chave');
+        if (nm_chave) {
+            queueOrExecuteFetch(nm_chave);
+        }
+        // Cleanup function
+        return function () {
+            // If this component unmounts while in queue, try to remove it from queue
+            var queueIndex = requestQueue.findIndex(function (req) {
+                return req.toString().includes(nm_chave);
+            });
+            if (queueIndex !== -1) {
+                requestQueue.splice(queueIndex, 1);
+            }
+        };
+    }, []);
+    // Get the display value for Quem Protestou field
+    var getQuemProtestouDisplay = function () {
+        var baseValue = quemApresentou || getField('./nomeCedente');
+        if (loading || queued) {
+            return React.createElement(React.Fragment, null,
+                baseValue || '',
+                " ",
+                React.createElement(ThreeDotsLoader, null));
+        }
+        return baseValue;
+    };
     return (React.createElement(ResultContent, { print: "repeat(7, 1fr)", desktop: "repeat(8, 1fr)", tablet: "repeat(4, 1fr)", mobile: "repeat(2, 1fr)" },
-        React.createElement(AddItemField, { name: "Quem Protestou", value: getField('./nomeCedente') }),
+        React.createElement(AddItemField, { name: "Quem Protestou", value: getQuemProtestouDisplay() }),
         React.createElement(AddItemField, { name: "Atrav\u00E9s De", value: getField('./nomeApresentante') }),
         React.createElement(AddItemField, { name: "CPF/CNPJ Protestado", value: formatDocument(getField('./cpfCnpj')) }),
         React.createElement(AddItemField, { name: "Data Do Protesto", value: getField('./dataProtesto') }),