From 626cd982cad101057cca0f46b1b407a9d112f09b Mon Sep 17 00:00:00 2001
From: tfomkin <tfomkin@ronasit.com>
Date: Fri, 16 Jan 2026 17:27:33 +0700
Subject: [PATCH 1/3] fix: CodeBlock background color fix

---
 .../shared/features/markdown-view/src/lib/component.tsx    | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/libs/mobile/shared/features/markdown-view/src/lib/component.tsx b/libs/mobile/shared/features/markdown-view/src/lib/component.tsx
index 7fa7ee9..4a2bd63 100644
--- a/libs/mobile/shared/features/markdown-view/src/lib/component.tsx
+++ b/libs/mobile/shared/features/markdown-view/src/lib/component.tsx
@@ -53,7 +53,7 @@ export function AppMarkdownView({
     ) => {
       return (
         <CodeBlock
-          fenceStyle={[inheritedStyles, styles.fence]}
+          fenceStyle={[inheritedStyles, markdownStyles.fence]}
           key={`code-block-${node.key}`}
           sourceInfo={node.sourceInfo}
           content={node.content}
@@ -289,4 +289,9 @@ const markdownStyles = createStyles({
     backgroundColor: colorScheme.get() === 'dark' ? colors.gray700 : colors.gray75,
     textDecorationLine: 'none',
   },
+  fence: {
+    backgroundColor: colorScheme.get() === 'dark' ? colors.gray700 : colors.gray75,
+    borderRadius: 8,
+    padding: 12,
+  },
 });

From 0fd57eebeaf54354ab84e3ceea3db7046e3d17ad Mon Sep 17 00:00:00 2001
From: tfomkin <tfomkin@ronasit.com>
Date: Sun, 18 Jan 2026 23:44:39 +0700
Subject: [PATCH 2/3] fix: removed AppMarkDownView restProps spread to prevent
 key leakage

---
 libs/mobile/shared/features/markdown-view/src/lib/component.tsx | 2 --
 1 file changed, 2 deletions(-)

diff --git a/libs/mobile/shared/features/markdown-view/src/lib/component.tsx b/libs/mobile/shared/features/markdown-view/src/lib/component.tsx
index 4a2bd63..bb848b1 100644
--- a/libs/mobile/shared/features/markdown-view/src/lib/component.tsx
+++ b/libs/mobile/shared/features/markdown-view/src/lib/component.tsx
@@ -39,7 +39,6 @@ export function AppMarkdownView({
   onCitationPress,
   isContentReady,
   textColor: elementTextColor,
-  ...restProps
 }: AppMarkdownViewProps): ReactElement {
   const { isDarkColorScheme } = useColorScheme();
   const textColor = elementTextColor || (isDarkColorScheme ? colors.darkTextPrimary : colors.textPrimary);
@@ -220,7 +219,6 @@ export function AppMarkdownView({
         code_inline: { backgroundColor: isDarkColorScheme ? colors.gray700 : colors.gray75 },
       }}
       rules={markdownRules}
-      {...restProps}
       markdownit={markdownItInstance}
     />
   );

From 684f960bca554dbaa951115c2159f8ec3d2c2dd7 Mon Sep 17 00:00:00 2001
From: tfomkin <tfomkin@ronasit.com>
Date: Fri, 23 Jan 2026 20:23:32 +0700
Subject: [PATCH 3/3] fix: props fix, a key prop is being spread into JSX error
 fix

---
 .../markdown-view/src/lib/component.tsx       | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/libs/mobile/shared/features/markdown-view/src/lib/component.tsx b/libs/mobile/shared/features/markdown-view/src/lib/component.tsx
index bb848b1..3a4e41e 100644
--- a/libs/mobile/shared/features/markdown-view/src/lib/component.tsx
+++ b/libs/mobile/shared/features/markdown-view/src/lib/component.tsx
@@ -3,6 +3,7 @@ import markdownItMath from 'markdown-it-math/no-default-renderer';
 import { colorScheme } from 'nativewind';
 import React, { PropsWithChildren, ReactElement, ReactNode, useCallback, useMemo } from 'react';
 import { Linking } from 'react-native';
+import FitImage from 'react-native-fit-image';
 import Markdown, { ASTNode, MarkdownProps, RenderRules } from 'react-native-markdown-display';
 import { CitationPrefix } from '@open-webui-react-native/mobile/chat/features/use-citations';
 import { CodeBlock } from '@open-webui-react-native/mobile/shared/ui/code-block';
@@ -39,6 +40,7 @@ export function AppMarkdownView({
   onCitationPress,
   isContentReady,
   textColor: elementTextColor,
+  children,
 }: AppMarkdownViewProps): ReactElement {
   const { isDarkColorScheme } = useColorScheme();
   const textColor = elementTextColor || (isDarkColorScheme ? colors.darkTextPrimary : colors.textPrimary);
@@ -208,6 +210,18 @@ export function AppMarkdownView({
         </AppText>
       ),
       table: renderTable,
+      //NOTE: A props object containing a "key" prop is being spread into JSX error fix
+      image: (node: ASTNode, children, parent, styles) => {
+        const uri = node.attributes?.src;
+
+        if (!uri) return null;
+
+        return <FitImage
+          key={`image-${node.key}`}
+          source={{ uri }}
+          style={styles.image}
+          resizeMode='contain' />;
+      },
     };
   }, [fence, onCitationPress, isContentReady, renderTable]);
 
@@ -219,8 +233,9 @@ export function AppMarkdownView({
         code_inline: { backgroundColor: isDarkColorScheme ? colors.gray700 : colors.gray75 },
       }}
       rules={markdownRules}
-      markdownit={markdownItInstance}
-    />
+      markdownit={markdownItInstance}>
+      {children}
+    </Markdown>
   );
 }