@widergy/utilitygo-smart-bill-web 3.6.2 → 3.7.0

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+# [3.7.0](https://github.com/widergy/UtilityGO-Smart-Bill-Web/compare/v3.6.2...v3.7.0) (2025-05-28)
+
+
+### Features
+
+* [CX-746] smartbill ai question list new services ([#52](https://github.com/widergy/UtilityGO-Smart-Bill-Web/issues/52)) ([ba403da](https://github.com/widergy/UtilityGO-Smart-Bill-Web/commit/ba403da3cef06f935d585e282355d641ae4b79e9))
+
 ## [3.6.2](https://github.com/widergy/UtilityGO-Smart-Bill-Web/compare/v3.6.1...v3.6.2) (2025-05-26)
 
 

package/dist/components/SmartBillSummary/components/AIPanel/index.js

@@ -7,7 +7,6 @@ exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _energyUi = require("@widergy/energy-ui");
 var _propTypes = require("prop-types");
-var _i18next = _interopRequireDefault(require("i18next"));
 var _reactLoadingSkeleton = _interopRequireDefault(require("react-loading-skeleton"));
 var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -15,15 +14,22 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const AIPanel = _ref => {
   let {
-    aiQuestionsList,
+    aiQuestionsList = [],
+    aiQuestionsListError,
+    aiQuestionsListLoading,
     answer,
     error,
     getAnswer,
     isOpen,
     loading,
     notEnoughBillsErrorType,
-    onClose
+    onClose,
+    translations
   } = _ref;
+  const {
+    generatedByLabel,
+    title: panelTitle
+  } = translations?.AIPanel || {};
   const [openCards, setOpenCards] = (0, _react.useState)([]);
   const toggleCard = id => {
     if (!answer?.[id] && !openCards.includes(id)) {
@@ -35,6 +41,9 @@ const AIPanel = _ref => {
     onClose?.();
     setOpenCards([]);
   };
+  (0, _react.useEffect)(() => {
+    if (aiQuestionsListError && !aiQuestionsListLoading) handleClose();
+  }, [isOpen, aiQuestionsListError, aiQuestionsListLoading]);
   return /*#__PURE__*/_react.default.createElement(_energyUi.UTPanel, {
     classes: {
       paper: _stylesModule.default.paper,
@@ -48,12 +57,14 @@ const AIPanel = _ref => {
   }, /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
     weight: "medium",
     variant: "title2"
-  }, _i18next.default.t('IAPanel:title')), /*#__PURE__*/_react.default.createElement("div", {
+  }, panelTitle), /*#__PURE__*/_react.default.createElement(_energyUi.UTLoading, {
+    loading: aiQuestionsListLoading
+  }, /*#__PURE__*/_react.default.createElement("div", {
     className: _stylesModule.default.questionsContainer
   }, aiQuestionsList.map(_ref2 => {
     let {
       id,
-      title
+      question
     } = _ref2;
     const isLoading = loading?.[id];
     const errorContent = error?.[id];
@@ -67,14 +78,14 @@ const AIPanel = _ref => {
         expandableContent: _stylesModule.default.expandableContent,
         expandableContentActive: _stylesModule.default.activeCard
       },
-      header: title,
+      header: question,
       isCollapsible: true,
       isOpen: openCards.includes(id),
       key: id,
       onClick: () => toggleCard(id)
     }, renderAnswer ? /*#__PURE__*/_react.default.createElement("div", {
       className: `${_stylesModule.default.answer} ${errorContent && !isLoading ? notEnoughBills ? _stylesModule.default.notEnoughBillsContainer : _stylesModule.default.errorAnswer : ''}`
-    }, isLoading ? /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
+    }, isLoading ? /*#__PURE__*/_react.default.createElement("section", null, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
       containerClassName: _stylesModule.default.skeletonContainer,
       count: 3,
       height: 22
@@ -83,17 +94,17 @@ const AIPanel = _ref => {
     }, /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
       colorTheme: "gray",
       variant: "small"
-    }, "Generado con AI"), /*#__PURE__*/_react.default.createElement(_energyUi.UTIcon, {
+    }, generatedByLabel), /*#__PURE__*/_react.default.createElement(_energyUi.UTIcon, {
       colorTheme: "neutral",
       name: "IconSparkles",
       size: 18
-    }))) : errorContent ? /*#__PURE__*/_react.default.createElement("div", {
+    }))) : errorContent ? /*#__PURE__*/_react.default.createElement("section", {
       className: _stylesModule.default.errorCard
     }, /*#__PURE__*/_react.default.createElement(_energyUi.UTIcon, {
       colorTheme: notEnoughBills ? 'gray' : 'error',
       name: notEnoughBills ? 'IconFileX' : 'IconCircleX',
       shade: "04"
-    }), /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, null, notEnoughBills ? notEnoughBillsContent : errorContent)) : answerContent ? /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
+    }), /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, null, notEnoughBills ? notEnoughBillsContent : errorContent)) : answerContent ? /*#__PURE__*/_react.default.createElement("section", null, /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
       className: _stylesModule.default.answerContent,
       withMarkdown: true
     }, answerContent), /*#__PURE__*/_react.default.createElement("div", {
@@ -101,24 +112,27 @@ const AIPanel = _ref => {
     }, /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
       colorTheme: "gray",
       variant: "small"
-    }, "Generado con AI"), /*#__PURE__*/_react.default.createElement(_energyUi.UTIcon, {
+    }, generatedByLabel), /*#__PURE__*/_react.default.createElement(_energyUi.UTIcon, {
       colorTheme: "neutral",
       name: "IconSparkles",
       size: 18
     }))) : null) : null);
