fix: audio issue when sending app to background on Android and other fixes

Signed-off-by: Brian Sztamfater <brian@status.im>

src/quo2/components/record_audio/record_audio/view.cljs

@@ -173,6 +173,7 @@
            reached-max-duration? (atom false)
            touch-timestamp (atom nil)
            disabled? (atom false)
+           app-state-listener (atom nil)
            rec-options
            (merge
             audio/default-recorder-options
@@ -512,7 +513,13 @@
                          (on-init reset-recorder))
                        (when audio-file
                          (let [filename (last (string/split audio-file "/"))]
-                           (reload-player filename)))))
+                           (reload-player filename)))
+                       (reset! app-state-listener
+                         (.addEventListener rn/app-state
+                                            "change"
+                                            #(when (= % "background")
+                                               (reset! playing-audio? false))))
+                       #(.remove @app-state-listener)))
          [rn/view
           {:style          style/bar-container
            :pointer-events :box-none}

src/react_native/audio_toolkit.cljs

@@ -130,6 +130,11 @@
   (when (and player (.-canPlay ^js player))
     (.-currentTime ^js player)))
 
+(defn set-player-wake-lock
+  [player wake-lock?]
+  (when player
+    (set! (.-wakeLock player) wake-lock?)))
+
 (defn toggle-playpause-player
   [player on-play on-pause on-error]
   (when (and player (.-canPlay ^js player))

src/status_im2/contexts/chat/messages/content/audio/component_spec.cljs

@@ -20,7 +20,8 @@
 
 (h/describe "audio message"
   (h/before-each
-   #(setup-subs {:mediaserver/port 1000}))
+   #(setup-subs {:mediaserver/port 1000
+                 :app-state        "active"}))
 
   (h/test "renders correctly"
     (h/render [audio-message/audio-message message context])

src/status_im2/contexts/chat/messages/content/audio/view.cljs

@@ -59,7 +59,7 @@
    audio-url
    (fn [base64-data]
      (let [player (audio/new-player
-                   (str "data:audio/acc;base64," base64-data)
+                   (str "data:audio/aac;base64," base64-data)
                    {:autoDestroy                 false
                     :continuesToPlayInBackground false}
                    (fn []
@@ -68,6 +68,7 @@
                      (when (and @progress-timer (= @current-player-key player-key))
                        (js/clearInterval @progress-timer)
                        (reset! progress-timer nil))))]
+       (audio/set-player-wake-lock player true)
        (swap! active-players assoc player-key player)
        (audio/prepare-player
         player
@@ -90,7 +91,8 @@
     (when-not playing?
       (reset! current-player-key player-key))
     (if (and player
-             (= (@audio-uris player-key) audio-uri))
+             (= (@audio-uris player-key) audio-uri)
+             (not= (audio/get-state player) audio/IDLE))
       (audio/toggle-playpause-player
        player
        (fn []
@@ -121,7 +123,7 @@
                          (reset! seeking-audio? false)
                          (if (> @progress 0)
                            (let [seek-time         (* audio-duration-ms @progress)
-                                 checked-seek-time (min audio-duration-ms seek-time)]
+                                 checked-seek-time (if (<= @progress 1) seek-time @progress)]
                              (seek-player
                               player-key
                               player-state
@@ -141,13 +143,20 @@
                     (if (or @seeking-audio? (#{:playing :seeking} @player-state))
                       (if (<= @progress 1) (* duration @progress) @progress)
                       duration)
-                    1000)]
+                    1000)
+        paused?    (= (audio/get-state player) audio/PAUSED)
+        app-state  (rf/sub [:app-state])]
     (rn/use-effect (fn [] #(destroy-player player-key)))
     (rn/use-effect
      (fn []
-       (when (and (some? @current-player-key)
+       (when (or
-                  (not= @current-player-key player-key)
+              (and (some? @current-player-key)
-                  (= @player-state :playing))
+                   (not= @current-player-key player-key)
+                   (= @player-state :playing))
+              (and platform/ios?
+                   (= @current-player-key player-key)
+                   (not= app-state "active")
+                   (= @player-state :playing)))
          (play-pause-player {:player-key        player-key
                              :player-state      player-state
                              :progress          progress
@@ -155,7 +164,7 @@
                              :audio-duration-ms duration
                              :seeking-audio?    seeking-audio?
                              :user-interaction? false})))
-     [@current-player-key])
+     [@current-player-key app-state])
     (if (= @player-state :error)
       [quo/text
        {:style               style/error-label
@@ -177,10 +186,12 @@
                                                    :user-interaction? true})
          :style               (style/play-pause-container)}
         [quo/icon
-         (case @player-state
+         (cond
-           :preparing :i/loading
+           (= @player-state :preparing)
-           :playing   :i/pause-audio
+           :i/loading
-           :i/play-audio)
+           (and (= @player-state :playing) (not paused?))
+           :i/pause-audio
+           :else :i/play-audio)
          {:size  20
           :color colors/white}]]
        [:f> quo/soundtrack