Shipping Labels: Add new screen to select category for HAZMAT

WooCommerce/Classes/AppDelegate.swift

@@ -294,7 +294,6 @@ private extension AppDelegate {
     func setupWooAppearance() {
         UINavigationBar.applyWooAppearance()
         UILabel.applyWooAppearance()
-        UISearchBar.applyWooAppearance()
         UITabBar.applyWooAppearance()
 
         // Take advantage of a bug in UIAlertController to style all UIAlertControllers with WC color

WooCommerce/Classes/Extensions/UISearchBar+Appearance.swift

@@ -1,31 +1,5 @@
 import UIKit
 
-
-// MARK: - UISearchBar + Woo
-//
-extension UISearchBar {
-
-    /// Applies the default WC's Appearance
-    ///
-    class func applyWooAppearance() {
-        let appearance = UISearchBar.appearance()
-        appearance.barTintColor = .basicBackground
-
-        appearance.layer.borderColor = UIColor.listSmallIcon.cgColor
-        appearance.layer.borderWidth = 1.0
-
-        let brandColor = UIColor.primary
-        appearance.tintColor = brandColor
-
-        let cancelButtonAttributes = [NSAttributedString.Key.foregroundColor: brandColor]
-        UIBarButtonItem.appearance(whenContainedInInstancesOf: [UISearchBar.self]).setTitleTextAttributes(cancelButtonAttributes, for: .normal)
-
-        let textAttributes = [NSAttributedString.Key.foregroundColor: UIColor.textTertiary]
-        UITextField.appearance(whenContainedInInstancesOf: [UISearchBar.self]).defaultTextAttributes = textAttributes
-    }
-}
-
-
 // Setting the UITextField background color via the appearance proxy does not seem to work
 // As a workaround, this property exposes the texfield, so the background color can be set manually
 //

WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Hazmat Section/WooShippingHazmatCategoryList.swift

@@ -0,0 +1,87 @@
+import SwiftUI
+
+struct WooShippingHazmatCategoryList: View {
+    private let categories: [ShippingLabelHazmatCategory] = {
+        ShippingLabelHazmatCategory.allCases.filter {
+            /// Filter out items that don't match the list on the web
+            let exceptions: [ShippingLabelHazmatCategory] = [.none, .class4, .class5, .class6]
+            return !exceptions.contains($0)
+        }
+    }()
+
+    private let selectionHandler: (ShippingLabelHazmatCategory) -> Void
+
+    @State private var selectedItem: ShippingLabelHazmatCategory?
+
+    @State private var query: String = ""
+
+    @Environment(\.dismiss) private var dismiss
+
+    var filteredCategories: [ShippingLabelHazmatCategory] {
+        if query.isEmpty {
+            return categories
+        } else {
+            return categories.filter { $0.localizedName.lowercased().contains(query.lowercased()) }
+        }
+    }
+
+    init(selectedItem: ShippingLabelHazmatCategory? = nil,
+         selectionHandler: @escaping (ShippingLabelHazmatCategory) -> Void) {
+        self.selectedItem = selectedItem
+        self.selectionHandler = selectionHandler
+    }
+
+    var body: some View {
+        NavigationStack {
+            List(filteredCategories, id: \.self) { category in
+                HStack {
+                    Image(systemName: "checkmark")
+                        .foregroundStyle(Color.accentColor)
+                        .opacity(selectedItem == category ? 1 : 0)
+
+                    Text(category.localizedName)
+                        .multilineTextAlignment(.leading)
+                        .frame(maxWidth: .infinity, alignment: .leading)
+
+                    Image(systemName: "chevron.forward")
+                        .foregroundStyle(Color(.tertiaryLabel))
+                }
+                .contentShape(Rectangle())
+                .onTapGesture {
+                    selectedItem = category
+                    selectionHandler(category)
+                }
+            }
+            .listStyle(.plain)
+            .navigationTitle(Localization.title)
+            .navigationBarTitleDisplayMode(.inline)
+            .toolbar {
+                ToolbarItem(placement: .cancellationAction) {
+                    Button(Localization.cancel) {
+                        dismiss()
+                    }
+                }
+            }
+            .searchable(text: $query)
+        }
+    }
+}
+
+private extension WooShippingHazmatCategoryList {
+    enum Localization {
+        static let title = NSLocalizedString(
+            "wooShippingHazmatCategoryList.title",
+            value: "Select Category",
+            comment: "Title of the screen to select a category for hazardous materials in the shipping label creation flow"
+        )
+        static let cancel = NSLocalizedString(
+            "wooShippingHazmatCategoryList.cancel",
+            value: "Cancel",
+            comment: "Button to dismiss the hazardous material category screen in the shipping label creation flow"
+        )
+    }
+}
+
+#Preview {
+    WooShippingHazmatCategoryList(selectionHandler: { _ in })
+}

WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Hazmat Section/WooShippingHazmatDetailView.swift

@@ -3,12 +3,17 @@ import SwiftUI
 struct WooShippingHazmatDetailView: View {
     @Environment(\.dismiss) private var dismiss
 
-    @Binding private var isHazardous: Bool
+    @State private var isHazardous: Bool
+
+    @State private var selectedCategory: ShippingLabelHazmatCategory?
 
     @State private var detailURL: URL?
 
-    init(isHazardous: Binding<Bool>) {
-        self._isHazardous = isHazardous
+    @State private var isShowingCategoryList = false
+
+    init(isHazardous: Bool, selectedCategory: ShippingLabelHazmatCategory?) {
+        self.isHazardous = isHazardous
+        self.selectedCategory = selectedCategory
     }
 
     var body: some View {
@@ -26,7 +31,7 @@ struct WooShippingHazmatDetailView: View {
                     }
 
                     Button(Localization.selectCategory) {
-                        // TODO: navigate to category list
+                        isShowingCategoryList = true
                     }
                     .buttonStyle(PrimaryButtonStyle())
                     .renderedIf(isHazardous)
@@ -57,6 +62,12 @@ struct WooShippingHazmatDetailView: View {
                 }
                 .toolbarBackground(Color.clear, for: .navigationBar)
             }
+            .sheet(isPresented: $isShowingCategoryList) {
+                WooShippingHazmatCategoryList(selectedItem: selectedCategory,
+                                              selectionHandler: { category in
+                    // TODO: dismiss view
+                })
+            }
         }
     }
 }
