@widergy/utilitygo-smart-bill-web 3.8.0 → 3.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/components/SmartBillSummary/tabs/Billing/components/RateCard/index.js +65 -8
  3. package/dist/components/SmartBillSummary/tabs/Billing/components/RateCard/styles.module.scss +27 -0
  4. package/dist/constants/testIds.js +19 -0
  5. package/dist/index.js +14 -0
  6. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,10 @@
1
+ # [3.9.0](https://github.com/widergy/UtilityGO-Smart-Bill-Web/compare/v3.8.0...v3.9.0) (2025-07-10)
2
+
3
+
4
+ ### Features
5
+
6
+ * [UGEE-309] smart bill projection ([#57](https://github.com/widergy/UtilityGO-Smart-Bill-Web/issues/57)) ([bae9bcd](https://github.com/widergy/UtilityGO-Smart-Bill-Web/commit/bae9bcda49f30f82ee6e2dc6bb5f620fd5a27fec))
7
+
1
8
  # [3.8.0](https://github.com/widergy/UtilityGO-Smart-Bill-Web/compare/v3.7.1...v3.8.0) (2025-06-27)
2
9
 
3
10
 
package/dist/components/SmartBillSummary/tabs/Billing/components/RateCard/index.js CHANGED
@@ -7,15 +7,20 @@ exports.default = void 0;
7
7
  var _react = _interopRequireWildcard(require("react"));
8
8
  var _energyUi = require("@widergy/energy-ui");
9
9
  var _propTypes = require("prop-types");
10
+ var _numeral = _interopRequireDefault(require("numeral"));
10
11
  var _isEmpty = _interopRequireDefault(require("lodash/isEmpty"));
11
12
  var _debounce = _interopRequireDefault(require("lodash/debounce"));
12
13
  var _utils = require("../../../Consumptions/components/CurrentConsumption/utils");
14
+ var _testIds = require("../../../../../../constants/testIds");
13
15
  var _utils2 = require("./utils");
14
16
  var _ProgressBar = _interopRequireDefault(require("./components/ProgressBar"));
15
17
  var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
16
18
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
17
19
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
18
20
  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; }
21
+ const {
22
+ smartBill: smartBillTestIds
23
+ } = _testIds.TEST_IDS;
19
24
  const RateCard = _ref => {
20
25
  let {
21
26
  components,
@@ -25,25 +30,32 @@ const RateCard = _ref => {
25
30
  normalizedRate = '',
26
31
  rateCardTranslations = {},
27
32
  ratesTableLink,
33
+ seeFooter = true,
34
+ smallTitle = false,
28
35
  smartBill = {},
29
36
  subsidy = '',
30
37
  subsidyLevels,
31
38
  trackRedirectionToExternalLink
32
39
  } = _ref;
33
40
  const {
41
+ banner = {},
34
42
  helpText,
35
43
  limitRateValueLabel,
36
44
  seeRatesTable,
45
+ seeBill,
37
46
  startRateValueLabel,
38
47
  title,
39
48
  tooltipContent,
49
+ tooltipText,
40
50
  unit,
41
51
  yourConsumption,
42
52
  yourRate
43
53
  } = rateCardTranslations;
44
54
  const {
45
55
  client,
46
- periods
56
+ periods,
57
+ levelValue: limitSubsidyValue = 0,
58
+ levelNumber
47
59
  } = smartBill;
48
60
  const purchasedRate = client?.rate?.purchased || '';
49
61
  const periodsToCompare = (0, _utils.getConsumptionPeriodsToCompare)(periods);
@@ -78,6 +90,7 @@ const RateCard = _ref => {
78
90
  const limitRateValue = Array.isArray(currentRate?.range) && currentRate.range.length > 0 && currentRate.range[currentRate.range.length - 1];
79
91
  const charges = client?.rate?.charges || [];
80
92
  const isT1 = purchasedRate.includes('T1');
93
+ const diff = limitSubsidyValue !== 0 ? (0, _numeral.default)(totalConsumption - limitSubsidyValue).format('0,0.[00]') : 0;
81
94
  const noLevels = (0, _isEmpty.default)(consumptionLevels);
82
95
  const showRateLabel = !isT1 || startRateValue === false || limitRateValue === false;
83
96
  const debouncedTrackRedirection = (0, _react.useMemo)(() => (0, _debounce.default)(link => {
@@ -97,11 +110,23 @@ const RateCard = _ref => {
97
110
  }, /*#__PURE__*/_react.default.createElement("div", {
98
111
  className: _stylesModule.default.headerTitles
99
112
  }, /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
100
- variant: "title2",
101
- weight: "medium"
113
+ colorTheme: smallTitle ? 'gray' : '',
114
+ dataTestId: smartBillTestIds.rateCard.title,
115
+ variant: smallTitle ? 'small' : 'title3'
102
116
  }, title), /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
103
- colorTheme: "gray"
104
- }, helpText)), !noLevels && /*#__PURE__*/_react.default.createElement(_ProgressBar.default, {
117
+ colorTheme: "gray",
118
+ dataTestId: smartBillTestIds.rateCard.helpText
119
+ }, helpText), banner && limitSubsidyValue !== 0 && totalConsumption > limitSubsidyValue && /*#__PURE__*/_react.default.createElement("div", {
120
+ className: _stylesModule.default.bannerDetail,
121
+ "data-testid": smartBillTestIds.rateCard.banner
122
+ }, /*#__PURE__*/_react.default.createElement(_energyUi.UTIcon, {
123
+ colorTheme: "error",
124
+ name: "IconCircleX"
125
+ }), /*#__PURE__*/_react.default.createElement("div", {
126
+ className: _stylesModule.default.bannerDetailText
127
+ }, /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
128
+ dataTestId: smartBillTestIds.rateCard.bannerLabel
129
+ }, banner.label?.(limitSubsidyValue, diff))))), !noLevels && /*#__PURE__*/_react.default.createElement(_ProgressBar.default, {
105
130
  components: components,
106
131
  currentPeriod: currentPeriod,
107
132
  data: rates,
@@ -116,32 +141,50 @@ const RateCard = _ref => {
116
141
  }, /*#__PURE__*/_react.default.createElement("div", {
117
142
  className: _stylesModule.default.consumptionContent
118
143
  }, /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
144
+ dataTestId: smartBillTestIds.rateCard.yourRate,
119
145
  variant: "title3",
120
146
  weight: "medium"
121
147
  }, (0, _utils2.getCurrentRate)(purchasedRate, currentRate)), /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
122
148
  colorTheme: "gray",
149
+ dataTestId: smartBillTestIds.rateCard.yourRateLabel,
123
150
  variant: "small"
124
151
  }, showRateLabel ? yourRate : limitRateValue === 'Infinity' ? startRateValueLabel?.(startRateValue) : limitRateValueLabel?.(limitRateValue))), /*#__PURE__*/_react.default.createElement("div", {
125
152
  className: _stylesModule.default.consumptionContent
126
153
  }, /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
154
+ dataTestId: smartBillTestIds.rateCard.totalConsumption,
127
155
  variant: "title3",
128
156
  weight: "medium"
129
157
  }, totalConsumptionFormatted, " ", unit), /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
