Implement booking cancellation alert dialogue

Author: RafaelKayumov

WooCommerce/Classes/ViewModels/Booking Details/BookingDetailsViewModel.swift

@@ -5,7 +5,11 @@ final class BookingDetailsViewModel: ObservableObject {
     let sections: [Section]
     let navigationTitle: String
 
+    private let booking: Booking
+
     init(booking: Booking) {
+        self.booking = booking
+
         navigationTitle = Self.navigationTitle(for: booking)
 
         let headerSection = Section.init(
@@ -59,6 +63,27 @@ final class BookingDetailsViewModel: ObservableObject {
     }
 }
 
+extension BookingDetailsViewModel {
+    var cancellationAlertMessage: String {
+        // Temporary hardcoded
+        //TODO: - replace with associated customer data
+        let productName = "Women's Haircut"
+        let customerName = "Margarita Nikolaevna"
+
+        let date = booking.startDate.formatted(
+            date: .long,
+            time: .shortened
+        )
+
+        return String(
+            format: Localization.cancelBookingAlertMessage,
+            customerName,
+            productName,
+            date
+        )
+    }
+}
+
 private extension BookingDetailsViewModel {
     static func navigationTitle(for booking: Booking) -> String {
         let titleFormat = NSLocalizedString(
@@ -107,5 +132,11 @@ private extension BookingDetailsViewModel {
             value: "Booking notes",
             comment: "Header title for the 'Booking notes' section in the booking details screen."
         )
+
+        static let cancelBookingAlertMessage = NSLocalizedString(
+            "BookingDetailsView.cancelation.alert.message",
+            value: "%1$@ will no longer be able to attend “%2$@” on %3$@.",
+            comment: "Message for the booking cancellation confirmation alert. %1$@ is customer name, %2$@ is product name, %3$@ is booking date."
+        )
     }
 }

WooCommerce/Classes/ViewRelated/Bookings/Booking Details/BookingDetailsView.swift

@@ -6,6 +6,7 @@ struct BookingDetailsView: View {
     @Environment(\.dismiss) private var dismiss
     @State private var showingOptions = false
     @State private var showingStatusSheet = false
+    @State private var showingCancelAlert = false
 
     @ObservedObject private var viewModel: BookingDetailsViewModel
 
@@ -78,6 +79,17 @@ struct BookingDetailsView: View {
             .presentationDetents([.medium, .large])
             .presentationDragIndicator(.visible)
         }
+        .alert(
+            Localization.cancelBookingAlertTitle,
+            isPresented: $showingCancelAlert
+        ) {
+            Button(Localization.cancelBookingAlertConfirmAction, role: .destructive) {
+                print("On cancel booking confirmation tap")
+            }
+            Button(Localization.cancelBookingAlertCancelAction, role: .cancel) {}
+        } message: {
+            Text(viewModel.cancellationAlertMessage)
+        }
     }
 }
 
@@ -185,7 +197,7 @@ private extension BookingDetailsView {
             }
 
             Button {
-                /// On cancel booking button tap
+                showingCancelAlert = true
             } label: {
                 Text(Localization.cancelBooking)
             }
@@ -356,6 +368,24 @@ private extension BookingDetailsView {
             comment: "'Cancel booking' button title in appointment details section in booking details view."
         )
 
+        static let cancelBookingAlertTitle = NSLocalizedString(
+            "BookingDetailsView.cancelation.alert.title",
+            value: "Cancel booking",
+            comment: "Title for the booking cancellation confirmation alert."
+        )
+
+        static let cancelBookingAlertConfirmAction = NSLocalizedString(
+            "BookingDetailsView.cancelation.alert.confirmAction",
+            value: "Yes, cancel it",
+            comment: "Confirm button title for the booking cancellation confirmation alert."
+        )
+
+        static let cancelBookingAlertCancelAction = NSLocalizedString(
+            "BookingDetailsView.cancelation.alert.cancelAction",
+            value: "No, keep it",
+            comment: "Cancel button title for the booking cancellation confirmation alert."
+        )
+
         /// Attendance section
         static let statusRowTitle = NSLocalizedString(
             "BookingDetailsView.customer.status.title",