diff --git a/src/components/FormHelpMessage.js b/src/components/FormHelpMessage.js
deleted file mode 100644
index bec02c3d51f0..000000000000
--- a/src/components/FormHelpMessage.js
+++ /dev/null
@@ -1,62 +0,0 @@
-import PropTypes from 'prop-types';
-import React from 'react';
-import {View} from 'react-native';
-import _ from 'underscore';
-import * as Localize from '@libs/Localize';
-import stylePropTypes from '@styles/stylePropTypes';
-import useTheme from '@styles/themes/useTheme';
-import useThemeStyles from '@styles/useThemeStyles';
-import Icon from './Icon';
-import * as Expensicons from './Icon/Expensicons';
-import Text from './Text';
-
-const propTypes = {
-    /** Error or hint text. Ignored when children is not empty */
-    message: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.object]))]),
-
-    /** Children to render next to dot indicator */
-    children: PropTypes.node,
-
-    /** Indicates whether to show error or hint */
-    isError: PropTypes.bool,
-
-    /** Container style props */
-    style: stylePropTypes,
-};
-
-const defaultProps = {
-    message: '',
-    children: null,
-    isError: true,
-    style: [],
-};
-
-function FormHelpMessage(props) {
-    const theme = useTheme();
-    const styles = useThemeStyles();
-    if (_.isEmpty(props.message) && _.isEmpty(props.children)) {
-        return null;
-    }
-
-    const translatedMessage = Localize.translateIfPhraseKey(props.message);
-    return (
-        <View style={[styles.flexRow, styles.alignItemsCenter, styles.mt2, styles.mb1, ...props.style]}>
-            {props.isError && (
-                <Icon
-                    src={Expensicons.DotIndicator}
-                    fill={theme.danger}
-                />
-            )}
-
-            <View style={[styles.flex1, props.isError && styles.ml2]}>
-                {props.children || <Text style={[props.isError ? styles.formError : styles.formHelp, styles.mb0]}>{translatedMessage}</Text>}
-            </View>
-        </View>
-    );
-}
-
-FormHelpMessage.propTypes = propTypes;
-FormHelpMessage.defaultProps = defaultProps;
-FormHelpMessage.displayName = 'FormHelpMessage';
-
-export default FormHelpMessage;
diff --git a/src/components/FormHelpMessage.tsx b/src/components/FormHelpMessage.tsx
new file mode 100644
index 000000000000..27a1f5827d75
--- /dev/null
+++ b/src/components/FormHelpMessage.tsx
@@ -0,0 +1,49 @@
+import isEmpty from 'lodash/isEmpty';
+import React from 'react';
+import {StyleProp, View, ViewStyle} from 'react-native';
+import * as Localize from '@libs/Localize';
+import useTheme from '@styles/themes/useTheme';
+import useThemeStyles from '@styles/useThemeStyles';
+import Icon from './Icon';
+import * as Expensicons from './Icon/Expensicons';
+import Text from './Text';
+
+type FormHelpMessageProps = {
+    /** Error or hint text. Ignored when children is not empty */
+    message?: Localize.MaybePhraseKey;
+
+    /** Children to render next to dot indicator */
+    children?: React.ReactNode;
+
+    /** Indicates whether to show error or hint */
+    isError?: boolean;
+
+    /** Container style props */
+    style?: StyleProp<ViewStyle>;
+};
+
+function FormHelpMessage({message = '', children, isError = true, style}: FormHelpMessageProps) {
+    const theme = useTheme();
+    const styles = useThemeStyles();
+    if (isEmpty(message) && isEmpty(children)) {
+        return null;
+    }
+
+    const translatedMessage = Localize.translateIfPhraseKey(message);
+
+    return (
+        <View style={[styles.flexRow, styles.alignItemsCenter, styles.mt2, styles.mb1, style]}>
+            {isError && (
+                <Icon
+                    src={Expensicons.DotIndicator}
+                    fill={theme.danger}
+                />
+            )}
+            <View style={[styles.flex1, isError && styles.ml2]}>{children ?? <Text style={[isError ? styles.formError : styles.formHelp, styles.mb0]}>{translatedMessage}</Text>}</View>
+        </View>
+    );
+}
+
+FormHelpMessage.displayName = 'FormHelpMessage';
+
+export default FormHelpMessage;
diff --git a/src/components/SingleChoiceQuestion.tsx b/src/components/SingleChoiceQuestion.tsx
index 07d4dfe817dd..6a3a3d87ee8a 100644
--- a/src/components/SingleChoiceQuestion.tsx
+++ b/src/components/SingleChoiceQuestion.tsx
@@ -1,5 +1,6 @@
 import React, {ForwardedRef, forwardRef} from 'react';
 import {Text as RNText} from 'react-native';
+import type {MaybePhraseKey} from '@libs/Localize';
 import useThemeStyles from '@styles/useThemeStyles';
 import FormHelpMessage from './FormHelpMessage';
 import RadioButtons, {Choice} from './RadioButtons';
@@ -7,7 +8,7 @@ import Text from './Text';
 
 type SingleChoiceQuestionProps = {
     prompt: string;
-    errorText?: string | string[];
+    errorText?: MaybePhraseKey;
     possibleAnswers: Choice[];
     currentQuestionIndex: number;
     onInputChange: (value: string) => void;