diff --git a/native/chat/message-result.react.js b/native/chat/message-result.react.js
--- a/native/chat/message-result.react.js
+++ b/native/chat/message-result.react.js
@@ -1,20 +1,51 @@
 // @flow
 
 import * as React from 'react';
-import { View } from 'react-native';
+import { ScrollView } from 'react-native';
 
 import { type ThreadInfo } from 'lib/types/thread-types.js';
 
+import { MessageListContextProvider } from './message-list-types.js';
+import { Message } from './message.react.js';
+import type { AppNavigationProp } from '../navigation/app-navigator.react';
+import type { NavigationRoute } from '../navigation/route-names';
+import { useStyles } from '../themes/colors.js';
 import type { ChatMessageInfoItemWithHeight } from '../types/chat-types.js';
 
 type MessageResultProps = {
   +item: ChatMessageInfoItemWithHeight,
   +threadInfo: ThreadInfo,
+  +navigation: AppNavigationProp<'TogglePinModal'>,
+  +route: NavigationRoute<'TogglePinModal'>,
 };
 
-/* eslint-disable no-unused-vars */
 function MessageResult(props: MessageResultProps): React.Node {
-  return <View />;
+  const styles = useStyles(unboundStyles);
+
+  const onToggleFocus = React.useCallback(() => {}, []);
+
+  return (
+    <ScrollView style={styles.container}>
+      <MessageListContextProvider threadInfo={props.threadInfo}>
+        <Message
+          item={props.item}
+          focused={false}
+          navigation={props.navigation}
+          route={props.route}
+          toggleFocus={onToggleFocus}
+          verticalBounds={null}
+        />
+      </MessageListContextProvider>
+    </ScrollView>
+  );
 }
 
+const unboundStyles = {
+  container: {
+    maxHeight: '70%',
+    marginTop: 20,
+    marginBottom: 20,
+  },
+};
+
 export default MessageResult;
diff --git a/native/chat/message.react.js b/native/chat/message.react.js
--- a/native/chat/message.react.js
+++ b/native/chat/message.react.js
@@ -20,6 +20,7 @@
   type KeyboardState,
   KeyboardContext,
 } from '../keyboard/keyboard-state.js';
+import type { AppNavigationProp } from '../navigation/app-navigator.react';
 import type { NavigationRoute } from '../navigation/route-names.js';
 import type { ChatMessageInfoItemWithHeight } from '../types/chat-types.js';
 import { type VerticalBounds } from '../types/layout-types.js';
@@ -28,8 +29,10 @@
 type BaseProps = {
   +item: ChatMessageInfoItemWithHeight,
   +focused: boolean,
-  +navigation: ChatNavigationProp<'MessageList'>,
-  +route: NavigationRoute<'MessageList'>,
+  +navigation:
+    | ChatNavigationProp<'MessageList'>
+    | AppNavigationProp<'TogglePinModal'>,
+  +route: NavigationRoute<'MessageList'> | NavigationRoute<'TogglePinModal'>,
   +toggleFocus: (messageKey: string) => void,
   +verticalBounds: ?VerticalBounds,
 };
diff --git a/native/chat/robotext-message.react.js b/native/chat/robotext-message.react.js
--- a/native/chat/robotext-message.react.js
+++ b/native/chat/robotext-message.react.js
@@ -15,6 +15,7 @@
 import { getMessageTooltipKey, useContentAndHeaderOpacity } from './utils.js';
 import { ChatContext } from '../chat/chat-context.js';
 import { KeyboardContext } from '../keyboard/keyboard-state.js';
+import type { AppNavigationProp } from '../navigation/app-navigator.react';
 import { OverlayContext } from '../navigation/overlay-context.js';
 import { RobotextMessageTooltipModalRouteName } from '../navigation/route-names.js';
 import type { NavigationRoute } from '../navigation/route-names.js';
@@ -27,8 +28,10 @@
 type Props = {
   ...React.ElementConfig<typeof View>,
   +item: ChatRobotextMessageInfoItemWithHeight,
-  +navigation: ChatNavigationProp<'MessageList'>,
-  +route: NavigationRoute<'MessageList'>,
+  +navigation:
+    | ChatNavigationProp<'MessageList'>
+    | AppNavigationProp<'TogglePinModal'>,
+  +route: NavigationRoute<'MessageList'> | NavigationRoute<'TogglePinModal'>,
   +focused: boolean,
   +toggleFocus: (messageKey: string) => void,
   +verticalBounds: ?VerticalBounds,
diff --git a/native/chat/text-message.react.js b/native/chat/text-message.react.js
--- a/native/chat/text-message.react.js
+++ b/native/chat/text-message.react.js
@@ -23,6 +23,7 @@
 import { getMessageTooltipKey } from './utils.js';
 import { ChatContext, type ChatContextType } from '../chat/chat-context.js';
 import { MarkdownContext } from '../markdown/markdown-context.js';
+import type { AppNavigationProp } from '../navigation/app-navigator.react';
 import {
   OverlayContext,
   type OverlayContextType,
@@ -37,8 +38,10 @@
 type BaseProps = {
   ...React.ElementConfig<typeof View>,
   +item: ChatTextMessageInfoItemWithHeight,
-  +navigation: ChatNavigationProp<'MessageList'>,
-  +route: NavigationRoute<'MessageList'>,
+  +navigation:
+    | ChatNavigationProp<'MessageList'>
+    | AppNavigationProp<'TogglePinModal'>,
+  +route: NavigationRoute<'MessageList'> | NavigationRoute<'TogglePinModal'>,
   +focused: boolean,
   +toggleFocus: (messageKey: string) => void,
   +verticalBounds: ?VerticalBounds,
diff --git a/native/chat/toggle-pin-modal.react.js b/native/chat/toggle-pin-modal.react.js
--- a/native/chat/toggle-pin-modal.react.js
+++ b/native/chat/toggle-pin-modal.react.js
@@ -134,7 +134,12 @@
       <Text style={styles.modalConfirmationText}>
         {modalInfo.confirmationText}
       </Text>
-      <MessageResult item={modifiedItem} threadInfo={threadInfo} />
+      <MessageResult
+        item={modifiedItem}
+        threadInfo={threadInfo}
+        navigation={navigation}
+        route={route}
+      />
       <View style={styles.buttonsContainer}>
         <Button style={modalInfo.buttonStyle} onPress={onPress}>
           <Text style={styles.textColor}>{modalInfo.buttonText}</Text>