Merge pull request #1476 from stripe-ios/kg-smallpolish

Financial Connections: More polish around Native

StripeFinancialConnections/StripeFinancialConnections.xcodeproj/project.pbxproj

@@ -122,6 +122,7 @@
 		6A9117EE287F535C007633D4 /* DataAccessNoticeView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 6A9117ED287F535C007633D4 /* DataAccessNoticeView.swift */; };
 		6A99EF6228E51F1F00C76293 /* LinkingAccountsLoadingView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 6A99EF6128E51F1F00C76293 /* LinkingAccountsLoadingView.swift */; };
 		6A99EF6428E5CFBD00C76293 /* AccountNumberRetrievalErrorView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 6A99EF6328E5CFBD00C76293 /* AccountNumberRetrievalErrorView.swift */; };
+		6A99EF6628E708D200C76293 /* Button+Extensions.swift in Sources */ = {isa = PBXBuildFile; fileRef = 6A99EF6528E708D200C76293 /* Button+Extensions.swift */; };
 		6ABE2D04285A2DEF0064B3A4 /* ConsentBodyView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 6ABE2D03285A2DEF0064B3A4 /* ConsentBodyView.swift */; };
 		6ABE2D06285B72A30064B3A4 /* ClickableLabel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 6ABE2D05285B72A30064B3A4 /* ClickableLabel.swift */; };
 		6ABE2D0A285B7BA20064B3A4 /* SFSafariViewController+Extensions.swift in Sources */ = {isa = PBXBuildFile; fileRef = 6ABE2D09285B7BA20064B3A4 /* SFSafariViewController+Extensions.swift */; };
@@ -323,6 +324,7 @@
 		6A9117ED287F535C007633D4 /* DataAccessNoticeView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = DataAccessNoticeView.swift; sourceTree = "<group>"; };
 		6A99EF6128E51F1F00C76293 /* LinkingAccountsLoadingView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = LinkingAccountsLoadingView.swift; sourceTree = "<group>"; };
 		6A99EF6328E5CFBD00C76293 /* AccountNumberRetrievalErrorView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AccountNumberRetrievalErrorView.swift; sourceTree = "<group>"; };
+		6A99EF6528E708D200C76293 /* Button+Extensions.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "Button+Extensions.swift"; sourceTree = "<group>"; };
 		6ABE2D03285A2DEF0064B3A4 /* ConsentBodyView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ConsentBodyView.swift; sourceTree = "<group>"; };
 		6ABE2D05285B72A30064B3A4 /* ClickableLabel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ClickableLabel.swift; sourceTree = "<group>"; };
 		6ABE2D09285B7BA20064B3A4 /* SFSafariViewController+Extensions.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "SFSafariViewController+Extensions.swift"; sourceTree = "<group>"; };
@@ -758,6 +760,7 @@
 				6A4FA13828E11B3D00F07D42 /* CloseConfirmationAlertHandler.swift */,
 				6A4FA14828E391ED00F07D42 /* InstitutionIconView.swift */,
 				6A4FA14C28E477EA00F07D42 /* SpinnerIconView.swift */,
+				6A99EF6528E708D200C76293 /* Button+Extensions.swift */,
 			);
 			path = Shared;
 			sourceTree = "<group>";
@@ -959,6 +962,7 @@
 				6A7C861728D273940025B8DF /* SuccessIconView.swift in Sources */,
 				6A9117E5287CA2A5007633D4 /* ConsentModel.swift in Sources */,
 				6A1E299E289DB83E00F99E9D /* AccountPickerDataSource.swift in Sources */,
+				6A99EF6628E708D200C76293 /* Button+Extensions.swift in Sources */,
 				6AD448B928C25F85002CABB0 /* ResetFlowDataSource.swift in Sources */,
 				6A59FCA428B70C0200F0F33E /* ManualEntryDataSource.swift in Sources */,
 				6A1BA4AC2858D5F100759697 /* ConsentViewController.swift in Sources */,

StripeFinancialConnections/StripeFinancialConnections/Source/Native/AccountPicker/AccountPickerFooterView.swift

