From 028912aafcfc075dbcc1b15ea0acfe34d53a92e4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Boz=CC=8Cidar=20S=CC=8Cevo?= Date: Thu, 26 Sep 2024 16:07:40 +0200 Subject: [PATCH 01/10] Basic starting scaffolding for adding package --- .../WooShippingAddPackageView.swift | 171 ++++++++++++++++++ .../WooShippingPackageSelection.swift | 7 +- .../WooCommerce.xcodeproj/project.pbxproj | 4 + 3 files changed, 181 insertions(+), 1 deletion(-) create mode 100644 WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package Selection/WooShippingAddPackageView.swift diff --git a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package Selection/WooShippingAddPackageView.swift b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package Selection/WooShippingAddPackageView.swift new file mode 100644 index 00000000000..075307db0b8 --- /dev/null +++ b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package Selection/WooShippingAddPackageView.swift @@ -0,0 +1,171 @@ +import SwiftUI + +struct WooShippingAddPackageView: View { + enum PackageProviderType: CaseIterable { + case custom, carrier, saved + var name: String { + switch self { + case .custom: + return Localization.custom + case .carrier: + return Localization.carrier + case .saved: + return Localization.saved + } + } + } + + @Environment(\.presentationMode) var presentationMode + + @State var selectedPackageType = PackageProviderType.custom + + var body: some View { + NavigationView { + VStack { + Picker("", selection: $selectedPackageType) { + ForEach(PackageProviderType.allCases, id: \.self) { + Text($0.name) + } + } + .pickerStyle(.segmented) + .padding() + Spacer() + selectedPackageTypeView + } + .toolbar { + ToolbarItem(placement: .topBarLeading) { + Button(action: { + presentationMode.wrappedValue.dismiss() + }, label: { + Text(Localization.cancel) + }) + } + } + .navigationTitle(Localization.title) + .navigationBarTitleDisplayMode(.inline) + } + .navigationViewStyle(.stack) + } + + @ViewBuilder + private var selectedPackageTypeView: some View { + ScrollView { + switch selectedPackageType { + case .custom: + customPackageView + case .carrier: + carrierPackageView + case .saved: + savedPackageView + } + } + } + + enum PackageType: CaseIterable { + case box, envelope + var name: String { + switch self { + case .box: + return Localization.box + case .envelope: + return Localization.envelope + } + } + } + + @State var packageType: PackageType = .box + @State var showSaveTemplate: Bool = false + @State var length: String = "" + + private var customPackageView: some View { + VStack(alignment: .leading) { + HStack { + Text("Package type") + Spacer() + } + // type selection + Picker(selection: $packageType) { + ForEach(PackageType.allCases, id: \.self) { + Text($0.name) + } + } label: { + EmptyView() + } + HStack { + ForEach(WooShippingAddPackageDimensionView.DimensionType.allCases, id: \.self) { + WooShippingAddPackageDimensionView(dimensionType: $0) + } + } + Toggle(isOn: $showSaveTemplate) { + Text("Save this a new package template") + } + if showSaveTemplate { + Button { + // save template + } label: { + Text("Save package template") + } + + } + } + .padding() + } + + private var carrierPackageView: some View { + Text("carrier") + } + + private var savedPackageView: some View { + Text("saved") + } +} + +struct WooShippingAddPackageDimensionView: View { + enum DimensionType: CaseIterable { + case length, width, height + var name: String { + switch self { + case .length: + return Localization.length + case .width: + return Localization.width + case .height: + return Localization.height + } + } + } + + let dimensionType: DimensionType + @State var fieldValue: String = "" + + var body: some View { + VStack { + Text(dimensionType.name) + TextField(dimensionType.name, text: $fieldValue) + } + } +} + +#Preview { + WooShippingAddPackageView() +} + +extension WooShippingAddPackageView { + enum Localization { + static let title = NSLocalizedString("Add Package", comment: "Description") + static let cancel = NSLocalizedString("Cancel", comment: "Description") + static let custom = NSLocalizedString("Custom", comment: "Description") + static let carrier = NSLocalizedString("Carrier", comment: "Description") + static let saved = NSLocalizedString("Saved", comment: "Description") + static let box = NSLocalizedString("Box", comment: "Description") + static let envelope = NSLocalizedString("Envelope", comment: "Description") + } +} + +extension WooShippingAddPackageDimensionView { + enum Localization { + static let length = NSLocalizedString("Length", comment: "Description") + static let width = NSLocalizedString("Width", comment: "Description") + static let height = NSLocalizedString("Height", comment: "Description") + } +} diff --git a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package Selection/WooShippingPackageSelection.swift b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package Selection/WooShippingPackageSelection.swift index 2aaf328efb1..bd3acf4dcf0 100644 --- a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package Selection/WooShippingPackageSelection.swift +++ b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package Selection/WooShippingPackageSelection.swift @@ -1,13 +1,18 @@ import SwiftUI struct WooShippingPackageSelection: View { + @State var showAddPackage: Bool = false + var body: some View { Button { - // TODO-13551: Open package selection UI + showAddPackage.toggle() } label: { Text(Localization.addPackage) } .buttonStyle(PrimaryButtonStyle()) + .sheet(isPresented: $showAddPackage) { + WooShippingAddPackageView() + } } } diff --git a/WooCommerce/WooCommerce.xcodeproj/project.pbxproj b/WooCommerce/WooCommerce.xcodeproj/project.pbxproj index 655adb71e0d..c95b44a014d 100644 --- a/WooCommerce/WooCommerce.xcodeproj/project.pbxproj +++ b/WooCommerce/WooCommerce.xcodeproj/project.pbxproj @@ -2457,6 +2457,7 @@ DA81B4332C8EE5D6000F3466 /* MarkOrderAsReadUseCase.swift in Sources */ = {isa = PBXBuildFile; fileRef = DA25ADDC2C86145E00AE81FE /* MarkOrderAsReadUseCase.swift */; }; DA81B4342C8EE5D6000F3466 /* MarkOrderAsReadUseCase.swift in Sources */ = {isa = PBXBuildFile; fileRef = DA25ADDC2C86145E00AE81FE /* MarkOrderAsReadUseCase.swift */; }; DA81B4362C8F2BB8000F3466 /* MarkOrderAsReadUseCase.swift in Sources */ = {isa = PBXBuildFile; fileRef = DA25ADDC2C86145E00AE81FE /* MarkOrderAsReadUseCase.swift */; }; + DAB4099D2CA59B26008EE1F2 /* WooShippingAddPackageView.swift in Sources */ = {isa = PBXBuildFile; fileRef = DAB4099C2CA59B23008EE1F2 /* WooShippingAddPackageView.swift */; }; DABF35272C11B426006AF826 /* PointOfSaleDashboardViewModelTests.swift in Sources */ = {isa = PBXBuildFile; fileRef = DABF35262C11B426006AF826 /* PointOfSaleDashboardViewModelTests.swift */; }; DAD988C62C4A9CF9009DE9E3 /* CartItem+Order.swift in Sources */ = {isa = PBXBuildFile; fileRef = DAD988C52C4A9CF9009DE9E3 /* CartItem+Order.swift */; }; DAD988C92C4A9D6C009DE9E3 /* CartItemTests.swift in Sources */ = {isa = PBXBuildFile; fileRef = DAD988C82C4A9D6C009DE9E3 /* CartItemTests.swift */; }; @@ -5520,6 +5521,7 @@ DA25ADDC2C86145E00AE81FE /* MarkOrderAsReadUseCase.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MarkOrderAsReadUseCase.swift; sourceTree = ""; }; DA25ADDE2C87403900AE81FE /* PushNotificationTests.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PushNotificationTests.swift; sourceTree = ""; }; DA4104392C247B6900E8456A /* POSOrderPreviewService.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = POSOrderPreviewService.swift; sourceTree = ""; }; + DAB4099C2CA59B23008EE1F2 /* WooShippingAddPackageView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = WooShippingAddPackageView.swift; sourceTree = ""; }; DABF35262C11B426006AF826 /* PointOfSaleDashboardViewModelTests.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PointOfSaleDashboardViewModelTests.swift; sourceTree = ""; }; DAD988C52C4A9CF9009DE9E3 /* CartItem+Order.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "CartItem+Order.swift"; sourceTree = ""; }; DAD988C82C4A9D6C009DE9E3 /* CartItemTests.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CartItemTests.swift; sourceTree = ""; }; @@ -11798,6 +11800,7 @@ isa = PBXGroup; children = ( CE7B4A5F2CA1D05D00F764EB /* WooShippingPackageSelection.swift */, + DAB4099C2CA59B23008EE1F2 /* WooShippingAddPackageView.swift */, ); path = "WooShipping Package Selection"; sourceTree = ""; @@ -14978,6 +14981,7 @@ 451A04F42386F7C900E368C9 /* AddProductImageCollectionViewCell.swift in Sources */, D843D5CB22437E59001BFA55 /* TitleAndEditableValueTableViewCell.swift in Sources */, 26281776278F0B0100C836D3 /* View+NoticesModifier.swift in Sources */, + DAB4099D2CA59B26008EE1F2 /* WooShippingAddPackageView.swift in Sources */, 025B1748237A92D800C780B4 /* ProductFormSection+ReusableTableRow.swift in Sources */, CC4A4ED82655478D00B75DCD /* ShippingLabelPaymentMethodsViewModel.swift in Sources */, B5A8F8A920B84D3F00D211DE /* ApiCredentials.swift in Sources */, From 37ebac34dae083ff25dc4fb21d111c8b64c931c4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Boz=CC=8Cidar=20S=CC=8Cevo?= Date: Thu, 26 Sep 2024 16:17:09 +0200 Subject: [PATCH 02/10] Update --- .../WooShippingAddPackageView.swift | 0 .../WooShippingPackageAndRatePlaceholder.swift | 6 +++++- WooCommerce/WooCommerce.xcodeproj/project.pbxproj | 4 ++++ 3 files changed, 9 insertions(+), 1 deletion(-) rename WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/{WooShipping Package Selection => WooShipping Package and Rate Selection}/WooShippingAddPackageView.swift (100%) diff --git a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package Selection/WooShippingAddPackageView.swift b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift similarity index 100% rename from WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package Selection/WooShippingAddPackageView.swift rename to WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift diff --git a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingPackageAndRatePlaceholder.swift b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingPackageAndRatePlaceholder.swift index 9882c9b4b29..da659bc5437 100644 --- a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingPackageAndRatePlaceholder.swift +++ b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingPackageAndRatePlaceholder.swift @@ -1,10 +1,11 @@ import SwiftUI struct WooShippingPackageAndRatePlaceholder: View { + @State private var showAddPackage: Bool = false var body: some View { VStack(spacing: .zero) { Button { - // TODO-13551: Open package selection UI + showAddPackage.toggle() } label: { Text(Localization.addPackage) } @@ -22,6 +23,9 @@ struct WooShippingPackageAndRatePlaceholder: View { .multilineTextAlignment(.center) .padding(Layout.padding) .roundedBorder(cornerRadius: Layout.borderCornerRadius, lineColor: Color(.border), lineWidth: Layout.borderLineWidth, dashed: true) + .sheet(isPresented: $showAddPackage) { + WooShippingAddPackageView() + } } } diff --git a/WooCommerce/WooCommerce.xcodeproj/project.pbxproj b/WooCommerce/WooCommerce.xcodeproj/project.pbxproj index 255f003d669..7edc13496c9 100644 --- a/WooCommerce/WooCommerce.xcodeproj/project.pbxproj +++ b/WooCommerce/WooCommerce.xcodeproj/project.pbxproj @@ -2458,6 +2458,7 @@ DA81B4332C8EE5D6000F3466 /* MarkOrderAsReadUseCase.swift in Sources */ = {isa = PBXBuildFile; fileRef = DA25ADDC2C86145E00AE81FE /* MarkOrderAsReadUseCase.swift */; }; DA81B4342C8EE5D6000F3466 /* MarkOrderAsReadUseCase.swift in Sources */ = {isa = PBXBuildFile; fileRef = DA25ADDC2C86145E00AE81FE /* MarkOrderAsReadUseCase.swift */; }; DA81B4362C8F2BB8000F3466 /* MarkOrderAsReadUseCase.swift in Sources */ = {isa = PBXBuildFile; fileRef = DA25ADDC2C86145E00AE81FE /* MarkOrderAsReadUseCase.swift */; }; + DAB4099F2CA5A329008EE1F2 /* WooShippingAddPackageView.swift in Sources */ = {isa = PBXBuildFile; fileRef = DAB4099E2CA5A329008EE1F2 /* WooShippingAddPackageView.swift */; }; DABF35272C11B426006AF826 /* PointOfSaleDashboardViewModelTests.swift in Sources */ = {isa = PBXBuildFile; fileRef = DABF35262C11B426006AF826 /* PointOfSaleDashboardViewModelTests.swift */; }; DAD988C62C4A9CF9009DE9E3 /* CartItem+Order.swift in Sources */ = {isa = PBXBuildFile; fileRef = DAD988C52C4A9CF9009DE9E3 /* CartItem+Order.swift */; }; DAD988C92C4A9D6C009DE9E3 /* CartItemTests.swift in Sources */ = {isa = PBXBuildFile; fileRef = DAD988C82C4A9D6C009DE9E3 /* CartItemTests.swift */; }; @@ -5525,6 +5526,7 @@ DA25ADDE2C87403900AE81FE /* PushNotificationTests.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PushNotificationTests.swift; sourceTree = ""; }; DA3F99B92C92F6D30034BDA5 /* MarkOrderAsReadUseCaseTests.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MarkOrderAsReadUseCaseTests.swift; sourceTree = ""; }; DA4104392C247B6900E8456A /* POSOrderPreviewService.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = POSOrderPreviewService.swift; sourceTree = ""; }; + DAB4099E2CA5A329008EE1F2 /* WooShippingAddPackageView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = WooShippingAddPackageView.swift; sourceTree = ""; }; DABF35262C11B426006AF826 /* PointOfSaleDashboardViewModelTests.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PointOfSaleDashboardViewModelTests.swift; sourceTree = ""; }; DAD988C52C4A9CF9009DE9E3 /* CartItem+Order.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "CartItem+Order.swift"; sourceTree = ""; }; DAD988C82C4A9D6C009DE9E3 /* CartItemTests.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CartItemTests.swift; sourceTree = ""; }; @@ -11959,6 +11961,7 @@ isa = PBXGroup; children = ( CECEFA6C2CA2CEB50071C7DB /* WooShippingPackageAndRatePlaceholder.swift */, + DAB4099E2CA5A329008EE1F2 /* WooShippingAddPackageView.swift */, ); path = "WooShipping Package and Rate Selection"; sourceTree = ""; @@ -14835,6 +14838,7 @@ 0218B4EC242E06F00083A847 /* MediaType+WPMediaType.swift in Sources */, D85A3C5026C153A500C0E026 /* InPersonPaymentsPluginNotActivatedView.swift in Sources */, D8815AE726383FD600EDAD62 /* CardPresentPaymentsModalViewModel.swift in Sources */, + DAB4099F2CA5A329008EE1F2 /* WooShippingAddPackageView.swift in Sources */, 02B21C5729C9EEF900C5623B /* WooAnalyticsEvent+StoreOnboarding.swift in Sources */, 0216271E2375044D000208D2 /* AztecFormatBar+Update.swift in Sources */, CC254F3626C437AB005F3C82 /* ShippingLabelCustomPackageForm.swift in Sources */, From 2fb7462f4ac098b8438de88e8be6176b5e01909c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Boz=CC=8Cidar=20S=CC=8Cevo?= Date: Thu, 26 Sep 2024 16:18:22 +0200 Subject: [PATCH 03/10] Delete WooShippingPackageSelection.swift --- .../WooShippingPackageSelection.swift | 29 ------------------- 1 file changed, 29 deletions(-) delete mode 100644 WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package Selection/WooShippingPackageSelection.swift diff --git a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package Selection/WooShippingPackageSelection.swift b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package Selection/WooShippingPackageSelection.swift deleted file mode 100644 index bd3acf4dcf0..00000000000 --- a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package Selection/WooShippingPackageSelection.swift +++ /dev/null @@ -1,29 +0,0 @@ -import SwiftUI - -struct WooShippingPackageSelection: View { - @State var showAddPackage: Bool = false - - var body: some View { - Button { - showAddPackage.toggle() - } label: { - Text(Localization.addPackage) - } - .buttonStyle(PrimaryButtonStyle()) - .sheet(isPresented: $showAddPackage) { - WooShippingAddPackageView() - } - } -} - -private extension WooShippingPackageSelection { - enum Localization { - static let addPackage = NSLocalizedString("wooShipping.createLabel.addPackage.button", - value: "Add a Package", - comment: "Button to select a package to use for a shipment in the shipping label creation flow.") - } -} - -#Preview { - WooShippingPackageSelection() -} From 06f9fb37ff97cb31286c88c57ee52d3a1b61f197 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Boz=CC=8Cidar=20S=CC=8Cevo?= Date: Thu, 26 Sep 2024 16:23:15 +0200 Subject: [PATCH 04/10] Update WooShippingAddPackageView.swift --- .../WooShippingAddPackageView.swift | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift index 075307db0b8..86565037458 100644 --- a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift +++ b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift @@ -31,6 +31,13 @@ struct WooShippingAddPackageView: View { .padding() Spacer() selectedPackageTypeView + Spacer() + Button { + // add package + } label: { + Text(Localization.addPackage) + } + } .toolbar { ToolbarItem(placement: .topBarLeading) { @@ -41,7 +48,7 @@ struct WooShippingAddPackageView: View { }) } } - .navigationTitle(Localization.title) + .navigationTitle(Localization.addPackage) .navigationBarTitleDisplayMode(.inline) } .navigationViewStyle(.stack) @@ -152,7 +159,7 @@ struct WooShippingAddPackageDimensionView: View { extension WooShippingAddPackageView { enum Localization { - static let title = NSLocalizedString("Add Package", comment: "Description") + static let addPackage = NSLocalizedString("Add Package", comment: "Description") static let cancel = NSLocalizedString("Cancel", comment: "Description") static let custom = NSLocalizedString("Custom", comment: "Description") static let carrier = NSLocalizedString("Carrier", comment: "Description") From 1d0a8f89305a56f241158576fc5136e42a4860cd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Boz=CC=8Cidar=20S=CC=8Cevo?= Date: Fri, 27 Sep 2024 13:03:35 +0200 Subject: [PATCH 05/10] Update WooShippingAddPackageView.swift --- .../WooShippingAddPackageView.swift | 35 +++++++++++++++---- 1 file changed, 28 insertions(+), 7 deletions(-) diff --git a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift index 86565037458..fa6c2dbf035 100644 --- a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift +++ b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift @@ -91,13 +91,26 @@ struct WooShippingAddPackageView: View { Spacer() } // type selection - Picker(selection: $packageType) { - ForEach(PackageType.allCases, id: \.self) { - Text($0.name) + Menu { + // show selection + ForEach(PackageType.allCases, id: \.self) { option in + Button { + packageType = option + } label: { + Text(option.name) + } } } label: { - EmptyView() + HStack { + // text + Text(packageType.name) + // arrows + Spacer() + Image(systemName: "chevron.up.chevron.down") + } + .padding() } + .roundedBorder(cornerRadius: 8, lineColor: Color(.separator), lineWidth: 1) HStack { ForEach(WooShippingAddPackageDimensionView.DimensionType.allCases, id: \.self) { WooShippingAddPackageDimensionView(dimensionType: $0) @@ -112,7 +125,6 @@ struct WooShippingAddPackageView: View { } label: { Text("Save package template") } - } } .padding() @@ -147,9 +159,18 @@ struct WooShippingAddPackageDimensionView: View { var body: some View { VStack { - Text(dimensionType.name) - TextField(dimensionType.name, text: $fieldValue) + HStack { + Text(dimensionType.name) + Spacer() + } + HStack { + TextField("", text: $fieldValue) + Text("cm") + } + .padding() + .roundedBorder(cornerRadius: 8, lineColor: Color(.separator), lineWidth: 1) } + .frame(minHeight: 48) } } From 79a2335bf8847063be30eab526651876022f8870 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Boz=CC=8Cidar=20S=CC=8Cevo?= Date: Mon, 30 Sep 2024 16:30:17 +0200 Subject: [PATCH 06/10] Update styling of text and buttons, add package button disabled logic --- .../WooShippingAddPackageView.swift | 57 ++++++++++++++----- 1 file changed, 43 insertions(+), 14 deletions(-) diff --git a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift index fa6c2dbf035..575befc5b95 100644 --- a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift +++ b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift @@ -18,6 +18,14 @@ struct WooShippingAddPackageView: View { @Environment(\.presentationMode) var presentationMode @State var selectedPackageType = PackageProviderType.custom + var addPackageButtonDisabled: Bool { + for (_, value) in fieldValues { + if value.isEmpty { + return true + } + } + return fieldValues.count != WooShippingAddPackageDimensionView.DimensionType.allCases.count + } var body: some View { NavigationView { @@ -32,12 +40,12 @@ struct WooShippingAddPackageView: View { Spacer() selectedPackageTypeView Spacer() - Button { + Button(Localization.addPackage) { // add package - } label: { - Text(Localization.addPackage) } - + .buttonStyle(PrimaryButtonStyle()) + .disabled(addPackageButtonDisabled) + .padding() } .toolbar { ToolbarItem(placement: .topBarLeading) { @@ -83,11 +91,13 @@ struct WooShippingAddPackageView: View { @State var packageType: PackageType = .box @State var showSaveTemplate: Bool = false @State var length: String = "" + @State var fieldValues: [WooShippingAddPackageDimensionView.DimensionType: String] = [:] private var customPackageView: some View { VStack(alignment: .leading) { HStack { - Text("Package type") + Text(Localization.packageType) + .font(.subheadline) Spacer() } // type selection @@ -98,6 +108,7 @@ struct WooShippingAddPackageView: View { packageType = option } label: { Text(option.name) + .font(.body) } } } label: { @@ -111,30 +122,36 @@ struct WooShippingAddPackageView: View { .padding() } .roundedBorder(cornerRadius: 8, lineColor: Color(.separator), lineWidth: 1) - HStack { - ForEach(WooShippingAddPackageDimensionView.DimensionType.allCases, id: \.self) { - WooShippingAddPackageDimensionView(dimensionType: $0) + HStack(spacing: 8) { + ForEach(WooShippingAddPackageDimensionView.DimensionType.allCases, id: \.self) { dimensionType in + WooShippingAddPackageDimensionView(dimensionType: dimensionType, fieldValue: Binding(get: { + return self.fieldValues[dimensionType] ?? "" + }, set: { value in + self.fieldValues[dimensionType] = value + })) } } Toggle(isOn: $showSaveTemplate) { - Text("Save this a new package template") + Text(Localization.saveNewPackageTemplate) + .font(.subheadline) } if showSaveTemplate { - Button { + Button(Localization.savePackageTemplate) { // save template - } label: { - Text("Save package template") } + .buttonStyle(SecondaryButtonStyle()) } } .padding() } private var carrierPackageView: some View { + // TODO: just a placeholder Text("carrier") } private var savedPackageView: some View { + // TODO: just a placeholder Text("saved") } } @@ -155,20 +172,29 @@ struct WooShippingAddPackageDimensionView: View { } let dimensionType: DimensionType - @State var fieldValue: String = "" + @Binding var fieldValue: String + @FocusState var fieldFocused: Bool var body: some View { VStack { HStack { Text(dimensionType.name) + .font(.subheadline) Spacer() } HStack { TextField("", text: $fieldValue) + .keyboardType(.decimalPad) + .font(.body) + .focused($fieldFocused) Text("cm") + .font(.subheadline) + .foregroundStyle(.secondary) } .padding() - .roundedBorder(cornerRadius: 8, lineColor: Color(.separator), lineWidth: 1) + .roundedBorder(cornerRadius: 8, + lineColor: fieldFocused ? Color(UIColor.wooCommercePurple(.shade60)) : Color(.separator), + lineWidth: fieldFocused ? 2 : 1) } .frame(minHeight: 48) } @@ -181,12 +207,15 @@ struct WooShippingAddPackageDimensionView: View { extension WooShippingAddPackageView { enum Localization { static let addPackage = NSLocalizedString("Add Package", comment: "Description") + static let packageType = NSLocalizedString("Package type", comment: "Description") static let cancel = NSLocalizedString("Cancel", comment: "Description") static let custom = NSLocalizedString("Custom", comment: "Description") static let carrier = NSLocalizedString("Carrier", comment: "Description") static let saved = NSLocalizedString("Saved", comment: "Description") static let box = NSLocalizedString("Box", comment: "Description") static let envelope = NSLocalizedString("Envelope", comment: "Description") + static let saveNewPackageTemplate = NSLocalizedString("Save this a new package template", comment: "Description") + static let savePackageTemplate = NSLocalizedString("Save package template", comment: "Description") } } From d95e4cf9e611eef42f4c3304c7ebcdbaeeb591ba Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Boz=CC=8Cidar=20S=CC=8Cevo?= Date: Tue, 1 Oct 2024 12:32:04 +0200 Subject: [PATCH 07/10] Update localization strings --- .../WooShippingAddPackageView.swift | 52 ++++++++++++++----- 1 file changed, 39 insertions(+), 13 deletions(-) diff --git a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift index 575befc5b95..40af06a77d3 100644 --- a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift +++ b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift @@ -206,23 +206,49 @@ struct WooShippingAddPackageDimensionView: View { extension WooShippingAddPackageView { enum Localization { - static let addPackage = NSLocalizedString("Add Package", comment: "Description") - static let packageType = NSLocalizedString("Package type", comment: "Description") - static let cancel = NSLocalizedString("Cancel", comment: "Description") - static let custom = NSLocalizedString("Custom", comment: "Description") - static let carrier = NSLocalizedString("Carrier", comment: "Description") - static let saved = NSLocalizedString("Saved", comment: "Description") - static let box = NSLocalizedString("Box", comment: "Description") - static let envelope = NSLocalizedString("Envelope", comment: "Description") - static let saveNewPackageTemplate = NSLocalizedString("Save this a new package template", comment: "Description") - static let savePackageTemplate = NSLocalizedString("Save package template", comment: "Description") + static let addPackage = NSLocalizedString("wooShipping.createLabel.addPackage.title", + value: "Add Package", + comment: "Title for the Add Package screen") + static let packageType = NSLocalizedString("wooShipping.createLabel.addPackage.packageType", + value: "Package type", + comment: "Info label for selecting package type") + static let cancel = NSLocalizedString("wooShipping.createLabel.addPackage.cancel", + value: "Cancel", + comment: "Cancel button in navigation bar to dismiss the screen") + static let custom = NSLocalizedString("wooShipping.createLabel.addPackage.custom", + value: "Custom", + comment: "Info label for custom package option") + static let carrier = NSLocalizedString("wooShipping.createLabel.addPackage.carrier", + value: "Carrier", + comment: "Info label for carrier package option") + static let saved = NSLocalizedString("wooShipping.createLabel.addPackage.saved", + value: "Saved", + comment: "Info label for saved package option") + static let box = NSLocalizedString("wooShipping.createLabel.addPackage.box", + value: "Box", + comment: "Info label for selected box as a package type") + static let envelope = NSLocalizedString("wooShipping.createLabel.addPackage.envelope", + value: "Envelope", + comment: "Info label for selected envelope as a package type") + static let saveNewPackageTemplate = NSLocalizedString("wooShipping.createLabel.addPackage.saveNewPackageTemplate", + value: "Save this as a new package template", + comment: "Info label for saving package as a new template toggle") + static let savePackageTemplate = NSLocalizedString("wooShipping.createLabel.addPackage.savePackageTemplate", + value: "Save package template", + comment: "Button for saving package as a new template") } } extension WooShippingAddPackageDimensionView { enum Localization { - static let length = NSLocalizedString("Length", comment: "Description") - static let width = NSLocalizedString("Width", comment: "Description") - static let height = NSLocalizedString("Height", comment: "Description") + static let length = NSLocalizedString("wooShipping.createLabel.addPackage.length", + value: "Length", + comment: "Info label for length input field") + static let width = NSLocalizedString("wooShipping.createLabel.addPackage.width", + value: "Width", + comment: "Info label for width input field") + static let height = NSLocalizedString("wooShipping.createLabel.addPackage.height", + value: "Height", + comment: "Info label for height input field") } } From fcb303d69982f4d87ab6cf9f31b3289fe8203956 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Boz=CC=8Cidar=20S=CC=8Cevo?= Date: Tue, 1 Oct 2024 18:06:13 +0200 Subject: [PATCH 08/10] Use cancellationAction and update padding --- .../WooShippingAddPackageView.swift | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift index 40af06a77d3..0f9ca738123 100644 --- a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift +++ b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift @@ -37,7 +37,6 @@ struct WooShippingAddPackageView: View { } .pickerStyle(.segmented) .padding() - Spacer() selectedPackageTypeView Spacer() Button(Localization.addPackage) { @@ -48,7 +47,7 @@ struct WooShippingAddPackageView: View { .padding() } .toolbar { - ToolbarItem(placement: .topBarLeading) { + ToolbarItem(placement: .cancellationAction) { Button(action: { presentationMode.wrappedValue.dismiss() }, label: { @@ -142,7 +141,7 @@ struct WooShippingAddPackageView: View { .buttonStyle(SecondaryButtonStyle()) } } - .padding() + .padding(.horizontal) } private var carrierPackageView: some View { From 114c56e1670d1a2ccd23149cf2f3a4853f71386c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Boz=CC=8Cidar=20S=CC=8Cevo?= Date: Tue, 1 Oct 2024 18:18:49 +0200 Subject: [PATCH 09/10] Update vertical spacing and use AdaptiveStack --- .../WooShippingAddPackageView.swift | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift index 0f9ca738123..97eb108f4ee 100644 --- a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift +++ b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift @@ -14,6 +14,9 @@ struct WooShippingAddPackageView: View { } } } + enum Constants { + static let defaultVerticalSpacing: CGFloat = 16.0 + } @Environment(\.presentationMode) var presentationMode @@ -89,11 +92,10 @@ struct WooShippingAddPackageView: View { @State var packageType: PackageType = .box @State var showSaveTemplate: Bool = false - @State var length: String = "" @State var fieldValues: [WooShippingAddPackageDimensionView.DimensionType: String] = [:] private var customPackageView: some View { - VStack(alignment: .leading) { + VStack(alignment: .leading, spacing: Constants.defaultVerticalSpacing) { HStack { Text(Localization.packageType) .font(.subheadline) @@ -121,7 +123,7 @@ struct WooShippingAddPackageView: View { .padding() } .roundedBorder(cornerRadius: 8, lineColor: Color(.separator), lineWidth: 1) - HStack(spacing: 8) { + AdaptiveStack(spacing: 8) { ForEach(WooShippingAddPackageDimensionView.DimensionType.allCases, id: \.self) { dimensionType in WooShippingAddPackageDimensionView(dimensionType: dimensionType, fieldValue: Binding(get: { return self.fieldValues[dimensionType] ?? "" From 7513dfc09745dbf56cdb4734472228a97b860db3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Boz=CC=8Cidar=20S=CC=8Cevo?= Date: Tue, 1 Oct 2024 18:19:15 +0200 Subject: [PATCH 10/10] Use bodyStyle and add checkmark image in menu --- .../WooShippingAddPackageView.swift | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift index 97eb108f4ee..3ce11c2304f 100644 --- a/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift +++ b/WooCommerce/Classes/ViewRelated/Orders/Order Details/Shipping Labels/WooShipping Create Shipping Labels/WooShipping Package and Rate Selection/WooShippingAddPackageView.swift @@ -109,13 +109,17 @@ struct WooShippingAddPackageView: View { packageType = option } label: { Text(option.name) - .font(.body) + .bodyStyle() + if packageType == option { + Image(uiImage: .checkmarkStyledImage) + } } } } label: { HStack { // text Text(packageType.name) + .bodyStyle() // arrows Spacer() Image(systemName: "chevron.up.chevron.down") @@ -186,7 +190,7 @@ struct WooShippingAddPackageDimensionView: View { HStack { TextField("", text: $fieldValue) .keyboardType(.decimalPad) - .font(.body) + .bodyStyle() .focused($fieldFocused) Text("cm") .font(.subheadline)