-  }))));
+  })))));
 };
 AIPanel.propTypes = {
   aiQuestionsList: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
-    id: _propTypes.string,
-    title: _propTypes.string
+    id: _propTypes.number,
+    question: _propTypes.string
   })),
+  aiQuestionsListLoading: _propTypes.bool,
+  aiQuestionsListError: _propTypes.bool,
   answer: _propTypes.object,
   error: _propTypes.object,
   getAnswer: _propTypes.func,
   isOpen: _propTypes.bool,
   loading: _propTypes.object,
   notEnoughBillsErrorType: _propTypes.string,
-  onClose: _propTypes.func
+  onClose: _propTypes.func,
+  translations: _propTypes.object
 };
 var _default = exports.default = AIPanel;

package/dist/components/SmartBillSummary/components/AIPanel/styles.module.scss

@@ -24,6 +24,10 @@ $ia-panel-width: 600px;
   display: flex;
   flex-direction: column;
   grid-gap: 12px;
+
+  &:last-child {
+    padding-bottom: 24px;
+  }
 }
 
 .card {

package/dist/components/SmartBillSummary/index.js

@@ -7,6 +7,7 @@ exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _energyUi = require("@widergy/energy-ui");
 var _propTypes = require("prop-types");
+var _isEmpty = _interopRequireDefault(require("lodash/isEmpty"));
 var _billDataTypes = require("../../shared/types/billDataTypes");
 var _constants = require("./constants");
 var _utils = require("./utils");
@@ -29,6 +30,8 @@ const SmartBillSummary = _ref => {
   } = _ref;
   const {
     aiQuestionsList,
+    aiQuestionsListError,
+    aiQuestionsListLoading,
     aiQuestionsPanelEnabled,
     consumptionLevels,
     currentAccount,
@@ -44,6 +47,7 @@ const SmartBillSummary = _ref => {
   const {
     getGlossaryData,
     getSmartBillAIAnswer,
+    getSmartBillAIQuestions,
     resetSmartBillAIAnswers
   } = handlers;
   const filteredTabOptions = loading ? [] : (0, _utils.getTabOptions)(isDesktopSize, tabOptions, smartBill);
@@ -51,7 +55,10 @@ const SmartBillSummary = _ref => {
   const [currentTab, setCurrentTab] = (0, _react.useState)(defaultCurrentTab);
   const [aiPanelIsOpen, setAiPanelIsOpen] = (0, _react.useState)(false);
   const changeCurrentTab = newTab => setCurrentTab(newTab);
-  const openAIPanel = () => setAiPanelIsOpen(true);
+  const openAIPanel = () => {
+    if ((0, _isEmpty.default)(aiQuestionsList)) getSmartBillAIQuestions();
+    setAiPanelIsOpen(true);
+  };
   const closeAIPanel = () => {
     setAiPanelIsOpen(false);
     resetSmartBillAIAnswers();
@@ -106,13 +113,16 @@ const SmartBillSummary = _ref => {
     name: "EnergyIconChatSparkFilled"
   })), /*#__PURE__*/_react.default.createElement(_AIPanel.default, {
     aiQuestionsList: aiQuestionsList,
+    aiQuestionsListError: aiQuestionsListError,
+    aiQuestionsListLoading: aiQuestionsListLoading,
     answer: smartBillAIAnswer,
     error: smartBillAIAnswerError,
     getAnswer: getSmartBillAIAnswer,
     isOpen: aiPanelIsOpen,
     loading: smartBillAIAnswerLoading,
     notEnoughBillsErrorType: notEnoughBillsErrorType,
-    onClose: closeAIPanel
+    onClose: closeAIPanel,
+    translations: translations
   })));
 };
 SmartBillSummary.propTypes = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@widergy/utilitygo-smart-bill-web",
-  "version": "3.6.2",
+  "version": "3.7.0",
   "description": "UtilityGO SmartBill Web",
   "license": "MIT",
   "main": "dist/index.js",