Add a RestApiUpgradePrompt for migrating site to application passwords

Author: crazytonyli

Modules/Package.swift

@@ -60,7 +60,7 @@ let package = Package(
         .target(name: "WordPressFlux"),
         .target(name: "WordPressSharedObjC", resources: [.process("Resources")]),
         .target(name: "WordPressShared", dependencies: [.target(name: "WordPressSharedObjC")], resources: [.process("Resources")]),
-        .target(name: "WordPressUI", resources: [.process("Resources")]),
+        .target(name: "WordPressUI", dependencies: [.target(name: "DesignSystem")], resources: [.process("Resources")]),
         .testTarget(name: "JetpackStatsWidgetsCoreTests", dependencies: [.target(name: "JetpackStatsWidgetsCore")]),
         .testTarget(name: "DesignSystemTests", dependencies: [.target(name: "DesignSystem")]),
         .testTarget(name: "WordPressFluxTests", dependencies: ["WordPressFlux"]),

Modules/Sources/WordPressUI/Components/RestApiUpgradePrompt.swift

@@ -0,0 +1,63 @@
+import SwiftUI
+import DesignSystem
+
+public struct RestApiUpgradePrompt: View {
+
+    private let localizedFeatureName: String
+    private var didTapGetStarted: () -> Void
+
+    public init(localizedFeatureName: String, didTapGetStarted: @escaping () -> Void) {
+        self.localizedFeatureName = localizedFeatureName
+        self.didTapGetStarted = didTapGetStarted
+    }
+
+    public var body: some View {
+        VStack {
+            let scrollView = ScrollView {
+                VStack(alignment: .leading) {
+                    Text(Strings.title)
+                        .font(.largeTitle)
+                        .fontWeight(.semibold)
+                        .padding(.bottom)
+
+                    Text(Strings.description(localizedFeatureName: localizedFeatureName))
+                        .font(.body)
+                }.padding()
+            }
+
+            if #available(iOS 16.4, *) {
+                scrollView.scrollBounceBehavior(.basedOnSize, axes: [.vertical])
+            }
+
+            Spacer()
+            VStack {
+                Button(action: didTapGetStarted, label: {
+                    HStack {
+                        Spacer()
+                        Text("Get Started")
+                            .font(.headline)
+                            .padding(.DS.Padding.half)
+                        Spacer()
+                    }
+                }).buttonStyle(.borderedProminent)
+            }.padding()
+        }
+    }
+
+    private enum Strings {
+        static var title: String {
+            NSLocalizedString("applicationPasswordRequired.title", value: "Application Password Required", comment: "Title for the prompt to upgrade to Application Passwords")
+        }
+
+        static func description(localizedFeatureName: String) -> String {
+            let format = NSLocalizedString("applicationPasswordRequired.description", value: "Application passwords are a more secure way to connect to your self-hosted site, and enable support for features like %@.", comment: "Description for the prompt to upgrade to Application Passwords. The first argument is the name of the feature that requires Application Passwords.")
+            return String(format: format, localizedFeatureName)
+        }
+    }
+}
+
+#Preview {
+    RestApiUpgradePrompt(localizedFeatureName: "User Management") {
+        debugPrint("Tapped Get Started")
+    }
+}

WordPress/Classes/ViewRelated/Blog/Blog Details/BlogDetailsViewController+SectionHelpers.swift

@@ -1,6 +1,8 @@
 import Foundation
 import UIKit
 import SwiftUI
