diff --git a/src/components/AmountPicker/index.tsx b/src/components/AmountPicker/index.tsx
index 45e511f24748..014932f7736b 100644
--- a/src/components/AmountPicker/index.tsx
+++ b/src/components/AmountPicker/index.tsx
@@ -1,17 +1,15 @@
 import React, {forwardRef, useState} from 'react';
 import type {ForwardedRef} from 'react';
 import {View} from 'react-native';
-import FormHelpMessage from '@components/FormHelpMessage';
 import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
 import useStyleUtils from '@hooks/useStyleUtils';
-import useThemeStyles from '@hooks/useThemeStyles';
 import variables from '@styles/variables';
+import CONST from '@src/CONST';
 import callOrReturn from '@src/types/utils/callOrReturn';
 import AmountSelectorModal from './AmountSelectorModal';
 import type {AmountPickerProps} from './types';
 
 function AmountPicker({value, description, title, errorText = '', onInputChange, furtherDetails, rightLabel, ...rest}: AmountPickerProps, forwardedRef: ForwardedRef<View>) {
-    const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
     const [isPickerVisible, setIsPickerVisible] = useState(false);
 
@@ -43,11 +41,10 @@ function AmountPicker({value, description, title, errorText = '', onInputChange,
                 description={description}
                 onPress={showPickerModal}
                 furtherDetails={furtherDetails}
+                brickRoadIndicator={errorText ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
                 rightLabel={rightLabel}
+                errorText={errorText}
             />
-            <View style={styles.ml5}>
-                <FormHelpMessage message={errorText} />
-            </View>
             <AmountSelectorModal
                 // eslint-disable-next-line react/jsx-props-no-spreading
                 {...rest}
diff --git a/src/components/CountrySelector.tsx b/src/components/CountrySelector.tsx
index dc0201747da2..002c0c6d4b0a 100644
--- a/src/components/CountrySelector.tsx
+++ b/src/components/CountrySelector.tsx
@@ -1,14 +1,14 @@
 import {useIsFocused} from '@react-navigation/native';
 import React, {forwardRef, useEffect, useRef} from 'react';
 import type {ForwardedRef} from 'react';
-import {View} from 'react-native';
+import type {View} from 'react-native';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import type {MaybePhraseKey} from '@libs/Localize';
 import Navigation from '@libs/Navigation/Navigation';
+import CONST from '@src/CONST';
 import type {Country} from '@src/CONST';
 import ROUTES from '@src/ROUTES';
-import FormHelpMessage from './FormHelpMessage';
 import MenuItemWithTopDescription from './MenuItemWithTopDescription';
 
 type CountrySelectorProps = {
@@ -53,23 +53,20 @@ function CountrySelector({errorText = '', value: countryCode, onInputChange = ()
     }, [countryCode]);
 
     return (
-        <View>
-            <MenuItemWithTopDescription
-                shouldShowRightIcon
-                title={title}
-                ref={ref}
-                descriptionTextStyle={countryTitleDescStyle}
-                description={translate('common.country')}
-                onPress={() => {
-                    const activeRoute = Navigation.getActiveRouteWithoutParams();
-                    didOpenContrySelector.current = true;
-                    Navigation.navigate(ROUTES.SETTINGS_ADDRESS_COUNTRY.getRoute(countryCode ?? '', activeRoute));
-                }}
-            />
-            <View style={styles.ml5}>
-                <FormHelpMessage message={errorText} />
-            </View>
-        </View>
+        <MenuItemWithTopDescription
+            shouldShowRightIcon
+            title={title}
+            ref={ref}
+            descriptionTextStyle={countryTitleDescStyle}
+            brickRoadIndicator={errorText ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
+            description={translate('common.country')}
+            errorText={errorText}
+            onPress={() => {
+                const activeRoute = Navigation.getActiveRouteWithoutParams();
+                didOpenContrySelector.current = true;
+                Navigation.navigate(ROUTES.SETTINGS_ADDRESS_COUNTRY.getRoute(countryCode ?? '', activeRoute));
+            }}
+        />
     );
 }
 
diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx
index 42de7e2fb7f4..eb525ef3d1ff 100644
--- a/src/components/MenuItem.tsx
+++ b/src/components/MenuItem.tsx
@@ -150,12 +150,12 @@ type MenuItemBaseProps = {
     /** Should the description be shown above the title (instead of the other way around) */
     shouldShowDescriptionOnTop?: boolean;
 
-    /** Error to display below the title */
-    error?: string;
-
     /** Error to display at the bottom of the component */
     errorText?: MaybePhraseKey;
 
+    /** Hint to display at the bottom of the component */
+    hintText?: MaybePhraseKey;
+
     /** A boolean flag that gives the icon a green fill if true */
     success?: boolean;
 
@@ -304,8 +304,8 @@ function MenuItem(
         description,
         helperText,
         helperTextStyle,
-        error,
         errorText,
+        hintText,
         success = false,
         focused = false,
         disabled = false,
@@ -455,7 +455,6 @@ function MenuItem(
                         style={({pressed}) =>
                             [
                                 containerStyle,
-                                errorText ? styles.pb5 : {},
                                 combinedStyle,
                                 !interactive && styles.cursorDefault,
                                 StyleUtils.getButtonBackgroundColorStyle(getButtonState(focused || isHovered, pressed, success, disabled, interactive), true),
@@ -473,206 +472,208 @@ function MenuItem(
                         onFocus={onFocus}
                     >
                         {({pressed}) => (
-                            <>
-                                <View style={[styles.flexColumn, styles.flex1]}>
-                                    {!!label && isLabelHoverable && (
-                                        <View style={[icon ? styles.mb2 : null, labelStyle]}>
-                                            <Text style={StyleUtils.combineStyles([styles.sidebarLinkText, styles.optionAlternateText, styles.textLabelSupporting, styles.pre])}>
-                                                {label}
-                                            </Text>
-                                        </View>
-                                    )}
-                                    <View style={[styles.flexRow, styles.pointerEventsAuto, disabled && !shouldUseDefaultCursorWhenDisabled && styles.cursorDisabled]}>
-                                        {!!icon && Array.isArray(icon) && (
-                                            <MultipleAvatars
-                                                isHovered={isHovered}
-                                                isPressed={pressed}
-                                                icons={icon as IconType[]}
-                                                size={avatarSize}
-                                                secondAvatarStyle={[
-                                                    StyleUtils.getBackgroundAndBorderStyle(theme.sidebar),
-                                                    pressed && interactive ? StyleUtils.getBackgroundAndBorderStyle(theme.buttonPressedBG) : undefined,
-                                                    isHovered && !pressed && interactive ? StyleUtils.getBackgroundAndBorderStyle(theme.border) : undefined,
-                                                ]}
-                                            />
+                            <View style={[styles.flexColumn, styles.flex1]}>
+                                <View style={[styles.flexRow, styles.flex1]}>
+                                    <View style={[styles.flexColumn, styles.flex1]}>
+                                        {!!label && isLabelHoverable && (
+                                            <View style={[icon ? styles.mb2 : null, labelStyle]}>
+                                                <Text style={StyleUtils.combineStyles([styles.sidebarLinkText, styles.optionAlternateText, styles.textLabelSupporting, styles.pre])}>
+                                                    {label}
+                                                </Text>
+                                            </View>
                                         )}
-                                        {!icon && shouldPutLeftPaddingWhenNoIcon && <View style={[styles.popoverMenuIcon, iconStyles, StyleUtils.getAvatarWidthStyle(avatarSize)]} />}
-                                        {icon && !Array.isArray(icon) && (
-                                            <View style={[styles.popoverMenuIcon, iconStyles, StyleUtils.getAvatarWidthStyle(avatarSize)]}>
-                                                {typeof icon !== 'string' && iconType === CONST.ICON_TYPE_ICON && (
+                                        <View style={[styles.flexRow, styles.pointerEventsAuto, disabled && !shouldUseDefaultCursorWhenDisabled && styles.cursorDisabled]}>
+                                            {!!icon && Array.isArray(icon) && (
+                                                <MultipleAvatars
+                                                    isHovered={isHovered}
+                                                    isPressed={pressed}
+                                                    icons={icon as IconType[]}
+                                                    size={avatarSize}
+                                                    secondAvatarStyle={[
+                                                        StyleUtils.getBackgroundAndBorderStyle(theme.sidebar),
+                                                        pressed && interactive ? StyleUtils.getBackgroundAndBorderStyle(theme.buttonPressedBG) : undefined,
+                                                        isHovered && !pressed && interactive ? StyleUtils.getBackgroundAndBorderStyle(theme.border) : undefined,
+                                                    ]}
+                                                />
+                                            )}
+                                            {!icon && shouldPutLeftPaddingWhenNoIcon && <View style={[styles.popoverMenuIcon, iconStyles, StyleUtils.getAvatarWidthStyle(avatarSize)]} />}
+                                            {icon && !Array.isArray(icon) && (
+                                                <View style={[styles.popoverMenuIcon, iconStyles, StyleUtils.getAvatarWidthStyle(avatarSize)]}>
+                                                    {typeof icon !== 'string' && iconType === CONST.ICON_TYPE_ICON && (
+                                                        <Icon
+                                                            contentFit={contentFit}
+                                                            hovered={isHovered}
+                                                            pressed={pressed}
+                                                            src={icon}
+                                                            width={iconWidth}
+                                                            height={iconHeight}
+                                                            fill={
+                                                                displayInDefaultIconColor
+                                                                    ? undefined
+                                                                    : iconFill ??
+                                                                      StyleUtils.getIconFillColor(
+                                                                          getButtonState(focused || isHovered, pressed, success, disabled, interactive),
+                                                                          true,
+                                                                          isPaneMenu,
+                                                                      )
+                                                            }
+                                                        />
+                                                    )}
+                                                    {icon && iconType === CONST.ICON_TYPE_WORKSPACE && (
+                                                        <Avatar
+                                                            imageStyles={[styles.alignSelfCenter]}
+                                                            size={CONST.AVATAR_SIZE.DEFAULT}
+                                                            source={icon as AvatarSource}
+                                                            fallbackIcon={fallbackIcon}
+                                                            name={title}
+                                                            type={CONST.ICON_TYPE_WORKSPACE}
+                                                        />
+                                                    )}
+                                                    {iconType === CONST.ICON_TYPE_AVATAR && (
+                                                        <Avatar
+                                                            imageStyles={[styles.alignSelfCenter]}
+                                                            source={icon as AvatarSource}
+                                                            fallbackIcon={fallbackIcon}
+                                                            size={avatarSize}
+                                                        />
+                                                    )}
+                                                </View>
+                                            )}
+                                            {secondaryIcon && (
+                                                <View style={[styles.popoverMenuIcon, iconStyles]}>
                                                     <Icon
                                                         contentFit={contentFit}
-                                                        hovered={isHovered}
-                                                        pressed={pressed}
-                                                        src={icon}
+                                                        src={secondaryIcon}
                                                         width={iconWidth}
                                                         height={iconHeight}
                                                         fill={
-                                                            displayInDefaultIconColor
-                                                                ? undefined
-                                                                : iconFill ??
-                                                                  StyleUtils.getIconFillColor(getButtonState(focused || isHovered, pressed, success, disabled, interactive), true, isPaneMenu)
+                                                            secondaryIconFill ??
+                                                            StyleUtils.getIconFillColor(getButtonState(focused || isHovered, pressed, success, disabled, interactive), true)
                                                         }
                                                     />
-                                                )}
-                                                {icon && iconType === CONST.ICON_TYPE_WORKSPACE && (
-                                                    <Avatar
-                                                        imageStyles={[styles.alignSelfCenter]}
-                                                        size={CONST.AVATAR_SIZE.DEFAULT}
-                                                        source={icon as AvatarSource}
-                                                        fallbackIcon={fallbackIcon}
-                                                        name={title}
-                                                        type={CONST.ICON_TYPE_WORKSPACE}
-                                                    />
-                                                )}
-                                                {iconType === CONST.ICON_TYPE_AVATAR && (
-                                                    <Avatar
-                                                        imageStyles={[styles.alignSelfCenter]}
-                                                        source={icon as AvatarSource}
-                                                        fallbackIcon={fallbackIcon}
-                                                        size={avatarSize}
-                                                    />
-                                                )}
-                                            </View>
-                                        )}
-                                        {secondaryIcon && (
-                                            <View style={[styles.popoverMenuIcon, iconStyles]}>
-                                                <Icon
-                                                    contentFit={contentFit}
-                                                    src={secondaryIcon}
-                                                    width={iconWidth}
-                                                    height={iconHeight}
-                                                    fill={
-                                                        secondaryIconFill ?? StyleUtils.getIconFillColor(getButtonState(focused || isHovered, pressed, success, disabled, interactive), true)
-                                                    }
-                                                />
-                                            </View>
-                                        )}
-                                        <View style={[styles.justifyContentCenter, styles.flex1, StyleUtils.getMenuItemTextContainerStyle(isSmallAvatarSubscriptMenu)]}>
-                                            {!!description && shouldShowDescriptionOnTop && (
-                                                <Text
-                                                    style={descriptionTextStyles}
-                                                    numberOfLines={numberOfLinesDescription}
-                                                >
-                                                    {description}
-                                                </Text>
+                                                </View>
                                             )}
-                                            <View style={[styles.flexRow, styles.alignItemsCenter]}>
-                                                {!!title && (shouldRenderAsHTML || (shouldParseTitle && !!html.length)) && (
-                                                    <View style={styles.renderHTMLTitle}>
-                                                        <RenderHTML html={processedTitle} />
-                                                    </View>
-                                                )}
-                                                {!shouldRenderAsHTML && !shouldParseTitle && !!title && (
+                                            <View style={[styles.justifyContentCenter, styles.flex1, StyleUtils.getMenuItemTextContainerStyle(isSmallAvatarSubscriptMenu)]}>
+                                                {!!description && shouldShowDescriptionOnTop && (
                                                     <Text
-                                                        style={combinedTitleTextStyle}
-                                                        numberOfLines={numberOfLinesTitle || undefined}
-                                                        dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: interactive && disabled}}
+                                                        style={descriptionTextStyles}
+                                                        numberOfLines={numberOfLinesDescription}
                                                     >
-                                                        {renderTitleContent()}
+                                                        {description}
                                                     </Text>
                                                 )}
-                                                {shouldShowTitleIcon && titleIcon && (
-                                                    <View style={[styles.ml2]}>
-                                                        <Icon
-                                                            src={titleIcon}
-                                                            fill={theme.iconSuccessFill}
-                                                        />
-                                                    </View>
-                                                )}
-                                            </View>
-                                            {!!description && !shouldShowDescriptionOnTop && (
-                                                <Text
-                                                    style={descriptionTextStyles}
-                                                    numberOfLines={numberOfLinesDescription}
-                                                >
-                                                    {description}
-                                                </Text>
-                                            )}
-                                            {!!error && (
-                                                <View style={[styles.mt1]}>
-                                                    <Text style={[styles.textLabelError]}>{error}</Text>
-                                                </View>
-                                            )}
-                                            {!!furtherDetails && (
-                                                <View style={[styles.flexRow, styles.mt1, styles.alignItemsCenter]}>
-                                                    {!!furtherDetailsIcon && (
-                                                        <Icon
-                                                            src={furtherDetailsIcon}
-                                                            height={variables.iconSizeNormal}
-                                                            width={variables.iconSizeNormal}
-                                                            inline
-                                                        />
+                                                <View style={[styles.flexRow, styles.alignItemsCenter]}>
+                                                    {!!title && (shouldRenderAsHTML || (shouldParseTitle && !!html.length)) && (
+                                                        <View style={styles.renderHTMLTitle}>
+                                                            <RenderHTML html={processedTitle} />
+                                                        </View>
+                                                    )}
+                                                    {!shouldRenderAsHTML && !shouldParseTitle && !!title && (
+                                                        <Text
+                                                            style={combinedTitleTextStyle}
+                                                            numberOfLines={numberOfLinesTitle || undefined}
+                                                            dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: interactive && disabled}}
+                                                        >
+                                                            {renderTitleContent()}
+                                                        </Text>
+                                                    )}
+                                                    {shouldShowTitleIcon && titleIcon && (
+                                                        <View style={[styles.ml2]}>
+                                                            <Icon
+                                                                src={titleIcon}
+                                                                fill={theme.iconSuccessFill}
+                                                            />
+                                                        </View>
                                                     )}
+                                                </View>
+                                                {!!description && !shouldShowDescriptionOnTop && (
                                                     <Text
-                                                        style={furtherDetailsIcon ? [styles.furtherDetailsText, styles.ph2, styles.pt1] : styles.textLabelSupporting}
-                                                        numberOfLines={2}
+                                                        style={descriptionTextStyles}
+                                                        numberOfLines={numberOfLinesDescription}
                                                     >
-                                                        {furtherDetails}
+                                                        {description}
                                                     </Text>
-                                                </View>
-                                            )}
+                                                )}
+                                                {!!furtherDetails && (
+                                                    <View style={[styles.flexRow, styles.mt1, styles.alignItemsCenter]}>
+                                                        {!!furtherDetailsIcon && (
+                                                            <Icon
+                                                                src={furtherDetailsIcon}
+                                                                height={variables.iconSizeNormal}
+                                                                width={variables.iconSizeNormal}
+                                                                inline
+                                                            />
+                                                        )}
+                                                        <Text
+                                                            style={furtherDetailsIcon ? [styles.furtherDetailsText, styles.ph2, styles.pt1] : styles.textLabelSupporting}
+                                                            numberOfLines={2}
+                                                        >
+                                                            {furtherDetails}
+                                                        </Text>
+                                                    </View>
+                                                )}
+                                            </View>
                                         </View>
                                     </View>
-                                </View>
-                                <View style={[styles.flexRow, styles.menuItemTextContainer, !hasPressableRightComponent && styles.pointerEventsNone]}>
-                                    {badgeText && (
-                                        <Badge
-                                            text={badgeText}
-                                            badgeStyles={badgeStyle}
-                                        />
-                                    )}
-                                    {/* Since subtitle can be of type number, we should allow 0 to be shown */}
-                                    {(subtitle === 0 || subtitle) && (
-                                        <View style={[styles.justifyContentCenter, styles.mr1]}>
-                                            <Text style={[styles.textLabelSupporting, ...(combinedStyle as TextStyle[])]}>{subtitle}</Text>
-                                        </View>
-                                    )}
-                                    {floatRightAvatars?.length > 0 && (
-                                        <View style={[styles.alignItemsCenter, styles.justifyContentCenter, brickRoadIndicator ? styles.mr2 : styles.mrn2]}>
-                                            {shouldShowSubscriptRightAvatar ? (
-                                                <SubscriptAvatar
-                                                    backgroundColor={isHovered ? theme.activeComponentBG : theme.componentBG}
-                                                    mainAvatar={floatRightAvatars[0]}
-                                                    secondaryAvatar={floatRightAvatars[1]}
-                                                    size={floatRightAvatarSize ?? fallbackAvatarSize}
+                                    <View style={[styles.flexRow, styles.menuItemTextContainer, !hasPressableRightComponent && styles.pointerEventsNone]}>
+                                        {badgeText && (
+                                            <Badge
+                                                text={badgeText}
+                                                badgeStyles={badgeStyle}
+                                            />
+                                        )}
+                                        {/* Since subtitle can be of type number, we should allow 0 to be shown */}
+                                        {(subtitle === 0 || subtitle) && (
+                                            <View style={[styles.justifyContentCenter, styles.mr1]}>
+                                                <Text style={[styles.textLabelSupporting, ...(combinedStyle as TextStyle[])]}>{subtitle}</Text>
+                                            </View>
+                                        )}
+                                        {floatRightAvatars?.length > 0 && (
+                                            <View style={[styles.alignItemsCenter, styles.justifyContentCenter, brickRoadIndicator ? styles.mr2 : styles.mrn2]}>
+                                                {shouldShowSubscriptRightAvatar ? (
+                                                    <SubscriptAvatar
+                                                        backgroundColor={isHovered ? theme.activeComponentBG : theme.componentBG}
+                                                        mainAvatar={floatRightAvatars[0]}
+                                                        secondaryAvatar={floatRightAvatars[1]}
+                                                        size={floatRightAvatarSize ?? fallbackAvatarSize}
+                                                    />
+                                                ) : (
+                                                    <MultipleAvatars
+                                                        isHovered={isHovered}
+                                                        isPressed={pressed}
+                                                        icons={floatRightAvatars}
+                                                        size={floatRightAvatarSize ?? fallbackAvatarSize}
+                                                        fallbackIcon={defaultWorkspaceAvatars.WorkspaceBuilding}
+                                                        shouldStackHorizontally={shouldStackHorizontally}
+                                                        isFocusMode
+                                                    />
+                                                )}
+                                            </View>
+                                        )}
+                                        {!!brickRoadIndicator && (
+                                            <View style={[styles.alignItemsCenter, styles.justifyContentCenter, styles.ml1]}>
+                                                <Icon
+                                                    src={Expensicons.DotIndicator}
+                                                    fill={brickRoadIndicator === 'error' ? theme.danger : theme.success}
                                                 />
-                                            ) : (
-                                                <MultipleAvatars
-                                                    isHovered={isHovered}
-                                                    isPressed={pressed}
-                                                    icons={floatRightAvatars}
-                                                    size={floatRightAvatarSize ?? fallbackAvatarSize}
-                                                    fallbackIcon={defaultWorkspaceAvatars.WorkspaceBuilding}
-                                                    shouldStackHorizontally={shouldStackHorizontally}
-                                                    isFocusMode
+                                            </View>
+                                        )}
+                                        {!title && !!rightLabel && !errorText && (
+                                            <View style={styles.justifyContentCenter}>
+                                                <Text style={styles.rightLabelMenuItem}>{rightLabel}</Text>
+                                            </View>
+                                        )}
+                                        {shouldShowRightIcon && (
+                                            <View style={[styles.popoverMenuIcon, styles.pointerEventsAuto, disabled && !shouldUseDefaultCursorWhenDisabled && styles.cursorDisabled]}>
+                                                <Icon
+                                                    src={iconRight}
+                                                    fill={StyleUtils.getIconFillColor(getButtonState(focused || isHovered, pressed, success, disabled, interactive))}
                                                 />
-                                            )}
-                                        </View>
-                                    )}
-                                    {!!brickRoadIndicator && (
-                                        <View style={[styles.alignItemsCenter, styles.justifyContentCenter, styles.ml1, styles.mr2]}>
-                                            <Icon
-                                                src={Expensicons.DotIndicator}
-                                                fill={brickRoadIndicator === 'error' ? theme.danger : theme.success}
-                                            />
-                                        </View>
-                                    )}
-                                    {!title && !!rightLabel && (
-                                        <View style={styles.justifyContentCenter}>
-                                            <Text style={styles.rightLabelMenuItem}>{rightLabel}</Text>
-                                        </View>
-                                    )}
-                                    {shouldShowRightIcon && (
-                                        <View style={[styles.popoverMenuIcon, styles.pointerEventsAuto, disabled && !shouldUseDefaultCursorWhenDisabled && styles.cursorDisabled]}>
-                                            <Icon
-                                                src={iconRight}
-                                                fill={StyleUtils.getIconFillColor(getButtonState(focused || isHovered, pressed, success, disabled, interactive))}
-                                            />
-                                        </View>
-                                    )}
-                                    {shouldShowRightComponent && rightComponent}
-                                    {shouldShowSelectedState && <SelectCircle isChecked={isSelected} />}
+                                            </View>
+                                        )}
+                                        {shouldShowRightComponent && rightComponent}
+                                        {shouldShowSelectedState && <SelectCircle isChecked={isSelected} />}
+                                    </View>
                                 </View>
                                 {!!errorText && (
                                     <FormHelpMessage
@@ -682,7 +683,15 @@ function MenuItem(
                                         style={styles.menuItemError}
                                     />
                                 )}
-                            </>
+                                {!!hintText && (
+                                    <FormHelpMessage
+                                        isError={false}
+                                        shouldShowRedDotIndicator={false}
+                                        message={hintText}
+                                        style={styles.menuItemError}
+                                    />
+                                )}
+                            </View>
                         )}
                     </PressableWithSecondaryInteraction>
                 )}
diff --git a/src/components/MoneyRequestConfirmationList.tsx b/src/components/MoneyRequestConfirmationList.tsx
index 2c592c20f4c6..7d6d061d1ce5 100755
--- a/src/components/MoneyRequestConfirmationList.tsx
+++ b/src/components/MoneyRequestConfirmationList.tsx
@@ -803,7 +803,7 @@ function MoneyRequestConfirmationList({
                     titleStyle={styles.moneyRequestConfirmationAmount}
                     disabled={didConfirm}
                     brickRoadIndicator={shouldDisplayFieldError && TransactionUtils.isAmountMissing(transaction ?? null) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
-                    error={shouldDisplayFieldError && TransactionUtils.isAmountMissing(transaction ?? null) ? translate('common.error.enterAmount') : ''}
+                    errorText={shouldDisplayFieldError && TransactionUtils.isAmountMissing(transaction ?? null) ? translate('common.error.enterAmount') : ''}
                 />
             ),
             shouldShow: shouldShowSmartScanFields,
@@ -899,8 +899,8 @@ function MoneyRequestConfirmationList({
                     disabled={didConfirm}
                     interactive={!isReadOnly}
                     brickRoadIndicator={shouldDisplayMerchantError ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
-                    error={shouldDisplayMerchantError ? translate('common.error.fieldRequired') : ''}
-                    rightLabel={isMerchantRequired ? translate('common.required') : ''}
+                    errorText={shouldDisplayMerchantError ? translate('common.error.fieldRequired') : ''}
+                    rightLabel={isMerchantRequired && !shouldDisplayMerchantError ? translate('common.required') : ''}
                 />
             ),
             shouldShow: shouldShowMerchant,
@@ -922,7 +922,7 @@ function MoneyRequestConfirmationList({
                     disabled={didConfirm}
                     interactive={!isReadOnly}
                     brickRoadIndicator={shouldDisplayFieldError && TransactionUtils.isCreatedMissing(transaction) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
-                    error={shouldDisplayFieldError && TransactionUtils.isCreatedMissing(transaction) ? translate('common.error.enterDate') : ''}
+                    errorText={shouldDisplayFieldError && TransactionUtils.isCreatedMissing(transaction) ? translate('common.error.enterDate') : ''}
                 />
             ),
             shouldShow: shouldShowDate,
diff --git a/src/components/ReportActionItem/MoneyRequestView.tsx b/src/components/ReportActionItem/MoneyRequestView.tsx
index 9b7bfb2c2f17..73d3bfd19626 100644
--- a/src/components/ReportActionItem/MoneyRequestView.tsx
+++ b/src/components/ReportActionItem/MoneyRequestView.tsx
@@ -406,7 +406,7 @@ function MoneyRequestView({
                         shouldShowRightIcon={canEditAmount}
                         onPress={() => Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_AMOUNT.getRoute(CONST.IOU.ACTION.EDIT, iouType, transaction?.transactionID ?? '', report.reportID))}
                         brickRoadIndicator={getErrorForField('amount') ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
-                        error={getErrorForField('amount')}
+                        errorText={getErrorForField('amount')}
                     />
                 </OfflineWithFeedback>
                 <OfflineWithFeedback pendingAction={getPendingFieldAction('comment')}>
@@ -420,7 +420,7 @@ function MoneyRequestView({
                         onPress={() => Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_DESCRIPTION.getRoute(CONST.IOU.ACTION.EDIT, iouType, transaction?.transactionID ?? '', report.reportID))}
                         wrapperStyle={[styles.pv2, styles.taskDescriptionMenuItem]}
                         brickRoadIndicator={getErrorForField('comment') ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
-                        error={getErrorForField('comment')}
+                        errorText={getErrorForField('comment')}
                         numberOfLinesTitle={0}
                     />
                 </OfflineWithFeedback>
@@ -438,7 +438,7 @@ function MoneyRequestView({
                                 Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_MERCHANT.getRoute(CONST.IOU.ACTION.EDIT, iouType, transaction?.transactionID ?? '', report.reportID))
                             }
                             brickRoadIndicator={getErrorForField('merchant') ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
-                            error={getErrorForField('merchant')}
+                            errorText={getErrorForField('merchant')}
                         />
                     </OfflineWithFeedback>
                 )}
@@ -451,7 +451,7 @@ function MoneyRequestView({
                         titleStyle={styles.flex1}
                         onPress={() => Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_DATE.getRoute(CONST.IOU.ACTION.EDIT, iouType, transaction?.transactionID ?? '', report.reportID))}
                         brickRoadIndicator={getErrorForField('date') ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
-                        error={getErrorForField('date')}
+                        errorText={getErrorForField('date')}
                     />
                 </OfflineWithFeedback>
                 {shouldShowCategory && (
@@ -466,7 +466,7 @@ function MoneyRequestView({
                                 Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_CATEGORY.getRoute(CONST.IOU.ACTION.EDIT, iouType, transaction?.transactionID ?? '', report.reportID))
                             }
                             brickRoadIndicator={getErrorForField('category') ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
-                            error={getErrorForField('category')}
+                            errorText={getErrorForField('category')}
                         />
                     </OfflineWithFeedback>
                 )}
@@ -495,7 +495,7 @@ function MoneyRequestView({
                                         ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR
                                         : undefined
                                 }
-                                error={getErrorForField('tag', {tagListIndex: index, tagListName: name})}
+                                errorText={getErrorForField('tag', {tagListIndex: index, tagListName: name})}
                             />
                         </OfflineWithFeedback>
                     ))}
@@ -521,7 +521,7 @@ function MoneyRequestView({
                                 Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_TAX_RATE.getRoute(CONST.IOU.ACTION.EDIT, iouType, transaction?.transactionID ?? '', report.reportID))
                             }
                             brickRoadIndicator={getErrorForField('tax') ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
-                            error={getErrorForField('tax')}
+                            errorText={getErrorForField('tax')}
                         />
                     </OfflineWithFeedback>
                 )}
diff --git a/src/components/StateSelector.tsx b/src/components/StateSelector.tsx
index 18e6f45ed9e5..8cae007679ff 100644
--- a/src/components/StateSelector.tsx
+++ b/src/components/StateSelector.tsx
@@ -2,14 +2,14 @@ import {useIsFocused} from '@react-navigation/native';
 import {CONST as COMMON_CONST} from 'expensify-common/lib/CONST';
 import React, {useEffect, useRef} from 'react';
 import type {ForwardedRef} from 'react';
-import {View} from 'react-native';
+import type {View} from 'react-native';
 import useGeographicalStateFromRoute from '@hooks/useGeographicalStateFromRoute';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import type {MaybePhraseKey} from '@libs/Localize';
 import Navigation from '@libs/Navigation/Navigation';
+import CONST from '@src/CONST';
 import ROUTES from '@src/ROUTES';
-import FormHelpMessage from './FormHelpMessage';
 import type {MenuItemProps} from './MenuItem';
 import MenuItemWithTopDescription from './MenuItemWithTopDescription';
 
@@ -79,26 +79,23 @@ function StateSelector(
     const descStyle = title.length === 0 ? styles.textNormal : null;
 
     return (
-        <View>
-            <MenuItemWithTopDescription
-                descriptionTextStyle={descStyle}
-                ref={ref}
-                shouldShowRightIcon
-                title={title}
-                // Label can be an empty string
-                // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
-                description={label || translate('common.state')}
-                onPress={() => {
-                    const activeRoute = Navigation.getActiveRoute();
-                    didOpenStateSelector.current = true;
-                    Navigation.navigate(stateSelectorRoute.getRoute(stateCode, activeRoute, label));
-                }}
-                wrapperStyle={wrapperStyle}
-            />
-            <View style={styles.ml5}>
-                <FormHelpMessage message={errorText} />
-            </View>
-        </View>
+        <MenuItemWithTopDescription
+            descriptionTextStyle={descStyle}
+            ref={ref}
+            shouldShowRightIcon
+            title={title}
+            // Label can be an empty string
+            // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+            description={label || translate('common.state')}
+            brickRoadIndicator={errorText ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
+            errorText={errorText}
+            onPress={() => {
+                const activeRoute = Navigation.getActiveRoute();
+                didOpenStateSelector.current = true;
+                Navigation.navigate(stateSelectorRoute.getRoute(stateCode, activeRoute, label));
+            }}
+            wrapperStyle={wrapperStyle}
+        />
     );
 }
 
diff --git a/src/components/TextPicker/index.tsx b/src/components/TextPicker/index.tsx
index 00c22e8b75ee..0900884d874c 100644
--- a/src/components/TextPicker/index.tsx
+++ b/src/components/TextPicker/index.tsx
@@ -1,11 +1,11 @@
 import React, {forwardRef, useState} from 'react';
 import type {ForwardedRef} from 'react';
 import {View} from 'react-native';
-import FormHelpMessage from '@components/FormHelpMessage';
 import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
 import useStyleUtils from '@hooks/useStyleUtils';
 import useThemeStyles from '@hooks/useThemeStyles';
 import variables from '@styles/variables';
+import CONST from '@src/CONST';
 import TextSelectorModal from './TextSelectorModal';
 import type {TextPickerProps} from './types';
 
@@ -42,11 +42,10 @@ function TextPicker({value, description, placeholder = '', errorText = '', onInp
                 onPress={showPickerModal}
                 furtherDetails={furtherDetails}
                 rightLabel={rightLabel}
+                brickRoadIndicator={errorText ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
+                errorText={errorText}
                 style={[styles.moneyRequestMenuItem]}
             />
-            <View style={styles.ml5}>
-                <FormHelpMessage message={errorText} />
-            </View>
             <TextSelectorModal
                 value={value}
                 isVisible={isPickerVisible}
diff --git a/src/components/ValuePicker/index.tsx b/src/components/ValuePicker/index.tsx
index 4fb5a8b588b3..5b877e139af0 100644
--- a/src/components/ValuePicker/index.tsx
+++ b/src/components/ValuePicker/index.tsx
@@ -1,17 +1,15 @@
 import React, {forwardRef, useState} from 'react';
 import type {ForwardedRef} from 'react';
 import {View} from 'react-native';
-import FormHelpMessage from '@components/FormHelpMessage';
 import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
 import useStyleUtils from '@hooks/useStyleUtils';
-import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@libs/Navigation/Navigation';
 import variables from '@styles/variables';
+import CONST from '@src/CONST';
 import type {ValuePickerItem, ValuePickerProps} from './types';
 import ValueSelectorModal from './ValueSelectorModal';
 
 function ValuePicker({value, label, items, placeholder = '', errorText = '', onInputChange, furtherDetails, shouldShowTooltips = true}: ValuePickerProps, forwardedRef: ForwardedRef<View>) {
-    const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
     const [isPickerVisible, setIsPickerVisible] = useState(false);
 
@@ -44,10 +42,9 @@ function ValuePicker({value, label, items, placeholder = '', errorText = '', onI
                 description={label}
                 onPress={showPickerModal}
                 furtherDetails={furtherDetails}
+                brickRoadIndicator={errorText ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
+                errorText={errorText}
             />
-            <View style={styles.ml5}>
-                <FormHelpMessage message={errorText} />
-            </View>
             <ValueSelectorModal
                 isVisible={isPickerVisible}
                 label={label}
diff --git a/src/pages/ReimbursementAccount/BusinessInfo/substeps/TypeBusiness/BusinessTypePicker/index.tsx b/src/pages/ReimbursementAccount/BusinessInfo/substeps/TypeBusiness/BusinessTypePicker/index.tsx
index 60b73efd8305..2bd4df609da4 100644
--- a/src/pages/ReimbursementAccount/BusinessInfo/substeps/TypeBusiness/BusinessTypePicker/index.tsx
+++ b/src/pages/ReimbursementAccount/BusinessInfo/substeps/TypeBusiness/BusinessTypePicker/index.tsx
@@ -1,10 +1,10 @@
 import React, {useState} from 'react';
 import type {StyleProp, ViewStyle} from 'react-native';
 import {View} from 'react-native';
-import FormHelpMessage from '@components/FormHelpMessage';
 import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
+import CONST from '@src/CONST';
 import BusinessTypeSelectorModal from './BusinessTypeSelectorModal';
 import type {BusinessTypeItemType, IncorporationType} from './types';
 
@@ -65,11 +65,10 @@ function BusinessTypePicker({errorText = '', value = '', wrapperStyle, onInputCh
                 description={label}
                 descriptionTextStyle={descStyle}
                 onPress={showPickerModal}
+                brickRoadIndicator={errorText ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
+                errorText={errorText}
                 wrapperStyle={wrapperStyle}
             />
-            <View style={styles.ml5}>
-                <FormHelpMessage message={errorText} />
-            </View>
             <BusinessTypeSelectorModal
                 isVisible={isPickerVisible}
                 currentBusinessType={value}
diff --git a/src/pages/workspace/WorkspaceProfilePage.tsx b/src/pages/workspace/WorkspaceProfilePage.tsx
index 8500aecdcaa7..9e41cc2090bc 100644
--- a/src/pages/workspace/WorkspaceProfilePage.tsx
+++ b/src/pages/workspace/WorkspaceProfilePage.tsx
@@ -13,7 +13,6 @@ import * as Illustrations from '@components/Icon/Illustrations';
 import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
 import OfflineWithFeedback from '@components/OfflineWithFeedback';
 import Section from '@components/Section';
-import Text from '@components/Text';
 import useActiveWorkspace from '@hooks/useActiveWorkspace';
 import useLocalize from '@hooks/useLocalize';
 import usePermissions from '@hooks/usePermissions';
@@ -216,10 +215,8 @@ function WorkspaceProfilePage({policy, currencyList = {}, route}: WorkSpaceProfi
                                     onPress={onPressCurrency}
                                     shouldGreyOutWhenDisabled={false}
                                     shouldUseDefaultCursorWhenDisabled
+                                    hintText={hasVBA ? translate('workspace.editor.currencyInputDisabledText') : translate('workspace.editor.currencyInputHelpText')}
                                 />
-                                <Text style={[styles.textLabel, styles.colorMuted, styles.mt1, styles.mh5, styles.sectionMenuItemTopDescription]}>
-                                    {hasVBA ? translate('workspace.editor.currencyInputDisabledText') : translate('workspace.editor.currencyInputHelpText')}
-                                </Text>
                             </View>
                         </OfflineWithFeedback>
                         {canUseSpotnanaTravel && shouldShowAddress && (
diff --git a/src/pages/workspace/accounting/qbo/advanced/QuickbooksAdvancedPage.tsx b/src/pages/workspace/accounting/qbo/advanced/QuickbooksAdvancedPage.tsx
index a356b82a0c2b..3239be6f61b7 100644
--- a/src/pages/workspace/accounting/qbo/advanced/QuickbooksAdvancedPage.tsx
+++ b/src/pages/workspace/accounting/qbo/advanced/QuickbooksAdvancedPage.tsx
@@ -50,11 +50,10 @@ function QuickbooksAdvancedPage({policy}: WithPolicyConnectionsProps) {
                     description={translate('workspace.qbo.advancedConfig.qboBillPaymentAccount')}
                     wrapperStyle={[styles.sectionMenuItemTopDescription]}
                     onPress={waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_ACCOUNTING_QUICKBOOKS_ONLINE_ACCOUNT_SELECTOR.getRoute(policyID)))}
-                    error={errorFields?.reimbursementAccountID ? translate('common.genericErrorMessage') : undefined}
+                    errorText={errorFields?.reimbursementAccountID ? translate('common.genericErrorMessage') : undefined}
                     brickRoadIndicator={errorFields?.reimbursementAccountID ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
                 />
             </OfflineWithFeedback>
-
             <OfflineWithFeedback pendingAction={pendingFields?.collectionAccountID}>
                 <MenuItemWithTopDescription
                     shouldShowRightIcon
@@ -62,7 +61,7 @@ function QuickbooksAdvancedPage({policy}: WithPolicyConnectionsProps) {
                     description={translate('workspace.qbo.advancedConfig.qboInvoiceCollectionAccount')}
                     wrapperStyle={[styles.sectionMenuItemTopDescription]}
                     onPress={waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_ACCOUNTING_QUICKBOOKS_ONLINE_INVOICE_ACCOUNT_SELECTOR.getRoute(policyID)))}
-                    error={errorFields?.collectionAccountID ? translate('common.genericErrorMessage') : undefined}
+                    errorText={errorFields?.collectionAccountID ? translate('common.genericErrorMessage') : undefined}
                     brickRoadIndicator={errorFields?.collectionAccountID ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
                 />
             </OfflineWithFeedback>
diff --git a/src/pages/workspace/accounting/qbo/export/QuickbooksCompanyCardExpenseAccountPage.tsx b/src/pages/workspace/accounting/qbo/export/QuickbooksCompanyCardExpenseAccountPage.tsx
index b3fd41d9a342..e589cee0087b 100644
--- a/src/pages/workspace/accounting/qbo/export/QuickbooksCompanyCardExpenseAccountPage.tsx
+++ b/src/pages/workspace/accounting/qbo/export/QuickbooksCompanyCardExpenseAccountPage.tsx
@@ -42,24 +42,20 @@ function QuickbooksCompanyCardExpenseAccountPage({policy}: WithPolicyConnections
                         <MenuItemWithTopDescription
                             title={nonReimbursableExpensesExportDestination ? translate(`workspace.qbo.accounts.${nonReimbursableExpensesExportDestination}`) : undefined}
                             description={translate('workspace.qbo.exportCompany')}
-                            error={errorFields?.nonReimbursableExpensesExportDestination ? translate('common.genericErrorMessage') : undefined}
+                            errorText={errorFields?.nonReimbursableExpensesExportDestination ? translate('common.genericErrorMessage') : undefined}
                             onPress={() => Navigation.navigate(ROUTES.POLICY_ACCOUNTING_QUICKBOOKS_ONLINE_COMPANY_CARD_EXPENSE_SELECT.getRoute(policyID))}
                             brickRoadIndicator={errorFields?.nonReimbursableExpensesExportDestination ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
                             shouldShowRightIcon
+                            hintText={nonReimbursableExpensesExportDestination ? translate(`workspace.qbo.accounts.${nonReimbursableExpensesExportDestination}Description`) : undefined}
                         />
                     </OfflineWithFeedback>
-                    {!!nonReimbursableExpensesExportDestination && (
-                        <Text style={[styles.ph5, styles.mutedNormalTextLabel, styles.pt1, styles.pb2]}>
-                            {translate(`workspace.qbo.accounts.${nonReimbursableExpensesExportDestination}Description`)}
-                        </Text>
-                    )}
                     {isVendorSelected && (
                         <>
                             <OfflineWithFeedback pendingAction={pendingFields?.nonReimbursableExpensesAccount}>
                                 <MenuItemWithTopDescription
                                     title={nonReimbursableExpensesAccount?.name}
                                     description={translate('workspace.qbo.accountsPayable')}
-                                    error={errorFields?.nonReimbursableExpensesAccount ? translate('common.genericErrorMessage') : undefined}
+                                    errorText={errorFields?.nonReimbursableExpensesAccount ? translate('common.genericErrorMessage') : undefined}
                                     onPress={() => Navigation.navigate(ROUTES.POLICY_ACCOUNTING_QUICKBOOKS_ONLINE_COMPANY_CARD_EXPENSE_ACCOUNT_PAYABLE_SELECT.getRoute(policyID))}
                                     brickRoadIndicator={errorFields?.nonReimbursableExpensesAccount ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
                                     shouldShowRightIcon
@@ -83,7 +79,7 @@ function QuickbooksCompanyCardExpenseAccountPage({policy}: WithPolicyConnections
                             onPress={() => Navigation.navigate(ROUTES.POLICY_ACCOUNTING_QUICKBOOKS_ONLINE_NON_REIMBURSABLE_DEFAULT_VENDOR_SELECT.getRoute(policyID))}
                             brickRoadIndicator={errorFields?.nonReimbursableBillDefaultVendor ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
                             shouldShowRightIcon
-                            error={errorFields?.nonReimbursableBillDefaultVendor ? translate('common.genericErrorMessage') : undefined}
+                            errorText={errorFields?.nonReimbursableBillDefaultVendor ? translate('common.genericErrorMessage') : undefined}
                         />
                     </OfflineWithFeedback>
                 </ScrollView>
diff --git a/src/pages/workspace/accounting/qbo/export/QuickbooksExportConfigurationPage.tsx b/src/pages/workspace/accounting/qbo/export/QuickbooksExportConfigurationPage.tsx
index 527a55d41b30..e49536c33306 100644
--- a/src/pages/workspace/accounting/qbo/export/QuickbooksExportConfigurationPage.tsx
+++ b/src/pages/workspace/accounting/qbo/export/QuickbooksExportConfigurationPage.tsx
@@ -41,7 +41,7 @@ function QuickbooksExportConfigurationPage({policy}: WithPolicyConnectionsProps)
             brickRoadIndicator: errorFields?.exporter ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
             title: exportConfiguration?.exporter ?? policyOwner,
             pendingAction: pendingFields?.export,
-            error: errorFields?.exporter ? translate('common.genericErrorMessage') : undefined,
+            errorText: errorFields?.exporter ? translate('common.genericErrorMessage') : undefined,
         },
         {
             description: translate('workspace.qbo.date'),
@@ -49,7 +49,7 @@ function QuickbooksExportConfigurationPage({policy}: WithPolicyConnectionsProps)
             brickRoadIndicator: errorFields?.exportDate ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
             title: exportDate ? translate(`workspace.qbo.exportDate.values.${exportDate}.label`) : undefined,
             pendingAction: pendingFields?.exportDate,
-            error: errorFields?.exportDate ? translate('common.genericErrorMessage') : undefined,
+            errorText: errorFields?.exportDate ? translate('common.genericErrorMessage') : undefined,
         },
         {
             description: translate('workspace.qbo.exportExpenses'),
@@ -65,7 +65,7 @@ function QuickbooksExportConfigurationPage({policy}: WithPolicyConnectionsProps)
             brickRoadIndicator: errorFields?.receivableAccount ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
             title: receivableAccount?.name,
             pendingAction: pendingFields?.receivableAccount,
-            error: errorFields?.receivableAccount ? translate('common.genericErrorMessage') : undefined,
+            errorText: errorFields?.receivableAccount ? translate('common.genericErrorMessage') : undefined,
         },
         {
             description: translate('workspace.qbo.exportCompany'),
@@ -73,7 +73,7 @@ function QuickbooksExportConfigurationPage({policy}: WithPolicyConnectionsProps)
             brickRoadIndicator: errorFields?.exportCompanyCard ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
             title: nonReimbursableExpensesExportDestination ? translate(`workspace.qbo.accounts.${nonReimbursableExpensesExportDestination}`) : undefined,
             pendingAction: pendingFields?.nonReimbursableExpensesExportDestination,
-            error: errorFields?.nonReimbursableExpensesExportDestination ? translate('common.genericErrorMessage') : undefined,
+            errorText: errorFields?.nonReimbursableExpensesExportDestination ? translate('common.genericErrorMessage') : undefined,
         },
         {
             description: translate('workspace.qbo.exportExpensifyCard'),
@@ -108,9 +108,7 @@ function QuickbooksExportConfigurationPage({policy}: WithPolicyConnectionsProps)
                                 shouldShowRightIcon={menuItem?.shouldShowRightIcon ?? true}
                                 onPress={menuItem?.onPress}
                                 brickRoadIndicator={menuItem?.brickRoadIndicator}
-                                // TODO uncomment when errorText will be fixed
-                                // errorText={menuItem?.errorText}
-                                error={menuItem?.error}
+                                errorText={menuItem?.errorText}
                             />
                         </OfflineWithFeedback>
                     ))}
diff --git a/src/pages/workspace/accounting/qbo/export/QuickbooksOutOfPocketExpenseConfigurationPage.tsx b/src/pages/workspace/accounting/qbo/export/QuickbooksOutOfPocketExpenseConfigurationPage.tsx
index bc4741e00b48..c04a8ece794f 100644
--- a/src/pages/workspace/accounting/qbo/export/QuickbooksOutOfPocketExpenseConfigurationPage.tsx
+++ b/src/pages/workspace/accounting/qbo/export/QuickbooksOutOfPocketExpenseConfigurationPage.tsx
@@ -42,15 +42,17 @@ function QuickbooksOutOfPocketExpenseConfigurationPage({policy}: WithPolicyConne
                         <MenuItemWithTopDescription
                             title={reimbursableExpensesExportDestination ? translate(`workspace.qbo.accounts.${reimbursableExpensesExportDestination}`) : undefined}
                             description={translate('workspace.qbo.exportAs')}
-                            error={hasErrors && reimbursableExpensesExportDestination ? translate(`workspace.qbo.accounts.${reimbursableExpensesExportDestination}Error`) : undefined}
+                            errorText={hasErrors && reimbursableExpensesExportDestination ? translate(`workspace.qbo.accounts.${reimbursableExpensesExportDestination}Error`) : undefined}
                             onPress={() => Navigation.navigate(ROUTES.POLICY_ACCOUNTING_QUICKBOOKS_ONLINE_EXPORT_OUT_OF_POCKET_EXPENSES_SELECT.getRoute(policyID))}
                             brickRoadIndicator={hasErrors ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
                             shouldShowRightIcon
+                            hintText={
+                                reimbursableExpensesExportDestination === CONST.QUICKBOOKS_REIMBURSABLE_ACCOUNT_TYPE.VENDOR_BILL && !isLocationEnabled
+                                    ? translate('workspace.qbo.exportVendorBillDescription')
+                                    : undefined
+                            }
                         />
                     </OfflineWithFeedback>
-                    {reimbursableExpensesExportDestination === CONST.QUICKBOOKS_REIMBURSABLE_ACCOUNT_TYPE.VENDOR_BILL && !isLocationEnabled && (
-                        <Text style={[styles.ph5, styles.mutedNormalTextLabel, styles.pt1, styles.pb2]}>{translate('workspace.qbo.exportVendorBillDescription')}</Text>
-                    )}
                     {isLocationEnabled && <Text style={[styles.ph5, styles.mutedNormalTextLabel, styles.pt1]}>{translate('workspace.qbo.outOfPocketLocationEnabledDescription')}</Text>}
                     {!isLocationEnabled && (
                         <OfflineWithFeedback pendingAction={pendingFields?.reimbursableExpensesAccount}>
@@ -60,9 +62,7 @@ function QuickbooksOutOfPocketExpenseConfigurationPage({policy}: WithPolicyConne
                                 onPress={() => Navigation.navigate(ROUTES.POLICY_ACCOUNTING_QUICKBOOKS_ONLINE_EXPORT_OUT_OF_POCKET_EXPENSES_ACCOUNT_SELECT.getRoute(policyID))}
                                 brickRoadIndicator={errorFields?.exportAccount ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
                                 shouldShowRightIcon
-                                error={errorFields?.exportAccount ? translate('common.genericErrorMessage') : undefined}
-                                // TODO uncomment when errorText will be fixed
-                                // errorText={errors?.exportAccount}
+                                errorText={errorFields?.exportAccount ? translate('common.genericErrorMessage') : undefined}
                             />
                         </OfflineWithFeedback>
                     )}
diff --git a/src/pages/workspace/accounting/xero/export/XeroExportConfigurationPage.tsx b/src/pages/workspace/accounting/xero/export/XeroExportConfigurationPage.tsx
index 934c41dab614..f78e7abd69e5 100644
--- a/src/pages/workspace/accounting/xero/export/XeroExportConfigurationPage.tsx
+++ b/src/pages/workspace/accounting/xero/export/XeroExportConfigurationPage.tsx
@@ -26,7 +26,7 @@ function XeroExportConfigurationPage({policy}: WithPolicyConnectionsProps) {
             brickRoadIndicator: errorFields?.exporter ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
             title: exportConfiguration?.exporter ?? policyOwner,
             pendingAction: pendingFields?.export,
-            error: errorFields?.exporter ? translate('common.genericErrorMessage') : undefined,
+            errorText: errorFields?.exporter ? translate('common.genericErrorMessage') : undefined,
         },
         {
             description: translate('workspace.xero.exportExpenses'),
@@ -40,14 +40,14 @@ function XeroExportConfigurationPage({policy}: WithPolicyConnectionsProps) {
             brickRoadIndicator: errorFields?.billDate ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
             title: exportConfiguration?.billDate,
             pendingAction: pendingFields?.export,
-            error: errorFields?.billDate ? translate('common.genericErrorMessage') : undefined,
+            errorText: errorFields?.billDate ? translate('common.genericErrorMessage') : undefined,
         },
         {
             description: translate('workspace.xero.advancedConfig.purchaseBillStatusTitle'),
             onPress: () => {},
             title: exportConfiguration?.billStatus?.purchase,
             pendingAction: pendingFields?.export,
-            error: errorFields?.purchase ? translate('common.genericErrorMessage') : undefined,
+            errorText: errorFields?.purchase ? translate('common.genericErrorMessage') : undefined,
         },
         {
             description: translate('workspace.xero.exportInvoices'),
@@ -69,7 +69,7 @@ function XeroExportConfigurationPage({policy}: WithPolicyConnectionsProps) {
             brickRoadIndicator: errorFields?.nonReimbursableAccount ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
             title: undefined,
             pendingAction: pendingFields?.export,
-            error: undefined,
+            errorText: undefined,
         },
     ];
 
@@ -97,7 +97,7 @@ function XeroExportConfigurationPage({policy}: WithPolicyConnectionsProps) {
                         onPress={menuItem?.onPress}
                         brickRoadIndicator={menuItem?.brickRoadIndicator}
                         helperText={menuItem?.helperText}
-                        error={menuItem?.error}
+                        errorText={menuItem?.errorText}
                     />
                 </OfflineWithFeedback>
             ))}
diff --git a/src/styles/index.ts b/src/styles/index.ts
index 060fb1c5ba90..bec646d27095 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -1392,14 +1392,14 @@ const styles = (theme: ThemeColors) =>
         formHelp: {
             color: theme.textSupporting,
             fontSize: variables.fontSizeLabel,
-            lineHeight: variables.lineHeightLarge,
+            lineHeight: variables.lineHeightNormal,
             marginBottom: 4,
         },
 
         formError: {
             color: theme.textError,
             fontSize: variables.fontSizeLabel,
-            lineHeight: variables.formErrorLineHeight,
+            lineHeight: variables.lineHeightNormal,
             marginBottom: 4,
         },
 
@@ -4476,10 +4476,8 @@ const styles = (theme: ThemeColors) =>
             width: '100%',
         },
         menuItemError: {
-            position: 'absolute',
-            bottom: -4,
-            left: 20,
-            right: 20,
+            marginTop: 4,
+            marginBottom: 0,
         },
         formHelperMessage: {
             height: 32,