Show banned members in the members list. (#2460)

Only shown to users with enough power to ban.
2026-11-04 10:33:45 +00:00 · 2024-02-16 12:49:35 +00:00
parent 4787c17c38
commit 9d1d5e43a9
17 changed files with 246 additions and 69 deletions
@@ -22,9 +22,23 @@ struct RoomMembersListScreen: View {
    
    var body: some View {
        ScrollView {
-            LazyVStack(alignment: .leading, spacing: 12) {
-                membersSection(data: context.viewState.visibleInvitedMembers, sectionTitle: L10n.screenRoomMemberListPendingHeaderTitle)
-                membersSection(data: context.viewState.visibleJoinedMembers, sectionTitle: L10n.screenRoomMemberListHeaderTitle(Int(context.viewState.joinedMembersCount)))
+            if context.viewState.canBanUsers,
+               context.viewState.bannedMembersCount > 0 {
+                // Maybe this should go into the search bar if it can be pinned when not focussed?
+                Picker("", selection: $context.mode) {
+                    Text(L10n.screenRoomMemberListModeMembers)
+                        .tag(RoomMembersListScreenMode.members)
+                    Text(L10n.screenRoomMemberListModeBanned)
+                        .tag(RoomMembersListScreenMode.banned)
+                }
+                .pickerStyle(.segmented)
+                .padding(.horizontal, 16)
+            }
+            
+            if context.mode == .members {
+                roomMembers
+            } else {
+                bannedUsers
            }
        }
        .searchable(text: $context.searchQuery, placement: .navigationBarDrawer(displayMode: .always))
@@ -42,20 +56,39 @@ struct RoomMembersListScreen: View {
    
    // MARK: - Private
    
-    private func membersSection(data: [RoomMemberDetails], sectionTitle: String) -> some View {
-        Section {
-            ForEach(data, id: \.id) { member in
-                RoomMembersListScreenMemberCell(member: member, context: context)
-            }
-        } header: {
-            if !data.isEmpty {
-                Text(sectionTitle)
-                    .foregroundColor(.compound.textSecondary)
-                    .font(.compound.bodyLG)
-                    .padding(.top, 12)
-            }
+    var roomMembers: some View {
+        LazyVStack(alignment: .leading, spacing: 12) {
+            membersSection(data: context.viewState.visibleInvitedMembers, sectionTitle: L10n.screenRoomMemberListPendingHeaderTitle)
+            membersSection(data: context.viewState.visibleJoinedMembers, sectionTitle: L10n.screenRoomMemberListHeaderTitle(Int(context.viewState.joinedMembersCount)))
+        }
+    }
+    
+    var bannedUsers: some View {
+        LazyVStack(alignment: .leading, spacing: 12) {
+            membersSection(data: context.viewState.visibleBannedMembers)
+        }
+    }
+    
+    @ViewBuilder
+    private func membersSection(data: [RoomMemberDetails], sectionTitle: String? = nil) -> some View {
+        if !data.isEmpty {
+            Section {
+                ForEach(data, id: \.id) { member in
+                    RoomMembersListScreenMemberCell(member: member, context: context)
+                }
+            } header: {
+                if let sectionTitle {
+                    Text(sectionTitle)
+                        .foregroundColor(.compound.textSecondary)
+                        .font(.compound.bodyLG)
+                        .padding(.top, 12)
+                } else {
+                    // Put something in here to maintain constant top padding.
+                    Spacer().frame(height: 0)
+                }
+            }
+            .padding(.horizontal, 16)
        }
-        .padding(.horizontal)
    }
    
    @ViewBuilder
@@ -73,23 +106,62 @@ struct RoomMembersListScreen: View {
 // MARK: - Previews

 struct RoomMembersListScreen_Previews: PreviewProvider, TestablePreview {
-    static let viewModel = {
-        let members: [RoomMemberProxyMock] = [
-            .mockAlice,
-            .mockBob,
-            .mockCharlie,
-            .mockAdmin,
-            .mockModerator
-        ]
-        return RoomMembersListScreenViewModel(roomProxy: RoomProxyMock(with: .init(displayName: "Some room", members: members)),
-                                              mediaProvider: MockMediaProvider(),
-                                              userIndicatorController: ServiceLocator.shared.userIndicatorController)
-    }()
+    static let viewModel = makeViewModel()
+    static let invitesViewModel = makeViewModel(withInvites: true)
+    static let adminViewModel = makeViewModel(isAdmin: true, initialMode: .members)
+    static let bannedViewModel = makeViewModel(isAdmin: true, initialMode: .banned)
    
    static var previews: some View {
        NavigationStack {
            RoomMembersListScreen(context: viewModel.context)
        }
        .snapshot(delay: 1.0)
+        .previewDisplayName("Member")
+        
+        NavigationStack {
+            RoomMembersListScreen(context: invitesViewModel.context)
+        }
+        .snapshot(delay: 1.0)
+        .previewDisplayName("Invites")
+        
+        NavigationStack {
+            RoomMembersListScreen(context: adminViewModel.context)
+        }
+        .snapshot(delay: 1.0)
+        .previewDisplayName("Admin: Members")
+        
+        NavigationStack {
+            RoomMembersListScreen(context: bannedViewModel.context)
+        }
+        .snapshot(delay: 1.0)
+        .previewDisplayName("Admin: Banned")
+    }
+    
+    static func makeViewModel(withInvites: Bool = false,
+                              isAdmin: Bool = false,
+                              initialMode: RoomMembersListScreenMode = .members) -> RoomMembersListScreenViewModel {
+        let mockAdmin = RoomMemberProxyMock.mockAdmin
+        
+        if isAdmin {
+            mockAdmin.underlyingCanBanUsers = true
+            mockAdmin.underlyingIsAccountOwner = true
+        }
+        
+        var members: [RoomMemberProxyMock] = [
+            .mockAlice,
+            .mockBob,
+            .mockCharlie,
+            mockAdmin,
+            .mockModerator
+        ] + RoomMemberProxyMock.mockBanned
+        
+        if withInvites {
+            members.append(.mockInvited)
+        }
+        
+        return RoomMembersListScreenViewModel(initialMode: initialMode,
+                                              roomProxy: RoomProxyMock(with: .init(displayName: "Some room", members: members)),
+                                              mediaProvider: MockMediaProvider(),
+                                              userIndicatorController: ServiceLocator.shared.userIndicatorController)
    }
 }
@@ -25,8 +25,8 @@ struct RoomMembersListScreenMemberCell: View {
            context.send(viewAction: .selectMember(id: member.id))
        } label: {
            HStack(spacing: 8) {
-                LoadableAvatarImage(url: member.avatarURL,
-                                    name: member.name ?? "",
+                LoadableAvatarImage(url: avatarURL,
+                                    name: avatarName,
                                    contentID: member.id,
                                    avatarSize: .user(on: .roomDetails),
                                    imageProvider: context.imageProvider)
@@ -34,14 +34,17 @@ struct RoomMembersListScreenMemberCell: View {
                
                HStack(alignment: .firstTextBaseline, spacing: 4) {
                    VStack(alignment: .leading, spacing: 0) {
-                        Text(member.name ?? "")
+                        Text(title)
                            .font(.compound.bodyMDSemibold)
                            .foregroundColor(.compound.textPrimary)
                            .lineLimit(1)
-                        Text(member.id)
-                            .font(.compound.bodySM)
-                            .foregroundColor(.compound.textSecondary)
-                            .lineLimit(1)
+                        
+                        if let subtitle {
+                            Text(subtitle)
+                                .font(.compound.bodySM)
+                                .foregroundColor(.compound.textSecondary)
+                                .lineLimit(1)
+                        }
                    }
                    .frame(maxWidth: .infinity, alignment: .leading)
                    
@@ -67,22 +70,59 @@ struct RoomMembersListScreenMemberCell: View {
            nil
        }
    }
+    
+    // Computed properties to hide the user's profile when banned.
+    
+    var title: String {
+        guard !member.isBanned else { return member.id }
+        return member.name ?? member.id
+    }
+    
+    var subtitle: String? {
+        member.isBanned ? nil : member.id
+    }
+    
+    var avatarName: String? {
+        member.isBanned ? nil : member.name
+    }
+    
+    var avatarURL: URL? {
+        member.isBanned ? nil : member.avatarURL
+    }
 }

 struct RoomMembersListMemberCell_Previews: PreviewProvider, TestablePreview {
    static let members: [RoomMemberProxyMock] = [
        .mockAlice,
-        .mockBob,
-        .mockCharlie,
-        .mockModerator
+        .mockAdmin,
+        .mockModerator,
+        .init(with: .init(userID: "@nodisplayname:matrix.org", membership: .join)),
+        .init(with: .init(userID: "@avatar:matrix.org", displayName: "Avatar", avatarURL: .picturesDirectory, membership: .join))
    ]
-    static let viewModel = RoomMembersListScreenViewModel(roomProxy: RoomProxyMock(with: .init(displayName: "Some room", members: members)),
+    
+    static let bannedMembers: [RoomMemberProxyMock] = [
+        .init(with: .init(userID: "@nodisplayname:matrix.org", membership: .ban)),
+        .init(with: .init(userID: "@fake:matrix.org", displayName: "President", membership: .ban)),
+        .init(with: .init(userID: "@badavatar:matrix.org", avatarURL: .picturesDirectory, membership: .ban))
+    ]
+    
+    static let viewModel = RoomMembersListScreenViewModel(roomProxy: RoomProxyMock(with: .init(displayName: "Some room",
+                                                                                               members: members)),
                                                          mediaProvider: MockMediaProvider(),
                                                          userIndicatorController: ServiceLocator.shared.userIndicatorController)
    static var previews: some View {
        VStack(spacing: 12) {
-            ForEach(members, id: \.userID) { member in
-                RoomMembersListScreenMemberCell(member: .init(withProxy: member), context: viewModel.context)
+            Section("Invited/Joined") {
+                ForEach(members, id: \.userID) { member in
+                    RoomMembersListScreenMemberCell(member: .init(withProxy: member), context: viewModel.context)
+                }
+            }
+            
+            // Banned members should have their profiles hidden and the avatar should use the first letter from their user ID.
+            Section("Banned") {
+                ForEach(bannedMembers, id: \.userID) { member in
+                    RoomMembersListScreenMemberCell(member: .init(withProxy: member), context: viewModel.context)
+                }
            }
        }
    }