Allow tapping the avatar in the room member bottom sheet to view it fullscreen (#5989)

* Extract a shared helper for loading a media preview

The four screens that show a fullscreen avatar each had their own copy of the same
load-and-wrap logic. Move it to MediaPreviewItem.load, with the mime type as a
parameter defaulting to JPEG, and leave each screen's loading indicator where it is.

Signed-off-by: Daniel Anderson <daniel.anderson@toptal.com>

* Only dismiss a QuickLook preview that is still presented

UIKit forwards dismiss() up the presentation chain when the receiver has nothing
presented, so dismissing the avatar view was dismissing the profile details sheet
also.

Signed-off-by: Daniel Anderson <daniel.anderson@toptal.com>

* Allow tapping the avatar in the room member bottom sheet to view it fullscreen

Signed-off-by: Daniel Anderson <daniel.anderson@toptal.com>

---------

Signed-off-by: Daniel Anderson <daniel.anderson@toptal.com>

ElementX/Sources/Screens/ManageRoomMemberSheet/ManageRoomMemberSheetModels.swift

@@ -6,6 +6,8 @@
 // Please see LICENSE files in the repository root for full details.
 //
 
+import Foundation
+
 enum ManageRoomMemberSheetViewModelAction: Equatable {
     case dismiss(shouldShowDetails: Bool)
 }
@@ -46,6 +48,7 @@ struct ManageRoomMemberSheetViewState: BindableState {
 
 struct ManageRoomMemberSheetViewStateBindings {
     var alertInfo: AlertInfo<ManageRoomMemberSheetViewAlertType>?
+    var mediaPreviewItem: MediaPreviewItem?
 }
 
 enum ManageRoomMemberSheetViewAlertType {
@@ -59,6 +62,7 @@ enum ManageRoomMemberSheetViewAction {
     case ban
     case unban
     case displayDetails
+    case displayAvatar(URL)
 }
 
 enum ManageRoomMemberDetails {

ElementX/Sources/Screens/ManageRoomMemberSheet/ManageRoomMemberSheetViewModel.swift

@@ -16,6 +16,7 @@ class ManageRoomMemberSheetViewModel: ManageRoomMemberSheetViewModelType, Manage
     private let roomProxy: JoinedRoomProxyProtocol
     private let userIndicatorController: UserIndicatorControllerProtocol
     private let analyticsService: AnalyticsServiceProtocol
+    private let mediaProvider: MediaProviderProtocol
     
     private var actionsSubject: PassthroughSubject<ManageRoomMemberSheetViewModelAction, Never> = .init()
     
@@ -32,6 +33,7 @@ class ManageRoomMemberSheetViewModel: ManageRoomMemberSheetViewModelType, Manage
         self.userIndicatorController = userIndicatorController
         self.roomProxy = roomProxy
         self.analyticsService = analyticsService
+        self.mediaProvider = mediaProvider
         super.init(initialViewState: .init(memberDetails: memberDetails, permissions: permissions), mediaProvider: mediaProvider)
     }
     
@@ -45,6 +47,8 @@ class ManageRoomMemberSheetViewModel: ManageRoomMemberSheetViewModelType, Manage
             actionsSubject.send(.dismiss(shouldShowDetails: true))
         case .unban:
             displayAlert(.unban)
+        case .displayAvatar(let url):
+            Task { await displayFullScreenAvatar(url) }
         }
     }
     
@@ -127,6 +131,14 @@ class ManageRoomMemberSheetViewModel: ManageRoomMemberSheetViewModelType, Manage
         }
     }
     
+    private func displayFullScreenAvatar(_ url: URL) async {
+        let loadingIndicatorIdentifier = "manageRoomMemberAvatarLoadingIndicator"
+        userIndicatorController.submitIndicator(UserIndicator(id: loadingIndicatorIdentifier, type: .modal, title: L10n.commonLoading, persistent: true))
+        defer { userIndicatorController.retractIndicatorWithId(loadingIndicatorIdentifier) }
+        
+        state.bindings.mediaPreviewItem = await MediaPreviewItem.load(from: url, title: state.memberDetails.name, using: mediaProvider)
+    }
+    
     private func showManageMemberIndicator(title: String) {
         userIndicatorController.submitIndicator(UserIndicator(id: title,
                                                               type: .toast(progress: .indeterminate),

ElementX/Sources/Screens/ManageRoomMemberSheet/View/ManageRoomMemberSheetView.swift

@@ -18,13 +18,17 @@ struct ManageRoomMemberSheetView: View {
             case .memberDetails(let member):
                 AvatarHeaderView(member: member,
                                  avatarSize: .user(on: .memberDetails),
-                                 mediaProvider: context.mediaProvider) {
+                                 mediaProvider: context.mediaProvider) { url in
+                    context.send(viewAction: .displayAvatar(url))
+                } footer: {
                     EmptyView()
                 }
             case .loadingMemberDetails(let sender):
                 AvatarHeaderView(sender: sender,
                                  avatarSize: .user(on: .memberDetails),
-                                 mediaProvider: context.mediaProvider) {
+                                 mediaProvider: context.mediaProvider) { url in
+                    context.send(viewAction: .displayAvatar(url))
+                } footer: {
                     EmptyView()
                 }
             }
@@ -76,6 +80,7 @@ struct ManageRoomMemberSheetView: View {
         .presentationDragIndicator(.visible)
         .presentationDetents([.large, .fraction(0.67)]) // Maybe find a way to use the ideal height somehow?
         .alert(item: $context.alertInfo)
+        .interactiveQuickLook(item: $context.mediaPreviewItem, allowEditing: false)
     }
 }