Dependency updates

package.json

@@ -72,7 +72,7 @@
     "qs": "^6.13.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "react-intl": "6.6.8",
+    "react-intl": "6.7.0",
     "react-redux": "^9.1.2",
     "react-router-dom": "^6.26.2",
     "redux": "^5.0.1",
@@ -97,15 +97,15 @@
     "@testing-library/user-event": "^14.5.2",
     "@types/jest": "^29.5.13",
     "@types/qs": "^6.9.16",
-    "@types/react": "^18.3.8",
+    "@types/react": "^18.3.10",
     "@types/react-dom": "^18.3.0",
     "@types/react-redux": "^7.1.34",
     "@types/react-router-dom": "^5.3.3",
-    "@typescript-eslint/eslint-plugin": "^8.6.0",
+    "@typescript-eslint/eslint-plugin": "^8.7.0",
     "@typescript-eslint/parser": "^8.7.0",
     "aphrodite": "^2.4.0",
     "copy-webpack-plugin": "^12.0.2",
-    "eslint": "^9.11.0",
+    "eslint": "^9.11.1",
     "eslint-plugin-formatjs": "^5.0.0",
     "eslint-plugin-jest-dom": "^5.4.0",
     "eslint-plugin-jsdoc": "^50.3.0",
@@ -134,8 +134,8 @@
     "webpack-bundle-analyzer": "^4.10.2"
   },
   "overrides": {
-    "@typescript-eslint/eslint-plugin": "^8.6.0",
-    "eslint": "^9.11.0",
+    "@typescript-eslint/eslint-plugin": "^8.7.0",
+    "eslint": "^9.11.1",
     "redux": "^5.0.1"
   },
   "insights": {

src/routes/details/components/costChart/costChart.tsx

@@ -101,7 +101,7 @@ class CostChartBase extends React.Component<CostChartProps, any> {
               intl.formatMessage(messages.costBreakdownTooltip, {
                 name: datum.x,
                 value: formatCurrency(datum.y, datum.units),
-              })
+              }) as string
             }
             legendComponent={Legend}
             legendData={[

src/routes/details/components/historicalData/historicalDataCostChart.tsx

@@ -118,8 +118,6 @@ class HistoricalDataCostChartBase extends React.Component<HistoricalDataCostChar
 
     const costUnits = currentReport?.meta?.total?.cost ? currentReport.meta.total.cost[reportItemValue].units : 'USD';
 
-    const test = intl.formatMessage(messages.currencyUnits, { units: costUnits });
-
     return (
       <div style={styles.chartContainer}>
         <div style={styles.costChart}>
@@ -138,7 +136,7 @@ class HistoricalDataCostChartBase extends React.Component<HistoricalDataCostChar
               previousInfrastructureCostData={previousInfrastructureCostData}
               xAxisLabel={intl.formatMessage(messages.historicalChartDayOfMonthLabel)}
               yAxisLabel={intl.formatMessage(messages.historicalChartCostLabel, {
-                units: test,
+                units: intl.formatMessage(messages.currencyUnits, { units: costUnits }) as string,
               })}
             />
           )}

src/routes/details/components/overheadCostChart/overheadCostChart.tsx

@@ -169,7 +169,7 @@ class OverheadCostChartBase extends React.Component<OverheadCostChartProps, any>
               intl.formatMessage(messages.costBreakdownTooltip, {
                 name: datum.x,
                 value: formatCurrency(datum.y, datum.units),
-              })
+              }) as string
             }
             legendComponent={Legend}
             legendData={[

src/routes/overview/components/dashboardWidgetBase.tsx

@@ -263,7 +263,7 @@ class DashboardWidgetBase extends React.Component<DashboardWidgetProps, Dashboar
 
     const computedReportItem = trend.computedReportItem || 'cost'; // cost, supplementary cost, etc.
     const computedReportItemValue = trend.computedReportItemValue; // infrastructure usage cost
-    const title = intl.formatMessage(trend.titleKey, { units: this.getFormattedUnits() });
+    const title = intl.formatMessage(trend.titleKey, { units: this.getFormattedUnits() }) as string;
 
     // Cost data
     const currentData = transformReport(
@@ -309,7 +309,7 @@ class DashboardWidgetBase extends React.Component<DashboardWidgetProps, Dashboar
 
     const title = intl.formatMessage(trend.titleKey, {
       units: this.getFormattedUnits(),
-    });
+    }) as string;
 
     // Request data
     const currentRequestData = transformReport(currentReport, trend.datumType, 'date', 'request', 'total');
@@ -390,7 +390,7 @@ class DashboardWidgetBase extends React.Component<DashboardWidgetProps, Dashboar
     if (computedReportItem === ComputedReportItemType.usage) {
       return intl.formatMessage(messages.units, { units: unitsLookupKey(units) });
     }
-    return intl.formatMessage(messages.currencyUnits, { units });
+    return intl.formatMessage(messages.currencyUnits, { units }) as string;
   };
 
   private getHorizontalLayout = () => {

src/routes/settings/costModels/costModelWizard/table.tsx

@@ -116,9 +116,11 @@ const SourcesTable: React.FC<WrappedComponentProps> = ({ intl }) => {
                           {row.costmodel && (
                             <WarningIcon
                               key={`wrng-${row.name}`}
-                              text={intl.formatMessage(messages.costModelsWizardSourceWarning, {
-                                costModel: row.costmodel,
-                              })}
+                              text={
+                                intl.formatMessage(messages.costModelsWizardSourceWarning, {
+                                  costModel: row.costmodel,
+                                }) as string
+                              }
                             />
                           )}
                         </Td>

src/routes/settings/costModels/costModelsDetails/utils/filters.tsx

@@ -136,7 +136,7 @@ const DescriptionFilterBase: React.FC<DescriptionFilterProps> = ({
   const children =
     filterType === 'description' ? (
       <FilterInput
-        placeholder={intl.formatMessage(messages.filterByPlaceholder, { value: filterType })}
+        placeholder={intl.formatMessage(messages.filterByPlaceholder, { value: filterType }) as string}
         value={value}
         onChange={(val: string) => setValue(val)}
         onKeyPress={onKeyPress(router, 'description', { ...initialCostModelsQuery, ...query }, { value, setValue })}
@@ -211,7 +211,7 @@ const NameFilterBase: React.FC<NameFilterProps> = ({
   const children =
     filterType === 'name' ? (
       <FilterInput
-        placeholder={intl.formatMessage(messages.filterByPlaceholder, { value: filterType })}
+        placeholder={intl.formatMessage(messages.filterByPlaceholder, { value: filterType }) as string}
         value={value}
         onChange={(val: string) => setValue(val)}
         onKeyPress={onKeyPress(router, 'name', { ...initialCostModelsQuery, ...query }, { value, setValue })}

src/store/settings/settingsActions.ts

@@ -138,10 +138,12 @@ export function updateSettings(settingsType: SettingsType, payload: SettingsPayl
             title = intl.formatMessage(messages.settingsTagMappingDisableErrorTitle);
             description = intl.formatMessage(messages.settingsTagMappingDisableErrorDesc, {
               value: err.response?.data?.ids?.length,
-            });
+            }) as string;
           } else if (err.response?.data?.enabled && err.response?.data?.limit) {
-            title = intl.formatMessage(messages.settingsTagsErrorTitle, { value: err.response.data.limit });
-            description = intl.formatMessage(messages.settingsTagsErrorDesc, { value: err.response.data.enabled });
+            title = intl.formatMessage(messages.settingsTagsErrorTitle, { value: err.response.data.limit }) as string;
+            description = intl.formatMessage(messages.settingsTagsErrorDesc, {
+              value: err.response.data.enabled,
+            }) as string;
           }
         } else if (settingsType === SettingsType.tagsMappingsChildAdd) {
           description = intl.formatMessage(messages.tagMappingAddErrorDesc);

src/utils/format.ts

@@ -73,7 +73,7 @@ export const formatCurrencyAbbreviation: Formatter = (value, units = 'USD') => {
         minimumFractionDigits: 0,
         maximumFractionDigits: 0,
       }),
-    });
+    }) as string;
   }
 
   // If no format was found, format value without abbreviation