130
158
  colorTheme: "gray",
159
+ dataTestId: smartBillTestIds.rateCard.yourConsumption,
131
160
  variant: "small"
132
- }, yourConsumption))), /*#__PURE__*/_react.default.createElement("div", {
161
+ }, yourConsumption))), levelNumber && /*#__PURE__*/_react.default.createElement("div", {
162
+ className: _stylesModule.default.levelNumber,
163
+ "data-testid": smartBillTestIds.rateCard.level
164
+ }, /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
165
+ dataTestId: smartBillTestIds.rateCard.levelLabel,
166
+ variant: "subtitle1"
167
+ }, banner.level?.(levelNumber)), /*#__PURE__*/_react.default.createElement(_energyUi.UTTooltip, {
168
+ content: tooltipText,
169
+ dataTestId: smartBillTestIds.rateCard.levelTooltip
170
+ }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_energyUi.UTIcon, {
171
+ name: "IconHelp"
172
+ })))), /*#__PURE__*/_react.default.createElement("div", {
133
173
  className: _stylesModule.default.footer
134
- }, charges.map(_ref5 => {
174
+ }, seeFooter && charges.map((_ref5, i) => {
135
175
  let {
136
176
  concept,
137
177
  amount
138
178
  } = _ref5;
139
179
  return /*#__PURE__*/_react.default.createElement("div", {
140
180
  className: _stylesModule.default.detail,
181
+ "data-testid": `${smartBillTestIds.rateCard.detail}.${i}`,
141
182
  key: concept
142
183
  }, /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
184
+ dataTestId: `${smartBillTestIds.rateCard.detailLabel}.${i}`,
143
185
  weight: "medium"
144
186
  }, concept), /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
187
+ dataTestId: `${smartBillTestIds.rateCard.detailAmount}.${i}`,
145
188
  variant: "subtitle1",
146
189
  weight: "medium"
147
190
  }, formatAmount?.(amount)));
