Merge pull request #8094 from woocommerce/task/contentedgeinsets-deprecated-ios-15

Fix 'contentEdgeInsets' was deprecated in iOS 15.0

Author: iamgabrielma

WooCommerce/Classes/Extensions/UIButton+Helpers.swift

@@ -8,7 +8,13 @@ extension UIButton {
     /// Applies the Primary Button Style: Solid BG!
     ///
     func applyPrimaryButtonStyle() {
-        contentEdgeInsets = Style.defaultEdgeInsets
+        var configuration = UIButton.Configuration.filled()
+        configuration.contentInsets = .init(
+            top: Style.verticalInset,
+            leading: Style.horizontalInset,
+            bottom: Style.verticalInset,
+            trailing: Style.horizontalInset
+        )
         layer.borderColor = UIColor.primaryButtonBorder.cgColor
         layer.borderWidth = Style.defaultBorderWidth
         layer.cornerRadius = Style.defaultCornerRadius
@@ -39,8 +45,14 @@ extension UIButton {
     /// Applies the Secondary Button Style: Clear BG / Bordered Outline
     ///
     func applySecondaryButtonStyle() {
+        var configuration = UIButton.Configuration.filled()
+        configuration.contentInsets = .init(
+            top: Style.verticalInset,
+            leading: Style.horizontalInset,
+            bottom: Style.verticalInset,
+            trailing: Style.horizontalInset
+        )
         backgroundColor = .secondaryButtonBackground
-        contentEdgeInsets = Style.defaultEdgeInsets
         layer.borderColor = UIColor.secondaryButtonBorder.cgColor
         layer.borderWidth = Style.defaultBorderWidth
         layer.cornerRadius = Style.defaultCornerRadius
@@ -71,8 +83,14 @@ extension UIButton {
     /// Applies the Link Button Style: Clear BG / Brand Text Color
     ///
     func applyLinkButtonStyle(enableMultipleLines: Bool = false) {
+        var configuration = UIButton.Configuration.plain()
+        configuration.contentInsets = .init(
+            top: Style.verticalInset,
+            leading: Style.horizontalInset,
+            bottom: Style.verticalInset,
+            trailing: Style.horizontalInset
+        )
         backgroundColor = .clear
-        contentEdgeInsets = Style.defaultEdgeInsets
         tintColor = .accent
         titleLabel?.applyBodyStyle()
         titleLabel?.textAlignment = .natural
@@ -95,8 +113,14 @@ extension UIButton {
     }
 
     func applyPaymentsModalCancelButtonStyle() {
+        var configuration = UIButton.Configuration.plain()
+        configuration.contentInsets = .init(
+            top: Style.verticalInset,
+            leading: Style.horizontalInset,
+            bottom: Style.verticalInset,
+            trailing: Style.horizontalInset
+        )
         backgroundColor = .tertiarySystemBackground
-        contentEdgeInsets = Style.defaultEdgeInsets
         layer.borderColor = UIColor.secondaryButtonBorder.cgColor
         layer.borderWidth = Style.defaultBorderWidth
         layer.cornerRadius = Style.defaultCornerRadius
@@ -147,7 +171,15 @@ extension UIButton {
     private func enableMultipleLines() {
         titleLabel?.lineBreakMode = .byWordWrapping
         if let label = titleLabel {
-            pinSubviewToAllEdgeMargins(label)
+            if self.subviews.contains(where: { $0 == label }) {
+                pinSubviewToAllEdgeMargins(label)
+            } else {
+                DDLogWarn("""
+                    Failed attempt to pin button's title to the edges.
+                    This is likely because the custom button title label was not added to its view hierarchy.
+                    """
+                )
+            }
         }
     }
 }
@@ -160,6 +192,7 @@ private extension UIButton {
     struct Style {
         static let defaultCornerRadius = CGFloat(8.0)
         static let defaultBorderWidth = CGFloat(1.0)
-        static let defaultEdgeInsets = UIEdgeInsets(top: 12, left: 22, bottom: 12, right: 22)
+        static let verticalInset = CGFloat(12)
+        static let horizontalInset = CGFloat(22)
     }
 }

WooCommerce/Classes/ViewRelated/Orders/Order Details/Customer Section/CustomerNoteTableViewCell.swift

@@ -128,7 +128,9 @@ private extension CustomerNoteTableViewCell {
         addButton.setImage(.plusImage, for: .normal)
         addButton.contentHorizontalAlignment = .leading
         addButton.contentVerticalAlignment = .bottom
-        addButton.contentEdgeInsets = .zero
+        var configuration = UIButton.Configuration.plain()
+        configuration.contentInsets = .init(.zero)
+        addButton.configuration = configuration
         addButton.distributeTitleAndImage(spacing: Constants.buttonTitleAndImageSpacing)
         addButton.addTarget(self, action: #selector(addButtonTapped), for: .touchUpInside)
     }

WooCommerce/Classes/ViewRelated/Orders/Order Filters/FilteredOrdersHeaderBar.swift

@@ -55,7 +55,8 @@ private extension FilteredOrdersHeaderBar {
         String.localizedStringWithFormat(Localization.buttonWithActiveFilters, numberOfFilters)
 
         filterButton.setTitle(title, for: .normal)
-        filterButton.contentEdgeInsets = .zero
+        var configuration = UIButton.Configuration.filled()
+        configuration.contentInsets = .init(.zero)
         filterButton.accessibilityIdentifier = "orders-filter-button"
     }
 

WooCommerce/Classes/ViewRelated/ReusableViews/EmptyStateViewController/EmptyStateViewController.swift

@@ -307,7 +307,8 @@ private extension EmptyStateViewController {
         case .withSupportRequest(_, _, _, let buttonTitle, _):
             actionButton.isHidden = false
             actionButton.applyLinkButtonStyle()
-            actionButton.contentEdgeInsets = .zero
+            var configuration = UIButton.Configuration.filled()
+            configuration.contentInsets = .init(.zero)
             actionButton.setTitle(buttonTitle, for: .normal)
         }
     }

WooCommerce/Classes/ViewRelated/ReusableViews/VerticalButton.swift

@@ -10,10 +10,7 @@ class VerticalButton: UIButton {
 
     override func awakeFromNib() {
         super.awakeFromNib()
-
-        contentEdgeInsets = Settings.edgeInsets
-        layer.cornerRadius = Settings.cornerRadius
-        titleLabel?.font = UIFont.footnote
+        configureButton()
     }
 
     override func layoutSubviews() {
@@ -42,6 +39,18 @@ class VerticalButton: UIButton {
                                   width: titleSize.width,
                                   height: titleSize.height).integral
     }
+
+    private func configureButton() {
+        var configuration = UIButton.Configuration.filled()
+        configuration.contentInsets = .init(
+            top: .zero,
+            leading: Settings.inset,
+            bottom: .zero,
+            trailing: Settings.inset
+        )
+        layer.cornerRadius = Settings.cornerRadius
+        titleLabel?.font = UIFont.footnote
+    }
 }
 
 
@@ -51,7 +60,7 @@ private extension VerticalButton {
 
     enum Settings {
         static let cornerRadius     = CGFloat(10)
-        static let edgeInsets       = UIEdgeInsets(top: 5, left: 0, bottom: 5, right: 0)
+        static let inset            = CGFloat(5)
         static let labelPaddingTop  = CGFloat(2)
     }
 }

WooCommerce/Classes/ViewRelated/Survey/SurveySubmittedViewController.swift

@@ -93,7 +93,9 @@ private extension SurveySubmittedViewController {
 
         contactUsButton.applyLinkButtonStyle()
         contactUsButton.titleLabel?.applyCalloutStyle()
-        contactUsButton.contentEdgeInsets = .zero
+        var contactUsConfiguration = UIButton.Configuration.plain()
+        contactUsConfiguration.contentInsets = .init(.zero)
+        contactUsButton.configuration = contactUsConfiguration
     }
 
     /// Apply the correspondent localized texts to each component