diff --git a/src/components/InlineCodeBlock/index.native.tsx b/src/components/InlineCodeBlock/index.native.tsx
index fe7bfba62947..099ae9e48613 100644
--- a/src/components/InlineCodeBlock/index.native.tsx
+++ b/src/components/InlineCodeBlock/index.native.tsx
@@ -1,13 +1,13 @@
 import React from 'react';
 import useThemeStyles from '@hooks/useThemeStyles';
+import renderEmojisAsTextComponents from './renderEmojisAsTextComponents';
 import type InlineCodeBlockProps from './types';
 import type {TTextOrTPhrasing} from './types';
 import WrappedText from './WrappedText';
-import { renderEmojisAsTextComponents } from './renderEmojisAsTextComponents';
 
 function InlineCodeBlock<TComponent extends TTextOrTPhrasing>({TDefaultRenderer, defaultRendererProps, textStyle, boxModelStyle}: InlineCodeBlockProps<TComponent>) {
     const styles = useThemeStyles();
-    const { elements, hasLargeStyle } = renderEmojisAsTextComponents(defaultRendererProps);
+    const {elements, hasLargeStyle} = renderEmojisAsTextComponents(defaultRendererProps, styles);
 
     return (
         <TDefaultRenderer
diff --git a/src/components/InlineCodeBlock/index.tsx b/src/components/InlineCodeBlock/index.tsx
index f092e41fd3fb..c6862002466a 100644
--- a/src/components/InlineCodeBlock/index.tsx
+++ b/src/components/InlineCodeBlock/index.tsx
@@ -1,28 +1,26 @@
 import React from 'react';
-import { StyleSheet } from 'react-native';
+import {StyleSheet} from 'react-native';
 import Text from '@components/Text';
-import type InlineCodeBlockProps from './types';
-import type { TTextOrTPhrasing } from './types';
 import useThemeStyles from '@hooks/useThemeStyles';
-import { renderEmojisAsTextComponents } from './renderEmojisAsTextComponents';
+import renderEmojisAsTextComponents from './renderEmojisAsTextComponents';
+import type InlineCodeBlockProps from './types';
+import type {TTextOrTPhrasing} from './types';
 
-function InlineCodeBlock<TComponent extends TTextOrTPhrasing>({ TDefaultRenderer, textStyle, defaultRendererProps, boxModelStyle }: InlineCodeBlockProps<TComponent>) {
+function InlineCodeBlock<TComponent extends TTextOrTPhrasing>({TDefaultRenderer, textStyle, defaultRendererProps, boxModelStyle}: InlineCodeBlockProps<TComponent>) {
     const styles = useThemeStyles();
     const flattenTextStyle = StyleSheet.flatten(textStyle);
-    const { textDecorationLine, ...textStyles } = flattenTextStyle;
-    const { elements, hasLargeStyle } = renderEmojisAsTextComponents(defaultRendererProps);
+    const {textDecorationLine, ...textStyles} = flattenTextStyle;
+    const {elements, hasLargeStyle} = renderEmojisAsTextComponents(defaultRendererProps, styles);
 
     return (
         <TDefaultRenderer
             // eslint-disable-next-line react/jsx-props-no-spreading
             {...defaultRendererProps}
         >
-            <Text style={[boxModelStyle, textStyles, hasLargeStyle ? styles.onlyEmojisText : {}]}>
-                {elements}
-            </Text>
+            <Text style={[boxModelStyle, textStyles, hasLargeStyle ? styles.onlyEmojisText : {}]}>{elements}</Text>
         </TDefaultRenderer>
     );
 }
 InlineCodeBlock.displayName = 'InlineCodeBlock';
 
-export default InlineCodeBlock;
\ No newline at end of file
+export default InlineCodeBlock;
diff --git a/src/components/InlineCodeBlock/renderEmojisAsTextComponents.tsx b/src/components/InlineCodeBlock/renderEmojisAsTextComponents.tsx
index 6c6c97636e11..5b435bc1b03e 100644
--- a/src/components/InlineCodeBlock/renderEmojisAsTextComponents.tsx
+++ b/src/components/InlineCodeBlock/renderEmojisAsTextComponents.tsx
@@ -1,32 +1,46 @@
 import React from 'react';
+import type {TDefaultRendererProps} from 'react-native-render-html';
 import Text from '@components/Text';
-import type { TTextOrTPhrasing } from './types';
-import { TDefaultRendererProps } from 'react-native-render-html';
-import useThemeStyles from '@hooks/useThemeStyles';
-
-
-export function renderEmojisAsTextComponents(defaultRendererProps: TDefaultRendererProps<TTextOrTPhrasing>) {
-    const elements: (string | React.JSX.Element)[] = [];
-    const styles = useThemeStyles();
+import type {ThemeStyles} from '@styles/index';
+import type {TTextOrTPhrasing} from './types';
 
+function renderEmojisAsTextComponents(defaultRendererProps: TDefaultRendererProps<TTextOrTPhrasing>, styles: ThemeStyles) {
+    const elements: Array<string | React.JSX.Element> = [];
     let hasLargeStyle = false;
+
     if ('data' in defaultRendererProps.tnode) {
         elements.push(defaultRendererProps.tnode.data);
-    } else if (defaultRendererProps.tnode.children) {
-        defaultRendererProps.tnode.children.forEach((child) => {
-            if ('data' in child) {
-                if (child.tagName === 'emoji') {
-                    const largeStyle = 'islarge' in child.attributes ? styles.onlyEmojisText : {};
-                    if (Object.keys(largeStyle).length > 0) {
-                        hasLargeStyle = true;
-                    }
-                    elements.push(<Text style={[largeStyle, styles.emojiDefault]} key={child.data}>{child.data}</Text>);
-                } else {
-                    elements.push(child.data);
-                }
-            }
-        });
+        return {elements, hasLargeStyle};
+    }
+
+    if (!defaultRendererProps.tnode.children) {
+        return {elements, hasLargeStyle};
     }
 
-    return { elements, hasLargeStyle };
+    defaultRendererProps.tnode.children.forEach((child) => {
+        if (!('data' in child)) {
+            return;
+        }
+
+        if (child.tagName === 'emoji') {
+            const largeStyle = 'islarge' in child.attributes ? styles.onlyEmojisText : {};
+            if (Object.keys(largeStyle).length > 0) {
+                hasLargeStyle = true;
+            }
+            elements.push(
+                <Text
+                    style={[largeStyle, styles.emojiDefault]}
+                    key={child.data}
+                >
+                    {child.data}
+                </Text>,
+            );
+        } else {
+            elements.push(child.data);
+        }
+    });
+
+    return {elements, hasLargeStyle};
 }
+
+export default renderEmojisAsTextComponents;
diff --git a/src/styles/index.ts b/src/styles/index.ts
index 44e044fdc62f..d5116b805182 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -283,8 +283,8 @@ const styles = (theme: ThemeColors) =>
         emojiDefault: {
             fontStyle: 'normal',
             fontWeight: 'normal',
+            textDecorationLine: 'none',
             ...display.dInlineFlex,
-            textDecorationLine:'none'
         },
 
         emojiSuggestionsEmoji: {