[🐛] Photo without content is sent up through file picker

[tao-qian]

Issue

We have seen in a couple cases where a photo metadata is sent as the message, but the message doesn't contain the actual image.
.

Clicking on the image will lead to an blank page on the web (which means that there is no image URL attached to the message), even though the message contains a photo file name (e.g. the 20231206).

It seems like this only happens when images are sent through the file picker (they all have the 'originalFile' field in the backend).

Steps to reproduce

Steps to reproduce the behavior:

We weren't able to reproduce this ourselves yet because it only happens during slow network connection (which is different from no network connection). However, we have seen this happening at least twice in our 10 users pilot group in the past week, so it is not uncommon.

Expected behavior

The message shouldn't be sent and should just end up in a failure state, when the message only contains the photo file name, but not the photo URL.

Project Related Information

Customization

Click To Expand

We are not doing any customization in the image send flow.

<Channel
          LoadingErrorIndicator={() => <NetworkErrorScreenWithHeader/>}
          channel={channel}
          hideStickyDateHeader
          disableTypingIndicator
          enforceUniqueReaction
          hasFilePicker={true}
          hasImagePicker={true}
          messageActions={messageActions}
          AutoCompleteSuggestionList={() => null}
          giphyEnabled={false}
          initialScrollToFirstUnreadMessage
          // insets.top is applied to all screens in App.tsx, so we need to account for it here
          keyboardVerticalOffset={insets.top + (Platform.OS === 'ios' ?  0 : -300)}
          // Update this to change the style of the "Reconnecting..." banner
          // NetworkDownIndicator={() => null}
          CommandsButton={undefined}
          autoCompleteTriggerSettings={() => ({})}
          hasCommands={false}
          MoreOptionsButton={undefined}
          compressImageQuality={0.8}
        >
          {renderTopNavigation()}
          <Divider style={{height: 4}}/>
          <MessageList/>
          <MessageInput />
   </Channel>

Offline support

• I have enabled offline support.
• The feature I'm having does not occur when offline support is disabled. (stripe out if not applicable)

Environment

We have seen this happening on two Android devices so far, but we are not sure if this is an Android specific issue.

Click To Expand

package.json:

# N/A

react-native info output:

 OUTPUT GOES HERE

• Platform that you're experiencing the issue on:
  • iOS
  • Android
  • iOS but have not tested behavior on Android
  • Android but have not tested behavior on iOS
  • Both
• stream-chat-react-native version you're using that has this issue:
  • e.g. 5.4.3
• Device/Emulator info:
  • I am using a physical device
  • OS version: e.g. Android 10
  • Device/Emulator: e.g. iPhone 11

Additional context

Here is how the message metadata looks like in the Stream explorer

A "normal" image message would have an image_url field at the same level as the meme_type, but it is missing from the metadata, and the message was still sent.

The message id is 423-fa49ef6e-72ae-49fa-3227-1f1b6c501b59 if you want to look it up. I am also happy to provide other info like Stream App ID or channel ID, but just don't want to post those here in a public issue.

Screenshots

Click To Expand

---

[tao-qian]

Here is another example of a photo message without photo being sent up, from a different user