Media loading flow changes (#483)

* Use an imageProvider directly from the view in the home screen

* Add support for media request coalescing

* Rename MediaProxy to MediaLoader

* Add new image loading mechanism to the room details screen avatar.

* Use the `SettingsScreen` prefix for all settings screen related components

* Add new image loading mechanism to the room header

* Add new image loading mechanism to the room member details screen

* Introduce a LoadableImage SwiftUI view that will automatically handle image loading

* Adopt the new LoadableImage where possible

* Fix LoadableImage not using/storing loaded images properly

* Simplify media loader enqueueing

* Made LodableImage load content after mediaSource updates. Adopt it on the home and settings screens

* Introduce a LoadableAvatarImage component and reuse it throughout the app

* Small logging tweaks, made some LoadableImage properties private

* Fix redacted skeletons avatar background color

* Fix placeholder avatars changing when backgrounding the app

* PR comments.

- Trim the @ sign off of mxid placeholders.
- Only expose AvatarSize on the avatar image, use CGSize elsewhere.

Co-authored-by: Doug <douglase@element.io>

ElementX/Sources/Screens/RoomScreen/RoomScreenViewModel.swift

@@ -28,7 +28,6 @@ class RoomScreenViewModel: RoomScreenViewModelType, RoomScreenViewModelProtocol
 
     private let timelineController: RoomTimelineControllerProtocol
     private let timelineViewFactory: RoomTimelineViewFactoryProtocol
-    private let mediaProvider: MediaProviderProtocol
 
     // MARK: - Setup
         
@@ -39,12 +38,12 @@ class RoomScreenViewModel: RoomScreenViewModelType, RoomScreenViewModelProtocol
          roomAvatarUrl: URL? = nil) {
         self.timelineController = timelineController
         self.timelineViewFactory = timelineViewFactory
-        self.mediaProvider = mediaProvider
         
         super.init(initialViewState: RoomScreenViewState(roomId: timelineController.roomID,
                                                          roomTitle: roomName ?? "Unknown room 💥",
-                                                         roomAvatar: nil,
-                                                         bindings: .init(composerText: "", composerFocused: false)))
+                                                         roomAvatarURL: roomAvatarUrl,
+                                                         bindings: .init(composerText: "", composerFocused: false)),
+                   imageProvider: mediaProvider)
         
         timelineController.callbacks
             .receive(on: DispatchQueue.main)
@@ -76,15 +75,6 @@ class RoomScreenViewModel: RoomScreenViewModelType, RoomScreenViewModelProtocol
         state.contextMenuBuilder = buildContextMenuForItemId(_:)
         
         buildTimelineViews()
-        
-        if let roomAvatarUrl {
-            Task {
-                if case let .success(avatar) = await mediaProvider.loadImageFromURL(roomAvatarUrl,
-                                                                                    avatarSize: .room(on: .timeline)) {
-                    state.roomAvatar = avatar
-                }
-            }
-        }
     }
     
     // MARK: - Public