Decouple analytics events from AnalyticsTimeRangeCard view

Author: rachelmcr

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

@@ -9,6 +9,7 @@ final class AnalyticsHubViewModel: ObservableObject {
 
     private let siteID: Int64
     private let stores: StoresManager
+    private let analytics: Analytics
 
     private var subscriptions = Set<AnyCancellable>()
 
@@ -19,15 +20,19 @@ final class AnalyticsHubViewModel: ObservableObject {
     init(siteID: Int64,
          statsTimeRange: StatsTimeRangeV4,
          usageTracksEventEmitter: StoreStatsUsageTracksEventEmitter,
-         stores: StoresManager = ServiceLocator.stores) {
+         stores: StoresManager = ServiceLocator.stores,
+         analytics: Analytics = ServiceLocator.analytics) {
         let selectedType = AnalyticsHubTimeRangeSelection.SelectionType(statsTimeRange)
         let timeRangeSelection = AnalyticsHubTimeRangeSelection(selectionType: selectedType)
 
         self.siteID = siteID
         self.stores = stores
+        self.analytics = analytics
         self.timeRangeSelectionType = selectedType
         self.timeRangeSelection = timeRangeSelection
-        self.timeRangeCard = AnalyticsHubViewModel.timeRangeCard(timeRangeSelection: timeRangeSelection, usageTracksEventEmitter: usageTracksEventEmitter)
+        self.timeRangeCard = AnalyticsHubViewModel.timeRangeCard(timeRangeSelection: timeRangeSelection,
+                                                                 usageTracksEventEmitter: usageTracksEventEmitter,
+                                                                 analytics: analytics)
         self.usageTracksEventEmitter = usageTracksEventEmitter
 
         bindViewModelsWithData()
@@ -286,7 +291,8 @@ private extension AnalyticsHubViewModel {
                 guard let self else { return }
                 self.timeRangeSelection = AnalyticsHubTimeRangeSelection(selectionType: newSelectionType)
                 self.timeRangeCard = AnalyticsHubViewModel.timeRangeCard(timeRangeSelection: self.timeRangeSelection,
-                                                                         usageTracksEventEmitter: self.usageTracksEventEmitter)
+                                                                         usageTracksEventEmitter: self.usageTracksEventEmitter,
+                                                                         analytics: self.analytics)
 
                 // Update data on range selection change
                 Task.init {
@@ -386,11 +392,19 @@ private extension AnalyticsHubViewModel {
     }
 
     static func timeRangeCard(timeRangeSelection: AnalyticsHubTimeRangeSelection,
-                              usageTracksEventEmitter: StoreStatsUsageTracksEventEmitter) -> AnalyticsTimeRangeCardViewModel {
+                              usageTracksEventEmitter: StoreStatsUsageTracksEventEmitter,
+                              analytics: Analytics) -> AnalyticsTimeRangeCardViewModel {
         return AnalyticsTimeRangeCardViewModel(selectedRangeTitle: timeRangeSelection.rangeSelectionDescription,
                                                currentRangeSubtitle: timeRangeSelection.currentRangeDescription,
                                                previousRangeSubtitle: timeRangeSelection.previousRangeDescription,
-                                               usageTracksEventEmitter: usageTracksEventEmitter)
+                                               onTapped: {
+            usageTracksEventEmitter.interacted()
+            analytics.track(event: .AnalyticsHub.dateRangeButtonTapped())
+        },
+                                               onSelected: { selection in
+            usageTracksEventEmitter.interacted()
+            analytics.track(event: .AnalyticsHub.dateRangeOptionSelected(selection.tracksIdentifier))
+        })
     }
 }
 

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

@@ -17,13 +17,20 @@ struct AnalyticsTimeRangeCard: View {
     ///
     @State private var showCustomRangeSelectionView: Bool = false
 
-    private let usageTracksEventEmitter: StoreStatsUsageTracksEventEmitter
+    /// Closure invoked when the time range card is tapped.
+    ///
+    private var onTapped: () -> Void
+
+    /// Closure invoked when a time range is selected.
+    ///
+    private var onSelected: (Range) -> Void
 
     init(viewModel: AnalyticsTimeRangeCardViewModel, selectionType: Binding<AnalyticsHubTimeRangeSelection.SelectionType>) {
         self.timeRangeTitle = viewModel.selectedRangeTitle
         self.currentRangeDescription = viewModel.currentRangeSubtitle
         self.previousRangeDescription = viewModel.previousRangeSubtitle
-        self.usageTracksEventEmitter = viewModel.usageTracksEventEmitter
+        self.onSelected = viewModel.onSelected
+        self.onTapped = viewModel.onTapped
         self._selectionType = selectionType
     }
 
@@ -34,8 +41,7 @@ struct AnalyticsTimeRangeCard: View {
                               items: Range.allCases,
                               contentKeyPath: \.description,
                               selected: internalSelectionBinding()) { selection in
-                    usageTracksEventEmitter.interacted()
-                    ServiceLocator.analytics.track(event: .AnalyticsHub.dateRangeOptionSelected(selection.tracksIdentifier))
+                    onSelected(selection)
                 }
                 .sheet(isPresented: $showCustomRangeSelectionView) {
                     RangedDatePicker(startDate: selectionType.startDate, endDate: selectionType.endDate, datesFormatter: DatesFormatter()) { start, end in
@@ -49,9 +55,8 @@ struct AnalyticsTimeRangeCard: View {
     private func createTimeRangeContent() -> some View {
         VStack(alignment: .leading, spacing: Layout.verticalSpacing) {
             Button(action: {
-                usageTracksEventEmitter.interacted()
-                ServiceLocator.analytics.track(event: .AnalyticsHub.dateRangeButtonTapped())
                 showTimeRangeSelectionView.toggle()
+                onTapped()
             }, label: {
                 HStack {
                     Image(uiImage: .calendar)
@@ -152,8 +157,7 @@ struct TimeRangeCard_Previews: PreviewProvider {
     static var previews: some View {
         let viewModel = AnalyticsTimeRangeCardViewModel(selectedRangeTitle: "Month to Date",
                                                         currentRangeSubtitle: "Nov 1 - 23, 2022",
-                                                        previousRangeSubtitle: "Oct 1 - 23, 2022",
-                                                        usageTracksEventEmitter: StoreStatsUsageTracksEventEmitter())
+                                                        previousRangeSubtitle: "Oct 1 - 23, 2022")
         AnalyticsTimeRangeCard(viewModel: viewModel, selectionType: .constant(.monthToDate))
     }
 }

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

@@ -16,7 +16,11 @@ struct AnalyticsTimeRangeCardViewModel {
     ///
     let previousRangeSubtitle: String
 
-    /// Analytics Usage Tracks Event Emitter
+    /// Closure invoked when the time range card is tapped.
     ///
-    let usageTracksEventEmitter: StoreStatsUsageTracksEventEmitter
+    var onTapped: () -> Void = {}
+
+    /// Closure invoked when a time range is selected.
+    ///
+    var onSelected: (AnalyticsTimeRangeCard.Range) -> Void = { _ in }
 }

WooCommerce/WooCommerceTests/ViewRelated/Dashboard/Analytics Hub/AnalyticsHubViewModelTests.swift

@@ -6,11 +6,13 @@ final class AnalyticsHubViewModelTests: XCTestCase {
 
     private var stores: MockStoresManager!
     private var eventEmitter: StoreStatsUsageTracksEventEmitter!
+    private var analyticsProvider: MockAnalyticsProvider!
+    private var analytics: Analytics!
 
     override func setUp() {
         stores = MockStoresManager(sessionManager: .makeForTesting())
-        let analyticsProvider = MockAnalyticsProvider()
-        let analytics = WooAnalytics(analyticsProvider: analyticsProvider)
+        analyticsProvider = MockAnalyticsProvider()
+        analytics = WooAnalytics(analyticsProvider: analyticsProvider)
         eventEmitter = StoreStatsUsageTracksEventEmitter(analytics: analytics)
     }
 
@@ -167,4 +169,18 @@ final class AnalyticsHubViewModelTests: XCTestCase {
         // Then
         XCTAssertTrue(vm.showSessionsCard)
     }
+
+    func test_time_range_card_tracks_expected_events() throws {
+        // Given
+        let vm = AnalyticsHubViewModel(siteID: 123, statsTimeRange: .today, usageTracksEventEmitter: eventEmitter, analytics: analytics)
+
+        // When
+        vm.timeRangeCard.onTapped()
+        vm.timeRangeCard.onSelected(.weekToDate)
+
+        // Then
+        assertEqual(["analytics_hub_date_range_button_tapped", "analytics_hub_date_range_option_selected"], analyticsProvider.receivedEvents)
+        let optionSelectedEventProperty = try XCTUnwrap(analyticsProvider.receivedProperties.last?["option"] as? String)
+        assertEqual("Week to Date", optionSelectedEventProperty)
+    }
 }