diff --git a/native/chat/chat-input-bar.react.js b/native/chat/chat-input-bar.react.js
index 38c977440..d530b807f 100644
--- a/native/chat/chat-input-bar.react.js
+++ b/native/chat/chat-input-bar.react.js
@@ -1,927 +1,933 @@
 // @flow
 
 import invariant from 'invariant';
 import _throttle from 'lodash/throttle';
 import PropTypes from 'prop-types';
 import * as React from 'react';
 import {
   View,
   TextInput,
   TouchableOpacity,
   Platform,
   Text,
   ActivityIndicator,
   TouchableWithoutFeedback,
   Alert,
   NativeAppEventEmitter,
 } from 'react-native';
 import { TextInputKeyboardMangerIOS } from 'react-native-keyboard-input';
 import Animated, { Easing } from 'react-native-reanimated';
 import FAIcon from 'react-native-vector-icons/FontAwesome';
 import Icon from 'react-native-vector-icons/Ionicons';
 import { useDispatch } from 'react-redux';
 
 import { saveDraftActionType } from 'lib/actions/miscellaneous-action-types';
 import {
   joinThreadActionTypes,
   joinThread,
   newThread,
   newThreadActionTypes,
 } from 'lib/actions/thread-actions';
 import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors';
 import { trimMessage } from 'lib/shared/message-utils';
 import {
   threadHasPermission,
   viewerIsMember,
   threadFrozenDueToViewerBlock,
   threadActualMembers,
   threadIsPending,
   getPendingThreadOtherUsers,
   pendingThreadType,
 } from 'lib/shared/thread-utils';
 import type { CalendarQuery } from 'lib/types/entry-types';
 import { loadingStatusPropType } from 'lib/types/loading-types';
 import type { LoadingStatus } from 'lib/types/loading-types';
 import type { PhotoPaste } from 'lib/types/media-types';
 import { messageTypes } from 'lib/types/message-types';
 import type { Dispatch } from 'lib/types/redux-types';
 import {
   type ThreadInfo,
   threadInfoPropType,
   threadPermissions,
   type ClientThreadJoinRequest,
   type ThreadJoinPayload,
   type NewThreadRequest,
   type NewThreadResult,
 } from 'lib/types/thread-types';
 import { type UserInfos, userInfoPropType } from 'lib/types/user-types';
 import {
   type DispatchActionPromise,
   useServerCall,
   useDispatchActionPromise,
 } from 'lib/utils/action-utils';
 
 import Button from '../components/button.react';
 import ClearableTextInput from '../components/clearable-text-input.react';
 import {
   type InputState,
   inputStatePropType,
   InputStateContext,
 } from '../input/input-state';
 import { getKeyboardHeight } from '../keyboard/keyboard';
 import KeyboardInputHost from '../keyboard/keyboard-input-host.react';
 import {
   type KeyboardState,
   keyboardStatePropType,
   KeyboardContext,
 } from '../keyboard/keyboard-state';
 import {
   nonThreadCalendarQuery,
   activeThreadSelector,
 } from '../navigation/nav-selectors';
 import { NavContext } from '../navigation/navigation-context';
