Space Settings - Navigations (#4691)

* Implementation for all navigations inside the space settings aside the left space action

* pr suggestions

ElementX/Sources/Other/SwiftUI/Views/LoadableAvatarImage.swift

@@ -54,14 +54,10 @@ struct LoadableAvatarImage: View {
         avatar
             .frame(width: frameSize, height: frameSize)
             .background(Color.compound.bgCanvasDefault)
-            .clipShape(avatarShape)
+            .clipAvatar(isSpace: isSpace, scaledSize: _frameSize)
             .environment(\.shouldAutomaticallyLoadImages, true) // We always load avatars.
     }
     
-    private var avatarShape: some Shape {
-        isSpace ? AnyShape(RoundedRectangle(cornerRadius: frameSize / 4)) : AnyShape(Circle())
-    }
-    
     @ViewBuilder
     private var avatar: some View {
         if let url {
@@ -79,3 +75,37 @@ struct LoadableAvatarImage: View {
         }
     }
 }
+
+extension View {
+    func clipAvatar(isSpace: Bool, size: CGFloat) -> some View {
+        modifier(ClipAvatarModifier(isSpace: isSpace, size: size))
+    }
+    
+    func clipAvatar(isSpace: Bool, scaledSize: ScaledMetric<CGFloat>) -> some View {
+        modifier(ClipAvatarModifier(isSpace: isSpace, scaledSize: scaledSize))
+    }
+}
+
+struct ClipAvatarModifier: ViewModifier {
+    private let isSpace: Bool
+    @ScaledMetric private var scaledSize: CGFloat
+    
+    init(isSpace: Bool, size: CGFloat) {
+        self.isSpace = isSpace
+        _scaledSize = ScaledMetric(wrappedValue: size)
+    }
+    
+    init(isSpace: Bool, scaledSize: ScaledMetric<CGFloat>) {
+        self.isSpace = isSpace
+        _scaledSize = scaledSize
+    }
+    
+    func body(content: Content) -> some View {
+        content
+            .clipShape(avatarShape)
+    }
+    
+    private var avatarShape: some Shape {
+        isSpace ? AnyShape(RoundedRectangle(cornerRadius: scaledSize / 4)) : AnyShape(Circle())
+    }
+}

ElementX/Sources/Other/SwiftUI/Views/OverridableAvatarImage.swift

@@ -14,6 +14,7 @@ struct OverridableAvatarImage: View {
     let url: URL?
     let name: String?
     let contentID: String
+    let isSpace: Bool
     let avatarSize: Avatars.Size
     let mediaProvider: MediaProviderProtocol?
     
@@ -27,11 +28,12 @@ struct OverridableAvatarImage: View {
                 ProgressView()
             }
             .scaledFrame(size: avatarSize.value)
-            .clipShape(Circle())
+            .clipAvatar(isSpace: isSpace, size: avatarSize.value)
         } else {
             LoadableAvatarImage(url: url,
                                 name: name,
                                 contentID: contentID,
+                                isSpace: isSpace,
                                 avatarSize: avatarSize,
                                 mediaProvider: mediaProvider)
         }