iap: add loading spinner to purchase actions

Apple In-app purchases do not respond immediately. This commit adds a
loading spinner element, to improve the UX and avoid the appearance of a
broken/unresponsive element.

Testing
--------

Device: iPhone 15 simulator
iOS: 17.2
Damus: This commit
Setup:
- Using the sandbox environment
- No tx to start with
- IAP experimental support enabled on developer settings in Damus
Steps:
1. Click "purchase" in any option on the damus purple screen
2. It should show a loading spinner while the purchase action is loading. PASS
3. On the confirmation screen, cancel the purchase.
4. Purchase buttons should show again. PASS

Closes: #2020
Signed-off-by: Daniel D’Aquino <[email protected]>
Link: [email protected]
Signed-off-by: William Casarin <[email protected]>

damus/Views/Purple/Detail/IAPProductStateView.swift

@@ -21,20 +21,32 @@ extension DamusPurpleView {
         let subscribe: (Product) async throws -> Void
 
         @State var show_manage_subscriptions = false
+        @State var subscription_purchase_loading = false
 
         var body: some View {
-            switch self.products {
-                case .failed:
-                    PurpleViewPrimitives.ProductLoadErrorView()
-                case .loaded(let products):
-                    if let purchased {
-                        PurchasedView(purchased)
-                    } else {
-                        ProductsView(products)
-                    }
-                case .loading:
+            if subscription_purchase_loading {
+                HStack(spacing: 10) {
+                    Text(NSLocalizedString("Purchasing", comment: "Loading label indicating the purchase action is in progress"))
+                        .foregroundStyle(.white)
                     ProgressView()
                         .progressViewStyle(.circular)
+                        .tint(.white)
+                }
+            }
+            else {
+                switch self.products {
+                    case .failed:
+                        PurpleViewPrimitives.ProductLoadErrorView()
+                    case .loaded(let products):
+                        if let purchased {
+                            PurchasedView(purchased)
+                        } else {
+                            ProductsView(products)
+                        }
+                    case .loading:
+                        ProgressView()
+                            .progressViewStyle(.circular)
+                }
             }
         }
 
@@ -107,7 +119,9 @@ extension DamusPurpleView {
                     Button(action: {
                         Task { @MainActor in
                             do {
+                                subscription_purchase_loading = true
                                 try await subscribe(product)
+                                subscription_purchase_loading = false
                             } catch {
                                 print(error.localizedDescription)
                             }