diff --git a/src/frontend/src/components/tableComponent/index.tsx b/src/frontend/src/components/tableComponent/index.tsx
index 54c159856..7c3a540f7 100644
--- a/src/frontend/src/components/tableComponent/index.tsx
+++ b/src/frontend/src/components/tableComponent/index.tsx
@@ -8,7 +8,7 @@ import {
 } from "../../constants/constants";
 import { useDarkStore } from "../../stores/darkStore";
 import "../../style/ag-theme-shadcn.css"; // Custom CSS applied to the grid
-import { cn, toTitleCase } from "../../utils/utils";
+import { cn } from "../../utils/utils";
 import ForwardedIconComponent from "../genericIconComponent";
 import { Alert, AlertDescription, AlertTitle } from "../ui/alert";
 import TableOptions from "./components/TableOptions";
@@ -35,7 +35,7 @@ const TableComponent = forwardRef<
       alertDescription = DEFAULT_TABLE_ALERT_MSG,
       ...props
     },
-    ref,
+    ref
   ) => {
     let colDef = props.columnDefs.map((col, index) => {
       let newCol = {
@@ -110,7 +110,7 @@ const TableComponent = forwardRef<
     };
     const onColumnMoved = (params) => {
       const updatedColumnDefs = makeLastColumnNonResizable(
-        params.columnApi.getAllGridColumns().map((col) => col.getColDef()),
+        params.columnApi.getAllGridColumns().map((col) => col.getColDef())
       );
       params.api.setGridOption("columnDefs", updatedColumnDefs);
       if (props.onColumnMoved) props.onColumnMoved(params);
@@ -134,7 +134,7 @@ const TableComponent = forwardRef<
         className={cn(
           dark ? "ag-theme-quartz-dark" : "ag-theme-quartz",
           "ag-theme-shadcn flex h-full flex-col",
-          "relative",
+          "relative"
         )} // applying the grid theme
       >
         <AgGridReact
@@ -152,7 +152,7 @@ const TableComponent = forwardRef<
             if (e.sources.some((source) => source.includes("column"))) {
               localStorage.setItem(
                 storeReference,
-                JSON.stringify(realRef.current?.api?.getColumnState()),
+                JSON.stringify(realRef.current?.api?.getColumnState())
               );
               setColumnStateChange(true);
             }
@@ -175,7 +175,7 @@ const TableComponent = forwardRef<
         )}
       </div>
     );
-  },
+  }
 );
 
 export default TableComponent;
diff --git a/src/frontend/src/utils/utils.ts b/src/frontend/src/utils/utils.ts
index 92e0efe98..53dad718c 100644
--- a/src/frontend/src/utils/utils.ts
+++ b/src/frontend/src/utils/utils.ts
@@ -364,7 +364,7 @@ export function extractColumnsFromRows(
   function intersection() {
     for (const key in rows[0]) {
       columnsKeys[key] = {
-        headerName: toTitleCase(key),
+        headerName: key,
         field: key,
         cellRenderer: TableAutoCellRender,
         filter: true,
@@ -382,7 +382,7 @@ export function extractColumnsFromRows(
     for (const row of rows) {
       for (const key in row) {
         columnsKeys[key] = {
-          headerName: toTitleCase(key),
+          headerName: key,
           field: key,
           filter: true,
           cellRenderer: TableAutoCellRender,