Merge pull request #8374 from woocommerce/issue/8318-unblock-networking

[Analytics Hub] Update networking to load data in parallel

Author: ealeksandrov

WooCommerce/Classes/ViewRelated/Dashboard/Analytics Hub/AnalyticsHubView.swift

@@ -97,7 +97,7 @@ struct AnalyticsHubView: View {
                 VStack(spacing: Layout.dividerSpacing) {
                     Divider()
 
-                    AnalyticsProductCard(viewModel: viewModel.productCard)
+                    AnalyticsProductCard(statsViewModel: viewModel.productsStatsCard, itemsViewModel: viewModel.itemsSoldCard)
                         .padding(.horizontal, insets: safeAreaInsets)
                         .background(Color(uiColor: .listForeground))
 

WooCommerce/Classes/ViewRelated/Dashboard/Analytics Hub/AnalyticsHubViewModel.swift

@@ -41,9 +41,13 @@ final class AnalyticsHubViewModel: ObservableObject {
     ///
     @Published var ordersCard = AnalyticsHubViewModel.ordersCard(currentPeriodStats: nil, previousPeriodStats: nil)
 
-    /// Products Card ViewModel
+    /// Products Stats Card ViewModel
     ///
-    @Published var productCard = AnalyticsHubViewModel.productCard(currentPeriodStats: nil, previousPeriodStats: nil, itemsSoldStats: nil)
+    @Published var productsStatsCard = AnalyticsHubViewModel.productsStatsCard(currentPeriodStats: nil, previousPeriodStats: nil)
+
+    /// Items Sold Card ViewModel
+    ///
+    @Published var itemsSoldCard = AnalyticsHubViewModel.productsItemsSoldCard(itemsSoldStats: nil)
 
     /// Sessions Card ViewModel
     ///
@@ -92,7 +96,7 @@ final class AnalyticsHubViewModel: ObservableObject {
     @MainActor
     func updateData() async {
         do {
-            try await retrieveOrderStats()
+            try await retrieveData()
         } catch is AnalyticsHubTimeRangeSelection.TimeRangeGeneratorError {
             dismissNotice = Notice(title: Localization.timeRangeGeneratorError, feedbackType: .error)
             ServiceLocator.analytics.track(event: .AnalyticsHub.dateRangeSelectionFailed(for: timeRangeSelectionType))
@@ -114,26 +118,44 @@ final class AnalyticsHubViewModel: ObservableObject {
 private extension AnalyticsHubViewModel {
 
     @MainActor
-    func retrieveOrderStats() async throws {
+    func retrieveData() async throws {
         switchToLoadingState()
 
         let currentTimeRange = try timeRangeSelection.unwrapCurrentTimeRange()
         let previousTimeRange = try timeRangeSelection.unwrapPreviousTimeRange()
 
+        try await withThrowingTaskGroup(of: Void.self) { group in
+            group.addTask {
+                try await self.retrieveOrderStats(currentTimeRange: currentTimeRange, previousTimeRange: previousTimeRange)
+            }
+            group.addTask {
+                try await self.retrieveVisitorStats(currentTimeRange: currentTimeRange, previousTimeRange: previousTimeRange)
+            }
+            try await group.waitForAll()
+        }
+    }
+
+    @MainActor
+    func retrieveOrderStats(currentTimeRange: AnalyticsHubTimeRange, previousTimeRange: AnalyticsHubTimeRange) async throws {
         async let currentPeriodRequest = retrieveStats(earliestDateToInclude: currentTimeRange.start,
                                                        latestDateToInclude: currentTimeRange.end,
                                                        forceRefresh: true)
         async let previousPeriodRequest = retrieveStats(earliestDateToInclude: previousTimeRange.start,
                                                         latestDateToInclude: previousTimeRange.end,
                                                         forceRefresh: true)
 
+        let (currentPeriodStats, previousPeriodStats) = try await (currentPeriodRequest, previousPeriodRequest)
+        self.currentOrderStats = currentPeriodStats
+        self.previousOrderStats = previousPeriodStats
+    }
+
+    @MainActor
+    func retrieveVisitorStats(currentTimeRange: AnalyticsHubTimeRange, previousTimeRange: AnalyticsHubTimeRange) async throws {
         async let itemsSoldRequest = retrieveTopItemsSoldStats(earliestDateToInclude: currentTimeRange.start,
                                                                latestDateToInclude: currentTimeRange.end,
                                                                forceRefresh: true)
 
-        let (currentPeriodStats, previousPeriodStats, itemsSoldStats) = try await (currentPeriodRequest, previousPeriodRequest, itemsSoldRequest)
-        self.currentOrderStats = currentPeriodStats
-        self.previousOrderStats = previousPeriodStats
+        let itemsSoldStats = try await itemsSoldRequest
         self.itemsSoldStats = itemsSoldStats
     }
 
@@ -181,7 +203,8 @@ private extension AnalyticsHubViewModel {
     func switchToLoadingState() {
         self.revenueCard = revenueCard.redacted
         self.ordersCard = ordersCard.redacted
-        self.productCard = productCard.redacted
+        self.productsStatsCard = productsStatsCard.redacted
+        self.itemsSoldCard = itemsSoldCard.redacted
     }
 
     @MainActor
@@ -192,25 +215,33 @@ private extension AnalyticsHubViewModel {
     }
 
     func bindViewModelsWithData() {
-        Publishers.CombineLatest3($currentOrderStats, $previousOrderStats, $itemsSoldStats)
-            .sink { [weak self] currentOrderStats, previousOrderStats, itemsSoldStats in
+        Publishers.CombineLatest($currentOrderStats, $previousOrderStats)
+            .sink { [weak self] currentOrderStats, previousOrderStats in
                 guard let self else { return }
 
                 self.revenueCard = AnalyticsHubViewModel.revenueCard(currentPeriodStats: currentOrderStats, previousPeriodStats: previousOrderStats)
                 self.ordersCard = AnalyticsHubViewModel.ordersCard(currentPeriodStats: currentOrderStats, previousPeriodStats: previousOrderStats)
-                self.productCard = AnalyticsHubViewModel.productCard(currentPeriodStats: currentOrderStats,
-                                                                     previousPeriodStats: previousOrderStats,
-                                                                     itemsSoldStats: itemsSoldStats)
+                self.productsStatsCard = AnalyticsHubViewModel.productsStatsCard(currentPeriodStats: currentOrderStats, previousPeriodStats: previousOrderStats)
 
             }.store(in: &subscriptions)
 
+        $itemsSoldStats
+            .sink { [weak self] itemsSoldStats in
+                guard let self else { return }
+
+                self.itemsSoldCard = AnalyticsHubViewModel.productsItemsSoldCard(itemsSoldStats: itemsSoldStats)
+            }.store(in: &subscriptions)
+
         $timeRangeSelectionType
+            .dropFirst() // do not trigger refresh action on initial value
             .removeDuplicates()
             .sink { [weak self] newSelectionType in
                 guard let self else { return }
                 self.timeRangeSelection = AnalyticsHubTimeRangeSelection(selectionType: newSelectionType)
                 self.timeRangeCard = AnalyticsHubViewModel.timeRangeCard(timeRangeSelection: self.timeRangeSelection,
                                                                          usageTracksEventEmitter: self.usageTracksEventEmitter)
+
+                // Update data on range selection change
                 Task.init {
                     await self.updateData()
                 }
@@ -254,22 +285,26 @@ private extension AnalyticsHubViewModel {
                                             syncErrorMessage: Localization.OrderCard.noOrders)
     }
 
-    /// Helper function to create a `AnalyticsProductCardViewModel` from the fetched stats.
+    /// Helper function to create a `AnalyticsProductsStatsCardViewModel` from the fetched stats.
     ///
-    static func productCard(currentPeriodStats: OrderStatsV4?,
-                            previousPeriodStats: OrderStatsV4?,
-                            itemsSoldStats: TopEarnerStats?) -> AnalyticsProductCardViewModel {
+    static func productsStatsCard(currentPeriodStats: OrderStatsV4?,
+                                  previousPeriodStats: OrderStatsV4?) -> AnalyticsProductsStatsCardViewModel {
         let showStatsError = currentPeriodStats == nil || previousPeriodStats == nil
-        let showItemsSoldError = itemsSoldStats == nil
         let itemsSold = StatsDataTextFormatter.createItemsSoldText(orderStats: currentPeriodStats)
         let itemsSoldDelta = StatsDataTextFormatter.createOrderItemsSoldDelta(from: previousPeriodStats, to: currentPeriodStats)
 
-        return AnalyticsProductCardViewModel(itemsSold: itemsSold,
-                                             delta: itemsSoldDelta,
-                                             itemsSoldData: itemSoldRows(from: itemsSoldStats),
-                                             isRedacted: false,
-                                             showStatsError: showStatsError,
-                                             showItemsSoldError: showItemsSoldError)
+        return AnalyticsProductsStatsCardViewModel(itemsSold: itemsSold,
+                                                   delta: itemsSoldDelta,
+                                                   isRedacted: false,
+                                                   showStatsError: showStatsError)
+    }
+
+    /// Helper function to create a `AnalyticsItemsSoldViewModel` from the fetched stats.
+    ///
+    static func productsItemsSoldCard(itemsSoldStats: TopEarnerStats?) -> AnalyticsItemsSoldViewModel {
+        let showItemsSoldError = itemsSoldStats == nil
+
+        return AnalyticsItemsSoldViewModel(itemsSoldData: itemSoldRows(from: itemsSoldStats), isRedacted: false, showItemsSoldError: showItemsSoldError)
     }
 
     /// Helper functions to create `TopPerformersRow.Data` items rom the provided `TopEarnerStats`.

WooCommerce/Classes/ViewRelated/Dashboard/Analytics Hub/AnalyticsProductCard.swift

@@ -17,18 +17,22 @@ struct AnalyticsProductCard: View {
     /// Delta Tag text color.
     let deltaTextColor: UIColor
 
-    /// Items Solds data to render.
-    ///
-    let itemsSoldData: [TopPerformersRow.Data]
-
     /// Indicates if the values should be hidden (for loading state)
     ///
-    let isRedacted: Bool
+    let isStatsRedacted: Bool
 
     /// Indicates if there was an error loading stats part of the card.
     ///
     let showStatsError: Bool
 
+    /// Items Solds data to render.
+    ///
+    let itemsSoldData: [TopPerformersRow.Data]
+
+    /// Indicates if the values should be hidden (for loading state)
+    ///
+    let isItemsSoldRedacted: Bool
+
     /// Indicates if there was an error loading items sold part of the card.
     ///
     let showItemsSoldError: Bool
@@ -49,12 +53,12 @@ struct AnalyticsProductCard: View {
                 Text(itemsSold)
                     .titleStyle()
                     .frame(maxWidth: .infinity, alignment: .leading)
-                    .redacted(reason: isRedacted ? .placeholder : [])
-                    .shimmering(active: isRedacted)
+                    .redacted(reason: isStatsRedacted ? .placeholder : [])
+                    .shimmering(active: isStatsRedacted)
 
                 DeltaTag(value: delta, backgroundColor: deltaBackgroundColor, textColor: deltaTextColor)
-                    .redacted(reason: isRedacted ? .placeholder : [])
-                    .shimmering(active: isRedacted)
+                    .redacted(reason: isStatsRedacted ? .placeholder : [])
+                    .shimmering(active: isStatsRedacted)
             }
 
             if showStatsError {
@@ -65,10 +69,11 @@ struct AnalyticsProductCard: View {
                     .padding(.top, Layout.columnSpacing)
             }
 
-            TopPerformersView(itemTitle: Localization.title.localizedCapitalized, valueTitle: Localization.itemsSold, rows: itemsSoldData)
+            TopPerformersView(itemTitle: Localization.title.localizedCapitalized,
+                              valueTitle: Localization.itemsSold,
+                              rows: itemsSoldData,
+                              isRedacted: isItemsSoldRedacted)
                 .padding(.top, Layout.columnSpacing)
-                .redacted(reason: isRedacted ? .placeholder : [])
-                .shimmering(active: isRedacted)
 
             if showItemsSoldError {
                 Text(Localization.noItemsSold)
@@ -109,24 +114,26 @@ struct AnalyticsProductCardPreviews: PreviewProvider {
                              delta: "+23%",
                              deltaBackgroundColor: .withColorStudio(.green, shade: .shade50),
                              deltaTextColor: .textInverted,
+                             isStatsRedacted: false,
+                             showStatsError: false,
                              itemsSoldData: [
                                 .init(imageURL: imageURL, name: "Tabletop Photos", details: "Net Sales: $1,232", value: "32"),
                                 .init(imageURL: imageURL, name: "Kentya Palm", details: "Net Sales: $800", value: "10"),
                                 .init(imageURL: imageURL, name: "Love Ficus", details: "Net Sales: $599", value: "5"),
                                 .init(imageURL: imageURL, name: "Bird Of Paradise", details: "Net Sales: $23.50", value: "2"),
                              ],
-                             isRedacted: false,
-                             showStatsError: false,
+                             isItemsSoldRedacted: false,
                              showItemsSoldError: false)
             .previewLayout(.sizeThatFits)
 
         AnalyticsProductCard(itemsSold: "-",
                              delta: "0%",
                              deltaBackgroundColor: .withColorStudio(.gray, shade: .shade0),
                              deltaTextColor: .text,
-                             itemsSoldData: [],
-                             isRedacted: false,
+                             isStatsRedacted: false,
                              showStatsError: true,
+                             itemsSoldData: [],
+                             isItemsSoldRedacted: false,
                              showItemsSoldError: true)
             .previewLayout(.sizeThatFits)
             .previewDisplayName("No data")

WooCommerce/Classes/ViewRelated/Dashboard/Analytics Hub/AnalyticsProductCardViewModel.swift

@@ -1,10 +1,10 @@
 import Foundation
 import class UIKit.UIColor
 
-/// Analytics Hub Product Card ViewModel.
+/// Analytics Hub Products Stats Card ViewModel.
 /// Used to transmit analytics products data.
 ///
-struct AnalyticsProductCardViewModel {
+struct AnalyticsProductsStatsCardViewModel {
     /// Items Sold Value
     ///
     let itemsSold: String
@@ -13,51 +13,73 @@ struct AnalyticsProductCardViewModel {
     ///
     let delta: DeltaPercentage
 
-    /// Items Solds data to render.
-    ///
-    let itemsSoldData: [TopPerformersRow.Data]
-
     /// Indicates if the values should be hidden (for loading state)
     ///
     let isRedacted: Bool
 
     /// Indicates if there was an error loading stats part of the card.
     ///
     let showStatsError: Bool
+}
+
+/// Analytics Hub Items Sold ViewModel.
+/// Used to store top performing products data.
+///
+struct AnalyticsItemsSoldViewModel {
+
+    /// Items Solds data to render.
+    ///
+    let itemsSoldData: [TopPerformersRow.Data]
+
+    /// Indicates if the values should be hidden (for loading state)
+    ///
+    let isRedacted: Bool
 
     /// Indicates if there was an error loading items sold part of the card.
     ///
     let showItemsSoldError: Bool
 }
 
-extension AnalyticsProductCardViewModel {
+extension AnalyticsProductsStatsCardViewModel {
 
     /// Make redacted state of the card, replacing values with hardcoded placeholders
     ///
     var redacted: Self {
         // Values here are placeholders and will be redacted in the UI
         .init(itemsSold: "1000",
               delta: DeltaPercentage(string: "0%", direction: .zero),
-              itemsSoldData: [.init(imageURL: nil, name: "Product Name", details: "Net Sales", value: "$5678")],
               isRedacted: true,
-              showStatsError: false,
-              showItemsSoldError: false)
+              showStatsError: false)
     }
+}
+
+extension AnalyticsItemsSoldViewModel {
 
+    /// Make redacted state of the card, replacing values with hardcoded placeholders
+    ///
+    var redacted: Self {
+        // Values here are placeholders and will be redacted in the UI
+        .init(itemsSoldData: [.init(imageURL: nil, name: "Product Name", details: "Net Sales", value: "$5678")],
+              isRedacted: true,
+              showItemsSoldError: false)
+    }
 }
 
-/// Convenience extension to create an `AnalyticsReportCard` from a view model.
+/// Convenience extension to create an `AnalyticsProductCard` from a view model.
 ///
 extension AnalyticsProductCard {
-    init(viewModel: AnalyticsProductCardViewModel) {
-        self.itemsSold = viewModel.itemsSold
-        self.delta = viewModel.delta.string
-        self.deltaBackgroundColor = viewModel.delta.direction.deltaBackgroundColor
-        self.deltaTextColor = viewModel.delta.direction.deltaTextColor
-        self.itemsSoldData = viewModel.itemsSoldData
-        self.isRedacted = viewModel.isRedacted
-        self.showStatsError = viewModel.showStatsError
-        self.showItemsSoldError = viewModel.showItemsSoldError
+    init(statsViewModel: AnalyticsProductsStatsCardViewModel, itemsViewModel: AnalyticsItemsSoldViewModel) {
+        // Header with stats
+        self.itemsSold = statsViewModel.itemsSold
+        self.delta = statsViewModel.delta.string
+        self.deltaBackgroundColor = statsViewModel.delta.direction.deltaBackgroundColor
+        self.deltaTextColor = statsViewModel.delta.direction.deltaTextColor
+        self.isStatsRedacted = statsViewModel.isRedacted
+        self.showStatsError = statsViewModel.showStatsError
 
+        // Top performers list
+        self.itemsSoldData = itemsViewModel.itemsSoldData
+        self.isItemsSoldRedacted = itemsViewModel.isRedacted
+        self.showItemsSoldError = itemsViewModel.showItemsSoldError
     }
 }

WooCommerce/Classes/ViewRelated/Dashboard/MyStore/TopPerformersView.swift

@@ -17,6 +17,10 @@ struct TopPerformersView: View {
     ///
     let rows: [TopPerformersRow.Data]
 
+    /// Indicates if the values should be hidden (for loading state)
+    ///
+    let isRedacted: Bool
+
     /// Used to track the text margin value from the top performers row.
     /// Text margin value: Where the row text is placed in the X position.
     /// Needed to properly layout the row divider.
@@ -42,6 +46,8 @@ struct TopPerformersView: View {
                 // Do not render the divider for the last row.
                 TopPerformersRow(data: row, showDivider: index < rows.count - 1)
             }
+            .redacted(reason: isRedacted ? .placeholder : [])
+            .shimmering(active: isRedacted)
         }
     }
 }
@@ -141,7 +147,8 @@ struct TopPerformersPreview: PreviewProvider {
                             .init(imageURL: imageURL, name: "Kentya Palm", details: "Net Sales: $800", value: "10"),
                             .init(imageURL: imageURL, name: "Love Ficus", details: "Net Sales: $599", value: "5"),
                             .init(imageURL: imageURL, name: "Bird Of Paradise", details: "Net Sales: $23.50", value: "2")
-                          ])
+                          ],
+                          isRedacted: false)
         .padding()
         .previewLayout(.sizeThatFits)
     }