Skip to content

Commit be38554

Browse files
authored
Merge pull request #8059 from woocommerce/issue/8039-add-bottom-sheet-subtitle
Products Onboarding: Bottom Sheets Titles
2 parents 8bb50fe + 2da9316 commit be38554

File tree

11 files changed

+56
-26
lines changed

11 files changed

+56
-26
lines changed

WooCommerce/Classes/ViewRelated/BottomSheet/ListSelector/BottomSheetListSelectorSectionHeaderView.swift

Lines changed: 15 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,17 +3,20 @@ import UIKit
33
/// Renders a section header for the bottom sheet list selector with a main title label.
44
///
55
final class BottomSheetListSelectorSectionHeaderView: UITableViewHeaderFooterView {
6-
@IBOutlet private weak var label: UILabel!
6+
@IBOutlet private weak var title: UILabel!
7+
@IBOutlet private weak var subtitle: UILabel!
78

89
override func awakeFromNib() {
910
super.awakeFromNib()
1011

1112
configureMainView()
12-
configureLabel()
13+
configureTitle()
14+
configureSubtitle()
1315
}
1416

15-
func configure(text: String?) {
16-
label.text = text
17+
func configure(title: String?, subtitle: String?) {
18+
self.title.text = title
19+
self.subtitle.text = subtitle
1720
}
1821
}
1922

@@ -22,8 +25,13 @@ private extension BottomSheetListSelectorSectionHeaderView {
2225
contentView.backgroundColor = .listForeground
2326
}
2427

25-
func configureLabel() {
26-
label.applySubheadlineStyle()
27-
label.textColor = .systemColor(.secondaryLabel)
28+
func configureTitle() {
29+
title.applyHeadlineStyle()
30+
title.textColor = .systemColor(.label)
31+
}
32+
33+
func configureSubtitle() {
34+
subtitle.applySubheadlineStyle()
35+
subtitle.textColor = .systemColor(.secondaryLabel)
2836
}
2937
}

WooCommerce/Classes/ViewRelated/BottomSheet/ListSelector/BottomSheetListSelectorSectionHeaderView.xib

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<?xml version="1.0" encoding="UTF-8"?>
2-
<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="20037" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES">
2+
<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="21225" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES">
33
<device id="retina6_1" orientation="portrait" appearance="light"/>
44
<dependencies>
55
<deployment identifier="iOS"/>
6-
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="20020"/>
6+
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="21207"/>
77
<capability name="Safe area layout guides" minToolsVersion="9.0"/>
88
<capability name="System colors in document resources" minToolsVersion="11.0"/>
99
<capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
@@ -15,8 +15,14 @@
1515
<rect key="frame" x="0.0" y="0.0" width="414" height="896"/>
1616
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
1717
<subviews>
18+
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="yNN-dG-kuA">
19+
<rect key="frame" x="16" y="27" width="382" height="21"/>
20+
<fontDescription key="fontDescription" type="system" pointSize="17"/>
21+
<nil key="textColor"/>
22+
<nil key="highlightedColor"/>
23+
</label>
1824
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="MUy-0K-UzK">
19-
<rect key="frame" x="16" y="56" width="382" height="794"/>
25+
<rect key="frame" x="16" y="60" width="382" height="790"/>
2026
<fontDescription key="fontDescription" type="system" pointSize="17"/>
2127
<nil key="textColor"/>
2228
<nil key="highlightedColor"/>
@@ -28,11 +34,15 @@
2834
<constraint firstItem="MUy-0K-UzK" firstAttribute="leading" secondItem="vUN-kp-3ea" secondAttribute="leading" constant="16" id="GnY-De-657"/>
2935
<constraint firstItem="vUN-kp-3ea" firstAttribute="trailing" secondItem="MUy-0K-UzK" secondAttribute="trailing" priority="999" constant="16" id="MnQ-Ob-Wp4"/>
3036
<constraint firstItem="vUN-kp-3ea" firstAttribute="bottom" secondItem="MUy-0K-UzK" secondAttribute="bottom" constant="12" id="WDE-us-ZdJ"/>
37+
<constraint firstItem="MUy-0K-UzK" firstAttribute="top" secondItem="yNN-dG-kuA" secondAttribute="bottom" constant="12" id="nHE-te-rHP"/>
3138
<constraint firstItem="MUy-0K-UzK" firstAttribute="top" secondItem="vUN-kp-3ea" secondAttribute="top" constant="12" id="nmY-jt-bfb"/>
39+
<constraint firstItem="yNN-dG-kuA" firstAttribute="trailing" secondItem="MUy-0K-UzK" secondAttribute="trailing" id="o6t-QX-No4"/>
40+
<constraint firstItem="yNN-dG-kuA" firstAttribute="leading" secondItem="MUy-0K-UzK" secondAttribute="leading" id="wb7-Ze-GOP"/>
3241
</constraints>
3342
<freeformSimulatedSizeMetrics key="simulatedDestinationMetrics"/>
3443
<connections>
35-
<outlet property="label" destination="MUy-0K-UzK" id="Z0t-WU-7ls"/>
44+
<outlet property="subtitle" destination="MUy-0K-UzK" id="L6u-fg-l9X"/>
45+
<outlet property="title" destination="yNN-dG-kuA" id="hOy-NU-gAA"/>
3646
</connections>
3747
<point key="canvasLocation" x="139" y="109"/>
3848
</view>

WooCommerce/Classes/ViewRelated/BottomSheet/ListSelector/BottomSheetListSelectorViewController.swift

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -86,14 +86,14 @@ UIViewController, UITableViewDataSource, UITableViewDelegate where Command.Model
8686
}
8787