-import type { NavigationRoute } from '../navigation/route-names';
-import { CameraModalRouteName } from '../navigation/route-names';
+import {
+  type NavigationRoute,
+  CameraModalRouteName,
+  ImagePasteModalRouteName,
+} from '../navigation/route-names';
 import { useSelector } from '../redux/redux-utils';
 import {
   type Colors,
   colorsPropType,
   useStyles,
   useColors,
 } from '../themes/colors';
 import type { ViewStyle } from '../types/styles';
 import { runTiming } from '../utils/animation-utils';
 import type { ChatNavigationProp } from './chat.react';
 import {
   messageListRoutePropType,
   messageListNavPropType,
 } from './message-list-types';
 
 /* eslint-disable import/no-named-as-default-member */
 const {
   Value,
   Clock,
   block,
   set,
   cond,
   neq,
   sub,
   interpolate,
   stopClock,
 } = Animated;
 /* eslint-enable import/no-named-as-default-member */
 
 const expandoButtonsAnimationConfig = {
   duration: 500,
   easing: Easing.inOut(Easing.ease),
 };
 const sendButtonAnimationConfig = {
   duration: 150,
   easing: Easing.inOut(Easing.ease),
 };
 
 const draftKeyFromThreadID = (threadID: string) =>
   `${threadID}/message_composer`;
 
 type BaseProps = {|
   +threadInfo: ThreadInfo,
   +navigation: ChatNavigationProp<'MessageList'>,
   +route: NavigationRoute<'MessageList'>,
 |};
 type Props = {|
   ...BaseProps,
   // Redux state
   +viewerID: ?string,
   +draft: string,
   +joinThreadLoadingStatus: LoadingStatus,
   +calendarQuery: () => CalendarQuery,
   +nextLocalID: number,
   +userInfos: UserInfos,
   +colors: Colors,
   +styles: typeof unboundStyles,
   // connectNav
   +isActive: boolean,
   // withKeyboardState
   +keyboardState: ?KeyboardState,
   // Redux dispatch functions
   +dispatch: Dispatch,
   +dispatchActionPromise: DispatchActionPromise,
   // async functions that hit server APIs
   +joinThread: (request: ClientThreadJoinRequest) => Promise<ThreadJoinPayload>,
   +newThread: (request: NewThreadRequest) => Promise<NewThreadResult>,
   // withInputState
   +inputState: ?InputState,
 |};
 type State = {|
   +text: string,
   +buttonsExpanded: boolean,
 |};
 class ChatInputBar extends React.PureComponent<Props, State> {
   static propTypes = {
     threadInfo: threadInfoPropType.isRequired,
     navigation: messageListNavPropType.isRequired,
     route: messageListRoutePropType.isRequired,
     isActive: PropTypes.bool.isRequired,
     viewerID: PropTypes.string,
     draft: PropTypes.string.isRequired,
     joinThreadLoadingStatus: loadingStatusPropType.isRequired,
     calendarQuery: PropTypes.func.isRequired,
     nextLocalID: PropTypes.number.isRequired,
     userInfos: PropTypes.objectOf(userInfoPropType).isRequired,
     colors: colorsPropType.isRequired,
     styles: PropTypes.objectOf(PropTypes.object).isRequired,
     keyboardState: keyboardStatePropType,
     dispatch: PropTypes.func.isRequired,
     dispatchActionPromise: PropTypes.func.isRequired,
     joinThread: PropTypes.func.isRequired,
     inputState: inputStatePropType,
     newThread: PropTypes.func.isRequired,
   };
   textInput: ?React.ElementRef<typeof TextInput>;
   clearableTextInput: ?ClearableTextInput;
 
   expandoButtonsOpen: Value;
   targetExpandoButtonsOpen: Value;
   expandoButtonsStyle: ViewStyle;
   cameraRollIconStyle: ViewStyle;
   cameraIconStyle: ViewStyle;
   expandIconStyle: ViewStyle;
 
   sendButtonContainerOpen: Value;
   targetSendButtonContainerOpen: Value;
   sendButtonContainerStyle: ViewStyle;
 
   newThreadID: ?string;
 
   constructor(props: Props) {
     super(props);
     this.state = {
       text: props.draft,
       buttonsExpanded: true,
     };
 
     this.expandoButtonsOpen = new Value(1);
     this.targetExpandoButtonsOpen = new Value(1);
     const prevTargetExpandoButtonsOpen = new Value(1);
     const expandoButtonClock = new Clock();
     const expandoButtonsOpen = block([
       cond(neq(this.targetExpandoButtonsOpen, prevTargetExpandoButtonsOpen), [
         stopClock(expandoButtonClock),
         set(prevTargetExpandoButtonsOpen, this.targetExpandoButtonsOpen),
       ]),
       cond(
         neq(this.expandoButtonsOpen, this.targetExpandoButtonsOpen),
         set(
           this.expandoButtonsOpen,
           runTiming(
             expandoButtonClock,
             this.expandoButtonsOpen,
             this.targetExpandoButtonsOpen,
             true,
             expandoButtonsAnimationConfig,
           ),
         ),
       ),
       this.expandoButtonsOpen,
     ]);
 
     this.cameraRollIconStyle = {
       ...unboundStyles.cameraRollIcon,
       opacity: expandoButtonsOpen,
     };
     this.cameraIconStyle = {
       ...unboundStyles.cameraIcon,
       opacity: expandoButtonsOpen,
     };
 
     const expandoButtonsWidth = interpolate(expandoButtonsOpen, {
       inputRange: [0, 1],
       outputRange: [22, 60],
     });
     this.expandoButtonsStyle = {
       ...unboundStyles.expandoButtons,
       width: expandoButtonsWidth,
     };
 
     const expandOpacity = sub(1, expandoButtonsOpen);
     this.expandIconStyle = {
       ...unboundStyles.expandIcon,
       opacity: expandOpacity,
     };
 
     const initialSendButtonContainerOpen = trimMessage(props.draft) ? 1 : 0;
     this.sendButtonContainerOpen = new Value(initialSendButtonContainerOpen);
     this.targetSendButtonContainerOpen = new Value(
       initialSendButtonContainerOpen,
     );
     const prevTargetSendButtonContainerOpen = new Value(
       initialSendButtonContainerOpen,
     );
     const sendButtonClock = new Clock();
     const sendButtonContainerOpen = block([
       cond(
         neq(
           this.targetSendButtonContainerOpen,
           prevTargetSendButtonContainerOpen,
         ),
         [
           stopClock(sendButtonClock),
           set(
             prevTargetSendButtonContainerOpen,
             this.targetSendButtonContainerOpen,
           ),
         ],
       ),
       cond(
         neq(this.sendButtonContainerOpen, this.targetSendButtonContainerOpen),
         set(
           this.sendButtonContainerOpen,
           runTiming(
             sendButtonClock,
             this.sendButtonContainerOpen,
             this.targetSendButtonContainerOpen,
             true,
             sendButtonAnimationConfig,
           ),
         ),
       ),
       this.sendButtonContainerOpen,
     ]);
 
     const sendButtonContainerWidth = interpolate(sendButtonContainerOpen, {
       inputRange: [0, 1],
       outputRange: [4, 38],
     });
     this.sendButtonContainerStyle = { width: sendButtonContainerWidth };
   }
 
   static mediaGalleryOpen(props: Props) {
     const { keyboardState } = props;
     return !!(keyboardState && keyboardState.mediaGalleryOpen);
   }
 
   static systemKeyboardShowing(props: Props) {
     const { keyboardState } = props;
     return !!(keyboardState && keyboardState.systemKeyboardShowing);
   }
 
   get systemKeyboardShowing() {
     return ChatInputBar.systemKeyboardShowing(this.props);
   }
 
   immediatelyShowSendButton() {
     this.sendButtonContainerOpen.setValue(1);
     this.targetSendButtonContainerOpen.setValue(1);
   }
 
   updateSendButton(currentText: string) {
     this.targetSendButtonContainerOpen.setValue(currentText === '' ? 0 : 1);
   }
 
   componentDidMount() {
     if (this.props.isActive) {
       this.addReplyListener();
     }
   }
 
   componentWillUnmount() {
     if (this.props.isActive) {
       this.removeReplyListener();
     }
   }
 
   componentDidUpdate(prevProps: Props, prevState: State) {
     if (this.props.isActive && !prevProps.isActive) {
       this.addReplyListener();
     } else if (!this.props.isActive && prevProps.isActive) {
       this.removeReplyListener();
     }
 
     const currentText = trimMessage(this.state.text);
     const prevText = trimMessage(prevState.text);
 
     if (
       (currentText === '' && prevText !== '') ||
       (currentText !== '' && prevText === '')
     ) {
       this.updateSendButton(currentText);
     }
 
     const systemKeyboardIsShowing = ChatInputBar.systemKeyboardShowing(
       this.props,
     );
     const systemKeyboardWasShowing = ChatInputBar.systemKeyboardShowing(
       prevProps,
     );
     if (systemKeyboardIsShowing && !systemKeyboardWasShowing) {
       this.hideButtons();
     } else if (!systemKeyboardIsShowing && systemKeyboardWasShowing) {
       this.expandButtons();
     }
 
     const imageGalleryIsOpen = ChatInputBar.mediaGalleryOpen(this.props);
     const imageGalleryWasOpen = ChatInputBar.mediaGalleryOpen(prevProps);
     if (!imageGalleryIsOpen && imageGalleryWasOpen) {
       this.hideButtons();
     } else if (imageGalleryIsOpen && !imageGalleryWasOpen) {
       this.expandButtons();
       this.setIOSKeyboardHeight();
     }
   }
 
   addReplyListener() {
     invariant(
       this.props.inputState,
       'inputState should be set in addReplyListener',
     );
     this.props.inputState.addReplyListener(this.focusAndUpdateText);
   }
 
   removeReplyListener() {
     invariant(
       this.props.inputState,
       'inputState should be set in removeReplyListener',
     );
     this.props.inputState.removeReplyListener(this.focusAndUpdateText);
   }
 
   setIOSKeyboardHeight() {
     if (Platform.OS !== 'ios') {
       return;
     }
     const { textInput } = this;
     if (!textInput) {
       return;
     }
     const keyboardHeight = getKeyboardHeight();
     if (keyboardHeight === null || keyboardHeight === undefined) {
       return;
     }
     TextInputKeyboardMangerIOS.setKeyboardHeight(textInput, keyboardHeight);
   }
 
   render() {
     const isMember = viewerIsMember(this.props.threadInfo);
     const canJoin = threadHasPermission(
       this.props.threadInfo,
       threadPermissions.JOIN_THREAD,
     );
     let joinButton = null;
     if (!isMember && canJoin) {
       let buttonContent;
       if (this.props.joinThreadLoadingStatus === 'loading') {
         buttonContent = (
           <ActivityIndicator
             size="small"
             color="white"
             style={this.props.styles.joinThreadLoadingIndicator}
           />
         );
       } else {
         buttonContent = (
           <Text style={this.props.styles.joinButtonText}>Join Thread</Text>
         );
       }
       joinButton = (
         <View style={this.props.styles.joinButtonContainer}>
           <Button
             onPress={this.onPressJoin}
             iosActiveOpacity={0.5}
             style={this.props.styles.joinButton}
           >
             {buttonContent}
           </Button>
         </View>
       );
     }
 
     let content;
     if (threadHasPermission(this.props.threadInfo, threadPermissions.VOICED)) {
       content = this.renderInput();
     } else if (
       threadFrozenDueToViewerBlock(
         this.props.threadInfo,
         this.props.viewerID,
         this.props.userInfos,
       ) &&
       threadActualMembers(this.props.threadInfo.members).length === 2
     ) {
       content = (
         <Text style={this.props.styles.explanation}>
           You can&apos;t send messages to a user that you&apos;ve blocked.
         </Text>
       );
     } else if (isMember) {
       content = (
         <Text style={this.props.styles.explanation}>
           You don&apos;t have permission to send messages.
         </Text>
       );
     } else {
       const defaultRoleID = Object.keys(this.props.threadInfo.roles).find(
         (roleID) => this.props.threadInfo.roles[roleID].isDefault,
       );
       invariant(
         defaultRoleID !== undefined,
         'all threads should have a default role',
       );
       const defaultRole = this.props.threadInfo.roles[defaultRoleID];
       const membersAreVoiced = !!defaultRole.permissions[
         threadPermissions.VOICED
       ];
       if (membersAreVoiced && canJoin) {
         content = (
           <Text style={this.props.styles.explanation}>
             Join this thread to send messages.
           </Text>
         );
       } else {
         content = (
           <Text style={this.props.styles.explanation}>
             You don&apos;t have permission to send messages.
           </Text>
         );
       }
     }
 
     const keyboardInputHost =
       Platform.OS === 'android' ? null : (
         <KeyboardInputHost textInputRef={this.textInput} />
       );
 
     return (
       <View style={this.props.styles.container}>
         {joinButton}
         {content}
         {keyboardInputHost}
       </View>
     );
   }
 
   renderInput() {
     const expandoButton = (
       <TouchableOpacity
         onPress={this.expandButtons}
         activeOpacity={0.4}
         style={this.props.styles.expandButton}
       >
         <Animated.View style={this.expandIconStyle}>
           <FAIcon
             name="chevron-right"
             size={19}
             color={this.props.colors.listInputButton}
           />
         </Animated.View>
       </TouchableOpacity>
     );
     const threadColor = `#${this.props.threadInfo.color}`;
     return (
       <TouchableWithoutFeedback onPress={this.dismissKeyboard}>
         <View style={this.props.styles.inputContainer}>
           <Animated.View style={this.expandoButtonsStyle}>
             <View style={this.props.styles.innerExpandoButtons}>
               {this.state.buttonsExpanded ? expandoButton : null}
               <TouchableOpacity
                 onPress={this.showMediaGallery}
                 activeOpacity={0.4}
               >
                 <Animated.View style={this.cameraRollIconStyle}>
                   <Icon
                     name="md-image"
                     size={25}
                     color={this.props.colors.listInputButton}
                   />
                 </Animated.View>
               </TouchableOpacity>
               <TouchableOpacity
                 onPress={this.openCamera}
                 activeOpacity={0.4}
                 disabled={!this.state.buttonsExpanded}
               >
                 <Animated.View style={this.cameraIconStyle}>
                   <FAIcon
                     name="camera"
                     size={20}
                     color={this.props.colors.listInputButton}
                   />
                 </Animated.View>
               </TouchableOpacity>
               {this.state.buttonsExpanded ? null : expandoButton}
             </View>
           </Animated.View>
           <ClearableTextInput
             allowImagePasteForThreadID={this.props.threadInfo.id}
             value={this.state.text}
             onChangeText={this.updateText}
             placeholder="Send a message..."
             placeholderTextColor={this.props.colors.listInputButton}
             multiline={true}
             style={this.props.styles.textInput}
             textInputRef={this.textInputRef}
             ref={this.clearableTextInputRef}
           />
           <Animated.View style={this.sendButtonContainerStyle}>
             <TouchableOpacity
               onPress={this.onSend}
               activeOpacity={0.4}
               style={this.props.styles.sendButton}
               disabled={trimMessage(this.state.text) === ''}
             >
               <Icon
                 name="md-send"
                 size={25}
                 style={this.props.styles.sendIcon}
                 color={threadColor}
               />
             </TouchableOpacity>
           </Animated.View>
         </View>
       </TouchableWithoutFeedback>
     );
   }
 
   textInputRef = (textInput: ?React.ElementRef<typeof TextInput>) => {
     this.textInput = textInput;
   };
 
   clearableTextInputRef = (clearableTextInput: ?ClearableTextInput) => {
     this.clearableTextInput = clearableTextInput;
   };
 
   updateText = (text: string) => {
     this.setState({ text });
     this.saveDraft(text);
   };
 
   saveDraft = _throttle((text: string) => {
     this.props.dispatch({
       type: saveDraftActionType,
       payload: {
         key: draftKeyFromThreadID(this.props.threadInfo.id),
         draft: text,
       },
     });
   }, 400);
 
   focusAndUpdateText = (text: string) => {
     const currentText = this.state.text;
     if (!currentText.startsWith(text)) {
       const prependedText = text.concat(currentText);
       this.updateText(prependedText);
       this.immediatelyShowSendButton();
       this.immediatelyHideButtons();
     }
     invariant(this.textInput, 'textInput should be set in focusAndUpdateText');
     this.textInput.focus();
   };
 
   getServerThreadID = async () => {
     if (this.newThreadID) {
       return this.newThreadID;
     }
     const { threadInfo } = this.props;
     if (!threadIsPending(threadInfo.id)) {
       return threadInfo.id;
     }
 
     const otherMemberIDs = getPendingThreadOtherUsers(threadInfo);
     try {
       const resultPromise = this.props.newThread({
         type: pendingThreadType(otherMemberIDs.length),
         initialMemberIDs: otherMemberIDs,
         color: threadInfo.color,
       });
       this.props.dispatchActionPromise(newThreadActionTypes, resultPromise);
       const { newThreadID } = await resultPromise;
       this.newThreadID = newThreadID;
       return newThreadID;
     } catch (e) {
       Alert.alert('Unknown error', 'Uhh... try again?', [{ text: 'OK' }], {
         cancelable: false,
       });
     }
     return undefined;
   };
 
   onSend = async () => {
     if (!trimMessage(this.state.text)) {
       return;
     }
     this.updateSendButton('');
 
     const { clearableTextInput } = this;
     invariant(
       clearableTextInput,
       'clearableTextInput should be sent in onSend',
     );
     let text = await clearableTextInput.getValueAndReset();
     text = trimMessage(text);
     if (!text) {
       return;
     }
 
     const localID = `local${this.props.nextLocalID}`;
     const creatorID = this.props.viewerID;
     const threadID = await this.getServerThreadID();
     invariant(creatorID, 'should have viewer ID in order to send a message');
     invariant(
       this.props.inputState,
       'inputState should be set in ChatInputBar.onSend',
     );
 
     if (threadID) {
       this.props.inputState.sendTextMessage({
         type: messageTypes.TEXT,
         localID,
         threadID,
         text,
         creatorID,
         time: Date.now(),
       });
     }
   };
 
   onPressJoin = () => {
     this.props.dispatchActionPromise(joinThreadActionTypes, this.joinAction());
   };
 
   async joinAction() {
     const query = this.props.calendarQuery();
     return await this.props.joinThread({
       threadID: this.props.threadInfo.id,
       calendarQuery: {
         startDate: query.startDate,
         endDate: query.endDate,
         filters: [
           ...query.filters,
           { type: 'threads', threadIDs: [this.props.threadInfo.id] },
         ],
       },
     });
   }
 
   expandButtons = () => {
     if (this.state.buttonsExpanded) {
       return;
     }
     this.targetExpandoButtonsOpen.setValue(1);
     this.setState({ buttonsExpanded: true });
   };
 
   hideButtons() {
     if (
       ChatInputBar.mediaGalleryOpen(this.props) ||
       !this.systemKeyboardShowing ||
       !this.state.buttonsExpanded
     ) {
       return;
     }
     this.targetExpandoButtonsOpen.setValue(0);
     this.setState({ buttonsExpanded: false });
   }
 
   immediatelyHideButtons() {
     this.expandoButtonsOpen.setValue(0);
     this.targetExpandoButtonsOpen.setValue(0);
     this.setState({ buttonsExpanded: false });
   }
 
   openCamera = async () => {
     this.dismissKeyboard();
     this.props.navigation.navigate({
       name: CameraModalRouteName,
       params: {
         presentedFrom: this.props.route.key,
         threadID: this.props.threadInfo.id,
       },
     });
   };
 
   showMediaGallery = () => {
     const { keyboardState } = this.props;
     invariant(keyboardState, 'keyboardState should be initialized');
     keyboardState.showMediaGallery(this.props.threadInfo.id);
   };
 
   dismissKeyboard = () => {
     const { keyboardState } = this.props;
     keyboardState && keyboardState.dismissKeyboard();
   };
 }
 
 const unboundStyles = {
   cameraIcon: {
     paddingBottom: Platform.OS === 'android' ? 11 : 10,
     paddingRight: 3,
   },
   cameraRollIcon: {
     paddingBottom: Platform.OS === 'android' ? 8 : 7,
     paddingRight: 8,
   },
   container: {
     backgroundColor: 'listBackground',
   },
   expandButton: {
     bottom: 0,
     position: 'absolute',
     right: 0,
   },
   expandIcon: {
     paddingBottom: Platform.OS === 'android' ? 12 : 10,
   },
   expandoButtons: {
     alignSelf: 'flex-end',
   },
   explanation: {
     color: 'listBackgroundSecondaryLabel',
     paddingBottom: 4,
     paddingTop: 1,
     textAlign: 'center',
   },
   innerExpandoButtons: {
     alignItems: 'flex-end',
     alignSelf: 'flex-end',
     flexDirection: 'row',
   },
   inputContainer: {
     flexDirection: 'row',
   },
   joinButton: {
     backgroundColor: 'mintButton',
     borderRadius: 5,
     flex: 1,
     justifyContent: 'center',
     marginHorizontal: 12,
     marginVertical: 3,
     paddingBottom: 5,
     paddingTop: 3,
   },
   joinButtonContainer: {
     flexDirection: 'row',
     height: 36,
   },
   joinButtonText: {
     color: 'listBackground',
     fontSize: 20,
     textAlign: 'center',
   },
   joinThreadLoadingIndicator: {
     paddingVertical: 2,
   },
   sendButton: {
     position: 'absolute',
     bottom: Platform.OS === 'android' ? 4 : 3,
     left: 0,
   },
   sendIcon: {
     paddingLeft: 9,
     paddingRight: 8,
     paddingVertical: 5,
   },
   textInput: {
     backgroundColor: 'listInputBackground',
     borderRadius: 10,
     color: 'listForegroundLabel',
     fontSize: 16,
     marginLeft: 4,
     marginVertical: 5,
     maxHeight: 250,
     paddingHorizontal: 10,
     paddingVertical: 5,
   },
 };
 
 const joinThreadLoadingStatusSelector = createLoadingStatusSelector(
   joinThreadActionTypes,
 );
 
 export default React.memo<BaseProps>(function ConnectedChatInputBar(
   props: BaseProps,
 ) {
   const inputState = React.useContext(InputStateContext);
   const keyboardState = React.useContext(KeyboardContext);
   const navContext = React.useContext(NavContext);
 
   const styles = useStyles(unboundStyles);
   const colors = useColors();
 
   const isActive = React.useMemo(
     () => props.threadInfo.id === activeThreadSelector(navContext),
     [props.threadInfo.id, navContext],
   );
 
   const draftKey = draftKeyFromThreadID(props.threadInfo.id);
   const draft = useSelector((state) => state.drafts[draftKey] || '');
 
   const viewerID = useSelector(
     (state) => state.currentUserInfo && state.currentUserInfo.id,
   );
   const joinThreadLoadingStatus = useSelector(joinThreadLoadingStatusSelector);
   const calendarQuery = useSelector((state) =>
     nonThreadCalendarQuery({
       redux: state,
       navContext,
     }),
   );
   const nextLocalID = useSelector((state) => state.nextLocalID);
   const userInfos = useSelector((state) => state.userStore.userInfos);
 
   const dispatch = useDispatch();
   const dispatchActionPromise = useDispatchActionPromise();
   const callJoinThread = useServerCall(joinThread);
   const callNewThread = useServerCall(newThread);
 
   const imagePastedCallback = React.useCallback(
     (imagePastedEvent) => {
       if (props.threadInfo.id !== imagePastedEvent['threadID']) {
         return;
       }
       const pastedImage: PhotoPaste = {
         step: 'photo_paste',
         dimensions: {
-          height: imagePastedEvent['height'],
-          width: imagePastedEvent['width'],
+          height: imagePastedEvent.height,
+          width: imagePastedEvent.width,
         },
-        filename: imagePastedEvent['fileName'],
-        uri: 'file://' + imagePastedEvent['filePath'],
+        filename: imagePastedEvent.fileName,
+        uri: 'file://' + imagePastedEvent.filePath,
         selectTime: 0,
         sendTime: 0,
         retries: 0,
       };
-
-      const selection: $ReadOnlyArray<PhotoPaste> = [pastedImage];
-      invariant(inputState, 'inputState should be set in imagePasteListener');
-      inputState.sendMultimediaMessage(props.threadInfo.id, selection);
+      props.navigation.navigate({
+        name: ImagePasteModalRouteName,
+        params: {
+          imagePasteStagingInfo: pastedImage,
+          threadID: props.threadInfo.id,
+        },
+      });
     },
-    [inputState, props.threadInfo.id],
+    [props.navigation, props.threadInfo.id],
   );
 
   React.useEffect(() => {
     const imagePasteListener = NativeAppEventEmitter.addListener(
       'imagePasted',
       imagePastedCallback,
     );
     return () => imagePasteListener.remove();
   }, [imagePastedCallback]);
 
   return (
     <ChatInputBar
       {...props}
       viewerID={viewerID}
       draft={draft}
       joinThreadLoadingStatus={joinThreadLoadingStatus}
       calendarQuery={calendarQuery}
       nextLocalID={nextLocalID}
       userInfos={userInfos}
       colors={colors}
       styles={styles}
       isActive={isActive}
       keyboardState={keyboardState}
       dispatch={dispatch}
       dispatchActionPromise={dispatchActionPromise}
       joinThread={callJoinThread}
       inputState={inputState}
       newThread={callNewThread}
     />
   );
 });