@@ -151,11 +194,23 @@ const RateCard = _ref => {
151
194
  root: _stylesModule.default.footerAction
152
195
  },
153
196
  colorTheme: "secondary",
197
+ dataTestId: smartBillTestIds.rateCard.seeRatesTable,
198
+ Icon: "IconChevronRight",
199
+ iconPlacement: "right",
200
+ onClick: handleClickButton,
201
+ variant: "text"
202
+ }, seeRatesTable), !(0, _isEmpty.default)(seeBill) && /*#__PURE__*/_react.default.createElement(_energyUi.UTButton, {
203
+ classNames: {
204
+ childrenContainer: _stylesModule.default.footerActionChildren,
205
+ root: _stylesModule.default.footerAction
206
+ },
207
+ colorTheme: "secondary",
208
+ dataTestId: smartBillTestIds.rateCard.seeBill,
154
209
  Icon: "IconChevronRight",
155
210
  iconPlacement: "right",
156
211
  onClick: handleClickButton,
157
212
  variant: "text"
158
- }, seeRatesTable)));
213
+ }, seeBill)));
159
214
  };
160
215
  RateCard.propTypes = {
161
216
  components: _propTypes.object,
@@ -165,6 +220,8 @@ RateCard.propTypes = {
165
220
  normalizedRate: _propTypes.string,
166
221
  rateCardTranslations: _propTypes.object,
167
222
  ratesTableLink: _propTypes.string,
223
+ seeFooter: _propTypes.bool,
224
+ smallTitle: _propTypes.bool,
168
225
  smartBill: _propTypes.object,
169
226
  subsidy: _propTypes.string,
170
227
  subsidyLevels: (0, _propTypes.objectOf)(_propTypes.string),
package/dist/components/SmartBillSummary/tabs/Billing/components/RateCard/styles.module.scss CHANGED
@@ -61,3 +61,30 @@
61
61
  justify-content: space-between;
62
62
  padding: 16px;
63
63
  }
64
+
65
+ .bannerDetail {
66
+ align-items: flex-start;
67
+ background-color: var(--semanticError01);
68
+ border-radius: 8px;
69
+ display: flex;
70
+ flex-direction: row;
71
+ justify-content: space-between;
72
+ padding: 8px 16px;
73
+ }
74
+
75
+ .bannerDetailText {
76
+ display: flex;
77
+ flex-direction: column;
78
+ margin-left: 8px;
79
+ }
80
+
81
+ .levelNumber {
82
+ align-items: center;
83
+ background-color: var(--light03);
84
+ border-radius: 8px;
85
+ display: flex;
86
+ grid-gap: 8px;
87
+ justify-content: space-between;
88
+ margin: 0px 16px;
89
+ padding: 24px;
90
+ }
package/dist/constants/testIds.js CHANGED
@@ -22,6 +22,7 @@ const ID_CONSTANTS = {
22
22
  ICON_AND_DETAILS: 'iconAndDetails',
23
23
  MAIN_BILL_DATA: 'mainBillData',
24
24
  PERIOD: 'period',
25
+ RATE_CARD: 'rateCard',
25
26
  RATE_AND_CATEGORY: 'rateAndCategory',
26
27
  REDING_DETAILS: 'readingDetails',
27
28
  REMAINING_CONSUMPTION: 'remainingConsumption',
@@ -134,6 +135,24 @@ const TEST_IDS = exports.TEST_IDS = {
134
135
  category: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_AND_CATEGORY}.category`,
135
136
  rate: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_AND_CATEGORY}.rate`,
136
137
  title: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_AND_CATEGORY}.${ID_CONSTANTS.TITLE}`
138
+ },
139
+ rateCard: {
140
+ banner: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_CARD}.banner`,
141
+ title: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_CARD}.title`,
142
+ level: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_CARD}.level`,
143
+ detail: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_CARD}.detail`,
144
+ seeBill: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_CARD}.seeBill`,
145
+ helpText: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_CARD}.helpText`,
146
+ bannerLabel: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_CARD}.bannerLabel`,
147
+ levelLabel: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_CARD}.levelLabel`,
148
+ levelTooltip: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_CARD}.levelTooltip`,
149
+ detailLabel: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_CARD}.detailLabel`,
150
+ detailAmount: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_CARD}.detailAmount`,
151
+ seeRatesTable: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_CARD}.seeRatesTable`,
152
+ totalConsumption: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_CARD}.totalConsumption`,
153
+ yourConsumption: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_CARD}.yourConsumption`,
154
+ yourRate: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_CARD}.yourRate`,
155
+ yourRateLabel: `${ID_CONSTANTS.SMART_BILL}.${ID_CONSTANTS.RATE_CARD}.yourRateLabel`
137
156
  }