@@ -166,5 +177,6 @@ private extension WooShippingHazmatDetailView {
 }
 
 #Preview {
-    WooShippingHazmatDetailView(isHazardous: .constant(true))
+    WooShippingHazmatDetailView(isHazardous: true,
+                                selectedCategory: .airEligibleEthanol)
 }

WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Hazmat Section/WooShippingHazmatRow.swift

@@ -6,10 +6,15 @@ struct WooShippingHazmatRow: View {
 
     @Binding private var isHazardous: Bool
 
+    @Binding private var selectedCategory: ShippingLabelHazmatCategory?
+
     @State private var isShowingDetailView = false
 
-    init(isHazardous: Binding<Bool>, enabled: Bool) {
+    init(isHazardous: Binding<Bool>,
+         selectedCategory: Binding<ShippingLabelHazmatCategory?>,
+         enabled: Bool) {
         self._isHazardous = isHazardous
+        self._selectedCategory = selectedCategory
         self.enabled = enabled
     }
 
@@ -32,7 +37,8 @@ struct WooShippingHazmatRow: View {
         .buttonStyle(.plain)
         .disabled(!enabled)
         .sheet(isPresented: $isShowingDetailView) {
-            WooShippingHazmatDetailView(isHazardous: $isHazardous)
+            WooShippingHazmatDetailView(isHazardous: isHazardous,
+                                        selectedCategory: selectedCategory)
         }
     }
 }
@@ -61,6 +67,8 @@ private extension WooShippingHazmatRow {
 }
 
 #Preview {
-    WooShippingHazmatRow(isHazardous: .constant(false), enabled: true)
+    WooShippingHazmatRow(isHazardous: .constant(false),
+                         selectedCategory: .constant(nil),
+                         enabled: true)
         .padding()
 }

WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShippingCreateLabelsView.swift