diff --git a/native/chat/image-paste-modal.react.js b/native/chat/image-paste-modal.react.js
new file mode 100644
index 000000000..59e1605e4
--- /dev/null
+++ b/native/chat/image-paste-modal.react.js
@@ -0,0 +1,112 @@
+// @flow
+
+import invariant from 'invariant';
+import * as React from 'react';
+import { Button, View, Image } from 'react-native';
+import filesystem from 'react-native-fs';
+
+import type { PhotoPaste } from 'lib/types/media-types';
+import sleep from 'lib/utils/sleep';
+
+import Modal from '../components/modal.react';
+import { InputStateContext } from '../input/input-state';
+import type { RootNavigationProp } from '../navigation/root-navigator.react';
+import type { NavigationRoute } from '../navigation/route-names';
+import { useStyles } from '../themes/colors';
+
+export type ImagePasteModalParams = {|
+  +imagePasteStagingInfo: PhotoPaste,
+  +threadID: string,
+|};
+
+type Props = {|
+  +navigation: RootNavigationProp<'ImagePasteModal'>,
+  +route: NavigationRoute<'ImagePasteModal'>,
+|};
+function ImagePasteModal(props: Props) {
+  const styles = useStyles(unboundStyles);
+  const inputState = React.useContext(InputStateContext);
+  const {
+    navigation,
+    route: {
+      params: { imagePasteStagingInfo, threadID },
+    },
+  } = props;
+
+  const sendImage = React.useCallback(async () => {
+    navigation.goBackOnce();
+    const selection: $ReadOnlyArray<PhotoPaste> = [imagePasteStagingInfo];
+    invariant(inputState, 'inputState should be set in ImagePasteModal');
+    await inputState.sendMultimediaMessage(threadID, selection);
+    invariant(
+      imagePasteStagingInfo,
+      'imagePasteStagingInfo should be set in ImagePasteModal',
+    );
+  }, [imagePasteStagingInfo, inputState, navigation, threadID]);
+
+  const cancel = React.useCallback(async () => {
+    navigation.goBackOnce();
+    await sleep(5000);
+    filesystem.unlink(imagePasteStagingInfo.uri);
+  }, [imagePasteStagingInfo.uri, navigation]);
+
+  return (
+    <Modal
+      modalStyle={styles.modal}
+      navigation={navigation}
+      safeAreaEdges={['top']}
+    >
+      <Image style={styles.image} source={{ uri: imagePasteStagingInfo.uri }} />
+      <View style={styles.linebreak}></View>
+      <View style={styles.spacer}></View>
+      <Button title="Send" onPress={sendImage} />
+      <View style={styles.linebreak}></View>
+      <View style={styles.spacer}></View>
+      <Button title="Cancel" onPress={cancel} />
+      <View style={styles.spacer}></View>
+    </Modal>
+  );
+}
+
+const unboundStyles = {
+  modal: {
+    backgroundColor: 'modalBackground',
+    flex: 1,
+    justifyContent: 'center',
+    marginHorizontal: 0,
+    marginTop: 300,
+    marginBottom: 0,
+    padding: 12,
+    borderTopLeftRadius: 10,
+    borderTopRightRadius: 10,
+    borderRadius: 0,
+  },
+  modalBackground: {
+    backgroundColor: 'modalBackground',
+    padding: 12,
+    justifyContent: 'center',
+    alignItems: 'center',
+    borderRadius: 5,
+  },
+  image: {
+    resizeMode: 'contain',
+    flex: 1,
+    justifyContent: 'center',
+    marginBottom: 15,
+    marginHorizontal: 15,
+    marginTop: 20,
+  },
+  linebreak: {
+    borderBottomColor: 'gray',
+    alignSelf: 'stretch',
+    margin: 0,
+    borderBottomWidth: 0.25,
+    paddingBottom: 10,
+    padding: 5,
+  },
+  spacer: {
+    padding: 5,
+  },
+};
+
+export default ImagePasteModal;
diff --git a/native/components/modal.react.js b/native/components/modal.react.js
index 3dba6f36e..e83dca55b 100644
--- a/native/components/modal.react.js
+++ b/native/components/modal.react.js
@@ -1,86 +1,71 @@
 // @flow
 
