Add previews for various TotalsView states

Author: staskus

WooCommerce/Classes/POS/Card Present Payments/CardPresentPaymentPreviewService.swift

@@ -14,6 +14,10 @@ final class CardPresentPaymentPreviewService: CardPresentPaymentFacade {
         $readerConnectionStatus.eraseToAnyPublisher()
     }
 
+    init(connectionStatus: CardPresentPaymentReaderConnectionStatus = .disconnected) {
+        self.readerConnectionStatus = connectionStatus
+    }
+
     func connectReader(using connectionMethod: CardReaderConnectionMethod) async throws -> CardPresentPaymentReaderConnectionResult {
         .connected(CardPresentPaymentCardReader(name: "Test reader", batteryLevel: 0.85))
     }

WooCommerce/Classes/POS/Models/PointOfSaleAggregateModel.swift

@@ -629,3 +629,12 @@ private extension PointOfSaleAggregateModel {
         static let initialPage: Int = 1
     }
 }
+
+#if DEBUG
+extension PointOfSaleAggregateModel {
+    func setPreviewState(paymentState: PointOfSalePaymentState, inlineMessage: PointOfSaleCardPresentPaymentMessageType?) {
+        self.paymentState = paymentState
+        self.cardPresentPaymentInlineMessage = inlineMessage
+    }
+}
+#endif

WooCommerce/Classes/POS/Presentation/TotalsView.swift

@@ -566,8 +566,122 @@ private struct CashPaymentButton: View {
 }
 
 #if DEBUG
-#Preview {
+#Preview("Card Reader Not Connected") {
     TotalsView()
-        .environment(POSPreviewHelpers.makePreviewAggregateModel())
+        .environment(POSPreviewHelpers.makePreviewAggregateModel(
+            cardPresentPaymentService: CardPresentPaymentPreviewService(connectionStatus: .disconnected)
+        ))
+}
+
+#Preview("Card Reader Connected") {
+    TotalsView()
+        .environment(POSPreviewHelpers.makePreviewAggregateModel(
+            cardPresentPaymentService: CardPresentPaymentPreviewService(
+                connectionStatus: .connected(CardPresentPaymentCardReader(name: "Reader", batteryLevel: 0.85))
+            )
+        ))
+}
+
+#Preview("Validating Order") {
+    let aggregateModel = POSPreviewHelpers.makePreviewAggregateModel(
+        cardPresentPaymentService: CardPresentPaymentPreviewService(
+            connectionStatus: .connected(CardPresentPaymentCardReader(name: "Reader", batteryLevel: 0.85))
+        )
+    )
+    Task { @MainActor in
+        aggregateModel.setPreviewState(
+            paymentState: PointOfSalePaymentState(card: .validatingOrder, cash: .idle),
+            inlineMessage: .validatingOrder(viewModel: PointOfSaleCardPresentPaymentValidatingOrderMessageViewModel())
+        )
+    }
+    return TotalsView()
+        .environment(aggregateModel)
+}
+
+#Preview("Accepting Card") {
+    let aggregateModel = POSPreviewHelpers.makePreviewAggregateModel(
+        cardPresentPaymentService: CardPresentPaymentPreviewService(
+            connectionStatus: .connected(CardPresentPaymentCardReader(name: "Reader", batteryLevel: 0.85))
+        )
+    )
+    Task { @MainActor in
+        aggregateModel.setPreviewState(
+            paymentState: PointOfSalePaymentState(card: .acceptingCard, cash: .idle),
+            inlineMessage: .tapSwipeOrInsertCard(viewModel: PointOfSaleCardPresentPaymentTapSwipeInsertCardMessageViewModel(inputMethods: []))
+        )
+    }
+    return TotalsView()
+        .environment(aggregateModel)
 }
