fix Infinite useEffect loop in audio playback

[thib92]

🎯 Goal

Fix the bug described in #3036, where playing a voice note triggers an infinite useEffect loop, causing a massive performance impact, and even crashing the React Native bridge when using the old architecture

🛠 Implementation details

Wraps pauseAudio and playAudio in useCallback to avoid having the refs of these functions being redefined on each re-render of the AudioAttachment component. This avoids the useEffect being re-triggered on each render, causing another render indefinitely.

🎨 UI Changes

None

🧪 Testing

The reproduction steps for the issue have been described in #3036 . Applying this fix on the reproduction repo fixes the issue.

☑️ Checklist

• I have signed the Stream CLA (required)
• PR targets the develop branch
• Documentation is updated (irrelevant)
• New code is tested in main example apps, including all possible scenarios (tested in the reproduction repo instead)
  • SampleApp iOS and Android
  • Expo iOS and Android

[isekovanic]

Hi @thib92 ,

Thanks again for the very diligent debugging and fix !

I can confirm that:

• The issue was very reproducible on old architecture
• The fix indeed resolves that particular instance of the issue

However, since I'd like to do a few adjustments I'll open another PR soon in the interest of time and reference this one there.

[isekovanic]

Closing this in favour of #3038