compose: Don't immediately send selected image

For why this closes #2366, see Greg's explanation:
  #5474 (review)

Fixes: #4540
Fixes: #2366
Co-authored-by: Akash Dhiman <[email protected]>

Author: chrisbobbe

src/compose/ComposeMenu.js

@@ -8,14 +8,12 @@ import DocumentPicker from 'react-native-document-picker';
 import type { DocumentPickerResponse } from 'react-native-document-picker';
 import { launchCamera, launchImageLibrary } from 'react-native-image-picker';
 
-import { useDispatch } from '../react-redux';
 import * as logging from '../utils/logging';
 import { TranslationContext } from '../boot/TranslationProvider';
 import type { Narrow } from '../types';
 import { showErrorAlert } from '../utils/info';
 import { createStyleSheet } from '../styles';
 import { IconImage, IconCamera, IconAttach, IconVideo } from '../common/Icons';
-import { uploadFile } from '../actions';
 import { androidEnsureStoragePermission } from '../lightbox/download';
 import { ThemeContext } from '../styles/theme';
 import type { SpecificIconType } from '../common/Icons';
@@ -100,9 +98,8 @@ function MenuButton(props: MenuButtonProps) {
 }
 
 export default function ComposeMenu(props: Props): Node {
-  const { destinationNarrow, insertAttachments, insertVideoCallLink } = props;
+  const { insertAttachments, insertVideoCallLink } = props;
 
-  const dispatch = useDispatch();
   const _ = useContext(TranslationContext);
 
   const handleImagePickerResponse = useCallback(
@@ -155,7 +152,7 @@ export default function ComposeMenu(props: Props): Node {
         // TODO: See if we these unexpected situations actually happen. …Ah,
         //   yep, reportedly (and we've seen in Sentry):
         //   https://github.com/react-native-image-picker/react-native-image-picker/issues/1945
-        showErrorAlert(_('Error'), _('Something went wrong, and your message was not sent.'));
+        showErrorAlert(_('Error'), _('Failed to attach your file.'));
         logging.error('Unexpected response from image picker', {
           '!firstAsset': !firstAsset,
           'uri == null': uri == null,
@@ -164,9 +161,9 @@ export default function ComposeMenu(props: Props): Node {
         return;
       }
 
-      dispatch(uploadFile(destinationNarrow, uri, chooseUploadImageFilename(uri, fileName)));
+      insertAttachments([{ name: chooseUploadImageFilename(uri, fileName), url: uri }]);
     },
-    [_, destinationNarrow, dispatch],
+    [_, insertAttachments],
   );
 
   const handleImagePicker = useCallback(() => {

src/message/fetchActions.js

@@ -33,7 +33,6 @@ import {
 import { FIRST_UNREAD_ANCHOR, LAST_MESSAGE_ANCHOR } from '../anchor';
 import { ALL_PRIVATE_NARROW, apiNarrowOfNarrow, caseNarrow, topicNarrow } from '../utils/narrow';
 import { BackoffMachine, promiseTimeout, TimeoutError } from '../utils/async';
-import { addToOutbox } from '../outbox/outboxActions';
 import { getAllUsersById, getOwnUserId } from '../users/userSelectors';
 import type { ServerSettings } from '../api/settings/getServerSettings';
 
@@ -390,16 +389,6 @@ export async function tryFetch<T>(
   }
 }
 
-export const uploadFile =
-  (destinationNarrow: Narrow, uri: string, name: string): ThunkAction<Promise<void>> =>
-  async (dispatch, getState) => {
-    const auth = getAuth(getState());
-    const response = await api.uploadFile(auth, uri, name);
-    const messageToSend = `[${name}](${response.uri})`;
-
-    dispatch(addToOutbox(destinationNarrow, messageToSend));
-  };
-
 export async function fetchServerSettings(realm: URL): Promise<
   | {| +type: 'success', +value: ServerSettings |}
   | {|

static/translations/messages_en.json

@@ -23,6 +23,7 @@
   "Updates may be delayed.": "Updates may be delayed.",
   "No one has read this message yet.": "No one has read this message yet.",
   "Confirm": "Confirm",
+  "Failed to attach your file.": "Failed to attach your file.",
   "Configure permissions": "Configure permissions",
   "You": "You",
   "Discard changes": "Discard changes",
@@ -72,7 +73,6 @@
   "The server sent a malformed response.": "The server sent a malformed response.",
   "Storage permission needed": "Storage permission needed",
   "Zulip will save a copy of your photo on your device. To do so, Zulip will need permission to store files on your device.": "Zulip will save a copy of your photo on your device. To do so, Zulip will need permission to store files on your device.",
-  "Something went wrong, and your message was not sent.": "Something went wrong, and your message was not sent.",
   "Message not sent": "Message not sent",
   "Please specify a topic.": "Please specify a topic.",
   "Please specify a stream.": "Please specify a stream.",