8888
func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
89-
guard viewProperties.title != nil else {
89+
guard viewProperties.title != nil || viewProperties.subtitle != nil else {
9090
return nil
9191
}
9292
guard let header = tableView.dequeueReusableHeaderFooterView(withIdentifier: BottomSheetListSelectorSectionHeaderView.reuseIdentifier)
9393
as? BottomSheetListSelectorSectionHeaderView else {
9494
fatalError()
9595
}
96-
header.configure(text: viewProperties.title)
96+
header.configure(title: viewProperties.title, subtitle: viewProperties.subtitle)
9797
return header
9898
}
9999
}
@@ -111,7 +111,7 @@ private extension BottomSheetListSelectorViewController {
111111
tableView.dataSource = self
112112

113113
tableView.rowHeight = UITableView.automaticDimension
114-
tableView.estimatedSectionHeaderHeight = viewProperties.title != nil ? estimatedSectionHeight : .zero
114+
tableView.estimatedSectionHeaderHeight = (viewProperties.title != nil || viewProperties.subtitle != nil) ? estimatedSectionHeight : .zero
115115
tableView.sectionHeaderHeight = UITableView.automaticDimension
116116

117117
tableView.backgroundColor = .listForeground

WooCommerce/Classes/ViewRelated/BottomSheet/ListSelector/BottomSheetListSelectorViewProperties.swift

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,10 @@
22
///
33
struct BottomSheetListSelectorViewProperties {
44
let title: String?
5+
let subtitle: String?
6+
7+
init(title: String? = nil, subtitle: String? = nil) {
8+
self.title = title
9+
self.subtitle = subtitle
10+
}
511
}

WooCommerce/Classes/ViewRelated/Coupons/Add and Edit Coupons/AddEditCoupon.swift

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -73,7 +73,7 @@ struct AddEditCoupon: View {
7373
@State private var showingDiscountType: Bool = false
7474

7575
private var idiom: UIUserInterfaceIdiom { UIDevice.current.userInterfaceIdiom }
76-
private let viewProperties = BottomSheetListSelectorViewProperties(title: Localization.discountTypeSheetTitle)
76+
private let viewProperties = BottomSheetListSelectorViewProperties(subtitle: Localization.discountTypeSheetTitle)
7777

7878
private let categorySelectorConfig = ProductCategorySelector.Configuration.categoriesForCoupons
7979
private let categoryListConfig = ProductCategoryListViewController.Configuration(searchEnabled: true, clearSelectionEnabled: true)

WooCommerce/Classes/ViewRelated/Coupons/CouponListViewController.swift

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -302,7 +302,7 @@ private extension CouponListViewController {
302302

303303
@objc private func displayCouponTypeBottomSheet() {
304304
ServiceLocator.analytics.track(.couponsListCreateTapped)
305-
let viewProperties = BottomSheetListSelectorViewProperties(title: Localization.createCouponAction)
305+
let viewProperties = BottomSheetListSelectorViewProperties(subtitle: Localization.createCouponAction)
306306
let command = DiscountTypeBottomSheetListSelectorCommand(selected: nil) { [weak self] selectedType in
307307
guard let self = self else { return }
308308
self.presentedViewController?.dismiss(animated: true, completion: nil)

WooCommerce/Classes/ViewRelated/Orders/Order Creation/FlowCoordinator/AddOrderCoordinator.swift

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ final class AddOrderCoordinator: Coordinator {
5353
// MARK: Navigation
5454
private extension AddOrderCoordinator {
5555
func presentOrderTypeBottomSheet() {
56-
let viewProperties = BottomSheetListSelectorViewProperties(title: nil)
56+
let viewProperties = BottomSheetListSelectorViewProperties(subtitle: nil)
5757
let command = OrderTypeBottomSheetListSelectorCommand() { selectedBottomSheetOrderType in
5858
self.navigationController.dismiss(animated: true)
5959
self.presentOrderCreationFlow(bottomSheetOrderType: selectedBottomSheetOrderType)

WooCommerce/Classes/ViewRelated/Products/Add Product/AddProductCoordinator.swift

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -86,9 +86,11 @@ private extension AddProductCoordinator {
8686
/// Presents a bottom sheet for users to choose if they want a create a product manually or via a template.
8787
///
8888
func presentProductCreationTypeBottomSheet() {
89-
let title = NSLocalizedString("How do you want to start?",
89+
let title = NSLocalizedString("Add a product",
9090
comment: "Message title of bottom sheet for selecting a template or manual product")
91-
let viewProperties = BottomSheetListSelectorViewProperties(title: title)
91+
let subtitle = NSLocalizedString("How do you want to start?",
92+
comment: "Message subtitle of bottom sheet for selecting a template or manual product")
93+
let viewProperties = BottomSheetListSelectorViewProperties(title: title, subtitle: subtitle)
9294
let command = ProductCreationTypeSelectorCommand { selectedCreationType in
9395
self.trackProductCreationType(selectedCreationType)
9496
self.presentProductTypeBottomSheet(creationType: selectedCreationType)
@@ -100,9 +102,13 @@ private extension AddProductCoordinator {
100102
/// Presents a bottom sheet for users to choose if what kind of product they want to create.
101103
///
102104
func presentProductTypeBottomSheet(creationType: ProductCreationType) {
103-
let title = NSLocalizedString("Select a product type",
104-
comment: "Message title of bottom sheet for selecting a product type to create a product")
105-
let viewProperties = BottomSheetListSelectorViewProperties(title: title)
105+
let title: String? = {
106+
guard creationType == .template else { return nil }
107+
return NSLocalizedString("Choose a template", comment: "Message title of bottom sheet for selecting a template or manual product")
108+
}()
109+
let subtitle = NSLocalizedString("Select a product type",
110+
comment: "Message subtitle of bottom sheet for selecting a product type to create a product")
111+
let viewProperties = BottomSheetListSelectorViewProperties(title: title, subtitle: subtitle)
106112
let command = ProductTypeBottomSheetListSelectorCommand(selected: nil) { selectedBottomSheetProductType in
107113
ServiceLocator.analytics.track(.addProductTypeSelected, withProperties: ["product_type": selectedBottomSheetProductType.productType.rawValue])
108114
self.navigationController.dismiss(animated: true) {

WooCommerce/Classes/ViewRelated/Products/Edit Product/Downloadable Files/File List/ProductDownloadListViewController.swift

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -161,7 +161,7 @@ extension ProductDownloadListViewController {
161161

162162
@objc private func addButtonTapped(_ sender: UIButton) {
163163
let title = Localization.bottomSheetTitle
164-
let viewProperties = BottomSheetListSelectorViewProperties(title: title)
164+
let viewProperties = BottomSheetListSelectorViewProperties(subtitle: title)
165165
let actions = viewModel.bottomSheetActions
166166
let dataSource = DownloadableFileBottomSheetListSelectorCommand(actions: actions) { [weak self] action in
167167
self?.dismiss(animated: true) { [weak self] in

WooCommerce/Classes/ViewRelated/Products/Edit Product/ProductFormViewController.swift

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -713,7 +713,7 @@ private extension ProductFormViewController {
713713
func moreDetailsButtonTapped(button: UIButton) {
714714
let title = NSLocalizedString("Add more details",
715715
comment: "Title of the bottom sheet from the product form to add more product details.")
716-
let viewProperties = BottomSheetListSelectorViewProperties(title: title)
716+
let viewProperties = BottomSheetListSelectorViewProperties(subtitle: title)
717717
let actions = viewModel.actionsFactory.bottomSheetActions()
718718
let dataSource = ProductFormBottomSheetListSelectorCommand(actions: actions) { [weak self] action in
719719
self?.dismiss(animated: true) { [weak self] in
@@ -1151,7 +1151,7 @@ private extension ProductFormViewController {
11511151
func editProductType(cell: UITableViewCell?) {
11521152
let title = NSLocalizedString("Change product type",
11531153
comment: "Message title of bottom sheet for selecting a product type")
1154-
let viewProperties = BottomSheetListSelectorViewProperties(title: title)
1154+
let viewProperties = BottomSheetListSelectorViewProperties(subtitle: title)
11551155
let productType = BottomSheetProductType(productType: viewModel.productModel.productType, isVirtual: viewModel.productModel.virtual)
11561156
let command = ProductTypeBottomSheetListSelectorCommand(selected: productType) { [weak self] (selectedProductType) in
11571157
self?.dismiss(animated: true, completion: nil)

0 commit comments

Comments
 (0)