-import PropTypes from 'prop-types';
 import * as React from 'react';
-import {
-  View,
-  TouchableWithoutFeedback,
-  ViewPropTypes,
-  StyleSheet,
-} from 'react-native';
+import { View, TouchableWithoutFeedback, StyleSheet } from 'react-native';
 import { SafeAreaView } from 'react-native-safe-area-context';
+import type { Edge } from 'react-native-safe-area-context';
 
 import { connect } from 'lib/utils/redux-utils';
 
 import type { RootNavigationProp } from '../navigation/root-navigator.react';
 import type { AppState } from '../redux/redux-setup';
 import { styleSelector } from '../themes/colors';
 import type { ViewStyle } from '../types/styles';
 import KeyboardAvoidingView from './keyboard-avoiding-view.react';
 
 type Props = $ReadOnly<{|
   navigation: RootNavigationProp<>,
   children: React.Node,
   containerStyle?: ViewStyle,
   modalStyle?: ViewStyle,
+  safeAreaEdges?: $ReadOnlyArray<Edge>,
   // Redux state
   styles: typeof styles,
 |}>;
 class Modal extends React.PureComponent<Props> {
-  static propTypes = {
-    children: PropTypes.node,
-    navigation: PropTypes.shape({
-      isFocused: PropTypes.func.isRequired,
-      goBackOnce: PropTypes.func.isRequired,
-    }).isRequired,
-    styles: PropTypes.objectOf(PropTypes.object).isRequired,
-    containerStyle: ViewPropTypes.style,
-    modalStyle: ViewPropTypes.style,
-  };
-
   close = () => {
     if (this.props.navigation.isFocused()) {
       this.props.navigation.goBackOnce();
     }
   };
 
   render() {
-    const { containerStyle, modalStyle, children } = this.props;
+    const { containerStyle, modalStyle, children, safeAreaEdges } = this.props;
     return (
-      <SafeAreaView style={this.props.styles.container}>
+      <SafeAreaView style={this.props.styles.container} edges={safeAreaEdges}>
         <KeyboardAvoidingView
           behavior="padding"
           style={[this.props.styles.container, containerStyle]}
         >
           <TouchableWithoutFeedback onPress={this.close}>
             <View style={StyleSheet.absoluteFill} />
           </TouchableWithoutFeedback>
           <View style={[this.props.styles.modal, modalStyle]}>{children}</View>
         </KeyboardAvoidingView>
       </SafeAreaView>
     );
   }
 }
 
 const styles = {
   container: {
     flex: 1,
     justifyContent: 'center',
     overflow: 'visible',
   },
   modal: {
     backgroundColor: 'modalBackground',
     borderRadius: 5,
     flex: 1,
     justifyContent: 'center',
     marginBottom: 30,
     marginHorizontal: 15,
     marginTop: 100,
     padding: 12,
   },
 };
 const stylesSelector = styleSelector(styles);
 
 export default connect((state: AppState) => ({
   styles: stylesSelector(state),
 }))(Modal);