+
+#Preview("Processing Payment") {
+    let aggregateModel = POSPreviewHelpers.makePreviewAggregateModel(
+        cardPresentPaymentService: CardPresentPaymentPreviewService(
+            connectionStatus: .connected(CardPresentPaymentCardReader(name: "Reader", batteryLevel: 0.85))
+        )
+    )
+    Task { @MainActor in
+        aggregateModel.setPreviewState(
+            paymentState: PointOfSalePaymentState(card: .processingPayment, cash: .idle),
+            inlineMessage: .processing(viewModel: PointOfSaleCardPresentPaymentProcessingMessageViewModel())
+        )
+    }
+    return TotalsView()
+        .environment(aggregateModel)
+}
+
+#Preview("Card Payment Successful") {
+    let aggregateModel = POSPreviewHelpers.makePreviewAggregateModel(
+        cardPresentPaymentService: CardPresentPaymentPreviewService(
+            connectionStatus: .connected(CardPresentPaymentCardReader(name: "Reader", batteryLevel: 0.85))
+        )
+    )
+    Task { @MainActor in
+        aggregateModel.setPreviewState(
+            paymentState: PointOfSalePaymentState(card: .cardPaymentSuccessful, cash: .idle),
+            inlineMessage: .paymentSuccess(viewModel: PointOfSalePaymentSuccessViewModel(formattedOrderTotal: "$12.00", paymentMethod: .card))
+        )
+    }
+    return TotalsView()
+        .environment(aggregateModel)
+}
+
+#Preview("Display Reader Message") {
+    let aggregateModel = POSPreviewHelpers.makePreviewAggregateModel(
+        cardPresentPaymentService: CardPresentPaymentPreviewService(
+            connectionStatus: .connected(CardPresentPaymentCardReader(name: "Reader", batteryLevel: 0.85))
+        )
+    )
+    Task { @MainActor in
+        aggregateModel.setPreviewState(
+            paymentState: PointOfSalePaymentState(card: .processingPayment, cash: .idle),
+            inlineMessage: .displayReaderMessage(viewModel: PointOfSaleCardPresentPaymentDisplayReaderMessageMessageViewModel(message: "Remove card"))
+        )
+    }
+    return TotalsView()
+        .environment(aggregateModel)
+}
+
+#Preview("Payment Error") {
+    let aggregateModel = POSPreviewHelpers.makePreviewAggregateModel(
+        cardPresentPaymentService: CardPresentPaymentPreviewService(
+            connectionStatus: .connected(CardPresentPaymentCardReader(name: "Reader", batteryLevel: 0.85))
+        )
+    )
+    Task { @MainActor in
+        aggregateModel.setPreviewState(
+            paymentState: PointOfSalePaymentState(card: .paymentError, cash: .idle),
+            inlineMessage: .paymentError(viewModel: PointOfSaleCardPresentPaymentErrorMessageViewModel(
+                error: NSError(domain: "CardPaymentError", code: 1001, userInfo: [NSLocalizedDescriptionKey: "Card declined"]),
+                tryPaymentAgainButtonAction: {},
+                backToCheckoutButtonAction: {}
+            ))
+        )
+    }
+    return TotalsView()
+        .environment(aggregateModel)
+}
+
+#endif
+
 #endif

WooCommerce/Classes/POS/Utils/PointOfSalePreviewOrderController.swift

@@ -4,13 +4,17 @@ import struct Yosemite.Order
 import Combine
 
 class PointOfSalePreviewOrderController: PointOfSaleOrderControllerProtocol {
-    var orderState: PointOfSaleInternalOrderState = .loaded(
+    var orderState: PointOfSaleInternalOrderState
+
+    init(orderState: PointOfSaleInternalOrderState = .loaded(
         .init(cartTotal: "$10.50",
               orderTotal: "$12.00",
               taxTotal: "$1.50",
               orderTotalDecimal: 12.00),
         OrderFactory.newOrder(currency: .USD)
-    )
+    )) {
+        self.orderState = orderState
+    }
 
     func syncOrder(for cart: Cart, retryHandler: @escaping () async -> Void) async -> Result<SyncOrderState, Error> {
         return .success(.newOrder)