From 4ea42161b3178d1fd2a91654b45887dc04428fe0 Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Wed, 17 Aug 2022 11:39:27 +0800
Subject: [PATCH] Better handling of loading state when playing back audio

---
 .../Views/WebReader/WebReaderContainer.swift  | 62 +++++++++++--------
 .../Services/AudioSession/AudioSession.swift  |  6 +-
 2 files changed, 41 insertions(+), 27 deletions(-)

diff --git a/apple/OmnivoreKit/Sources/App/Views/WebReader/WebReaderContainer.swift b/apple/OmnivoreKit/Sources/App/Views/WebReader/WebReaderContainer.swift
index 876f2021c..8856ac072 100644
--- a/apple/OmnivoreKit/Sources/App/Views/WebReader/WebReaderContainer.swift
+++ b/apple/OmnivoreKit/Sources/App/Views/WebReader/WebReaderContainer.swift
@@ -56,6 +56,41 @@ struct WebReaderContainerView: View {
     }
   }
 
+  var audioNavbarItem: some View {
+    if audioSession.isLoadingItem(item: item) {
+      return AnyView(ProgressView()
+        .padding(.horizontal)
+        .scaleEffect(navBarVisibilityRatio))
+    } else {
+      return AnyView(Button(
+        action: {
+          switch audioSession.state {
+          case .playing:
+            if audioSession.item == self.item {
+              audioSession.pause()
+              return
+            }
+            fallthrough
+          case .paused:
+            if audioSession.item == self.item {
+              audioSession.unpause()
+              return
+            }
+            fallthrough
+          default:
+            audioSession.play(item: self.item)
+          }
+        },
+        label: {
+          Image(systemName: audioSession.isPlayingItem(item: item) ? "pause.circle" : "play.circle")
+            .font(.appTitleTwo)
+        }
+      )
+      .padding(.horizontal)
+      .scaleEffect(navBarVisibilityRatio))
+    }
+  }
+
   var navBar: some View {
     HStack(alignment: .center) {
       #if os(iOS)
@@ -72,32 +107,7 @@ struct WebReaderContainerView: View {
         Spacer()
       #endif
       if FeatureFlag.enableTextToSpeechButton {
-        Button(
-          action: {
-            switch audioSession.state {
-            case .playing:
-              if audioSession.item == self.item {
-                audioSession.pause()
-                return
-              }
-              fallthrough
-            case .paused:
-              if audioSession.item == self.item {
-                audioSession.unpause()
-                return
-              }
-              fallthrough
-            default:
-              audioSession.play(item: self.item)
-            }
-          },
-          label: {
-            Image(systemName: audioSession.isPlayingItem(item: item) ? "pause.circle" : "play.circle")
-              .font(.appTitleTwo)
-          }
-        )
-        .padding(.horizontal)
-        .scaleEffect(navBarVisibilityRatio)
+        audioNavbarItem
       }
       Button(
         action: { showPreferencesPopover.toggle() },
diff --git a/apple/OmnivoreKit/Sources/Services/AudioSession/AudioSession.swift b/apple/OmnivoreKit/Sources/Services/AudioSession/AudioSession.swift
index e09782778..1ce36c6ed 100644
--- a/apple/OmnivoreKit/Sources/Services/AudioSession/AudioSession.swift
+++ b/apple/OmnivoreKit/Sources/Services/AudioSession/AudioSession.swift
@@ -47,6 +47,10 @@ public class AudioSession: ObservableObject {
     item = nil
   }
 
+  public func isLoadingItem(item: LinkedItem) -> Bool {
+    state == .loading && self.item == item
+  }
+
   public func isPlayingItem(item: LinkedItem) -> Bool {
     state == .playing && self.item == item
   }
@@ -55,7 +59,7 @@ public class AudioSession: ObservableObject {
     state = .loading
 
     // Just simulating some loading delay here
-    DispatchQueue.main.asyncAfter(deadline: .now()) {
+    DispatchQueue.main.asyncAfter(deadline: .now() + .milliseconds(1000)) {
       self.audioUrl = Bundle.main.url(forResource: "speech-sample", withExtension: "mp3")!
       if let url = self.audioUrl {
         do {