Camera photo not sent to chat after taking picture

[carolinaknoll]

Hello there! I am using the WhatsApp clone code as a guide, and have reached kind of a dead end. The example project has an Image Preview screen, which I won't have on my case, so after I take a photo with my camera and press send on the camera UI, it should be readily uploaded and sent to the chat messages instead of taking me to the ImagePreview screen and then expecting me to press the send button in order to send the image.

Given that, I have followed the MessageInput component and set my code like this:

  const takeAndUploadImage = useCallback(async () => {
    const photo = await takePhoto({ compressImageQuality })

    if (!photo.cancelled) {
      await uploadNewImage(photo)

      await sendMessage()
      resetInput()
    }
  }, [compressImageQuality, resetInput, sendMessage, uploadNewImage])

However, the issue is that with this code, the image is not readily sent and I strangely do have to press the send message button for it to finally be sent to the messages list.

I am posting this here since it might be a common scenario and I probably am overlooking something, so I feel like others can benefit from the solution to this in the future as well. I have read the docs, checked other code and issues, and tried setting an useEffect to check if imageUploads has the uploaded image and then proceed with sending it to the chat, but it seems that imageUploads is always empty. Setting a timeout also doesn't seem to work.

I can get the photo, with the cancelled: false and the uri pointing to an internal path. However, it seems that the image might be getting uploaded (since it appears when I do press send) but not calling sendMessage as soon as it is ready.

Could someone please give me a helping hand here? Thank you so much!

Dev environment info:

• Package version "stream-chat": "^6.8.0", "stream-chat-react-native": "^4.14.0", "stream-chat-react-native-core": "^4.14.0",

• react-native version "react-native": "0.66.4",

• Device/Emulator (android/ios) version Android Emulator: Samsung Galaxy S21

Expected behavior

Should upload and send the image to chat messages stream after taking the photo with the camera.

[carolinaknoll]

An update on this, as I wasn't able to overcome this press to send step, a nice idea was to refactor the ImagePreview component so that the image, the input to add a caption and the send message button all show inside a modal. This is fun because we don't need to create a whole new page for it, and it worked nicely too!

I was able to fix this issue on my end, however I'll leave this issue open since if I close it, it will give a false impression that the original issue was fixed, and I still believe that others could benefit with a solution for the original problem. 😄 🚀

[vanGalilea]

Hey team! Please add your planning poker estimate with ZenHub @madsroskar @santhoshvai @vishalnarkhede

[vanGalilea]

This issue is stale. I'll be closing this issue for now. Please don't hesitate to contact us in the future if this issue or any questions arise.