Try and guard against play/pause function being called after player is destroyed (#9364)

* try and guard play/pause against unmount

* add try/catch to avoid fatal crashes

src/screens/VideoFeed/index.tsx

@@ -57,6 +57,7 @@ import {
 import {sanitizeDisplayName} from '#/lib/strings/display-names'
 import {cleanError} from '#/lib/strings/errors'
 import {sanitizeHandle} from '#/lib/strings/handles'
+import {logger} from '#/logger'
 import {isAndroid} from '#/platform/detection'
 import {useA11y} from '#/state/a11y'
 import {
@@ -1044,16 +1045,29 @@ function PlayPauseTapArea({
   const {isPlaying} = useEvent(player, 'playingChange', {
     isPlaying: player.playing,
   })
+  const isMounted = useRef(false)
 
-  const togglePlayPause = () => {
+  useEffect(() => {
-    if (!player) return
+    isMounted.current = true
-    doubleTapRef.current = null
+    return () => {
-    if (player.playing) {
+      isMounted.current = false
-      player.pause()
-    } else {
-      player.play()
     }
-  }
+  }, [])
+
+  const togglePlayPause = useNonReactiveCallback(() => {
+    // gets called after a timeout, so guard against being called after unmount -sfn
+    if (!player || !isMounted.current) return
+    doubleTapRef.current = null
+    try {
+      if (player.playing) {
+        player.pause()
+      } else {
+        player.play()
+      }
+    } catch (err) {
+      logger.error('Could not toggle play/pause', {safeMessage: err})
+    }
+  })
 
   const onPress = () => {
     if (doubleTapRef.current) {