@@ -19,14 +19,7 @@ final class AccountPickerFooterView: UIView {
     private let didSelectLinkAccounts: () -> Void
 
     private lazy var linkAccountsButton: Button = {
-        let linkAccountsButton = Button(
-            configuration: {
-                var linkAccountsButtonConfiguration = Button.Configuration.primary()
-                linkAccountsButtonConfiguration.font = .stripeFont(forTextStyle: .bodyEmphasized)
-                linkAccountsButtonConfiguration.backgroundColor = .textBrand
-                return linkAccountsButtonConfiguration
-            }()
-        )
+        let linkAccountsButton = Button(configuration: .financialConnectionsPrimary)
         linkAccountsButton.addTarget(self, action: #selector(didSelectLinkAccountsButton), for: .touchUpInside)
         linkAccountsButton.translatesAutoresizingMaskIntoConstraints = false
         NSLayoutConstraint.activate([
@@ -74,6 +67,7 @@ final class AccountPickerFooterView: UIView {
 
     func didSelectAccounts(count numberOfAccountsSelected: Int) {
         linkAccountsButton.isEnabled = (numberOfAccountsSelected > 0)
+        linkAccountsButton.alpha = linkAccountsButton.isEnabled ? 1.0 : 0.5
 
         if numberOfAccountsSelected == 0 {
             if singleAccount {

StripeFinancialConnections/StripeFinancialConnections/Source/Native/AccountPicker/AccountPickerNoAccountEligibleErrorView.swift

@@ -67,7 +67,14 @@ final class AccountPickerNoAccountEligibleErrorView: UIView {
         }()
 
         let reusableInformationView = ReusableInformationView(
-            iconType: .icon, // TODO(kgaidis): set institution image with exclamation error
+            iconType: .view({
+                let institutionIconView = InstitutionIconView(
+                    size: .large,
+                    showWarning: true
+                )
+                institutionIconView.setImageUrl(institution.smallImageUrl)
+                return institutionIconView
+            }()),
             title: {
                 if institutionSkipAccountSelection {
                     if numberOfIneligibleAccounts == 1 {

StripeFinancialConnections/StripeFinancialConnections/Source/Native/Consent/ConsentFooterView.swift

@@ -17,10 +17,7 @@ class ConsentFooterView: UIView {
     private let didSelectManuallyVerify: (() -> Void)?
 
     private lazy var agreeButton: StripeUICore.Button = {
-        var agreeButtonConfiguration = Button.Configuration.primary()
-        agreeButtonConfiguration.font = .stripeFont(forTextStyle: .bodyEmphasized)
-        agreeButtonConfiguration.backgroundColor = .textBrand
-        let agreeButton = Button(configuration: agreeButtonConfiguration)
+        let agreeButton = Button(configuration: .financialConnectionsPrimary)
         agreeButton.title = "Agree"
         agreeButton.addTarget(self, action: #selector(didSelectAgreeButton), for: .touchUpInside)
         agreeButton.translatesAutoresizingMaskIntoConstraints = false

StripeFinancialConnections/StripeFinancialConnections/Source/Native/InstitutionPicker/FeaturedInstitutionGridView.swift

@@ -10,6 +10,7 @@ import UIKit
 @_spi(STP) import StripeUICore
 
 @available(iOS 13.0, *)
+@available(iOSApplicationExtension, unavailable)
 protocol FeaturedInstitutionGridViewDelegate: AnyObject {
     func featuredInstitutionGridView(_ view: FeaturedInstitutionGridView, didSelectInstitution institution: FinancialConnectionsInstitution)
 }
@@ -19,6 +20,7 @@ private enum Section {
 }
 
 @available(iOS 13.0, *)
+@available(iOSApplicationExtension, unavailable)
 class FeaturedInstitutionGridView: UIView {
 
     private let horizontalPadding: CGFloat = 24.0
@@ -86,6 +88,7 @@ class FeaturedInstitutionGridView: UIView {
 // MARK: - <UICollectionViewDelegate>
 
 @available(iOS 13.0, *)
+@available(iOSApplicationExtension, unavailable)
 extension FeaturedInstitutionGridView: UICollectionViewDelegate {
 
     func collectionView(
@@ -103,6 +106,7 @@ extension FeaturedInstitutionGridView: UICollectionViewDelegate {
 import SwiftUI
 
 @available(iOS 13.0, *)
+@available(iOSApplicationExtension, unavailable)
 private struct FeaturedInstitutionGridViewUIViewRepresentable: UIViewRepresentable {
 
     func makeUIView(context: Context) -> FeaturedInstitutionGridView {
@@ -117,8 +121,10 @@ private struct FeaturedInstitutionGridViewUIViewRepresentable: UIViewRepresentab
     }
 }
 
+@available(iOS 13.0, *)
+@available(iOSApplicationExtension, unavailable)
 struct FeaturedInstitutionGridView_Previews: PreviewProvider {
-    @available(iOS 13.0.0, *)
+
     static var previews: some View {
         VStack {
             FeaturedInstitutionGridViewUIViewRepresentable()

StripeFinancialConnections/StripeFinancialConnections/Source/Native/InstitutionPicker/InstitutionPicker.swift

@@ -69,18 +69,26 @@ class InstitutionPicker: UIViewController {
         contentContainerView.backgroundColor = .clear
         return contentContainerView
     }()
+    private var _featuredInstitutionGridView: Any? = nil
     @available(iOS 13.0, *)
-    private lazy var featuredInstitutionGridView: FeaturedInstitutionGridView = {
-        let featuredInstitutionGridView = FeaturedInstitutionGridView()
-        featuredInstitutionGridView.delegate = self
-        return featuredInstitutionGridView
-    }()
+    private var featuredInstitutionGridView: FeaturedInstitutionGridView {
+        if _featuredInstitutionGridView == nil {
+            let featuredInstitutionGridView = FeaturedInstitutionGridView()
+            featuredInstitutionGridView.delegate = self
+            _featuredInstitutionGridView = featuredInstitutionGridView
+        }
+        return _featuredInstitutionGridView as! FeaturedInstitutionGridView
+    }
+    private var _institutionSearchTableView: Any? = nil
     @available(iOS 13.0, *)
-    private lazy var institutionSearchTableView: InstitutionSearchTableView = {
-        let institutionSearchTableView = InstitutionSearchTableView(allowManualEntry: dataSource.manifest.allowManualEntry)
-        institutionSearchTableView.delegate = self
-        return institutionSearchTableView
-    }()
+    private var institutionSearchTableView: InstitutionSearchTableView {
+        if _institutionSearchTableView == nil {
+            let institutionSearchTableView = InstitutionSearchTableView(allowManualEntry: dataSource.manifest.allowManualEntry)
+            institutionSearchTableView.delegate = self
+            _institutionSearchTableView = institutionSearchTableView
+        }
+        return _institutionSearchTableView as! InstitutionSearchTableView
+    }
     // Only used for iOS12 fallback where we don't ahve the diffable datasource
     private lazy var institutions: [FinancialConnectionsInstitution]? = nil
 

StripeFinancialConnections/StripeFinancialConnections/Source/Native/ManualEntry/ManualEntryFooterView.swift

@@ -14,14 +14,7 @@ final class ManualEntryFooterView: UIView {
     private let didSelectContinue: () -> Void
 
     private(set) lazy var continueButton: Button = {
-        let continueButton = Button(
-            configuration: {
-                var continueButtonConfiguration = Button.Configuration.primary()
-                continueButtonConfiguration.font = .stripeFont(forTextStyle: .bodyEmphasized)
-                continueButtonConfiguration.backgroundColor = .textBrand
-                return continueButtonConfiguration
-            }()
-        )
+        let continueButton = Button(configuration: .financialConnectionsPrimary)
         continueButton.title = "Continue" // TODO: replace with String.Localized.continue when we localize
         continueButton.addTarget(self, action: #selector(didSelectContinueButton), for: .touchUpInside)
         continueButton.translatesAutoresizingMaskIntoConstraints = false

StripeFinancialConnections/StripeFinancialConnections/Source/Native/ManualEntry/ManualEntryViewController.swift

@@ -99,6 +99,7 @@ final class ManualEntryViewController: UIViewController {
 
     private func adjustContinueButtonStateIfNeeded() {
         footerView.continueButton.isEnabled = (manualEntryFormView.routingAndAccountNumber != nil)
+        footerView.continueButton.alpha = footerView.continueButton.isEnabled ? 1.0 : 0.5
     }
 }
 

StripeFinancialConnections/StripeFinancialConnections/Source/Native/ManualEntrySuccess/ManualEntrySuccessViewController.swift

@@ -36,6 +36,7 @@ final class ManualEntrySuccessViewController: UIViewController {
     override func viewDidLoad() {
         super.viewDidLoad()
         view.backgroundColor = .customBackgroundColor
+        navigationItem.hidesBackButton = true
 
         let paneWithHeaderLayoutView = PaneWithHeaderLayoutView(
             icon: .view(SuccessIconView()),
@@ -66,14 +67,7 @@ final class ManualEntrySuccessViewController: UIViewController {
 // MARK: - Helpers
 
 private func CreateFooterView(_ buttonTarget: ManualEntrySuccessViewController) -> UIView {
-    let doneButton = Button(
-        configuration: {
-            var doneButtonConfiguration = Button.Configuration.primary()
-            doneButtonConfiguration.font = .stripeFont(forTextStyle: .bodyEmphasized)
-            doneButtonConfiguration.backgroundColor = .textBrand
-            return doneButtonConfiguration
-        }()
-    )
+    let doneButton = Button(configuration: .financialConnectionsPrimary)
     doneButton.title = "Done" // TODO: replace with UIButton.doneButtonTitle once the SDK is localized
     doneButton.addTarget(
         buttonTarget,

StripeFinancialConnections/StripeFinancialConnections/Source/Native/PartnerAuth/PrepaneView.swift

@@ -52,12 +52,7 @@ final class PrepaneView: UIView {
     }
 
     private func createFooterView(partnerName: String?) -> UIView {
-        let continueButton = Button(configuration: {
-            var continueButtonConfiguration = Button.Configuration.primary()
-            continueButtonConfiguration.font = .stripeFont(forTextStyle: .bodyEmphasized)
-            continueButtonConfiguration.backgroundColor = .textBrand
-            return continueButtonConfiguration
-        }())
+        let continueButton = Button(configuration: .financialConnectionsPrimary)
         continueButton.title = "Continue" // TODO: when Financial Connections starts supporting localization, change this to `String.Localized.continue`
         continueButton.addTarget(self, action: #selector(didSelectContinueButton), for: .touchUpInside)
         continueButton.translatesAutoresizingMaskIntoConstraints = false

StripeFinancialConnections/StripeFinancialConnections/Source/Native/Shared/Button+Extensions.swift

@@ -0,0 +1,32 @@
+//
+//  Button+Extensions.swift
+//  StripeFinancialConnections
+//
+//  Created by Krisjanis Gaidis on 9/30/22.
+//
+
+import Foundation
+@_spi(STP) import StripeUICore
+
+extension Button.Configuration {
+    static var financialConnectionsPrimary: Button.Configuration {
+        var primaryButtonConfiguration = Button.Configuration.primary()
+        primaryButtonConfiguration.font = .stripeFont(forTextStyle: .bodyEmphasized)
+        primaryButtonConfiguration.backgroundColor = .textBrand
+        primaryButtonConfiguration.foregroundColor = .white
+        // disabed state is shown by making the whole button 0.5 opacity
+        // we can't make `backgroundColor` and foregroundColor` be 0.5 opacity
+        // because it causes color blending issues
+        primaryButtonConfiguration.disabledBackgroundColor = primaryButtonConfiguration.backgroundColor
+        primaryButtonConfiguration.disabledForegroundColor = primaryButtonConfiguration.foregroundColor
+        return primaryButtonConfiguration
+    }
+
+    static var financialConnectionsSecondary: Button.Configuration {
+        var secondaryButtonConfiguration = Button.Configuration.secondary()
+        secondaryButtonConfiguration.font = .stripeFont(forTextStyle: .bodyEmphasized)
+        secondaryButtonConfiguration.foregroundColor = .textSecondary
+        secondaryButtonConfiguration.backgroundColor = .borderNeutral
+        return secondaryButtonConfiguration
+    }
+}

StripeFinancialConnections/StripeFinancialConnections/Source/Native/Shared/DataAccessNoticeView.swift

@@ -90,10 +90,7 @@ final class DataAccessNoticeView: UIView {
     }
 
     private func createFooterView() -> UIView {
-        var okButtonConfiguration = Button.Configuration.primary()
-        okButtonConfiguration.font = .stripeFont(forTextStyle: .bodyEmphasized)
-        okButtonConfiguration.backgroundColor = .textBrand
-        let okButton = Button(configuration: okButtonConfiguration)
+        let okButton = Button(configuration: .financialConnectionsPrimary)
         okButton.title = "OK"
 
         okButton.addTarget(self, action: #selector(didSelectOK), for: .touchUpInside)

StripeFinancialConnections/StripeFinancialConnections/Source/Native/Shared/ReusableInformationView.swift

@@ -14,7 +14,6 @@ import UIKit
 final class ReusableInformationView: UIView {
 
     enum IconType {
-        case icon
         case view(UIView)
         case loading
     }
@@ -72,16 +71,6 @@ private func CreateIconView(iconType: ReusableInformationView.IconType) -> UIVie
     switch iconType {
     case .view(let iconView):
         return iconView
-    case .icon:
-        let iconContainerView = UIView()
-        iconContainerView.backgroundColor = .textDisabled
-        iconContainerView.layer.cornerRadius = 4 // TODO(kgaidis): add support for icons when we decide how they are done...
-        iconContainerView.translatesAutoresizingMaskIntoConstraints = false
-        NSLayoutConstraint.activate([
-            iconContainerView.widthAnchor.constraint(equalToConstant: 40),
-            iconContainerView.heightAnchor.constraint(equalToConstant: 40),
-        ])
-        return iconContainerView
     case .loading:
         return SpinnerIconView()
     }
@@ -101,15 +90,7 @@ private func CreateFooterView(
     footerStackView.axis = .vertical
     footerStackView.spacing = 12
     if let secondaryButtonConfiguration = secondaryButtonConfiguration {
-        let secondaryButton = Button(
-            configuration: {
-                var continueButtonConfiguration = Button.Configuration.secondary()
-                continueButtonConfiguration.font = .stripeFont(forTextStyle: .bodyEmphasized)
-                continueButtonConfiguration.foregroundColor = .textSecondary
-                continueButtonConfiguration.backgroundColor = .borderNeutral
-                return continueButtonConfiguration
-            }()
-        )
+        let secondaryButton = Button(configuration: .financialConnectionsSecondary)
         secondaryButton.title = secondaryButtonConfiguration.title
         secondaryButton.addTarget(view, action: #selector(ReusableInformationView.didSelectSecondaryButton), for: .touchUpInside)
         secondaryButton.translatesAutoresizingMaskIntoConstraints = false
@@ -119,14 +100,7 @@ private func CreateFooterView(
         footerStackView.addArrangedSubview(secondaryButton)
     }
     if let primaryButtonConfiguration = primaryButtonConfiguration {
-        let primaryButton = Button(
-            configuration: {
-                var continueButtonConfiguration = Button.Configuration.primary()
-                continueButtonConfiguration.font = .stripeFont(forTextStyle: .bodyEmphasized)
-                continueButtonConfiguration.backgroundColor = .textBrand
-                return continueButtonConfiguration
-            }()
-        )
+        let primaryButton = Button(configuration: .financialConnectionsPrimary)
         primaryButton.title = primaryButtonConfiguration.title
         primaryButton.addTarget(view, action: #selector(ReusableInformationView.didSelectPrimaryButton), for: .touchUpInside)
         primaryButton.translatesAutoresizingMaskIntoConstraints = false

StripeFinancialConnections/StripeFinancialConnections/Source/Native/Success/SuccessFooterView.swift

@@ -16,14 +16,7 @@ final class SuccessFooterView: UIView {
     private let didSelectLinkAnotherAccount: (() -> Void)?
 
     private lazy var doneButton: Button = {
-        let doneButton = Button(
-            configuration: {
-                var doneButtonConfiguration = Button.Configuration.primary()
-                doneButtonConfiguration.font = .stripeFont(forTextStyle: .bodyEmphasized)
-                doneButtonConfiguration.backgroundColor = .textBrand
-                return doneButtonConfiguration
-            }()
-        )
+        let doneButton = Button(configuration: .financialConnectionsPrimary)
         doneButton.title = "Done" // TODO: replace with UIButton.doneButtonTitle once the SDK is localized
         doneButton.addTarget(self, action: #selector(didSelectDoneButton), for: .touchUpInside)
         doneButton.translatesAutoresizingMaskIntoConstraints = false
@@ -46,15 +39,7 @@ final class SuccessFooterView: UIView {
         footerStackView.spacing = 12
 
         if didSelectLinkAnotherAccount != nil {
-            let linkAnotherAccount = Button(
-                configuration: {
-                    var linkAnotherAccountButtonConfiguration = Button.Configuration.secondary()
-                    linkAnotherAccountButtonConfiguration.font = .stripeFont(forTextStyle: .bodyEmphasized)
-                    linkAnotherAccountButtonConfiguration.foregroundColor = .textSecondary
-                    linkAnotherAccountButtonConfiguration.backgroundColor = .borderNeutral
-                    return linkAnotherAccountButtonConfiguration
-                }()
-            )
+            let linkAnotherAccount = Button(configuration: .financialConnectionsSecondary)
             linkAnotherAccount.title = String.Localized.link_another_account
             linkAnotherAccount.addTarget(self, action: #selector(didSelectLinkAnotherAccountButton), for: .touchUpInside)
             linkAnotherAccount.translatesAutoresizingMaskIntoConstraints = false