diff --git a/apps/meteor/client/views/room/contextualBar/AutoTranslate/AutoTranslate.js b/apps/meteor/client/views/room/contextualBar/AutoTranslate/AutoTranslate.tsx
similarity index 76%
rename from apps/meteor/client/views/room/contextualBar/AutoTranslate/AutoTranslate.js
rename to apps/meteor/client/views/room/contextualBar/AutoTranslate/AutoTranslate.tsx
index 98acd98ed4ddc..30b815fbb0987 100644
--- a/apps/meteor/client/views/room/contextualBar/AutoTranslate/AutoTranslate.js
+++ b/apps/meteor/client/views/room/contextualBar/AutoTranslate/AutoTranslate.tsx
@@ -1,10 +1,20 @@
 import { FieldGroup, Field, ToggleSwitch, Select } from '@rocket.chat/fuselage';
+import type { SelectOption } from '@rocket.chat/fuselage';
 import { useTranslation } from '@rocket.chat/ui-contexts';
 import React from 'react';
 
 import VerticalBar from '../../../../components/VerticalBar';
 
-const AutoTranslate = ({ language, languages, handleSwitch, translateEnable, handleChangeLanguage, handleClose }) => {
+type AutoTranslateProps = {
+	language: string;
+	languages: SelectOption[];
+	handleSwitch: (event?: any) => void;
+	translateEnable: boolean | undefined;
+	handleChangeLanguage: (value: string) => void;
+	handleClose?: () => void;
+};
+
+const AutoTranslate = ({ language, languages, handleSwitch, translateEnable, handleChangeLanguage, handleClose }: AutoTranslateProps) => {
 	const t = useTranslation();
 
 	return (