Fix an issue with compliance popover not dismissing for self-hosted site (#23932)

Author: kean

Modules/Sources/DesignSystem/Foundation/CGFloat+DesignSystem.swift

@@ -12,10 +12,6 @@ public extension CGFloat {
             public static let max: CGFloat = 48
         }
 
-        public enum Hitbox {
-            public static let minTappableLength: CGFloat = 44
-        }
-
         public enum Radius {
             public static let small: CGFloat = 5
             public static let medium: CGFloat = 10

Modules/Sources/DesignSystem/Gallery/LengthGallery.swift

@@ -30,7 +30,7 @@ struct LengthGallery: View {
         ZStack {
             RoundedRectangle(cornerRadius: .DS.Radius.small)
                 .fill(.background)
-                .frame(height: .DS.Hitbox.minTappableLength)
+                .frame(height: 44)
             HStack {
                 Text(name)
                     .offset(x: .DS.Padding.double)

WordPress/Classes/ViewRelated/EEUUSCompliance/CompliancePopover.swift

@@ -1,21 +1,28 @@
 import SwiftUI
 import JetpackStatsWidgetsCore
-import DesignSystem
 
 struct CompliancePopover: View {
     @StateObject
     var viewModel: CompliancePopoverViewModel
 
     var body: some View {
-        VStack(alignment: .leading, spacing: .DS.Padding.double) {
-            titleText
-            subtitleText
-            analyticsToggle
-            footnote
-            buttonsHStack
+        ScrollView(.vertical) {
+            VStack(alignment: .leading, spacing: 8) {
+                titleText.padding(.top, 16)
+                subtitleText
+                analyticsToggle.padding(.top, 8)
+                footnote
+            }
+            .padding(20)
+        }
+        .safeAreaInset(edge: .bottom) {
+            HStack(spacing: 8) {
+                settingsButton
+                saveButton
+            }
+            .padding(20)
+            .background(Color(.systemBackground))
         }
-        .padding(.DS.Padding.medium)
-        .fixedSize(horizontal: false, vertical: true)
     }
 
     private var titleText: some View {
@@ -33,7 +40,7 @@ struct CompliancePopover: View {
         Toggle(Strings.toggleTitle, isOn: $viewModel.isAnalyticsEnabled)
             .foregroundStyle(Color(.label))
             .toggleStyle(UIAppColor.switchStyle)
-            .padding(.vertical, .DS.Padding.single)
+            .padding(.vertical, 8)
     }
 
     private var footnote: some View {
@@ -42,26 +49,19 @@ struct CompliancePopover: View {
             .foregroundColor(.secondary)
     }
 
-    private var buttonsHStack: some View {
-        HStack(spacing: .DS.Padding.single) {
-            settingsButton
-            saveButton
-        }.padding(.top, .DS.Padding.medium)
-    }
-
     private var settingsButton: some View {
         Button(action: {
             self.viewModel.didTapSettings()
         }) {
             ZStack {
-                RoundedRectangle(cornerRadius: .DS.Padding.single)
-                    .stroke(.gray, lineWidth: .DS.Border.thin)
+                RoundedRectangle(cornerRadius: 8)
+                    .stroke(.gray, lineWidth: 0.5)
                 Text(Strings.settingsButtonTitle)
                     .font(.body)
             }
         }
         .foregroundColor(AppColor.brand)
-        .frame(height: .DS.Hitbox.minTappableLength)
+        .frame(height: 44)
     }
 
     private var saveButton: some View {
@@ -76,7 +76,7 @@ struct CompliancePopover: View {
             }
         }
         .foregroundColor(.white)
-        .frame(height: .DS.Hitbox.minTappableLength)
+        .frame(height: 44)
     }
 }
 

WordPress/Classes/ViewRelated/EEUUSCompliance/CompliancePopoverCoordinator.swift

@@ -101,10 +101,10 @@ final class CompliancePopoverCoordinator: CompliancePopoverCoordinatorProtocol {
             contextManager: ContextManager.shared
         )
         complianceViewModel.coordinator = self
-        let complianceViewController = CompliancePopoverViewController(viewModel: complianceViewModel)
-        let bottomSheetViewController = BottomSheetViewController(childViewController: complianceViewController, customHeaderSpacing: 0)
-
-        bottomSheetViewController.show(from: presentingViewController)
+        let complianceVC = CompliancePopoverViewController(viewModel: complianceViewModel)
+        complianceVC.sheetPresentationController?.detents = [.medium(), .large()]
+        complianceVC.isModalInPresentation = true
+        presentingViewController.present(complianceVC, animated: true)
     }
 }
 

WordPress/Classes/ViewRelated/EEUUSCompliance/CompliancePopoverViewController.swift

@@ -2,34 +2,12 @@ import UIKit
 import SwiftUI
 import WordPressUI
 
-final class CompliancePopoverViewController: UIViewController {
-
-    // MARK: - Dependencies
-
+final class CompliancePopoverViewController: UIHostingController<CompliancePopover> {
     private let viewModel: CompliancePopoverViewModel
 
-    // MARK: - Views
-
-    private let scrollView: UIScrollView = {
-        let view = UIScrollView()
-        view.showsVerticalScrollIndicator = false
-        view.translatesAutoresizingMaskIntoConstraints = false
-        return view
-    }()
-
-    private let hostingController: UIHostingController<CompliancePopover>
-
-    private var contentView: UIView {
-        return hostingController.view
-    }
-
-    // MARK: - Init
-
     init(viewModel: CompliancePopoverViewModel) {
         self.viewModel = viewModel
-        let content = CompliancePopover(viewModel: viewModel)
-        self.hostingController = UIHostingController(rootView: content)
-        super.init(nibName: nil, bundle: nil)
+        super.init(rootView: CompliancePopover(viewModel: viewModel))
     }
 
     required dynamic init?(coder aDecoder: NSCoder) {
@@ -40,60 +18,7 @@ final class CompliancePopoverViewController: UIViewController {
 
     override func viewDidLoad() {
         super.viewDidLoad()
-        self.addContentView()
-        self.viewModel.didDisplayPopover()
-    }
 
-    override func viewDidLayoutSubviews() {
-        super.viewDidLayoutSubviews()
-        // Calculate the size needed for the view to fit its content
-        let targetSize = CGSize(width: view.bounds.width, height: 0)
-        self.contentView.frame = CGRect(origin: .zero, size: targetSize)
-        let contentViewSize = contentView.systemLayoutSizeFitting(targetSize)
-        self.contentView.frame.size = contentViewSize
-
-        // Set the scrollView's content size to match the contentView's size
-        //
-        // Scroll is enabled / disabled automatically depending on whether the `contentSize` is bigger than the its size.
-        self.scrollView.contentSize = contentViewSize
-
-        // Set the preferred content size for the view controller to match the contentView's size
-        //
-        // This property should be updated when `DrawerPresentable.collapsedHeight` is `intrinsicHeight`.
-        // Because under the hood the `BottomSheetViewController` reads this property to layout its subviews.
-        self.preferredContentSize = contentViewSize
-    }
-
-    private func addContentView() {
-        self.view.addSubview(scrollView)
-        self.view.pinSubviewToAllEdges(scrollView)
-        self.hostingController.willMove(toParent: self)
-        self.addChild(hostingController)
-        self.contentView.translatesAutoresizingMaskIntoConstraints = true
-        self.scrollView.addSubview(contentView)
-        self.hostingController.didMove(toParent: self)
-    }
-}
-
-// MARK: - DrawerPresentable
-
-extension CompliancePopoverViewController: DrawerPresentable {
-    var collapsedHeight: DrawerHeight {
-        if traitCollection.verticalSizeClass == .compact {
-            return .maxHeight
-        }
-        return .intrinsicHeight
-    }
-
-    var allowsUserTransition: Bool {
-        return false
-    }
-
-    var allowsDragToDismiss: Bool {
-        false
-    }
-
-    var allowsTapToDismiss: Bool {
-        return false
+        self.viewModel.didDisplayPopover()
     }
 }

WordPress/Classes/ViewRelated/EEUUSCompliance/CompliancePopoverViewModel.swift

@@ -2,7 +2,7 @@ import Foundation
 import UIKit
 import WordPressUI
 
-class CompliancePopoverViewModel: ObservableObject {
+final class CompliancePopoverViewModel: ObservableObject {
 
     @Published
     var isAnalyticsEnabled: Bool = !WPAppAnalytics.userHasOptedOut()
@@ -45,13 +45,10 @@ class CompliancePopoverViewModel: ObservableObject {
             let account = try? WPAccount.lookupDefaultWordPressComAccount(in: context)
             return (account?.userID, account?.wordPressComRestApi)
         }
-
-        guard let accountID, let restAPI else {
-            return
+        if let accountID, let restAPI {
+            let change = AccountSettingsChange.tracksOptOut(!isAnalyticsEnabled)
+            AccountSettingsService(userID: accountID.intValue, api: restAPI).saveChange(change)
         }
-
-        let change = AccountSettingsChange.tracksOptOut(!isAnalyticsEnabled)
-        AccountSettingsService(userID: accountID.intValue, api: restAPI).saveChange(change)
         coordinator?.dismiss()
         defaults.didShowCompliancePopup = true
         analyticsTracker.trackPrivacyChoicesBannerSaveButtonTapped(analyticsEnabled: isAnalyticsEnabled)