@@ -107,6 +107,7 @@ private extension WooShippingCreateLabelsView {
                 WooShippingItems(viewModel: viewModel.items)
 
                 WooShippingHazmatRow(isHazardous: $viewModel.containsHazardousMaterials,
+                                     selectedCategory: $viewModel.hazmatCategory,
                                      enabled: !viewModel.canViewLabel)
 
                 WooShippingCustomsRow(informationIsCompleted: viewModel.customsInformationIsCompleted,

WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShippingCreateLabelsViewModel.swift

@@ -22,6 +22,7 @@ final class WooShippingCreateLabelsViewModel: ObservableObject {
     private var debounceDuration: Double = 1
 
     @Published var containsHazardousMaterials = false
+    @Published var hazmatCategory: ShippingLabelHazmatCategory?
 
     @Published var labelPurchaseErrorNotice: Notice?
 

WooCommerce/WooCommerce.xcodeproj/project.pbxproj

@@ -2794,6 +2794,7 @@
 		DEC0293A29C41BC500FD0E2F /* ApplicationPasswordAuthorizationViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = DEC0293929C41BC500FD0E2F /* ApplicationPasswordAuthorizationViewModel.swift */; };
 		DEC1508227F450AC00F4487C /* CouponAllowedEmails.swift in Sources */ = {isa = PBXBuildFile; fileRef = DEC1508127F450AC00F4487C /* CouponAllowedEmails.swift */; };
 		DEC17AE02D82C513005A6E6D /* WooShippingHazmatDetailView.swift in Sources */ = {isa = PBXBuildFile; fileRef = DEC17ADF2D82C513005A6E6D /* WooShippingHazmatDetailView.swift */; };
+		DEC1899A2D84197C005A6E6D /* WooShippingHazmatCategoryList.swift in Sources */ = {isa = PBXBuildFile; fileRef = DEC189992D84197C005A6E6D /* WooShippingHazmatCategoryList.swift */; };
 		DEC2961F26BD1605005A056B /* ShippingLabelCustomsFormListViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = DEC2961E26BD1605005A056B /* ShippingLabelCustomsFormListViewModel.swift */; };
 		DEC2962126BD1627005A056B /* ShippingLabelCustomsFormList.swift in Sources */ = {isa = PBXBuildFile; fileRef = DEC2962026BD1627005A056B /* ShippingLabelCustomsFormList.swift */; };
 		DEC2962326BD4E6E005A056B /* ShippingLabelCustomsFormInput.swift in Sources */ = {isa = PBXBuildFile; fileRef = DEC2962226BD4E6E005A056B /* ShippingLabelCustomsFormInput.swift */; };
@@ -5996,6 +5997,7 @@
 		DEC0293929C41BC500FD0E2F /* ApplicationPasswordAuthorizationViewModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ApplicationPasswordAuthorizationViewModel.swift; sourceTree = "<group>"; };
 		DEC1508127F450AC00F4487C /* CouponAllowedEmails.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CouponAllowedEmails.swift; sourceTree = "<group>"; };
 		DEC17ADF2D82C513005A6E6D /* WooShippingHazmatDetailView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = WooShippingHazmatDetailView.swift; sourceTree = "<group>"; };
+		DEC189992D84197C005A6E6D /* WooShippingHazmatCategoryList.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = WooShippingHazmatCategoryList.swift; sourceTree = "<group>"; };
 		DEC2961E26BD1605005A056B /* ShippingLabelCustomsFormListViewModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ShippingLabelCustomsFormListViewModel.swift; sourceTree = "<group>"; };
 		DEC2962026BD1627005A056B /* ShippingLabelCustomsFormList.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ShippingLabelCustomsFormList.swift; sourceTree = "<group>"; };
 		DEC2962226BD4E6E005A056B /* ShippingLabelCustomsFormInput.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ShippingLabelCustomsFormInput.swift; sourceTree = "<group>"; };
@@ -12341,6 +12343,7 @@
 			children = (
 				CE7B4A5A2CA1BF9900F764EB /* WooShippingHazmatRow.swift */,
 				DEC17ADF2D82C513005A6E6D /* WooShippingHazmatDetailView.swift */,
+				DEC189992D84197C005A6E6D /* WooShippingHazmatCategoryList.swift */,
 			);
 			path = "WooShipping Hazmat Section";
 			sourceTree = "<group>";
@@ -16409,6 +16412,7 @@
 				B97C6E562B15E51A008A2BF2 /* UpdateProductInventoryView.swift in Sources */,
 				268EC45F26CEA50C00716F5C /* EditCustomerNote.swift in Sources */,
 				DE7E5E862B4D11D7002E28D2 /* BlazeTargetDevicePickerViewModel.swift in Sources */,
+				DEC1899A2D84197C005A6E6D /* WooShippingHazmatCategoryList.swift in Sources */,
 				CE315DC62CC93CCE00A06748 /* WooShippingCarrier.swift in Sources */,
 				4535EE7E281BE04A004212B4 /* CouponAmountInputFormatter.swift in Sources */,
 				209AD3D22AC1EDF600825D76 /* WooPaymentsPayoutsCurrencyOverviewView.swift in Sources */,