Merge pull request #4959 from woocommerce/issue/4599-new-package-details

Shipping Labels: New packages form to support multiple packages

Author: itsmeichigo

WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/Create Shipping Label Form/Package Details/Multi-package/ShippingLabelPackageItem.swift

@@ -0,0 +1,48 @@
+import SwiftUI
+
+struct ShippingLabelPackageItem: View {
+
+    @ObservedObject private var viewModel: ShippingLabelPackageItemViewModel
+    @State private var isCollapsed: Bool = false
+    @State private var isShowingPackageSelection = false
+
+    private let isCollapsible: Bool
+    private let packageNumber: Int
+    private let safeAreaInsets: EdgeInsets
+
+    init(packageNumber: Int,
+         isCollapsible: Bool,
+         safeAreaInsets: EdgeInsets,
+         viewModel: ShippingLabelPackageItemViewModel) {
+        self.packageNumber = packageNumber
+        self.isCollapsible = isCollapsible
+        self.safeAreaInsets = safeAreaInsets
+        self.viewModel = viewModel
+        self.isCollapsed = packageNumber > 1
+    }
+
+    var body: some View {
+        CollapsibleView(isCollapsible: isCollapsible, isCollapsed: $isCollapsed, safeAreaInsets: safeAreaInsets) {
+            // TODO-4599 - Update view
+            ShippingLabelPackageNumberRow(packageNumber: packageNumber, numberOfItems: 1)
+        } content: {
+            // TODO-4599 - Update view
+            EmptyView()
+        }
+    }
+}
+
+struct ShippingLabelPackageItem_Previews: PreviewProvider {
+    static var previews: some View {
+        let order = ShippingLabelPackageDetailsViewModel.sampleOrder()
+        let packageResponse = ShippingLabelPackageDetailsViewModel.samplePackageDetails()
+        let viewModel = ShippingLabelPackageItemViewModel(order: order,
+                                                          orderItems: order.items,
+                                                          packagesResponse: packageResponse,
+                                                          selectedPackageID: "Box 1",
+                                                          totalWeight: "",
+                                                          products: [],
+                                                          productVariations: [])
+        ShippingLabelPackageItem(packageNumber: 1, isCollapsible: true, safeAreaInsets: .zero, viewModel: viewModel)
+    }
+}

WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/Create Shipping Label Form/Package Details/Multi-package/ShippingLabelPackagesForm.swift

@@ -0,0 +1,64 @@
+import SwiftUI
+
+struct ShippingLabelPackagesForm: View {
+    @ObservedObject private var viewModel: ShippingLabelPackagesFormViewModel
+    @Environment(\.presentationMode) var presentation
+
+    init(viewModel: ShippingLabelPackagesFormViewModel) {
+        self.viewModel = viewModel
+        ServiceLocator.analytics.track(.shippingLabelPurchaseFlow, withProperties: ["state": "packages_started"])
+    }
+
+    var body: some View {
+        GeometryReader { geometry in
+            ScrollView {
+                ForEach(Array(viewModel.itemViewModels.enumerated()), id: \.offset) { index, element in
+                    ShippingLabelPackageItem(packageNumber: index + 1,
+                                             isCollapsible: viewModel.foundMultiplePackages,
+                                             safeAreaInsets: geometry.safeAreaInsets,
+                                             viewModel: element)
+                }
+                .padding(.bottom, insets: geometry.safeAreaInsets)
+            }
+            .background(Color(.listBackground))
+            .ignoresSafeArea(.container, edges: [.horizontal, .bottom])
+        }
+        .navigationTitle(Localization.title)
+        .navigationBarItems(trailing: Button(action: {
+            ServiceLocator.analytics.track(.shippingLabelPurchaseFlow,
+                                           withProperties: ["state": "packages_selected"])
+            // TODO-4599: Update selection
+            presentation.wrappedValue.dismiss()
+        }, label: {
+            Text(Localization.doneButton)
+        }))
+    }
+}
+
+private extension ShippingLabelPackagesForm {
+    enum Localization {
+        static let title = NSLocalizedString("Package Details",
+                                             comment: "Navigation bar title of shipping label package details screen")
+        static let doneButton = NSLocalizedString("Done", comment: "Done navigation button in the Package Details screen in Shipping Label flow")
+    }
+
+    enum Constants {
+        static let dividerPadding: CGFloat = 16
+    }
+}
+
+struct ShippingLabelPackagesForm_Previews: PreviewProvider {
+    static var previews: some View {
+        let viewModel = ShippingLabelPackagesFormViewModel(order: ShippingLabelPackagesFormViewModel.sampleOrder(),
+                                                           packagesResponse: ShippingLabelPackagesFormViewModel.samplePackageDetails(),
+                                                           selectedPackages: [])
+
+        ShippingLabelPackagesForm(viewModel: viewModel)
+        .environment(\.colorScheme, .light)
+        .previewDisplayName("Light")
+
+        ShippingLabelPackagesForm(viewModel: viewModel)
+        .environment(\.colorScheme, .dark)
+        .previewDisplayName("Dark")
+    }
+}