[HELP] Trying to use Flatlist items as a mask for a linear gradient.

I am trying to mask Flatlist elements using linear gradient as shown in the image below. The text on the "message bubbles" are not rendering. I was able to make the flatlist scrollable by going into MaskedView.js and making pointerEvents to "auto". I am using the Flatlist as the maskElement, and a LinearGradient (expo-linear-gradient) as the child. Let me know of any ideas please. Another option I am considering is using gl-react for this, however I want to see if I can simply fix the text not showing up using this library. Thanks!