diff --git a/apps/meteor/client/views/omnichannel/analytics/InterchangeableChart.tsx b/apps/meteor/client/views/omnichannel/analytics/InterchangeableChart.tsx
index 872bb4f05b0d..e51cacf76c83 100644
--- a/apps/meteor/client/views/omnichannel/analytics/InterchangeableChart.tsx
+++ b/apps/meteor/client/views/omnichannel/analytics/InterchangeableChart.tsx
@@ -94,7 +94,7 @@ const InterchangeableChart = ({
 		});
 	}, [chartName, departmentId, draw, end, start, t, loadData]);
 
-	return <Chart ref={canvas} {...props} />;
+	return <Chart canvasRef={canvas} {...props} />;
 };
 
 export default InterchangeableChart;
diff --git a/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/AgentStatusChart.js b/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/AgentStatusChart.js
index 4564a859ccf5..4724bea74350 100644
--- a/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/AgentStatusChart.js
+++ b/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/AgentStatusChart.js
@@ -60,7 +60,7 @@ const AgentStatusChart = ({ params, reloadRef, ...props }) => {
 		}
 	}, [available, away, busy, offline, state, t, updateChartData]);
 
-	return <Chart ref={canvas} {...props} />;
+	return <Chart canvasRef={canvas} {...props} />;
 };
 
 export default AgentStatusChart;
diff --git a/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/Chart.js b/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/Chart.js
deleted file mode 100644
index 8ba5066c1706..000000000000
--- a/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/Chart.js
+++ /dev/null
@@ -1,15 +0,0 @@
-import { Box } from '@rocket.chat/fuselage';
-import React, { forwardRef } from 'react';
-
-const style = {
-	minHeight: '250px',
-};
-const Chart = forwardRef(function Chart(props, ref) {
-	return (
-		<Box padding='x20' height='x300' {...props}>
-			<canvas ref={ref} style={style}></canvas>
-		</Box>
-	);
-});
-
-export default Chart;
diff --git a/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/Chart.tsx b/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/Chart.tsx
new file mode 100644
index 000000000000..5a47906ce92d
--- /dev/null
+++ b/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/Chart.tsx
@@ -0,0 +1,16 @@
+import { Box } from '@rocket.chat/fuselage';
+import type { MutableRefObject } from 'react';
+import React from 'react';
+
+type ChartProps = { canvasRef: MutableRefObject<HTMLCanvasElement | null> };
+
+const style = {
+	minHeight: '250px',
+};
+const Chart = ({ canvasRef, ...props }: ChartProps) => (
+	<Box padding='x20' height='x300' {...props}>
+		<canvas ref={canvasRef} style={style}></canvas>
+	</Box>
+);
+
+export default Chart;
diff --git a/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ChatDurationChart.js b/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ChatDurationChart.js
index d85fe1d3799d..b4e155394f68 100644
--- a/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ChatDurationChart.js
+++ b/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ChatDurationChart.js
@@ -72,7 +72,7 @@ const ChatDurationChart = ({ params, reloadRef, ...props }) => {
 		}
 	}, [avg, longest, state, t, updateChartData]);
 
-	return <Chart ref={canvas} {...props} />;
+	return <Chart canvasRef={canvas} {...props} />;
 };
 
 export default ChatDurationChart;
diff --git a/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ChatsChart.js b/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ChatsChart.js
index cbe1285931d7..5a540dcd2dbd 100644
--- a/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ChatsChart.js
+++ b/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ChatsChart.js
@@ -60,7 +60,7 @@ const ChatsChart = ({ params, reloadRef, ...props }) => {
 		}
 	}, [closed, open, queued, onhold, state, t, updateChartData]);
 
-	return <Chart ref={canvas} {...props} />;
+	return <Chart canvasRef={canvas} {...props} />;
 };
 
 export default ChatsChart;
diff --git a/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ChatsPerAgentChart.js b/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ChatsPerAgentChart.js
index 6c7741781e1b..48b0bdbf655e 100644
--- a/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ChatsPerAgentChart.js
+++ b/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ChatsPerAgentChart.js
@@ -56,7 +56,7 @@ const ChatsPerAgentChart = ({ params, reloadRef, ...props }) => {
 		}
 	}, [chartData, state, t, updateChartData]);
 
-	return <Chart ref={canvas} {...props} />;
+	return <Chart canvasRef={canvas} {...props} />;
 };
 
 export default ChatsPerAgentChart;
diff --git a/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ChatsPerDepartmentChart.js b/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ChatsPerDepartmentChart.js
index 030fcedc0576..fbfe91695626 100644
--- a/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ChatsPerDepartmentChart.js
+++ b/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ChatsPerDepartmentChart.js
@@ -59,7 +59,7 @@ const ChatsPerDepartmentChart = ({ params, reloadRef, ...props }) => {
 		}
 	}, [chartData, state, t, updateChartData]);
 
-	return <Chart ref={canvas} {...props} />;
+	return <Chart canvasRef={canvas} {...props} />;
 };
 
 export default ChatsPerDepartmentChart;
diff --git a/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ResponseTimesChart.js b/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ResponseTimesChart.js
index ac0500ebf4da..cfc33687c8fc 100644
--- a/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ResponseTimesChart.js
+++ b/apps/meteor/client/views/omnichannel/realTimeMonitoring/charts/ResponseTimesChart.js
@@ -78,7 +78,7 @@ const ResponseTimesChart = ({ params, reloadRef, ...props }) => {
 		}
 	}, [reactionAvg, reactionLongest, responseAvg, responseLongest, state, t, updateChartData]);
 
-	return <Chart ref={canvas} {...props} />;
+	return <Chart canvasRef={canvas} {...props} />;
 };
 
 export default ResponseTimesChart;