diff --git a/native/input/input-state-container.react.js b/native/input/input-state-container.react.js
index f434b856e..a4c16c7ff 100644
--- a/native/input/input-state-container.react.js
+++ b/native/input/input-state-container.react.js
@@ -1,1091 +1,1091 @@
 // @flow
 
 import invariant from 'invariant';
 import PropTypes from 'prop-types';
 import * as React from 'react';
 import { Platform } from 'react-native';
 import * as Upload from 'react-native-background-upload';
 import { createSelector } from 'reselect';
 
 import {
   createLocalMessageActionType,
   sendMultimediaMessageActionTypes,
   sendMultimediaMessage,
   sendTextMessageActionTypes,
   sendTextMessage,
 } from 'lib/actions/message-actions';
 import { queueReportsActionType } from 'lib/actions/report-actions';
 import {
   uploadMultimedia,
   updateMultimediaMessageMediaActionType,
   type MultimediaUploadCallbacks,
   type MultimediaUploadExtras,
 } from 'lib/actions/upload-actions';
 import { pathFromURI } from 'lib/media/file-utils';
 import { videoDurationLimit } from 'lib/media/video-utils';
 import {
   createLoadingStatusSelector,
   combineLoadingStatuses,
 } from 'lib/selectors/loading-selectors';
 import { createMediaMessageInfo } from 'lib/shared/message-utils';
 import { isStaff } from 'lib/shared/user-utils';
 import type {
   UploadMultimediaResult,
   Media,
   NativeMediaSelection,
   MediaMissionResult,
   MediaMission,
 } from 'lib/types/media-types';
 import {
   messageTypes,
   type RawMessageInfo,
   type RawMultimediaMessageInfo,
   type SendMessageResult,
   type SendMessagePayload,
 } from 'lib/types/message-types';
 import type { RawImagesMessageInfo } from 'lib/types/message/images';
 import type { RawMediaMessageInfo } from 'lib/types/message/media';
 import type { RawTextMessageInfo } from 'lib/types/message/text';
 import {
   type MediaMissionReportCreationRequest,
   reportTypes,
 } from 'lib/types/report-types';
 import type {
   DispatchActionPayload,
   DispatchActionPromise,
 } from 'lib/utils/action-utils';
 import { getConfig } from 'lib/utils/config';
 import { getMessageForException, cloneError } from 'lib/utils/errors';
 import type {
   FetchJSONOptions,
   FetchJSONServerResponse,
 } from 'lib/utils/fetch-json';
 import { connect } from 'lib/utils/redux-utils';
 
 import { disposeTempFile } from '../media/file-utils';
 import { processMedia } from '../media/media-utils';
 import { displayActionResultModal } from '../navigation/action-result-modal';
 import type { AppState } from '../redux/redux-setup';
 import {
   InputStateContext,
   type PendingMultimediaUploads,
 } from './input-state';
 
 let nextLocalUploadID = 0;
 function getNewLocalID() {
   return `localUpload${nextLocalUploadID++}`;
 }
 
 type SelectionWithID = {|
   selection: NativeMediaSelection,
   localID: string,
 |};
 type CompletedUploads = { [localMessageID: string]: ?Set<string> };
 
 type Props = {|
   children: React.Node,
   // Redux state
   viewerID: ?string,
   nextLocalID: number,
   messageStoreMessages: { [id: string]: RawMessageInfo },
   ongoingMessageCreation: boolean,
   hasWiFi: boolean,
   // Redux dispatch functions
   dispatchActionPayload: DispatchActionPayload,
   dispatchActionPromise: DispatchActionPromise,
   // async functions that hit server APIs
   uploadMultimedia: (
     multimedia: Object,
     extras: MultimediaUploadExtras,
     callbacks: MultimediaUploadCallbacks,
   ) => Promise<UploadMultimediaResult>,
   sendMultimediaMessage: (
     threadID: string,
     localID: string,
     mediaIDs: $ReadOnlyArray<string>,
   ) => Promise<SendMessageResult>,
   sendTextMessage: (
     threadID: string,
     localID: string,
     text: string,
   ) => Promise<SendMessageResult>,
 |};
 type State = {|
   pendingUploads: PendingMultimediaUploads,
 |};
 class InputStateContainer extends React.PureComponent<Props, State> {
   static propTypes = {
     children: PropTypes.node.isRequired,
     viewerID: PropTypes.string,
     nextLocalID: PropTypes.number.isRequired,
     messageStoreMessages: PropTypes.object.isRequired,
     ongoingMessageCreation: PropTypes.bool.isRequired,
     hasWiFi: PropTypes.bool.isRequired,
     dispatchActionPayload: PropTypes.func.isRequired,
     dispatchActionPromise: PropTypes.func.isRequired,
     uploadMultimedia: PropTypes.func.isRequired,
     sendMultimediaMessage: PropTypes.func.isRequired,
     sendTextMessage: PropTypes.func.isRequired,
   };
   state: State = {
     pendingUploads: {},
   };
   sendCallbacks: Array<() => void> = [];
   activeURIs = new Map();
   replyCallbacks: Array<(message: string) => void> = [];
 
   static getCompletedUploads(props: Props, state: State): CompletedUploads {
     const completedUploads = {};
     for (let localMessageID in state.pendingUploads) {
       const messagePendingUploads = state.pendingUploads[localMessageID];
       const rawMessageInfo = props.messageStoreMessages[localMessageID];
       if (!rawMessageInfo) {
         continue;
       }
       invariant(
         rawMessageInfo.type === messageTypes.IMAGES ||
           rawMessageInfo.type === messageTypes.MULTIMEDIA,
         `rawMessageInfo ${localMessageID} should be multimedia`,
       );
 
       const completed = [];
       let allUploadsComplete = true;
       for (let localUploadID in messagePendingUploads) {
         let media;
         for (let singleMedia of rawMessageInfo.media) {
           if (singleMedia.id === localUploadID) {
             media = singleMedia;
             break;
           }
         }
         if (media) {
           allUploadsComplete = false;
         } else {
           completed.push(localUploadID);
         }
       }
 
       if (allUploadsComplete) {
         completedUploads[localMessageID] = null;
       } else if (completed.length > 0) {
         completedUploads[localMessageID] = new Set(completed);
       }
     }
     return completedUploads;
   }
 
   componentDidUpdate(prevProps: Props, prevState: State) {
     if (this.props.viewerID !== prevProps.viewerID) {
       this.setState({ pendingUploads: {} });
       return;
     }
 
     const currentlyComplete = InputStateContainer.getCompletedUploads(
       this.props,
       this.state,
     );
     const previouslyComplete = InputStateContainer.getCompletedUploads(
       prevProps,
       prevState,
     );
 
     const newPendingUploads = {};
     let pendingUploadsChanged = false;
     const readyMessageIDs = [];
     for (let localMessageID in this.state.pendingUploads) {
       const messagePendingUploads = this.state.pendingUploads[localMessageID];
       const prevRawMessageInfo = prevProps.messageStoreMessages[localMessageID];
       const rawMessageInfo = this.props.messageStoreMessages[localMessageID];
       const completedUploadIDs = currentlyComplete[localMessageID];
       const previouslyCompletedUploadIDs = previouslyComplete[localMessageID];
 
       if (!rawMessageInfo && prevRawMessageInfo) {
         pendingUploadsChanged = true;
         continue;
       } else if (completedUploadIDs === null) {
         // All of this message's uploads have been completed
         newPendingUploads[localMessageID] = {};
         if (previouslyCompletedUploadIDs !== null) {
           readyMessageIDs.push(localMessageID);
           pendingUploadsChanged = true;
         }
         continue;
       } else if (!completedUploadIDs) {
         // Nothing has been completed
         newPendingUploads[localMessageID] = messagePendingUploads;
         continue;
       }
 
       const newUploads = {};
       let uploadsChanged = false;
       for (let localUploadID in messagePendingUploads) {
         if (!completedUploadIDs.has(localUploadID)) {
           newUploads[localUploadID] = messagePendingUploads[localUploadID];
         } else if (
           !previouslyCompletedUploadIDs ||
           !previouslyCompletedUploadIDs.has(localUploadID)
         ) {
           uploadsChanged = true;
         }
       }
 
       if (uploadsChanged) {
         pendingUploadsChanged = true;
         newPendingUploads[localMessageID] = newUploads;
       } else {
         newPendingUploads[localMessageID] = messagePendingUploads;
       }
     }
     if (pendingUploadsChanged) {
       this.setState({ pendingUploads: newPendingUploads });
     }
 
     for (let localMessageID of readyMessageIDs) {
       const rawMessageInfo = this.props.messageStoreMessages[localMessageID];
       if (!rawMessageInfo) {
         continue;
       }
       invariant(
         rawMessageInfo.type === messageTypes.IMAGES ||
           rawMessageInfo.type === messageTypes.MULTIMEDIA,
         `rawMessageInfo ${localMessageID} should be multimedia`,
       );
       this.dispatchMultimediaMessageAction(rawMessageInfo);
     }
   }
 
   dispatchMultimediaMessageAction(messageInfo: RawMultimediaMessageInfo) {
     this.props.dispatchActionPromise(
       sendMultimediaMessageActionTypes,
       this.sendMultimediaMessageAction(messageInfo),
       undefined,
       messageInfo,
     );
   }
 
   async sendMultimediaMessageAction(
     messageInfo: RawMultimediaMessageInfo,
   ): Promise<SendMessagePayload> {
     const { localID, threadID } = messageInfo;
     invariant(
       localID !== null && localID !== undefined,
       'localID should be set',
     );
     const mediaIDs = [];
     for (let { id } of messageInfo.media) {
       mediaIDs.push(id);
     }
     try {
       const result = await this.props.sendMultimediaMessage(
         threadID,
         localID,
         mediaIDs,
       );
       return {
         localID,
         serverID: result.id,
         threadID,
         time: result.time,
         interface: result.interface,
       };
     } catch (e) {
       const copy = cloneError(e);
       copy.localID = localID;
       copy.threadID = threadID;
       throw copy;
     }
   }
 
   inputStateSelector = createSelector(
     (state: State) => state.pendingUploads,
     (pendingUploads: PendingMultimediaUploads) => ({
       pendingUploads,
       sendTextMessage: this.sendTextMessage,
       sendMultimediaMessage: this.sendMultimediaMessage,
       addReply: this.addReply,
       addReplyListener: this.addReplyListener,
       removeReplyListener: this.removeReplyListener,
       messageHasUploadFailure: this.messageHasUploadFailure,
       retryMultimediaMessage: this.retryMultimediaMessage,
       registerSendCallback: this.registerSendCallback,
       unregisterSendCallback: this.unregisterSendCallback,
       uploadInProgress: this.uploadInProgress,
       reportURIDisplayed: this.reportURIDisplayed,
     }),
   );
 
   uploadInProgress = () => {
     if (this.props.ongoingMessageCreation) {
       return true;
     }
     for (let localMessageID in this.state.pendingUploads) {
       const messagePendingUploads = this.state.pendingUploads[localMessageID];
       for (let localUploadID in messagePendingUploads) {
         const { failed } = messagePendingUploads[localUploadID];
         if (!failed) {
           return true;
         }
       }
     }
     return false;
   };
 
   sendTextMessage = (messageInfo: RawTextMessageInfo) => {
     this.sendCallbacks.forEach((callback) => callback());
     this.props.dispatchActionPromise(
       sendTextMessageActionTypes,
       this.sendTextMessageAction(messageInfo),
       undefined,
       messageInfo,
     );
   };
 
   async sendTextMessageAction(
     messageInfo: RawTextMessageInfo,
   ): Promise<SendMessagePayload> {
     try {
       const { localID } = messageInfo;
       invariant(
         localID !== null && localID !== undefined,
         'localID should be set',
       );
       const result = await this.props.sendTextMessage(
         messageInfo.threadID,
         localID,
         messageInfo.text,
       );
       return {
         localID,
         serverID: result.id,
         threadID: messageInfo.threadID,
         time: result.time,
         interface: result.interface,
       };
     } catch (e) {
       const copy = cloneError(e);
       copy.localID = messageInfo.localID;
       copy.threadID = messageInfo.threadID;
       throw copy;
     }
   }
 
   sendMultimediaMessage = async (
     threadID: string,
     selections: $ReadOnlyArray<NativeMediaSelection>,
   ) => {
     this.sendCallbacks.forEach((callback) => callback());
     const localMessageID = `local${this.props.nextLocalID}`;
     const selectionsWithIDs = selections.map((selection) => ({
       selection,
       localID: getNewLocalID(),
     }));
 
     const pendingUploads = {};
     for (let { localID } of selectionsWithIDs) {
       pendingUploads[localID] = {
         failed: null,
         progressPercent: 0,
       };
     }
 
     this.setState(
       (prevState) => {
         return {
           pendingUploads: {
             ...prevState.pendingUploads,
             [localMessageID]: pendingUploads,
           },
         };
       },
       () => {
         const creatorID = this.props.viewerID;
         invariant(creatorID, 'need viewer ID in order to send a message');
         const media = selectionsWithIDs.map(({ localID, selection }) => {
           if (selection.step === 'photo_library') {
             return {
               id: localID,
               uri: selection.uri,
               type: 'photo',
               dimensions: selection.dimensions,
               localMediaSelection: selection,
             };
           } else if (selection.step === 'photo_capture') {
             return {
               id: localID,
               uri: selection.uri,
               type: 'photo',
               dimensions: selection.dimensions,
               localMediaSelection: selection,
             };
           } else if (selection.step === 'photo_paste') {
             return {
               id: localID,
               uri: selection.uri,
               type: 'photo',
               dimensions: selection.dimensions,
               localMediaSelection: selection,
             };
           } else if (selection.step === 'video_library') {
             return {
               id: localID,
               uri: selection.uri,
               type: 'video',
               dimensions: selection.dimensions,
               localMediaSelection: selection,
               loop: false,
             };
           }
           invariant(false, `invalid selection ${JSON.stringify(selection)}`);
         });
         const messageInfo = createMediaMessageInfo({
           localID: localMessageID,
           threadID,
           creatorID,
           media,
         });
         this.props.dispatchActionPayload(
           createLocalMessageActionType,
           messageInfo,
         );
       },
     );
 
     await this.uploadFiles(localMessageID, selectionsWithIDs);
   };
 
   async uploadFiles(
     localMessageID: string,
     selectionsWithIDs: $ReadOnlyArray<SelectionWithID>,
   ) {
     const results = await Promise.all(
       selectionsWithIDs.map((selectionWithID) =>
         this.uploadFile(localMessageID, selectionWithID),
       ),
     );
     const errors = [...new Set(results.filter(Boolean))];
     if (errors.length > 0) {
       displayActionResultModal(errors.join(', ') + ' :(');
     }
   }
 
   async uploadFile(
     localMessageID: string,
     selectionWithID: SelectionWithID,
   ): Promise<?string> {
     const { localID, selection } = selectionWithID;
     const start = selection.sendTime;
     let steps = [selection],
       serverID,
       userTime,
       errorMessage;
     let reportPromise;
 
     const finish = async (result: MediaMissionResult) => {
       if (reportPromise) {
         const finalSteps = await reportPromise;
         steps.push(...finalSteps);
       }
       const totalTime = Date.now() - start;
       userTime = userTime ? userTime : totalTime;
       this.queueMediaMissionReport(
         { localID, localMessageID, serverID },
         { steps, result, totalTime, userTime },
       );
       return errorMessage;
     };
     const fail = (message: string) => {
       errorMessage = message;
       this.handleUploadFailure(localMessageID, localID, message);
       userTime = Date.now() - start;
     };
 
     let processedMedia;
     const processingStart = Date.now();
     try {
       const processMediaReturn = processMedia(
         selection,
         this.mediaProcessConfig(),
       );
       reportPromise = processMediaReturn.reportPromise;
       const processResult = await processMediaReturn.resultPromise;
       if (!processResult.success) {
         const message =
           processResult.reason === 'video_too_long'
             ? `can't do vids longer than ${videoDurationLimit}min`
             : 'processing failed';
         fail(message);
         return await finish(processResult);
       }
       processedMedia = processResult;
     } catch (e) {
       fail('processing failed');
       return await finish({
         success: false,
         reason: 'processing_exception',
         time: Date.now() - processingStart,
         exceptionMessage: getMessageForException(e),
       });
     }
 
     const { uploadURI, shouldDisposePath, filename, mime } = processedMedia;
 
     const { hasWiFi } = this.props;
 
     const uploadStart = Date.now();
     let uploadExceptionMessage, uploadResult, mediaMissionResult;
     try {
       uploadResult = await this.props.uploadMultimedia(
         { uri: uploadURI, name: filename, type: mime },
         { ...processedMedia.dimensions, loop: processedMedia.loop },
         {
           onProgress: (percent: number) =>
             this.setProgress(localMessageID, localID, percent),
           uploadBlob: this.uploadBlob,
         },
       );
       mediaMissionResult = { success: true };
     } catch (e) {
       uploadExceptionMessage = getMessageForException(e);
       fail('upload failed');
       mediaMissionResult = {
         success: false,
         reason: 'http_upload_failed',
         exceptionMessage: uploadExceptionMessage,
       };
     }
 
     if (uploadResult) {
       const { id, mediaType, uri, dimensions, loop } = uploadResult;
       serverID = id;
       this.props.dispatchActionPayload(updateMultimediaMessageMediaActionType, {
         messageID: localMessageID,
         currentMediaID: localID,
         mediaUpdate: {
           id,
           type: mediaType,
           uri,
           dimensions,
           localMediaSelection: undefined,
           loop,
         },
       });
       userTime = Date.now() - start;
     }
 
     const processSteps = await reportPromise;
     reportPromise = null;
     steps.push(...processSteps);
     steps.push({
       step: 'upload',
       success: !!uploadResult,
       exceptionMessage: uploadExceptionMessage,
       time: Date.now() - uploadStart,
       inputFilename: filename,
       outputMediaType: uploadResult && uploadResult.mediaType,
       outputURI: uploadResult && uploadResult.uri,
       outputDimensions: uploadResult && uploadResult.dimensions,
       outputLoop: uploadResult && uploadResult.loop,
       hasWiFi,
     });
 
     const promises = [];
 
     if (shouldDisposePath) {
       // If processMedia needed to do any transcoding before upload, we dispose
       // of the resultant temporary file here. Since the transcoded temporary
       // file is only used for upload, we can dispose of it after processMedia
       // (reportPromise) and the upload are complete
       promises.push(
         (async () => {
           const disposeStep = await disposeTempFile(shouldDisposePath);
           steps.push(disposeStep);
         })(),
       );
     }
 
-    if (selection.captureTime) {
+    if (selection.captureTime || selection.step === 'photo_paste') {
       // If we are uploading a newly captured photo, we dispose of the original
       // file here. Note that we try to save photo captures to the camera roll
       // if we have permission. Even if we fail, this temporary file isn't
       // visible to the user, so there's no point in keeping it around. Since
       // the initial URI is used in rendering paths, we have to wait for it to
       // be replaced with the remote URI before we can dispose
       const captureURI = selection.uri;
       promises.push(
         (async () => {
           const {
             steps: clearSteps,
             result: capturePath,
           } = await this.waitForCaptureURIUnload(captureURI);
           steps.push(...clearSteps);
           if (!capturePath) {
             return;
           }
           const disposeStep = await disposeTempFile(capturePath);
           steps.push(disposeStep);
         })(),
       );
     }
 
     await Promise.all(promises);
 
     return await finish(mediaMissionResult);
   }
 
   mediaProcessConfig() {
     const { hasWiFi, viewerID } = this.props;
     if (__DEV__ || (viewerID && isStaff(viewerID))) {
       return {
         hasWiFi,
         finalFileHeaderCheck: true,
       };
     }
     return { hasWiFi };
   }
 
   setProgress(
     localMessageID: string,
     localUploadID: string,
     progressPercent: number,
   ) {
     this.setState((prevState) => {
       const pendingUploads = prevState.pendingUploads[localMessageID];
       if (!pendingUploads) {
         return {};
       }
       const pendingUpload = pendingUploads[localUploadID];
       if (!pendingUpload) {
         return {};
       }
       const newOutOfHundred = Math.floor(progressPercent * 100);
       const oldOutOfHundred = Math.floor(pendingUpload.progressPercent * 100);
       if (newOutOfHundred === oldOutOfHundred) {
         return {};
       }
       const newPendingUploads = {
         ...pendingUploads,
         [localUploadID]: {
           ...pendingUpload,
           progressPercent,
         },
       };
       return {
         pendingUploads: {
           ...prevState.pendingUploads,
           [localMessageID]: newPendingUploads,
         },
       };
     });
   }
 
   uploadBlob = async (
     url: string,
     cookie: ?string,
     sessionID: ?string,
     input: { [key: string]: mixed },
     options?: ?FetchJSONOptions,
   ): Promise<FetchJSONServerResponse> => {
     invariant(
       cookie &&
         input.multimedia &&
         Array.isArray(input.multimedia) &&
         input.multimedia.length === 1 &&
         input.multimedia[0] &&
         typeof input.multimedia[0] === 'object',
       'InputStateContainer.uploadBlob sent incorrect input',
     );
     const { uri, name, type } = input.multimedia[0];
     invariant(
       typeof uri === 'string' &&
         typeof name === 'string' &&
         typeof type === 'string',
       'InputStateContainer.uploadBlob sent incorrect input',
     );
 
     const parameters = {};
     parameters.cookie = cookie;
     parameters.filename = name;
 
     for (let key in input) {
       if (
         key === 'multimedia' ||
         key === 'cookie' ||
         key === 'sessionID' ||
         key === 'filename'
       ) {
         continue;
       }
       const value = input[key];
       invariant(
         typeof value === 'string',
         'blobUpload calls can only handle string values for non-multimedia keys',
       );
       parameters[key] = value;
     }
 
     let path = uri;
     if (Platform.OS === 'android') {
       const resolvedPath = pathFromURI(uri);
       if (resolvedPath) {
         path = resolvedPath;
       }
     }
     const uploadID = await Upload.startUpload({
       url,
       path,
       type: 'multipart',
       headers: {
         Accept: 'application/json',
       },
       field: 'multimedia',
       parameters,
     });
     if (options && options.abortHandler) {
       options.abortHandler(() => {
         Upload.cancelUpload(uploadID);
       });
     }
     return await new Promise((resolve, reject) => {
       Upload.addListener('error', uploadID, (data) => {
         reject(data.error);
       });
       Upload.addListener('cancelled', uploadID, () => {
         reject(new Error('request aborted'));
       });
       Upload.addListener('completed', uploadID, (data) => {
         try {
           resolve(JSON.parse(data.responseBody));
         } catch (e) {
           reject(e);
         }
       });
       if (options && options.onProgress) {
         const { onProgress } = options;
         Upload.addListener('progress', uploadID, (data) =>
           onProgress(data.progress / 100),
         );
       }
     });
   };
 
   handleUploadFailure(
     localMessageID: string,
     localUploadID: string,
     message: string,
   ) {
     this.setState((prevState) => {
       const uploads = prevState.pendingUploads[localMessageID];
       const upload = uploads[localUploadID];
       if (!upload) {
         // The upload has been completed before it failed
         return {};
       }
       return {
         pendingUploads: {
           ...prevState.pendingUploads,
           [localMessageID]: {
             ...uploads,
             [localUploadID]: {
               ...upload,
               failed: message,
               progressPercent: 0,
             },
           },
         },
       };
     });
   }
 
   queueMediaMissionReport(
     ids: {| localID: string, localMessageID: string, serverID: ?string |},
     mediaMission: MediaMission,
   ) {
     const report: MediaMissionReportCreationRequest = {
       type: reportTypes.MEDIA_MISSION,
       time: Date.now(),
       platformDetails: getConfig().platformDetails,
       mediaMission,
       uploadServerID: ids.serverID,
       uploadLocalID: ids.localID,
       messageLocalID: ids.localMessageID,
     };
     this.props.dispatchActionPayload(queueReportsActionType, {
       reports: [report],
     });
   }
 
   messageHasUploadFailure = (localMessageID: string) => {
     const pendingUploads = this.state.pendingUploads[localMessageID];
     if (!pendingUploads) {
       return false;
     }
     for (let localUploadID in pendingUploads) {
       const { failed } = pendingUploads[localUploadID];
       if (failed) {
         return true;
       }
     }
     return false;
   };
 
   addReply = (message: string) => {
     this.replyCallbacks.forEach((addReplyCallback) =>
       addReplyCallback(message),
     );
   };
 
   addReplyListener = (callbackReply: (message: string) => void) => {
     this.replyCallbacks.push(callbackReply);
   };
 
   removeReplyListener = (callbackReply: (message: string) => void) => {
     this.replyCallbacks = this.replyCallbacks.filter(
       (candidate) => candidate !== callbackReply,
     );
   };
 
   retryMultimediaMessage = async (localMessageID: string) => {
     const rawMessageInfo = this.props.messageStoreMessages[localMessageID];
     invariant(rawMessageInfo, `rawMessageInfo ${localMessageID} should exist`);
 
     let pendingUploads = this.state.pendingUploads[localMessageID];
     if (!pendingUploads) {
       pendingUploads = {};
     }
 
     const now = Date.now();
 
     const updateMedia = <T: Media>(media: $ReadOnlyArray<T>): T[] =>
       media.map((singleMedia) => {
         const oldID = singleMedia.id;
         if (!oldID.startsWith('localUpload')) {
           // already uploaded
           return singleMedia;
         }
         if (pendingUploads[oldID] && !pendingUploads[oldID].failed) {
           // still being uploaded
           return singleMedia;
         }
 
         // If we have an incomplete upload that isn't in pendingUploads, that
         // indicates the app has restarted. We'll reassign a new localID to
         // avoid collisions. Note that this isn't necessary for the message ID
         // since the localID reducer prevents collisions there
         const id = pendingUploads[oldID] ? oldID : getNewLocalID();
 
         const oldSelection = singleMedia.localMediaSelection;
         invariant(
           oldSelection,
           'localMediaSelection should be set on locally created Media',
         );
         const retries = oldSelection.retries ? oldSelection.retries + 1 : 1;
 
         // We switch for Flow
         let selection;
         if (oldSelection.step === 'photo_capture') {
           selection = { ...oldSelection, sendTime: now, retries };
         } else if (oldSelection.step === 'photo_library') {
           selection = { ...oldSelection, sendTime: now, retries };
         } else if (oldSelection.step === 'photo_paste') {
           selection = { ...oldSelection, sendTime: now, retries };
         } else {
           selection = { ...oldSelection, sendTime: now, retries };
         }
 
         if (singleMedia.type === 'photo') {
           return {
             type: 'photo',
             ...singleMedia,
             id,
             localMediaSelection: selection,
           };
         } else {
           return {
             type: 'video',
             ...singleMedia,
             id,
             localMediaSelection: selection,
           };
         }
       });
 
     let newRawMessageInfo;
     // This conditional is for Flow
     if (rawMessageInfo.type === messageTypes.MULTIMEDIA) {
       newRawMessageInfo = ({
         ...rawMessageInfo,
         time: now,
         media: updateMedia(rawMessageInfo.media),
       }: RawMediaMessageInfo);
     } else if (rawMessageInfo.type === messageTypes.IMAGES) {
       newRawMessageInfo = ({
         ...rawMessageInfo,
         time: now,
         media: updateMedia(rawMessageInfo.media),
       }: RawImagesMessageInfo);
     } else {
       invariant(false, `rawMessageInfo ${localMessageID} should be multimedia`);
     }
 
     const incompleteMedia: Media[] = [];
     for (let singleMedia of newRawMessageInfo.media) {
       if (singleMedia.id.startsWith('localUpload')) {
         incompleteMedia.push(singleMedia);
       }
     }
     if (incompleteMedia.length === 0) {
       this.dispatchMultimediaMessageAction(newRawMessageInfo);
       this.setState((prevState) => ({
         pendingUploads: {
           ...prevState.pendingUploads,
           [localMessageID]: {},
         },
       }));
       return;
     }
 
     const retryMedia = incompleteMedia.filter(
       ({ id }) => !pendingUploads[id] || pendingUploads[id].failed,
     );
     if (retryMedia.length === 0) {
       // All media are already in the process of being uploaded
       return;
     }
 
     // We're not actually starting the send here,
     // we just use this action to update the message in Redux
     this.props.dispatchActionPayload(
       sendMultimediaMessageActionTypes.started,
       newRawMessageInfo,
     );
 
     // We clear out the failed status on individual media here,
     // which makes the UI show pending status instead of error messages
     for (let { id } of retryMedia) {
       pendingUploads[id] = {
         failed: null,
         progressPercent: 0,
       };
     }
     this.setState((prevState) => ({
       pendingUploads: {
         ...prevState.pendingUploads,
         [localMessageID]: pendingUploads,
       },
     }));
 
     const selectionsWithIDs = retryMedia.map((singleMedia) => {
       const { id, localMediaSelection } = singleMedia;
       invariant(
         localMediaSelection,
         'localMediaSelection should be set on locally created Media',
       );
       return { selection: localMediaSelection, localID: id };
     });
 
     await this.uploadFiles(localMessageID, selectionsWithIDs);
   };
 
   registerSendCallback = (callback: () => void) => {
     this.sendCallbacks.push(callback);
   };
 
   unregisterSendCallback = (callback: () => void) => {
     this.sendCallbacks = this.sendCallbacks.filter(
       (candidate) => candidate !== callback,
     );
   };
 
   reportURIDisplayed = (uri: string, loaded: boolean) => {
     const prevActiveURI = this.activeURIs.get(uri);
     const curCount = prevActiveURI && prevActiveURI.count;
     const prevCount = curCount ? curCount : 0;
     const count = loaded ? prevCount + 1 : prevCount - 1;
     const prevOnClear = prevActiveURI && prevActiveURI.onClear;
     const onClear = prevOnClear ? prevOnClear : [];
     const activeURI = { count, onClear };
     if (count) {
       this.activeURIs.set(uri, activeURI);
       return;
     }
     this.activeURIs.delete(uri);
     for (let callback of onClear) {
       callback();
     }
   };
 
   waitForCaptureURIUnload(uri: string) {
     const start = Date.now();
     const path = pathFromURI(uri);
     if (!path) {
       return Promise.resolve({
         result: null,
         steps: [
           {
             step: 'wait_for_capture_uri_unload',
             success: false,
             time: Date.now() - start,
             uri,
           },
         ],
       });
     }
 
     const getResult = () => ({
       result: path,
       steps: [
         {
           step: 'wait_for_capture_uri_unload',
           success: true,
           time: Date.now() - start,
           uri,
         },
       ],
     });
 
     const activeURI = this.activeURIs.get(uri);
     if (!activeURI) {
       return Promise.resolve(getResult());
     }
 
     return new Promise((resolve) => {
       const finish = () => resolve(getResult());
       const newActiveURI = {
         ...activeURI,
         onClear: [...activeURI.onClear, finish],
       };
       this.activeURIs.set(uri, newActiveURI);
     });
   }
 
   render() {
     const inputState = this.inputStateSelector(this.state);
     return (
       <InputStateContext.Provider value={inputState}>
         {this.props.children}
       </InputStateContext.Provider>
     );
   }
 }
 
 const mediaCreationLoadingStatusSelector = createLoadingStatusSelector(
   sendMultimediaMessageActionTypes,
 );
 const textCreationLoadingStatusSelector = createLoadingStatusSelector(
   sendTextMessageActionTypes,
 );
 
 export default connect(
   (state: AppState) => ({
     viewerID: state.currentUserInfo && state.currentUserInfo.id,
     nextLocalID: state.nextLocalID,
     messageStoreMessages: state.messageStore.messages,
     ongoingMessageCreation:
       combineLoadingStatuses(
         mediaCreationLoadingStatusSelector(state),
         textCreationLoadingStatusSelector(state),
       ) === 'loading',
     hasWiFi: state.connectivity.hasWiFi,
   }),
   { uploadMultimedia, sendMultimediaMessage, sendTextMessage },
 )(InputStateContainer);
diff --git a/native/navigation/root-navigator.react.js b/native/navigation/root-navigator.react.js
index 5044cb65b..0a9d10df2 100644
--- a/native/navigation/root-navigator.react.js
+++ b/native/navigation/root-navigator.react.js
@@ -1,194 +1,201 @@
 // @flow
 
 import {
   createNavigatorFactory,
   useNavigationBuilder,
   type StackNavigationState,
   type StackOptions,
   type StackNavigationEventMap,
   type StackNavigatorProps,
   type ExtraStackNavigatorProps,
 } from '@react-navigation/native';
 import { StackView, TransitionPresets } from '@react-navigation/stack';
 import * as React from 'react';
 import { Platform } from 'react-native';
 import { enableScreens } from 'react-native-screens';
 
 import LoggedOutModal from '../account/logged-out-modal.react';
 import VerificationModal from '../account/verification-modal.react';
 import ThreadPickerModal from '../calendar/thread-picker-modal.react';
+import ImagePasteModal from '../chat/image-paste-modal.react';
 import AddUsersModal from '../chat/settings/add-users-modal.react';
 import ColorPickerModal from '../chat/settings/color-picker-modal.react';
 import ComposeSubthreadModal from '../chat/settings/compose-subthread-modal.react';
 import SidebarListModal from '../chat/sidebar-list-modal.react';
 import CustomServerModal from '../more/custom-server-modal.react';
 import AppNavigator from './app-navigator.react';
 import { RootNavigatorContext } from './root-navigator-context';
 import RootRouter, { type RootRouterNavigationProp } from './root-router';
 import {
   LoggedOutModalRouteName,
   VerificationModalRouteName,
   AppRouteName,
   ThreadPickerModalRouteName,
+  ImagePasteModalRouteName,
   AddUsersModalRouteName,
   CustomServerModalRouteName,
   ColorPickerModalRouteName,
   ComposeSubthreadModalRouteName,
   SidebarListModalRouteName,
   type ScreenParamList,
   type RootParamList,
 } from './route-names';
 
 if (Platform.OS !== 'android' || Platform.Version >= 21) {
   // Older Android devices get stack overflows when trying to draw deeply nested
   // view structures. We've tried to get our draw depth down as much as possible
   // without going into React Navigation internals or creating a separate render
   // path for these old Android devices. Because react-native-screens increases
   // the draw depth enough to cause crashes in some scenarios, we disable it
   // here for those devices
   enableScreens();
 }
 
 type RootNavigatorProps = StackNavigatorProps<RootRouterNavigationProp<>>;
 function RootNavigator({
   initialRouteName,
   children,
   screenOptions,
   ...rest
 }: RootNavigatorProps) {
   const { state, descriptors, navigation } = useNavigationBuilder(RootRouter, {
     initialRouteName,
     children,
     screenOptions,
   });
 
   const [keyboardHandlingEnabled, setKeyboardHandlingEnabled] = React.useState(
     true,
   );
   const rootNavigationContext = React.useMemo(
     () => ({ setKeyboardHandlingEnabled }),
     [setKeyboardHandlingEnabled],
   );
 
   return (
     <RootNavigatorContext.Provider value={rootNavigationContext}>
       <StackView
         {...rest}
         state={state}
         descriptors={descriptors}
         navigation={navigation}
         keyboardHandlingEnabled={keyboardHandlingEnabled}
         detachInactiveScreens={Platform.OS !== 'ios'}
       />
     </RootNavigatorContext.Provider>
   );
 }
 const createRootNavigator = createNavigatorFactory<
   StackNavigationState,
   StackOptions,
   StackNavigationEventMap,
   RootRouterNavigationProp<>,
   ExtraStackNavigatorProps,
 >(RootNavigator);
 
 const baseTransitionPreset = Platform.select({
   ios: TransitionPresets.ModalSlideFromBottomIOS,
   default: TransitionPresets.FadeFromBottomAndroid,
 });
 const transitionPreset = {
   ...baseTransitionPreset,
   cardStyleInterpolator: (interpolatorProps) => {
     const baseCardStyleInterpolator = baseTransitionPreset.cardStyleInterpolator(
       interpolatorProps,
     );
     const overlayOpacity = interpolatorProps.current.progress.interpolate({
       inputRange: [0, 1],
       outputRange: ([0, 0.7]: number[]), // Flow...
       extrapolate: 'clamp',
     });
     return {
       ...baseCardStyleInterpolator,
       overlayStyle: [
         baseCardStyleInterpolator.overlayStyle,
         { opacity: overlayOpacity },
       ],
     };
   },
 };
 
 const defaultScreenOptions = {
   gestureEnabled: Platform.OS === 'ios',
   animationEnabled:
     Platform.OS !== 'web' &&
     Platform.OS !== 'windows' &&
     Platform.OS !== 'macos',
   cardStyle: { backgroundColor: 'transparent' },
   ...transitionPreset,
 };
 const disableGesturesScreenOptions = {
   gestureEnabled: false,
 };
 const modalOverlayScreenOptions = {
   cardOverlayEnabled: true,
 };
 
 export type RootNavigationProp<
   RouteName: $Keys<ScreenParamList> = $Keys<ScreenParamList>,
 > = RootRouterNavigationProp<ScreenParamList, RouteName>;
 
 const Root = createRootNavigator<
   ScreenParamList,
   RootParamList,
   RootNavigationProp<>,
 >();
 const RootComponent = () => {
   return (
     <Root.Navigator
       mode="modal"
       headerMode="none"
       screenOptions={defaultScreenOptions}
     >
       <Root.Screen
         name={LoggedOutModalRouteName}
         component={LoggedOutModal}
         options={disableGesturesScreenOptions}
       />
       <Root.Screen
         name={VerificationModalRouteName}
         component={VerificationModal}
       />
       <Root.Screen name={AppRouteName} component={AppNavigator} />
       <Root.Screen
         name={ThreadPickerModalRouteName}
         component={ThreadPickerModal}
         options={modalOverlayScreenOptions}
       />
+      <Root.Screen
+        name={ImagePasteModalRouteName}
+        component={ImagePasteModal}
+        options={modalOverlayScreenOptions}
+      />
       <Root.Screen
         name={AddUsersModalRouteName}
         component={AddUsersModal}
         options={modalOverlayScreenOptions}
       />
       <Root.Screen
         name={CustomServerModalRouteName}
         component={CustomServerModal}
         options={modalOverlayScreenOptions}
       />
       <Root.Screen
         name={ColorPickerModalRouteName}
         component={ColorPickerModal}
         options={modalOverlayScreenOptions}
       />
       <Root.Screen
         name={ComposeSubthreadModalRouteName}
         component={ComposeSubthreadModal}
         options={modalOverlayScreenOptions}
       />
       <Root.Screen
         name={SidebarListModalRouteName}
         component={SidebarListModal}
         options={modalOverlayScreenOptions}
       />
     </Root.Navigator>
   );
 };
 export default RootComponent;
diff --git a/native/navigation/route-names.js b/native/navigation/route-names.js
index 503583b62..681e2d58c 100644
--- a/native/navigation/route-names.js
+++ b/native/navigation/route-names.js
@@ -1,159 +1,162 @@
 // @flow
 
 import type { LeafRoute } from '@react-navigation/native';
 
 import type { VerificationModalParams } from '../account/verification-modal.react';
 import type { ThreadPickerModalParams } from '../calendar/thread-picker-modal.react';
 import type { ComposeThreadParams } from '../chat/compose-thread.react';
+import type { ImagePasteModalParams } from '../chat/image-paste-modal.react';
 import type { MessageListParams } from '../chat/message-list-types';
 import type { MultimediaTooltipModalParams } from '../chat/multimedia-tooltip-modal.react';
 import type { AddUsersModalParams } from '../chat/settings/add-users-modal.react';
 import type { ColorPickerModalParams } from '../chat/settings/color-picker-modal.react';
 import type { ComposeSubthreadModalParams } from '../chat/settings/compose-subthread-modal.react';
 import type { DeleteThreadParams } from '../chat/settings/delete-thread.react';
 import type { ThreadSettingsMemberTooltipModalParams } from '../chat/settings/thread-settings-member-tooltip-modal.react';
 import type { ThreadSettingsParams } from '../chat/settings/thread-settings.react';
 import type { SidebarListModalParams } from '../chat/sidebar-list-modal.react';
 import type { TextMessageTooltipModalParams } from '../chat/text-message-tooltip-modal.react';
 import type { CameraModalParams } from '../media/camera-modal.react';
 import type { MultimediaModalParams } from '../media/multimedia-modal.react';
 import type { CustomServerModalParams } from '../more/custom-server-modal.react';
 import type { RelationshipListItemTooltipModalParams } from '../more/relationship-list-item-tooltip-modal.react';
 import type { ActionResultModalParams } from './action-result-modal.react';
 
 export const AppRouteName = 'App';
 export const TabNavigatorRouteName = 'TabNavigator';
 export const ComposeThreadRouteName = 'ComposeThread';
 export const DeleteThreadRouteName = 'DeleteThread';
 export const ThreadSettingsRouteName = 'ThreadSettings';
 export const MessageListRouteName = 'MessageList';
 export const VerificationModalRouteName = 'VerificationModal';
 export const LoggedOutModalRouteName = 'LoggedOutModal';
 export const MoreRouteName = 'More';
 export const MoreScreenRouteName = 'MoreScreen';
 export const RelationshipListItemTooltipModalRouteName =
   'RelationshipListItemTooltipModal';
 export const ChatRouteName = 'Chat';
 export const ChatThreadListRouteName = 'ChatThreadList';
 export const HomeChatThreadListRouteName = 'HomeChatThreadList';
 export const BackgroundChatThreadListRouteName = 'BackgroundChatThreadList';
 export const CalendarRouteName = 'Calendar';
 export const BuildInfoRouteName = 'BuildInfo';
 export const DeleteAccountRouteName = 'DeleteAccount';
 export const DevToolsRouteName = 'DevTools';
 export const EditEmailRouteName = 'EditEmail';
 export const EditPasswordRouteName = 'EditPassword';
 export const AppearancePreferencesRouteName = 'AppearancePreferences';
 export const ThreadPickerModalRouteName = 'ThreadPickerModal';
 export const AddUsersModalRouteName = 'AddUsersModal';
 export const CustomServerModalRouteName = 'CustomServerModal';
 export const ColorPickerModalRouteName = 'ColorPickerModal';
 export const ComposeSubthreadModalRouteName = 'ComposeSubthreadModal';
 export const MultimediaModalRouteName = 'MultimediaModal';
 export const MultimediaTooltipModalRouteName = 'MultimediaTooltipModal';
 export const ActionResultModalRouteName = 'ActionResultModal';
 export const TextMessageTooltipModalRouteName = 'TextMessageTooltipModal';
 export const ThreadSettingsMemberTooltipModalRouteName =
   'ThreadSettingsMemberTooltipModal';
 export const CameraModalRouteName = 'CameraModal';
 export const FriendListRouteName = 'FriendList';
 export const BlockListRouteName = 'BlockList';
 export const SidebarListModalRouteName = 'SidebarListModal';
+export const ImagePasteModalRouteName = 'ImagePasteModal';
 
 export type RootParamList = {|
   LoggedOutModal: void,
   VerificationModal: VerificationModalParams,
   App: void,
   ThreadPickerModal: ThreadPickerModalParams,
   AddUsersModal: AddUsersModalParams,
   CustomServerModal: CustomServerModalParams,
   ColorPickerModal: ColorPickerModalParams,
   ComposeSubthreadModal: ComposeSubthreadModalParams,
   SidebarListModal: SidebarListModalParams,
+  ImagePasteModal: ImagePasteModalParams,
 |};
 
 export type TooltipModalParamList = {|
   MultimediaTooltipModal: MultimediaTooltipModalParams,
   TextMessageTooltipModal: TextMessageTooltipModalParams,
   ThreadSettingsMemberTooltipModal: ThreadSettingsMemberTooltipModalParams,
   RelationshipListItemTooltipModal: RelationshipListItemTooltipModalParams,
 |};
 
 export type OverlayParamList = {|
   TabNavigator: void,
   MultimediaModal: MultimediaModalParams,
   ActionResultModal: ActionResultModalParams,
   CameraModal: CameraModalParams,
   ...TooltipModalParamList,
 |};
 
 export type TabParamList = {|
   Calendar: void,
   Chat: void,
   More: void,
 |};
 
 export type ChatParamList = {|
   ChatThreadList: void,
   MessageList: MessageListParams,
   ComposeThread: ComposeThreadParams,
   ThreadSettings: ThreadSettingsParams,
   DeleteThread: DeleteThreadParams,
 |};
 
 export type ChatTopTabsParamList = {|
   HomeChatThreadList: void,
   BackgroundChatThreadList: void,
 |};
 
 export type MoreParamList = {|
   MoreScreen: void,
   EditEmail: void,
   EditPassword: void,
   DeleteAccount: void,
   BuildInfo: void,
   DevTools: void,
   AppearancePreferences: void,
   FriendList: void,
   BlockList: void,
 |};
 
 export type ScreenParamList = {|
   ...RootParamList,
   ...OverlayParamList,
   ...TabParamList,
   ...ChatParamList,
   ...ChatTopTabsParamList,
   ...MoreParamList,
 |};
 
 export type NavigationRoute<RouteName: string = $Keys<ScreenParamList>> = {|
   ...LeafRoute<RouteName>,
   +params: $ElementType<ScreenParamList, RouteName>,
 |};
 
 export const accountModals = [
   LoggedOutModalRouteName,
   VerificationModalRouteName,
 ];
 
 export const scrollBlockingModals = [
   MultimediaModalRouteName,
   MultimediaTooltipModalRouteName,
   TextMessageTooltipModalRouteName,
   ThreadSettingsMemberTooltipModalRouteName,
   RelationshipListItemTooltipModalRouteName,
 ];
 
 export const chatRootModals = [
   AddUsersModalRouteName,
   ColorPickerModalRouteName,
   ComposeSubthreadModalRouteName,
 ];
 
 export const threadRoutes = [
   MessageListRouteName,
   ThreadSettingsRouteName,
   DeleteThreadRouteName,
   ComposeThreadRouteName,
 ];