@widergy/utilitygo-smart-bill-mobile 3.1.4 → 3.3.0

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+# [3.3.0](https://github.com/widergy/UtilityGO-Smart-Bill-Mobile/compare/v3.2.0...v3.3.0) (2025-11-05)
+
+
+### Features
+
+* new temporally changes ([#52](https://github.com/widergy/UtilityGO-Smart-Bill-Mobile/issues/52)) ([46618ec](https://github.com/widergy/UtilityGO-Smart-Bill-Mobile/commit/46618ecee2a5e10e104a235bcca91eed5a8b0c35))
+
+# [3.2.0](https://github.com/widergy/UtilityGO-Smart-Bill-Mobile/compare/v3.1.4...v3.2.0) (2025-10-28)
+
+
+### Features
+
+* [EVEP-193] prod settings ([#51](https://github.com/widergy/UtilityGO-Smart-Bill-Mobile/issues/51)) ([2a8c116](https://github.com/widergy/UtilityGO-Smart-Bill-Mobile/commit/2a8c11605acbc9af5649254016543310447dd4dc))
+
 ## [3.1.4](https://github.com/widergy/UtilityGO-Smart-Bill-Mobile/compare/v3.1.3...v3.1.4) (2025-10-28)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@widergy/utilitygo-smart-bill-mobile",
-  "version": "3.1.4",
+  "version": "3.3.0",
   "description": "UtilityGO SmartBill Mobile",
   "license": "MIT",
   "main": "src/lib/index.js",

package/src/lib/components/BillCalculation/components/ConceptCard/index.js

@@ -3,6 +3,7 @@ import Collapsible from 'react-native-collapsible';
 import { View } from 'react-native';
 import { shape, number, string, arrayOf } from 'prop-types';
 import { useTogglableState } from '@widergy/mobile-ui';
+import cloneDeep from 'lodash/cloneDeep';
 
 import withContext from '../../../../hocs/withContext';
 import NumberWithSuperIndex from '../../../NumberWithSuperIndex';
@@ -22,7 +23,7 @@ const ConceptCard = ({ context, concept }) => {
   const isCollapsable = linesToRender?.length > 0;
 
   const renderConcepts = lines =>
-    lines?.map(line => (
+    cloneDeep(lines).map(line => (
       <View style={styles.linesContainer}>
         <View style={styles.linesConcept}>
           <Label small style={styles.lineTitle} useMarkdown={false}>

package/src/lib/components/BillCalculation/index.js

@@ -1,6 +1,7 @@
 import React, { useState } from 'react';
 import { View, FlatList } from 'react-native';
 import { Modal, SeparatorBar } from '@widergy/mobile-ui';
+import { bool } from 'prop-types';
 
 import { billDataTypes } from '../../types/billDataTypes';
 import { titleMapper } from '../../utils/billCalculation';
@@ -13,7 +14,7 @@ import ConceptCard from './components/ConceptCard';
 import getStyles from './styles';
 import DetailModalContent from './components/DetailModalContent';
 
-const BillCalculation = ({ bill, context }) => {
+const BillCalculation = ({ bill, context, temporalyDisabled }) => {
   const [detailModalMopen, setDetailModalOpen] = useState(false);
   const { config } = useSmartBill();
   const {
@@ -63,7 +64,9 @@ const BillCalculation = ({ bill, context }) => {
             </View>
           ) : (
             <Label semibold h4 primary style={styles.headerTitle}>
-              {`${texts.mainBillData.settlement} ${currentSettlement} ${texts.mainBillData.ofPreposition} ${totalSettlements} - ${periodicity} ${periodNumber} `}
+              {temporalyDisabled
+                ? `${periodicity} ${periodNumber} `
+                : `${texts.mainBillData.settlement} ${currentSettlement} ${texts.mainBillData.ofPreposition} ${totalSettlements} - ${periodicity} ${periodNumber} `}
             </Label>
           )}
         </View>
@@ -108,6 +111,7 @@ const BillCalculation = ({ bill, context }) => {
   );
 };
 BillCalculation.propTypes = {
-  bill: billDataTypes
+  bill: billDataTypes,
+  temporalyDisabled: bool
 };
 export default withContext()(BillCalculation);

package/src/lib/components/BillSummary/components/ConceptSummary/index.js

@@ -2,6 +2,7 @@ import React from 'react';
 import { View } from 'react-native';
 import { useTogglableState, Touchable } from '@widergy/mobile-ui';
 import { shape, string } from 'prop-types';
+import cloneDeep from 'lodash/cloneDeep';
 
 import { contextApiInfoTypes } from '../../../../types/smartBillTypes';
 import { billDataTypes } from '../../../../types/billDataTypes';
@@ -70,7 +71,7 @@ const ConceptSummary = ({ bill }) => {
       <View style={styles.detailsContainer}>
         {isListView ? (
           <View style={styles.conceptBar}>
-            {billDetailsData.map(
+            {cloneDeep(billDetailsData).map(
               (concept, index) =>
                 (concept.total !== 0 || showZeroConcepts) && (
                   <ConceptBar
@@ -87,7 +88,7 @@ const ConceptSummary = ({ bill }) => {
             <View style={styles.pieChartContainer}>
               <PieChart data={billDetailsData} />
             </View>
-            {billDetailsData.map(
+            {cloneDeep(billDetailsData).map(
               (item, index) =>
                 item.total !== 0 && (
                   <ConceptLine

package/src/lib/components/BillSummary/components/Header/index.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import { View } from 'react-native';
 import moment from 'moment';
+import { bool } from 'prop-types';
 
 import { contextApiInfoTypes } from '../../../../types/smartBillTypes';
 import { billDataTypes } from '../../../../types/billDataTypes';
@@ -10,7 +11,7 @@ import DebtStatusBadge from '../../../DebtStatusBadge';
 
 import styles from './styles';
 
-const Header = ({ context, bill }) => {
+const Header = ({ context, bill, temporalyDisabled }) => {
   const {
     config: {
       texts: {
@@ -35,6 +36,7 @@ const Header = ({ context, bill }) => {
           style={{ container: styles.periodCardContainer }}
           bill={bill}
           billSummaryStep
+          temporalyDisabled={temporalyDisabled}
         />
         <View style={[statusLabel && styles.issuedOnDate]}>
           <Label h6 midGray center={!showPeriodWithMonth(bill)}>
@@ -51,7 +53,8 @@ const Header = ({ context, bill }) => {
 
 Header.propTypes = {
   context: contextApiInfoTypes,
-  bill: billDataTypes
+  bill: billDataTypes,
+  temporalyDisabled: bool
 };
 
 export default withContext()(Header);

package/src/lib/components/BillSummary/index.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import { View } from 'react-native';
+import { bool } from 'prop-types';
 
 import { billDataTypes } from '../../types/billDataTypes';
 import AmountData from '../MainBillData/components/AmountData';
@@ -14,7 +15,7 @@ import styles from './styles';
 import BillRate from './components/BillRate';
 import PercentageComparison from './components/PercentageComparison';
 
-const BillSummary = ({ bill }) => {
+const BillSummary = ({ bill, temporalyDisabled }) => {
   const {
     config,
     assets: { ConsumptionDetailBanner }
@@ -24,11 +25,11 @@ const BillSummary = ({ bill }) => {
   const billToUse = { ...(bill || {}) };
   return (
     <View style={styles.container}>
-      <Header bill={billToUse} />
+      <Header bill={billToUse} temporalyDisabled={temporalyDisabled} />
       <AmountData bill={billToUse} />
       <ConceptSummary bill={billToUse} />
       <ConsumptionCard bill={billToUse} />
-      <PercentageComparison bill={billToUse} />
+      {!temporalyDisabled && <PercentageComparison bill={billToUse} />}
       {showPowerConsumptionGraphic(billToUse) && <PowerConsumptionGraphic bill={billToUse} />}
       <BillRate bill={billToUse} />
       {showBillSummaryBanner(billToUse) && (
@@ -38,6 +39,6 @@ const BillSummary = ({ bill }) => {
   );
 };
 
-BillSummary.propTypes = { bill: billDataTypes };
+BillSummary.propTypes = { bill: billDataTypes, temporalyDisabled: bool };
 
 export default BillSummary;

package/src/lib/components/ConsumptionComparison/components/ComparisonTable/components/DataLine/index.js

@@ -4,17 +4,23 @@ import { View } from 'react-native';
 
 import { componentTypes } from '../../../../../../types/componentsTypes';
 
-import styles from './styles';
+import getStyles from './styles';
 
-const DataLine = ({ fields }) => (
-  <View style={styles.container}>
-    {fields.map(field => (
-      <View key={field.id} style={styles.cell}>
-        {field.Component}
-      </View>
-    ))}
-  </View>
-);
+const DataLine = ({ fields }) => {
+  const styles = getStyles(fields.filter(field => field.show).length);
+
+  return (
+    <View style={styles.container}>
+      {fields
+        .filter(field => field.show)
+        .map(field => (
+          <View key={field.id} style={styles.cell}>
+            {field.Component}
+          </View>
+        ))}
+    </View>
+  );
+};
 
 DataLine.propTypes = {
   fields: arrayOf(shape({ id: string, Component: componentTypes }))

package/src/lib/components/ConsumptionComparison/components/ComparisonTable/components/DataLine/styles.js

@@ -1,18 +1,19 @@
 import { StyleSheet } from 'react-native';
 
-export default StyleSheet.create({
-  container: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'center',
-    flex: 1,
-    paddingHorizontal: 5
-  },
-  cell: {
-    justifyContent: 'center',
-    textAlign: 'center',
-    marginVertical: 13,
-    width: ` ${100 / 3}%`,
-    height: '100%'
-  }
-});
+export default fields =>
+  StyleSheet.create({
+    container: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      justifyContent: 'center',
+      flex: 1,
+      paddingHorizontal: 5
+    },
+    cell: {
+      justifyContent: 'center',
+      textAlign: 'center',
+      marginVertical: 13,
+      width: ` ${100 / fields}%`,
+      height: '100%'
+    }
+  });

package/src/lib/components/ConsumptionComparison/components/ComparisonTable/index.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { View, FlatList } from 'react-native';
-import { number } from 'prop-types';
+import { number, bool } from 'prop-types';
 import { getIn } from 'seamless-immutable';
 
 import withContext from '../../../../hocs/withContext';
@@ -12,7 +12,7 @@ import styles from './styles';
 import { getComparisonRow } from './utils';
 import DataLine from './components/DataLine';
 
-const ComparisonTable = ({ context, billData, monthNumber }) => {
+const ComparisonTable = ({ context, billData, monthNumber, temporalyDisabled }) => {
   const currentPeriod = getCurrentPeriod(billData);
   const lastYearPeriod = getLastYearPeriod(billData);
   const { settlements } = currentPeriod;
@@ -33,7 +33,8 @@ const ComparisonTable = ({ context, billData, monthNumber }) => {
         lastYearPeriodAverageTemperature,
         monthNumber,
         COMPARISON_ROWS_IDS[rowId],
-        totalSettlementsIsOne
+        totalSettlementsIsOne,
+        temporalyDisabled
       )
     )
     .filter(row => row.show);
@@ -50,7 +51,8 @@ const ComparisonTable = ({ context, billData, monthNumber }) => {
 };
 ComparisonTable.propTypes = {
   billData: billDataTypes,
-  monthNumber: number
+  monthNumber: number,
+  temporalyDisabled: bool
 };
 
 export default withContext()(ComparisonTable);

package/src/lib/components/ConsumptionComparison/components/ComparisonTable/utils.js

@@ -217,7 +217,8 @@ export const getComparisonRow = (
   lastYearPeriodAverageTemperature,
   monthNumber,
   periodId,
-  totalSettlementsIsOne
+  totalSettlementsIsOne,
+  temporalyDisabled
 ) => ({
   rowID: periodId,
   row: [
@@ -227,16 +228,16 @@ export const getComparisonRow = (
         context,
         lastYearPeriod,
         lastYearPeriodAverageTemperature,
-        {
-          gray: true
-        },
+        { gray: true },
         periodId,
         totalSettlementsIsOne
-      )
+      ),
+      show: !temporalyDisabled
     },
     {
       key: `header_${periodId}`,
-      Component: getHeaderField(context, periodId, totalSettlementsIsOne)
+      Component: getHeaderField(context, periodId, totalSettlementsIsOne),
+      show: true
     },
     {
       key: `current_period_${periodId}`,
@@ -251,7 +252,8 @@ export const getComparisonRow = (
         },
         periodId,
         totalSettlementsIsOne
-      )
+      ),
+      show: true
     }
   ],
   show: defineRowVisibility(

package/src/lib/components/ConsumptionComparison/index.js

@@ -2,6 +2,7 @@ import React from 'react';
 import { getIn } from 'seamless-immutable';
 import moment from 'moment';
 import { View } from 'react-native';
+import { bool } from 'prop-types';
 
 import { billDataTypes } from '../../types/billDataTypes';
 import { getCurrentPeriod } from '../../utils/periods';
@@ -14,7 +15,7 @@ import PercentageComparison from './components/PercentageComparison';
 import styles from './styles';
 import ConsumptionAdvice from './components/ConsumptionAdvice';
 
-const ConsumptionComparison = ({ bill, context }) => {
+const ConsumptionComparison = ({ bill, context, temporalyDisabled }) => {
   const {
     config,
     Label,
@@ -38,7 +39,7 @@ const ConsumptionComparison = ({ bill, context }) => {
 
   return (
     <View style={styles.container}>
-      <ComparisonTable billData={bill} monthNumber={monthNumber} />
+      <ComparisonTable billData={bill} monthNumber={monthNumber} temporalyDisabled={temporalyDisabled} />
       {showWeatherInfo && (
         <View style={styles.weatherInfo}>
           <Label small midGray>
@@ -49,7 +50,7 @@ const ConsumptionComparison = ({ bill, context }) => {
           </ExternalLink>
         </View>
       )}
-      {!!(savingsPercentage === 0 || savingsPercentage) && (
+      {!!(savingsPercentage === 0 || savingsPercentage) && !temporalyDisabled && (
         <PercentageComparison
           savingsPercentage={savingsPercentage}
           totalSettlementsIsOne={totalSettlementsIsOne}
@@ -69,7 +70,8 @@ const ConsumptionComparison = ({ bill, context }) => {
 };
 
 ConsumptionComparison.propTypes = {
-  bill: billDataTypes
+  bill: billDataTypes,
+  temporalyDisabled: bool
 };
 
 export default withContext()(ConsumptionComparison);

package/src/lib/components/ConsumptionPeriod/components/LectureDetail/index.js

@@ -2,6 +2,7 @@ import React from 'react';
 import { View } from 'react-native';
 import { string, func, arrayOf, shape } from 'prop-types';
 import { UTTooltip } from '@widergy/mobile-ui';
+import cloneDeep from 'lodash/cloneDeep';
 
 import { Label } from '../../../Base';
 import IconAndDetails from '../../../IconAndDetails';
@@ -45,7 +46,7 @@ const LectureDetail = ({ title, details, context, theme }) => {
         )}
       </View>
       <View style={styles.detailsContainer}>
-        {details?.map(detail => (
+        {cloneDeep(details)?.map(detail => (
           <IconAndDetails
             key={detail.mainText}
             {...detail}

package/src/lib/components/ConsumptionPeriod/index.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import { View } from 'react-native';
+import cloneDeep from 'lodash/cloneDeep';
 
 import withContext from '../../hocs/withContext';
 
@@ -22,7 +23,7 @@ const ConsumptionPeriod = ({ bill, context }) => {
   return (
     <View style={styles.container}>
       <View style={styles.readingsDetailsContainer}>
-        {readingDetails.map(detail => (
+        {cloneDeep(readingDetails).map(detail => (
           <LectureDetail key={detail.title} {...detail} />
         ))}
       </View>

package/src/lib/components/MainBillData/components/ConsumptionData/components/DataBySettlement/index.js

@@ -1,6 +1,6 @@
 import React, { useMemo } from 'react';
 import { View } from 'react-native';
-import { string, shape } from 'prop-types';
+import { string, shape, bool } from 'prop-types';
 
 import { billDataTypes } from '../../../../../../types/billDataTypes';
 import withContext from '../../../../../../hocs/withContext';
@@ -10,7 +10,7 @@ import { consumptionDataMapper } from '../../../../../../utils/consumptions';
 
 import getStyles from './styles';
 
-const DataBySettlement = ({ bill, context, colors }) => {
+const DataBySettlement = ({ bill, context, colors, temporalyDisabled }) => {
   const {
     config: {
       texts: {
@@ -31,43 +31,45 @@ const DataBySettlement = ({ bill, context, colors }) => {
       <Label bold style={styles.title} useMarkdown={false}>
         {consumptionTitle}
       </Label>
-
-      <View style={styles.settlementsContainer}>
-        {settlementsConsumption.map(data => {
-          const isFirstCard = data.order === 1;
-          const { isCurrent } = data;
-          return (
-            <View style={styles.consumptionContainer}>
-              <View
-                style={[
-                  isFirstCard ? styles.firstCardContainer : styles.secondCardContainer,
-                  isCurrent &&
-                    (isFirstCard ? styles.currentFirstCardContainer : styles.currentSecondCardContainer)
-                ]}>
-                <Label big center primary={isCurrent}>
-                  {numberFormatter(data.value)}{' '}
-                  <Label center primary={isCurrent}>
-                    {data.unit}
+      {!temporalyDisabled && (
+        <View style={styles.settlementsContainer}>
+          {settlementsConsumption.map(data => {
+            const isFirstCard = data.order === 1;
+            const { isCurrent } = data;
+            return (
+              <View style={styles.consumptionContainer}>
+                <View
+                  style={[
+                    isFirstCard ? styles.firstCardContainer : styles.secondCardContainer,
+                    isCurrent &&
+                      (isFirstCard ? styles.currentFirstCardContainer : styles.currentSecondCardContainer)
+                  ]}>
+                  <Label big center primary={isCurrent}>
+                    {numberFormatter(data.value)}{' '}
+                    <Label center primary={isCurrent}>
+                      {data.unit}
+                    </Label>
                   </Label>
-                </Label>
-                <Label center medium primary={isCurrent}>
-                  {data.settlementDuration}
+                  <Label center medium primary={isCurrent}>
+                    {data.settlementDuration}
+                  </Label>
+                </View>
+                <Label small center semibold={isCurrent} primary={isCurrent} style={styles.descriptionText}>
+                  {data.settlementDescription}
                 </Label>
               </View>
-              <Label small center semibold={isCurrent} primary={isCurrent} style={styles.descriptionText}>
-                {data.settlementDescription}
-              </Label>
-            </View>
-          );
-        })}
-      </View>
+            );
+          })}
+        </View>
+      )}
     </View>
   );
 };
 
 DataBySettlement.propTypes = {
   bill: billDataTypes,
-  colors: shape(string)
+  colors: shape(string),
+  temporalyDisabled: bool
 };
 
 export default withContext()(DataBySettlement);

package/src/lib/components/MainBillData/components/ConsumptionData/index.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import { View } from 'react-native';
 import moment from 'moment';
+import { bool } from 'prop-types';
 
 import { billDataTypes } from '../../../../types/billDataTypes';
 import { ENERGY_TYPES } from '../../../../constants/consumptions';
@@ -13,7 +14,7 @@ import ConsumptionCard from '../../../ConsumptionCard';
 import DataBySettlement from './components/DataBySettlement';
 import styles, { powerConsumptionStyles } from './styles';
 
-const ConsumptionData = ({ bill }) => {
+const ConsumptionData = ({ bill, temporalyDisabled }) => {
   const currentPeriod = bill.periods.find(period => period.current);
   const {
     config: {
@@ -39,7 +40,7 @@ const ConsumptionData = ({ bill }) => {
       {powerConsumptionData ? (
         <ConsumptionCard bill={bill} style={powerConsumptionStyles} />
       ) : (
-        <DataBySettlement bill={bill} />
+        <DataBySettlement bill={bill} temporalyDisabled={temporalyDisabled} />
       )}
 
       {!powerConsumptionData && (
@@ -64,7 +65,8 @@ const ConsumptionData = ({ bill }) => {
 };
 
 ConsumptionData.propTypes = {
-  bill: billDataTypes
+  bill: billDataTypes,
+  temporalyDisabled: bool
 };
 
 export default ConsumptionData;

package/src/lib/components/MainBillData/components/InitialData/index.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import { View } from 'react-native';
 import moment from 'moment';
+import { bool } from 'prop-types';
 
 import { billDataTypes } from '../../../../types/billDataTypes';
 import PeriodCard from '../../../PeriodCard';
@@ -10,7 +11,7 @@ import { Label } from '../../../Base';
 
 import styles from './styles';
 
-const InitialData = ({ bill }) => {
+const InitialData = ({ bill, temporalyDisabled }) => {
   const {
     assets: { UtilityLogo },
     config: {
@@ -62,13 +63,15 @@ const InitialData = ({ bill }) => {
         includeQuestionIcon
         style={{ container: [styles.periodCard, showPeriodWithMonth(bill) && styles.periodWithMonth] }}
         bill={bill}
+        temporalyDisabled={temporalyDisabled}
       />
     </View>
   );
 };
 
 InitialData.propTypes = {
-  bill: billDataTypes
+  bill: billDataTypes,
+  temporalyDisabled: bool
 };
 
 export default InitialData;

package/src/lib/components/MainBillData/components/ParticularConditions/index.js

@@ -42,7 +42,7 @@ const ParticularConditions = ({ bill, context }) => {
               <Label primary style={styles.listTitle}>
                 {particularConditionsListTitle}
               </Label>
-              {particularConditions.map(condition => (
+              {[...(particularConditions || [])].map(condition => (
                 <View key={condition} style={styles.condition}>
                   <View style={styles.dot} />
                   <Label gray small>

package/src/lib/components/MainBillData/index.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import { View } from 'react-native';
 import { isEmpty } from '@widergy/web-utils/lib/array';
+import { bool } from 'prop-types';
 
 import { billDataTypes } from '../../types/billDataTypes';
 import PowerConsumptionGraphic from '../PowerConsumptionGraphic';
@@ -14,7 +15,7 @@ import ParticularConditions from './components/ParticularConditions';
 import styles from './styles';
 import MeasurementInfo from './components/MeasurementInfo';
 
-const MainBillData = ({ bill }) => {
+const MainBillData = ({ bill, temporalyDisabled }) => {
   const {
     config: {
       validators: { showPowerConsumptionGraphic }
@@ -23,10 +24,10 @@ const MainBillData = ({ bill }) => {
 
   return (
     <View style={styles.root}>
-      <InitialData bill={bill} />
+      <InitialData bill={bill} temporalyDisabled={temporalyDisabled} />
       <AmountData bill={bill} />
       {!isEmpty(bill.particular_conditions) && <ParticularConditions bill={bill} />}
-      <ConsumptionData bill={bill} />
+      <ConsumptionData bill={bill} temporalyDisabled={temporalyDisabled} />
       {showPowerConsumptionGraphic(bill) && <PowerConsumptionGraphic bill={bill} />}
       <MeasurementInfo bill={bill} />
       <OwnerData bill={bill} />
@@ -35,7 +36,8 @@ const MainBillData = ({ bill }) => {
 };
 
 MainBillData.propTypes = {
-  bill: billDataTypes
+  bill: billDataTypes,
+  temporalyDisabled: bool
 };
 
 export default MainBillData;

package/src/lib/components/PeriodCard/index.js

@@ -10,7 +10,15 @@ import { useSmartBill, useThemedStyle } from '../../Context';
 
 import ownStyles, { retrieveStyles, ICON_SIZE } from './styles';
 
-const Period = ({ period, includeQuestionIcon, style, bill, showPeriod, billSummaryStep }) => {
+const Period = ({
+  period,
+  includeQuestionIcon,
+  style,
+  bill,
+  showPeriod,
+  billSummaryStep,
+  temporalyDisabled
+}) => {
   const {
     config,
     assets: { QuestionsIcon }
@@ -56,9 +64,11 @@ const Period = ({ period, includeQuestionIcon, style, bill, showPeriod, billSumm
               <Label h4 primary bold={!billSummaryStep} semibold={billSummaryStep} center>
                 {`${year} - ${periodicity === PERIODICITY.BIMONTHLY ? bimester : '-'} ${number}`}
               </Label>
-              <Label h4 primary bold={!billSummaryStep} semibold={billSummaryStep} center>
-                {`${settlement} ${currentSettlement} ${ofPreposition} ${totalSettlements}`}
-              </Label>
+              {!temporalyDisabled && (
+                <Label h4 primary bold={!billSummaryStep} semibold={billSummaryStep} center>
+                  {`${settlement} ${currentSettlement} ${ofPreposition} ${totalSettlements}`}
+                </Label>
+              )}
             </View>
             {includeQuestionIcon && (
               <View style={ownStyles.icon}>
@@ -87,7 +97,8 @@ Period.propTypes = {
   period: any,
   includeQuestionIcon: bool,
   showPeriod: bool,
-  billSummaryStep: bool
+  billSummaryStep: bool,
+  temporalyDisabled: bool
 };
 
 export default Period;