Only offer to verify if a cross-signed device is available and improve the UX whilst waiting. (#4710)

* Only offer to verify if a cross-signed device is available * Wait until we know which verification options are available before showing them. --------- Co-authored-by: Hubert Chathi <hubertc@matrix.org>
2026-11-02 21:33:26 +00:00 · 2025-11-07 12:10:12 +00:00
parent 096e2d1713
commit 51a9d8b56b
15 changed files with 142 additions and 25 deletions
@@ -23,7 +23,7 @@ struct IdentityConfirmationScreenViewState: BindableState {
        case interactiveVerification
    }
    
-    var availableActions: [AvailableActions] = []
+    var availableActions: [AvailableActions]?
    let learnMoreURL: URL
 }

@@ -9,7 +9,7 @@
 import Combine
 import SwiftUI

-typealias IdentityConfirmationScreenViewModelType = StateStoreViewModel<IdentityConfirmationScreenViewState, IdentityConfirmationScreenViewAction>
+typealias IdentityConfirmationScreenViewModelType = StateStoreViewModelV2<IdentityConfirmationScreenViewState, IdentityConfirmationScreenViewAction>

 class IdentityConfirmationScreenViewModel: IdentityConfirmationScreenViewModelType, IdentityConfirmationScreenViewModelProtocol {
    private let userSession: UserSessionProtocol
@@ -62,14 +62,22 @@ class IdentityConfirmationScreenViewModel: IdentityConfirmationScreenViewModelTy
            hideLoadingIndicator()
        }
        
+        // Note: Until the actions are unset, there's a disabled action button with a loading spinner.
+        
        guard sessionSecurityState.verificationState == .unverified else {
            return
        }
        
+        // Continue to show the loading action button until we know that there's a recovery set up.
+        // https://github.com/element-hq/element-x-ios/issues/4699
+        guard sessionSecurityState.recoveryState != .unknown else {
+            return
+        }
+        
        var availableActions: [IdentityConfirmationScreenViewState.AvailableActions] = []
        
-        if case let .success(isOnlyDeviceLeft) = await userSession.clientProxy.isOnlyDeviceLeft(),
-           !isOnlyDeviceLeft {
+        if case let .success(hasDevicesToVerifyAgainst) = await userSession.clientProxy.hasDevicesToVerifyAgainst(),
+           hasDevicesToVerifyAgainst {
            availableActions.append(.interactiveVerification)
        }
        
@@ -10,7 +10,7 @@ import Compound
 import SwiftUI

 struct IdentityConfirmationScreen: View {
-    @ObservedObject var context: IdentityConfirmationScreenViewModel.Context
+    let context: IdentityConfirmationScreenViewModel.Context
    
    var shouldShowSkipButton: Bool {
        #if DEBUG
@@ -63,25 +63,38 @@ struct IdentityConfirmationScreen: View {
    @ViewBuilder
    private var actionButtons: some View {
        VStack(spacing: 16) {
-            if context.viewState.availableActions.contains(.interactiveVerification) {
-                Button(L10n.screenIdentityConfirmationUseAnotherDevice) {
-                    context.send(viewAction: .otherDevice)
+            if let availableActions = context.viewState.availableActions {
+                if availableActions.contains(.interactiveVerification) {
+                    Button(L10n.screenIdentityConfirmationUseAnotherDevice) {
+                        context.send(viewAction: .otherDevice)
+                    }
+                    .buttonStyle(.compound(.primary))
+                }
+                
+                if availableActions.contains(.recovery) {
+                    Button(L10n.screenIdentityConfirmationUseRecoveryKey) {
+                        context.send(viewAction: .recoveryKey)
+                    }
+                    .buttonStyle(.compound(.primary))
+                }
+                
+                Button(L10n.screenIdentityConfirmationCannotConfirm) {
+                    context.send(viewAction: .reset)
+                }
+                .buttonStyle(.compound(.secondary))
+            } else {
+                Button { /* Placeholder button, there is no action */ } label: {
+                    Label {
+                        Text(L10n.commonLoading)
+                    } icon: {
+                        ProgressView()
+                            .tint(.compound.iconOnSolidPrimary)
+                    }
                }
                .buttonStyle(.compound(.primary))
+                .disabled(true)
            }
            
-            if context.viewState.availableActions.contains(.recovery) {
-                Button(L10n.screenIdentityConfirmationUseRecoveryKey) {
-                    context.send(viewAction: .recoveryKey)
-                }
-                .buttonStyle(.compound(.primary))
-            }
-            
-            Button(L10n.screenIdentityConfirmationCannotConfirm) {
-                context.send(viewAction: .reset)
-            }
-            .buttonStyle(.compound(.secondary))
-            
            if shouldShowSkipButton {
                Button("\(L10n.actionSkip) 🙉") {
                    context.send(viewAction: .skip)
@@ -105,20 +118,27 @@ struct IdentityConfirmationScreen: View {

 struct IdentityConfirmationScreen_Previews: PreviewProvider, TestablePreview {
    static var viewModel = makeViewModel()
+    static var loadingViewModel = makeViewModel(recoveryState: .unknown)
    
    static var previews: some View {
        NavigationStack {
            IdentityConfirmationScreen(context: viewModel.context)
        }
-        .snapshotPreferences(expect: viewModel.context.$viewState.map { state in
-            state.availableActions.contains([.interactiveVerification, .recovery])
-        })
+        .previewDisplayName("Actions")
+        .snapshotPreferences(expect: viewModel.context.observe(\.viewState.availableActions).map { actions in
+            actions?.contains([.interactiveVerification, .recovery]) == true
+        }.eraseToStream())
+        
+        NavigationStack {
+            IdentityConfirmationScreen(context: loadingViewModel.context)
+        }
+        .previewDisplayName("Loading")
    }
    
-    static func makeViewModel() -> IdentityConfirmationScreenViewModel {
+    static func makeViewModel(recoveryState: SecureBackupRecoveryState = .enabled) -> IdentityConfirmationScreenViewModel {
        let clientProxy = ClientProxyMock(.init())
        let userSession = UserSessionMock(.init(clientProxy: clientProxy))
-        userSession.sessionSecurityStatePublisher = CurrentValuePublisher<SessionSecurityState, Never>(.init(verificationState: .unverified, recoveryState: .enabled))
+        userSession.sessionSecurityStatePublisher = CurrentValuePublisher<SessionSecurityState, Never>(.init(verificationState: .unverified, recoveryState: recoveryState))
        
        return IdentityConfirmationScreenViewModel(userSession: userSession,
                                                   appSettings: ServiceLocator.shared.settings,