Port changes from WordPressAuthenticator Woo Brand Update PR to project

When wordpress-mobile/WordPressAuthenticator-iOS#867
was merged, I had already started working on folding
WordPressAuthenticator and didn't sync with the team about it.

This commit picks all the changes from that PR and copies them in one go
into the local version of the WordPressAuthenticator codebase.

Author: mokagio

WooCommerce/WordPressAuthenticator/Authenticator/WordPressAuthenticatorStyles.swift

@@ -107,6 +107,12 @@ public struct WordPressAuthenticatorStyle {
     ///
     public let prologueSecondaryButtonStyle: NUXButtonStyle?
 
+    /// Style: tertiary button on the prologue view
+    /// When `nil` it will use the default link style
+    /// Defaults to `nil`
+    ///
+    public let prologueTertiaryButtonStyle: NUXButtonStyle?
+
     /// Style: prologue top container child view controller
     /// When nil, `LoginProloguePageViewController` is displayed in the top container
     ///
@@ -163,6 +169,7 @@ public struct WordPressAuthenticatorStyle {
                 prologueButtonsBlurEffect: UIBlurEffect? = nil,
                 prologuePrimaryButtonStyle: NUXButtonStyle? = nil,
                 prologueSecondaryButtonStyle: NUXButtonStyle? = nil,
+                prologueTertiaryButtonStyle: NUXButtonStyle? = nil,
                 prologueTopContainerChildViewController: @autoclosure @escaping () -> UIViewController? = nil,
                 statusBarStyle: UIStatusBarStyle = .lightContent,
                 orDividerSeparatorColor: UIColor = .tertiaryLabel,
@@ -200,6 +207,7 @@ public struct WordPressAuthenticatorStyle {
         self.prologueButtonsBlurEffect = prologueButtonsBlurEffect
         self.prologuePrimaryButtonStyle = prologuePrimaryButtonStyle
         self.prologueSecondaryButtonStyle = prologueSecondaryButtonStyle
+        self.prologueTertiaryButtonStyle = prologueTertiaryButtonStyle
         self.prologueTopContainerChildViewController = prologueTopContainerChildViewController
         self.statusBarStyle = statusBarStyle
         self.orDividerSeparatorColor = orDividerSeparatorColor
@@ -250,6 +258,10 @@ public struct WordPressAuthenticatorUnifiedStyle {
     /// Style: optional auth Prologue view background image
     public let prologueBackgroundImage: UIImage?
 
+    /// Style: optional resizing policy for the prologue background image
+    ///
+    public let prologueBackgroundScaleMode: UIView.ContentMode
+
     /// Style: optional blur effect for the buttons view
     public let prologueButtonsBlurEffect: UIBlurEffect?
 
@@ -279,6 +291,7 @@ public struct WordPressAuthenticatorUnifiedStyle {
                 prologueButtonsBackgroundColor: UIColor = .clear,
                 prologueViewBackgroundColor: UIColor? = nil,
                 prologueBackgroundImage: UIImage? = nil,
+                prologueBackgroundScaleMode: UIView.ContentMode = .scaleToFill,
                 prologueButtonsBlurEffect: UIBlurEffect? = nil,
                 statusBarStyle: UIStatusBarStyle = .default,
                 navBarBackgroundColor: UIColor,
@@ -295,6 +308,7 @@ public struct WordPressAuthenticatorUnifiedStyle {
         self.prologueButtonsBackgroundColor = prologueButtonsBackgroundColor
         self.prologueViewBackgroundColor = prologueViewBackgroundColor ?? viewControllerBackgroundColor
         self.prologueBackgroundImage = prologueBackgroundImage
+        self.prologueBackgroundScaleMode = prologueBackgroundScaleMode
         self.prologueButtonsBlurEffect = prologueButtonsBlurEffect
         self.statusBarStyle = statusBarStyle
         self.navBarBackgroundColor = navBarBackgroundColor

WooCommerce/WordPressAuthenticator/NUX/Button/NUXStackedButtonsViewController.swift

@@ -150,13 +150,18 @@ private extension NUXStackedButtonsViewController {
         buttons = []
         topStackView?.arrangedSubviews.forEach({ $0.removeFromSuperview() })
         bottomStackView?.arrangedSubviews.forEach({ $0.removeFromSuperview() })
+        topStackView?.isHidden = true
+        bottomStackView?.isHidden = true
+
         for config in buttonConfigs {
             let button = NUXButton()
             switch config.stackView {
             case .top:
                 topStackView?.addArrangedSubview(button)
+                topStackView?.isHidden = false
             case .bottom:
                 bottomStackView?.addArrangedSubview(button)
+                bottomStackView?.isHidden = false
             }
             button.configure(withConfig: config.config, and: config.style)
             buttons.append(button)

WooCommerce/WordPressAuthenticator/Signin/LoginPrologueViewController.swift

@@ -12,11 +12,6 @@ class LoginPrologueViewController: LoginViewController {
     var showCancel = false
 
     @IBOutlet private weak var buttonContainerView: UIView!
-    /// Blur effect on button container view
-    ///
-    private var blurEffect: UIBlurEffect.Style {
-        return .systemChromeMaterial
-    }
 
     /// Constraints on the button view container.
     /// Used to adjust the button width in unified views.
@@ -65,12 +60,10 @@ class LoginPrologueViewController: LoginViewController {
             topContainerView.pinSubviewToAllEdges(topContainerChildViewController.view)
         }
 
+        setupViewBackground()
         createButtonViewController()
 
         defaultButtonViewMargin = buttonViewLeadingConstraint?.constant ?? 0
-        if let backgroundImage = WordPressAuthenticator.shared.unifiedStyle?.prologueBackgroundImage {
-            view.layer.contents = backgroundImage.cgImage
-        }
     }
 
     override func styleBackground() {
@@ -265,6 +258,7 @@ class LoginPrologueViewController: LoginViewController {
 
         let primaryButtonStyle = WordPressAuthenticator.shared.style.prologuePrimaryButtonStyle
         let secondaryButtonStyle = WordPressAuthenticator.shared.style.prologueSecondaryButtonStyle
+        let tertiaryButtonStyle = WordPressAuthenticator.shared.style.prologueTertiaryButtonStyle ?? NUXButtonStyle.linkButtonStyle
 
         setButtonViewMargins(forWidth: view.frame.width)
         let displayStrings = WordPressAuthenticator.shared.displayStrings
@@ -323,7 +317,7 @@ class LoginPrologueViewController: LoginViewController {
                                  isPrimary: false,
                                  configureBodyFontForTitle: true,
                                  accessibilityIdentifier: "Prologue Site Creation Guide button",
-                                 style: NUXButtonStyle.linkButtonStyle,
+                                 style: tertiaryButtonStyle,
                                  onTap: siteCreationGuideCallback())
         }()
 
@@ -385,26 +379,27 @@ class LoginPrologueViewController: LoginViewController {
         }
     }
 
+    private func setupViewBackground() {
+        if let prologueViewBackgroundColor = WordPressAuthenticator.shared.unifiedStyle?.prologueViewBackgroundColor {
+            view.backgroundColor = prologueViewBackgroundColor
+        }
+
+        if let backgroundImage = WordPressAuthenticator.shared.unifiedStyle?.prologueBackgroundImage {
+            let backgroundImageView = UIImageView(image: backgroundImage)
+            backgroundImageView.contentMode = WordPressAuthenticator.shared.unifiedStyle?.prologueBackgroundScaleMode ?? .scaleAspectFill
+            backgroundImageView.translatesAutoresizingMaskIntoConstraints = false
+            view.insertSubview(backgroundImageView, at: 0)
+            view.pinSubviewToAllEdges(backgroundImageView)
+		}
+    }
+
     private func setButtonViewControllerBackground() {
         // Fallback to setting the button background color to clear so the blur effect blurs the Prologue background color.
         let buttonsBackgroundColor = WordPressAuthenticator.shared.unifiedStyle?.prologueButtonsBackgroundColor ?? .clear
         buttonViewController?.backgroundColor = buttonsBackgroundColor
         buttonBackgroundView?.backgroundColor = buttonsBackgroundColor
         stackedButtonsViewController?.backgroundColor = buttonsBackgroundColor
 
-        /// If host apps provide a background color for the prologue buttons:
-        /// 1. Hide the blur effect
-        /// 2. Set the background color of the view controller to prologueViewBackgroundColor
-        let prologueViewBackgroundColor = WordPressAuthenticator.shared.unifiedStyle?.prologueViewBackgroundColor ?? .clear
-
-        guard prologueViewBackgroundColor.cgColor == buttonsBackgroundColor.cgColor else {
-            buttonBlurEffectView.effect = UIBlurEffect(style: blurEffect)
-            return
-        }
-        // do not set background color if we've set a background image earlier
-        if WordPressAuthenticator.shared.unifiedStyle?.prologueBackgroundImage == nil {
-            view.backgroundColor = prologueViewBackgroundColor
-        }
         // if a blur effect for the buttons was passed, use it; otherwise hide the view.
         guard let blurEffect = WordPressAuthenticator.shared.unifiedStyle?.prologueButtonsBlurEffect else {
             buttonBlurEffectView.isHidden = true