+import WordPressUI
+import WordPressAPI
 
 extension Array where Element: BlogDetailsSection {
     fileprivate func findSectionIndex(of category: BlogDetailsSectionCategory) -> Int? {
@@ -120,7 +122,7 @@ extension BlogDetailsViewController {
 
     @objc func shouldShowApplicationPasswordRow() -> Bool {
         // Only available for application-password authenticated self-hosted sites.
-        return self.blog.account == nil && self.blog.userID != nil && (try? WordPressSite(blog: self.blog)) != nil
+        return self.blog.account == nil && self.blog.userID != nil
     }
 
     private func createApplicationPasswordService() -> ApplicationPasswordService? {
@@ -139,13 +141,17 @@ extension BlogDetailsViewController {
     }
 
     @objc func showApplicationPasswordManagement() {
-        guard let presentationDelegate, let service = createApplicationPasswordService() else {
+        guard let presentationDelegate, let userId = self.blog.userID?.intValue else {
             return
         }
 
-        let viewModel = ApplicationTokenListViewModel(dataProvider: service)
-        let viewController = UIHostingController(rootView: ApplicationTokenListView(viewModel: viewModel))
-        presentationDelegate.presentBlogDetailsViewController(viewController)
+        let feature = NSLocalizedString("applicationPasswordRequired.feature.plugins", value: "Application Passwords Management", comment: "Feature name for managing Application Passwords in the app")
+        let rootView = ApplicationPasswordRequiredView(blog: self.blog, localizedFeatureName: feature) { client in
+            let service = ApplicationPasswordService(api: client, currentUserId: userId)
+            let viewModel = ApplicationTokenListViewModel(dataProvider: service)
+            return ApplicationTokenListView(viewModel: viewModel)
+        }
+        presentationDelegate.presentBlogDetailsViewController(UIHostingController(rootView: rootView))
     }
 
     @objc func showManagePluginsScreen() {
@@ -157,4 +163,65 @@ extension BlogDetailsViewController {
         let listViewController = PluginListViewController(site: site, query: query)
         presentationDelegate?.presentBlogDetailsViewController(listViewController)
     }
- }
+}
+
+struct ApplicationPasswordRequiredView<Content: View>: View {
+    private let blog: Blog
+    private let localizedFeatureName: String
+    @State private var site: WordPressSite?
+    private let builder: (WordPressClient) -> Content
+
+    init(blog: Blog, localizedFeatureName: String, @ViewBuilder content: @escaping (WordPressClient) -> Content) {
+        wpAssert(blog.account == nil, "The Blog argument should be a self-hosted site")
+
+        self.blog = blog
+        self.localizedFeatureName = localizedFeatureName
+        self.site = try? WordPressSite(blog: blog)
+        self.builder = content
+    }
+
+    var body: some View {
+        if let site {
+            builder(WordPressClient(site: site))
+        } else {
+            RestApiUpgradePrompt(localizedFeatureName: localizedFeatureName) {
+                Task {
+                    await self.migrate()
+                }
+            }
+        }
+    }
+
+    @MainActor
+    private func migrate() async {
+        guard let url = try? blog.getUrlString() else {
+            let error = NSLocalizedString("applicationPasswordMigration.error.siteUrlNotFound", value: "Cannot find the current site's url", comment: "Error message when the current site's url cannot be found")
+            Notice(title: error).post()
+            return
+        }
+
+        do {
+            // Get an application password for the given site.
+            let authenticator = SelfHostedSiteAuthenticator(session: .shared)
+            let success = try await authenticator.authentication(site: url, from: nil)
+
+            // Ensure the application password belongs to the current signed in user
+            if let username = blog.username, success.userLogin != username {
+                let format = NSLocalizedString("applicationPasswordMigration.error.usernameMismatch", value: "You need to sign in with user \"%@\"", comment: "Error message when the username does not match the signed-in user. The first argument is the currently signed in user's user login name")
+                Notice(title: .localizedStringWithFormat(format, username)).post()
+                return
+            }
+
+            try blog.setApplicationToken(success.password)
+
+            // Modify the `site` variable to display the intended feature.
+            self.site = try .init(baseUrl: ParsedUrl.parse(input: success.siteUrl), type: .selfHosted(username: success.userLogin, authToken: success.password))
+        } catch let error as WordPressLoginClient.Error {
+            if let message = error.errorMessage {
+                Notice(title: message).post()
+            }
+        } catch {
+            Notice(title: SharedStrings.Error.generic).post()
+        }
+    }
+}