@@ -211,13 +211,20 @@ public struct MFAEnrolmentView {
211
211
extension MFAEnrolmentView : View {
212
212
public var body : some View {
213
213
VStack ( spacing: 16 ) {
214
- // Cancel button
214
+ // Back button
215
215
HStack {
216
- Button ( " Cancel " ) {
216
+ Button ( action : {
217
217
cancelEnrollment ( )
218
+ } ) {
219
+ HStack ( spacing: 4 ) {
220
+ Image ( systemName: " chevron.left " )
221
+ . font ( . system( size: 17 , weight: . medium) )
222
+ Text ( " Back " )
223
+ . font ( . system( size: 17 ) )
224
+ }
225
+ . foregroundColor ( . blue)
218
226
}
219
- . foregroundColor ( . blue)
220
- . accessibilityIdentifier ( " cancel-button " )
227
+ . accessibilityIdentifier ( " mfa-back-button " )
221
228
Spacer ( )
222
229
}
223
230
. padding ( . horizontal)
@@ -507,20 +514,37 @@ extension MFAEnrolmentView: View {
507
514
. font ( . title2)
508
515
. fontWeight ( . semibold)
509
516
510
- Text ( " Use your authenticator app to scan this QR code " )
517
+ Text ( " Scan with your authenticator app or tap to open directly " )
511
518
. font ( . body)
512
519
. foregroundColor ( . secondary)
513
520
. multilineTextAlignment ( . center)
514
521
515
522
// QR Code generated from the otpauth:// URI
516
523
if let qrURL = totpInfo. qrCodeURL,
517
524
let qrImage = generateQRCode ( from: qrURL. absoluteString) {
518
- Image ( uiImage: qrImage)
519
- . interpolation ( . none)
520
- . resizable ( )
521
- . aspectRatio ( contentMode: . fit)
522
- . frame ( width: 200 , height: 200 )
523
- . accessibilityIdentifier ( " qr-code-image " )
525
+ Button ( action: {
526
+ UIApplication . shared. open ( qrURL)
527
+ } ) {
528
+ VStack ( spacing: 12 ) {
529
+ Image ( uiImage: qrImage)
530
+ . interpolation ( . none)
531
+ . resizable ( )
532
+ . aspectRatio ( contentMode: . fit)
533
+ . frame ( width: 200 , height: 200 )
534
+ . accessibilityIdentifier ( " qr-code-image " )
535
+
536
+ HStack ( spacing: 6 ) {
537
+ Image ( systemName: " arrow.up.forward.app.fill " )
538
+ . font ( . caption)
539
+ Text ( " Tap to open in authenticator app " )
540
+ . font ( . caption)
541
+ . fontWeight ( . medium)
542
+ }
543
+ . foregroundColor ( . blue)
544
+ }
545
+ }
546
+ . buttonStyle ( . plain)
547
+ . accessibilityIdentifier ( " open-authenticator-button " )
524
548
} else {
525
549
RoundedRectangle ( cornerRadius: 8 )
526
550
. fill ( Color . gray. opacity ( 0.3 ) )
0 commit comments