Secure backup tweaks (#2095)

* Show a loading indicator when confirming the recovery key

* Hide the passphrase characters when confirming the recovery key

* Don't show the settings security section until session verification state is retrieved (async)

* Fix preview screenshots

ElementX/Sources/Screens/SecureBackup/SecureBackupRecoveryKeyScreen/SecureBackupRecoveryKeyScreenViewModel.swift

@@ -72,6 +72,9 @@ class SecureBackupRecoveryKeyScreenViewModel: SecureBackupRecoveryKeyScreenViewM
             state.doneButtonEnabled = true
         case .confirmKey:
             Task {
+                let loadingIndicatorIdentifier = "SecureBackupRecoveryKeyScreen"
+                userIndicatorController.submitIndicator(.init(id: loadingIndicatorIdentifier, type: .modal, title: L10n.commonLoading, persistent: true))
+                
                 switch await secureBackupController.confirmRecoveryKey(state.bindings.confirmationRecoveryKey) {
                 case .success:
                     actionsSubject.send(.done(mode: context.viewState.mode))
@@ -79,6 +82,8 @@ class SecureBackupRecoveryKeyScreenViewModel: SecureBackupRecoveryKeyScreenViewM
                     MXLog.error("Failed confirming recovery key with error: \(error)")
                     state.bindings.alertInfo = .init(id: .init())
                 }
+                
+                userIndicatorController.retractIndicatorWithId(loadingIndicatorIdentifier)
             }
         case .cancel:
             actionsSubject.send(.cancel)

ElementX/Sources/Screens/SecureBackup/SecureBackupRecoveryKeyScreen/View/SecureBackupRecoveryKeyScreen.swift

@@ -179,7 +179,7 @@ struct SecureBackupRecoveryKeyScreen: View {
                 .foregroundColor(.compound.textPrimary)
                 .font(.compound.bodySM)
             
-            TextField(L10n.screenRecoveryKeyConfirmKeyPlaceholder, text: $context.confirmationRecoveryKey)
+            SecureField(L10n.screenRecoveryKeyConfirmKeyPlaceholder, text: $context.confirmationRecoveryKey)
                 .textContentType(.password) // Not ideal but stops random suggestions
                 .autocapitalization(.none)
                 .disableAutocorrection(true)

ElementX/Sources/Screens/Settings/SettingsScreen/SettingsScreenModels.swift

@@ -41,7 +41,7 @@ struct SettingsScreenViewState: BindableState {
     var accountSessionsListURL: URL?
     var userAvatarURL: URL?
     var userDisplayName: String?
-    var isSessionVerified = false
+    var isSessionVerified: Bool?
     var chatBackupEnabled = false
     var showSecureBackupBadge = false
     var showDeveloperOptions: Bool

ElementX/Sources/Screens/Settings/SettingsScreen/View/SettingsScreen.swift

@@ -84,9 +84,9 @@ struct SettingsScreen: View {
     
     @ViewBuilder
     private var accountSecuritySection: some View {
-        if !context.viewState.isSessionVerified || context.viewState.chatBackupEnabled {
-            Section {
-                if !context.viewState.isSessionVerified {
+        Section {
+            if let isSessionVerified = context.viewState.isSessionVerified {
+                if !isSessionVerified {
                     ListRow(label: .default(title: L10n.actionCompleteVerification,
                                             icon: \.checkCircle),
                             kind: .button { context.send(viewAction: .sessionVerification) })