138
157
  }
139
158
  };
package/dist/index.js CHANGED
@@ -16,6 +16,12 @@ Object.defineProperty(exports, "BillSummary", {
16
16
  return _BillSummary.default;
17
17
  }
18
18
  });
19
+ Object.defineProperty(exports, "Billing", {
20
+ enumerable: true,
21
+ get: function () {
22
+ return _Billing.default;
23
+ }
24
+ });
19
25
  Object.defineProperty(exports, "ColorAliases", {
20
26
  enumerable: true,
21
27
  get: function () {
@@ -53,6 +59,12 @@ Object.defineProperty(exports, "MainBillData", {
53
59
  return _MainBillData.default;
54
60
  }
55
61
  });
62
+ Object.defineProperty(exports, "RateCard", {
63
+ enumerable: true,
64
+ get: function () {
65
+ return _RateCard.default;
66
+ }
67
+ });
56
68
  Object.defineProperty(exports, "RatesDefinition", {
57
69
  enumerable: true,
58
70
  get: function () {
@@ -106,6 +118,8 @@ exports.Aliases = _aliases;
106
118
  var _billDataTypes = require("./shared/types/billDataTypes");
107
119
  var _rateStagesTypes = require("./shared/types/rateStagesTypes");
108
120
  var _tabs = require("./shared/constants/tabs");
121
+ var _Billing = _interopRequireDefault(require("./components/SmartBillSummary/tabs/Consumptions/components/Billing"));
122
+ var _RateCard = _interopRequireDefault(require("./components/SmartBillSummary/tabs/Billing/components/RateCard"));
109
123
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
110
124
  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; }
111
125
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@widergy/utilitygo-smart-bill-web",
3
- "version": "3.8.0",
3
+ "version": "3.9.0",
4
4
  "description": "UtilityGO SmartBill Web",
5
5
  "license": "MIT",
6
6
  "main": "dist/index.js",