types for our friend feroze

dashboard/src/main/home/project-settings/Bars.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React from "react";
 import {
   Bar,
   BarChart,
@@ -14,7 +14,7 @@ import styled from "styled-components";
 import Text from "components/porter/Text";
 
 type Props = {
-  data: any;
+  data: Array<Record<string, unknown>>;
   yKey: string;
   xKey: string;
   fill?: string;

dashboard/src/main/home/project-settings/BillingPage.tsx

@@ -50,22 +50,27 @@ function BillingPage(): JSX.Element {
     const before = usage;
     const resultMap = new Map();
 
-    before?.forEach((metric) => {
-      const metricName = metric.metric_name.toLowerCase().replace(" ", "_");
-      metric.usage_metrics.forEach(({ starting_on, value }) => {
-        if (resultMap.has(starting_on)) {
-          resultMap.get(starting_on)[metricName] = value;
-        } else {
-          resultMap.set(starting_on, {
-            starting_on: new Date(starting_on).toLocaleDateString("en-US", {
-              month: "short",
-              day: "numeric",
-            }),
-            [metricName]: value,
-          });
-        }
-      });
-    });
+    before?.forEach(
+      (metric: {
+        metric_name: string;
+        usage_metrics: Array<{ starting_on: string; value: number }>;
+      }) => {
+        const metricName = metric.metric_name.toLowerCase().replace(" ", "_");
+        metric.usage_metrics.forEach(({ starting_on, value }) => {
+          if (resultMap.has(starting_on)) {
+            resultMap.get(starting_on)[metricName] = value;
+          } else {
+            resultMap.set(starting_on, {
+              starting_on: new Date(starting_on).toLocaleDateString("en-US", {
+                month: "short",
+                day: "numeric",
+              }),
+              [metricName]: value,
+            });
+          }
+        });
+      }
+    );
 
     // Convert the map to an array of values
     const x = Array.from(resultMap.values());