Fix issue where IOUAction causes crash in empty chat

[Julesssss]

Details

Mobile apps are crashing when the user opens a ChatReport that has an associated IOUACTION, but no messages. When we try to scrollToBottom, the index count is inaccurate -- because we are not rendering a list item for an IOUACTION.

Fixed Issues

Fixes https://github.com/Expensify/Expensify/issues/158501

Tests

• Find two users who have not yet sent any messages to one other
• Using the API listed below, create an IOU between these two users (either user can create it)
• Navigate to the chat on mobile, make sure the keyboard gains focus
• Tap outside of the input field and then back into the field a couple of times
• The app should NOT crash!

Create an IOU transaction

curl --request POST \
  --url 'https://expensify-jules.ngrok.io/api?command=CreateIOUTransaction' \
  --header 'Content-Type: multipart/form-data; boundary=---011000010111000001101001' \
  --cookie 'email=jules%252B4%2540expensify.com; accountID=308; authToken=113FE...428E' \
  --form 'debtorEmail=jules+6@expensify.com' \
  --form currency=USD \
  --form comment=Cake \
  --form amount=110

device-2021-03-26-153831.mp4

QA Steps

Run above test ^

Tested On

• Web
• Mobile Web
• Desktop
• iOS
• Android

Screenshots

N/A

[Jag96]

When testing this, I didn't see the scroll ever get hit so I debugged and it looks like this.actionListElement.data is always undefined on both mobile and web. @Julesssss can you confirm?

[Julesssss]

Hey @Jag96.

I don't have a good answer for this, I also noticed the value was undefined for web. But this definitely does fix the crash (which was only affecting mobile).

Anyway, while retesting I found a better solution -- we'll simply include IOU actions in the list data, as they will be needed very soon for other IOU PRs anyway.

[Jag96]

LGTM and makes sense!