Add RoomChangeRolesScreen. (#2534)

Not part of a flow yet, just the screen.
2026-11-02 12:07:55 +00:00 · 2024-03-07 16:24:05 +00:00
parent 063b3732b1
commit 046f1dd533
19 changed files with 904 additions and 0 deletions
@@ -0,0 +1,67 @@
+//
+// Copyright 2022 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+// periphery:ignore:all - this is just a roomChangeRoles remove this comment once generating the final file
+
+import Combine
+import SwiftUI
+
+struct RoomChangeRolesScreenCoordinatorParameters {
+    let mode: RoomMemberDetails.Role
+    let roomProxy: RoomProxyProtocol
+    let userIndicatorController: UserIndicatorControllerProtocol
+}
+
+enum RoomChangeRolesScreenCoordinatorAction {
+    case done
+}
+
+final class RoomChangeRolesScreenCoordinator: CoordinatorProtocol {
+    private let parameters: RoomChangeRolesScreenCoordinatorParameters
+    private let viewModel: RoomChangeRolesScreenViewModelProtocol
+    
+    private var cancellables = Set<AnyCancellable>()
+ 
+    private let actionsSubject: PassthroughSubject<RoomChangeRolesScreenCoordinatorAction, Never> = .init()
+    var actionsPublisher: AnyPublisher<RoomChangeRolesScreenCoordinatorAction, Never> {
+        actionsSubject.eraseToAnyPublisher()
+    }
+    
+    init(parameters: RoomChangeRolesScreenCoordinatorParameters) {
+        self.parameters = parameters
+        
+        viewModel = RoomChangeRolesScreenViewModel(mode: parameters.mode,
+                                                   roomProxy: parameters.roomProxy,
+                                                   userIndicatorController: parameters.userIndicatorController)
+    }
+    
+    func start() {
+        viewModel.actionsPublisher.sink { [weak self] action in
+            MXLog.info("Coordinator: received view model action: \(action)")
+            
+            guard let self else { return }
+            switch action {
+            case .done:
+                self.actionsSubject.send(.done)
+            }
+        }
+        .store(in: &cancellables)
+    }
+        
+    func toPresentable() -> AnyView {
+        AnyView(RoomChangeRolesScreen(context: viewModel.context))
+    }
+}
@@ -0,0 +1,101 @@
+//
+// Copyright 2022 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import Collections
+import Foundation
+
+enum RoomChangeRolesScreenViewModelAction {
+    case done
+}
+
+struct RoomChangeRolesScreenViewState: BindableState {
+    /// The screen's current mode (which role we are promoting/demoting users to/from.
+    let mode: RoomMemberDetails.Role
+    /// All of the room's members.
+    var members: [RoomMemberDetails]
+    var bindings: RoomChangeRolesScreenViewStateBindings
+    
+    /// The members selected for promotion to the current role.
+    var membersToPromote: Set<RoomMemberDetails> = []
+    /// The member selected for demotion back to a regular user.
+    var membersToDemote: Set<RoomMemberDetails> = []
+    
+    /// The last member added to the carousel at the top of the screen.
+    var lastPromotedMember: RoomMemberDetails?
+    
+    /// The screen's title.
+    var title: String {
+        switch mode {
+        case .administrator:
+            L10n.screenRoomChangeRoleAdministratorsTitle
+        case .moderator:
+            L10n.screenRoomChangeRoleModeratorsTitle
+        case .user:
+            "" // The screen can't be configured with this role.
+        }
+    }
+    
+    /// The visible members in the screen (after searching).
+    var visibleMembers: [RoomMemberDetails] {
+        guard !bindings.searchQuery.isEmpty else { return members }
+        
+        return members.filter { member in
+            member.name?.localizedStandardContains(bindings.searchQuery) == true
+                || member.id.localizedStandardContains(bindings.searchQuery)
+        }
+    }
+    
+    /// All of the members who will gain/keep this screen's role after saving any changes.
+    var membersWithRole: [RoomMemberDetails] {
+        members.filter(isMemberSelected)
+    }
+    
+    /// Whether or not any changes have been made to the members.
+    var hasChanges: Bool {
+        !membersToPromote.isEmpty || !membersToDemote.isEmpty
+    }
+    
+    /// Whether or not the user is searching.
+    var isSearching: Bool {
+        !bindings.searchQuery.isEmpty
+    }
+    
+    /// Whether or not a specific member has this screen's role.
+    func isMemberSelected(_ member: RoomMemberDetails) -> Bool {
+        guard !membersToDemote.contains(member) else { return false }
+        return member.role == mode || membersToPromote.contains(member)
+    }
+}
+
+struct RoomChangeRolesScreenViewStateBindings {
+    var searchQuery = ""
+    /// Information about the currently displayed alert.
+    var alertInfo: AlertInfo<RoomChangePermissionsScreenAlertType>?
+}
+
+enum RoomChangeRolesScreenAlertType {
+    /// The generic error message.
+    case generic
+}
+
+enum RoomChangeRolesScreenViewAction {
+    /// Promote/Demote the specified member, toggling their role between user and this screen's role.
+    case toggleMember(RoomMemberDetails)
+    /// Demote the specified member to a regular user.
+    case demoteMember(RoomMemberDetails)
+    /// Save all the changes that the user has made.
+    case save
+}
@@ -0,0 +1,133 @@
+//
+// Copyright 2022 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import Combine
+import SwiftUI
+
+typealias RoomChangeRolesScreenViewModelType = StateStoreViewModel<RoomChangeRolesScreenViewState, RoomChangeRolesScreenViewAction>
+
+class RoomChangeRolesScreenViewModel: RoomChangeRolesScreenViewModelType, RoomChangeRolesScreenViewModelProtocol {
+    private let roomProxy: RoomProxyProtocol
+    private let userIndicatorController: UserIndicatorControllerProtocol
+    
+    private let actionsSubject: PassthroughSubject<RoomChangeRolesScreenViewModelAction, Never> = .init()
+    var actionsPublisher: AnyPublisher<RoomChangeRolesScreenViewModelAction, Never> {
+        actionsSubject.eraseToAnyPublisher()
+    }
+
+    init(mode: RoomMemberDetails.Role, roomProxy: RoomProxyProtocol, userIndicatorController: UserIndicatorControllerProtocol) {
+        guard mode != .user else { fatalError("Invalid screen configuration: \(mode)") }
+        
+        self.roomProxy = roomProxy
+        self.userIndicatorController = userIndicatorController
+        
+        super.init(initialViewState: RoomChangeRolesScreenViewState(mode: mode,
+                                                                    members: [],
+                                                                    bindings: .init()))
+        
+        roomProxy.membersPublisher
+            .receive(on: DispatchQueue.main)
+            .sink { [weak self] members in
+                self?.updateMembers(members)
+            }
+            .store(in: &cancellables)
+        
+        roomProxy.timeline.timelineProvider.membershipChangePublisher.sink { [roomProxy] in
+            Task { await roomProxy.updateMembers() }
+        }
+        .store(in: &cancellables)
+        
+        updateMembers(roomProxy.membersPublisher.value)
+    }
+    
+    // MARK: - Public
+    
+    override func process(viewAction: RoomChangeRolesScreenViewAction) {
+        MXLog.info("View model: received view action: \(viewAction)")
+        
+        switch viewAction {
+        case .toggleMember(let member):
+            toggleMember(member)
+        case .demoteMember(let member):
+            demoteMember(member)
+        case .save:
+            Task { await save() }
+        }
+    }
+    
+    // MARK: - Private
+    
+    private func updateMembers(_ members: [RoomMemberProxyProtocol]) {
+        state.members = members.sorted().compactMap { member in
+            guard member.membership == .join, member.userID != roomProxy.ownUserID else { return nil }
+            return RoomMemberDetails(withProxy: member)
+        }
+    }
+    
+    private func toggleMember(_ member: RoomMemberDetails) {
+        if state.membersToPromote.contains(member) {
+            state.membersToPromote.remove(member)
+        } else if state.membersToDemote.contains(member) {
+            state.membersToDemote.remove(member)
+            state.lastPromotedMember = member
+        } else if member.role == state.mode {
+            state.membersToDemote.insert(member)
+        } else {
+            state.membersToPromote.insert(member)
+            state.lastPromotedMember = member
+        }
+    }
+    
+    private func demoteMember(_ member: RoomMemberDetails) {
+        if state.membersToPromote.contains(member) {
+            state.membersToPromote.remove(member)
+        } else {
+            state.membersToDemote.insert(member)
+        }
+    }
+    
+    private func save() async {
+        showSavingIndicator()
+        
+        defer {
+            hideSavingIndicator()
+        }
+        
+        let promotingUpdates = state.membersToPromote.map { ($0.id, state.mode.rustPowerLevel) }
+        let demotingUpdates = state.membersToDemote.map { ($0.id, Int64(0)) }
+        switch await roomProxy.updatePowerLevelsForUsers(promotingUpdates + demotingUpdates) {
+        case .success:
+            MXLog.info("Success")
+        case .failure:
+            context.alertInfo = AlertInfo(id: .generic)
+        }
+    }
+    
+    // MARK: Loading indicator
+    
+    private static let indicatorID = "SavingRoomRoles"
+    
+    private func showSavingIndicator() {
+        userIndicatorController.submitIndicator(UserIndicator(id: Self.indicatorID,
+                                                              type: .modal(progress: .indeterminate, interactiveDismissDisabled: true, allowsInteraction: false),
+                                                              title: L10n.commonSaving,
+                                                              persistent: true))
+    }
+    
+    private func hideSavingIndicator() {
+        userIndicatorController.retractIndicatorWithId(Self.indicatorID)
+    }
+}
@@ -0,0 +1,23 @@
+//
+// Copyright 2022 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import Combine
+
+@MainActor
+protocol RoomChangeRolesScreenViewModelProtocol {
+    var actionsPublisher: AnyPublisher<RoomChangeRolesScreenViewModelAction, Never> { get }
+    var context: RoomChangeRolesScreenViewModelType.Context { get }
+}
@@ -0,0 +1,152 @@
+//
+// Copyright 2022 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import Compound
+import SwiftUI
+
+struct RoomChangeRolesScreen: View {
+    @ObservedObject var context: RoomChangeRolesScreenViewModel.Context
+    
+    var showTopSection: Bool {
+        !context.viewState.membersWithRole.isEmpty || context.viewState.isSearching
+    }
+    
+    var body: some View {
+        mainContent
+            .compoundList()
+            .scrollDismissesKeyboard(.immediately)
+            .navigationTitle(context.viewState.title)
+            .navigationBarTitleDisplayMode(.inline)
+            .navigationBarBackButtonHidden(context.viewState.hasChanges)
+            .toolbar { toolbar }
+            .searchController(query: $context.searchQuery,
+                              placeholder: L10n.commonSearchForSomeone,
+                              showsCancelButton: false,
+                              disablesInteractiveDismiss: true)
+            .compoundSearchField()
+            .alert(item: $context.alertInfo)
+    }
+    
+    // MARK: - Private
+    
+    private var mainContent: some View {
+        GeometryReader { proxy in
+            Form {
+                if showTopSection {
+                    // this is a fix for having the carousel not clipped, and inside the form, so when the search is dismissed, it wont break the design
+                    Section {
+                        EmptyView()
+                    } header: {
+                        membersWithRoleSection
+                            .textCase(.none)
+                            .frame(width: proxy.size.width)
+                    }
+                }
+                
+                membersSection
+            }
+        }
+    }
+    
+    private var noResultsContent: some View {
+        Text(L10n.commonNoResults)
+            .font(.compound.bodyLG)
+            .foregroundColor(.compound.textSecondary)
+            .frame(maxWidth: .infinity)
+            .listRowBackground(Color.clear)
+            .accessibilityIdentifier(A11yIdentifiers.startChatScreen.searchNoResults)
+    }
+    
+    @ViewBuilder
+    private var membersSection: some View {
+        if !context.viewState.visibleMembers.isEmpty {
+            Section {
+                ForEach(context.viewState.visibleMembers, id: \.id) { member in
+                    RoomChangeRolesScreenRow(member: member,
+                                             imageProvider: context.imageProvider,
+                                             kind: .multiSelection(isSelected: context.viewState.isMemberSelected(member)) {
+                                                 context.send(viewAction: .toggleMember(member))
+                                             })
+                                             .disabled(member.role == .administrator)
+                }
+            } header: {
+                Text(L10n.screenRoomMemberListRoomMembersHeaderTitle)
+                    .compoundListSectionHeader()
+            }
+        } else {
+            Section.empty
+        }
+    }
+    
+    @ScaledMetric private var cellWidth: CGFloat = 72
+
+    private var membersWithRoleSection: some View {
+        ScrollView(.horizontal, showsIndicators: false) {
+            ScrollViewReader { scrollView in
+                HStack(spacing: 16) {
+                    ForEach(context.viewState.membersWithRole, id: \.id) { member in
+                        RoomChangeRolesScreenSelectedItem(member: member, imageProvider: context.imageProvider) {
+                            context.send(viewAction: .demoteMember(member))
+                        }
+                        .frame(width: cellWidth)
+                    }
+                }
+                .onChange(of: context.viewState.lastPromotedMember) { member in
+                    guard let member else { return }
+                    withElementAnimation(.easeInOut) {
+                        scrollView.scrollTo(member.id)
+                    }
+                }
+                .padding(.horizontal, 14)
+            }
+        }
+    }
+    
+    @ToolbarContentBuilder
+    private var toolbar: some ToolbarContent {
+        ToolbarItem(placement: .confirmationAction) {
+            Button(L10n.actionSave) {
+                context.send(viewAction: .save)
+            }
+            .disabled(!context.viewState.hasChanges)
+        }
+    }
+}
+
+// MARK: - Previews
+
+struct RoomChangeRolesScreen_Previews: PreviewProvider, TestablePreview {
+    static let administratorViewModel = makeViewModel(mode: .administrator)
+    static let moderatorViewModel = makeViewModel(mode: .moderator)
+    
+    static var previews: some View {
+        NavigationStack {
+            RoomChangeRolesScreen(context: administratorViewModel.context)
+        }
+        .previewDisplayName("Administrators")
+        
+        NavigationStack {
+            RoomChangeRolesScreen(context: moderatorViewModel.context)
+        }
+        .previewDisplayName("Moderators")
+    }
+    
+    static func makeViewModel(mode: RoomMemberDetails.Role) -> RoomChangeRolesScreenViewModel {
+        RoomChangeRolesScreenViewModel(mode: mode,
+                                       roomProxy: RoomProxyMock(with: .init(members: .allMembersAsAdmin)),
+                                       userIndicatorController: UserIndicatorControllerMock())
+    }
+}
@@ -0,0 +1,72 @@
+//
+// Copyright 2023 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import Compound
+import MatrixRustSDK
+import SwiftUI
+
+struct RoomChangeRolesScreenRow: View {
+    let member: RoomMemberDetails
+    let imageProvider: ImageProviderProtocol?
+    
+    let kind: ListRow<LoadableAvatarImage, EmptyView, EmptyView, Bool>.Kind<EmptyView, Bool>
+    
+    var body: some View {
+        ListRow(label: .avatar(title: member.name ?? member.id,
+                               description: member.name == nil ? nil : member.id,
+                               icon: avatar),
+                kind: kind)
+    }
+    
+    var avatar: LoadableAvatarImage {
+        LoadableAvatarImage(url: member.avatarURL,
+                            name: member.name,
+                            contentID: member.id,
+                            avatarSize: .user(on: .startChat),
+                            imageProvider: imageProvider)
+    }
+}
+
+struct RoomChangeRolesScreenRow_Previews: PreviewProvider, TestablePreview {
+    static let action: () -> Void = { }
+    
+    static var previews: some View {
+        Form {
+            RoomChangeRolesScreenRow(member: .init(withProxy: RoomMemberProxyMock.mockAlice),
+                                     imageProvider: MockMediaProvider(),
+                                     kind: .multiSelection(isSelected: true, action: action))
+            
+            RoomChangeRolesScreenRow(member: .init(withProxy: RoomMemberProxyMock.mockBob),
+                                     imageProvider: MockMediaProvider(),
+                                     kind: .multiSelection(isSelected: false, action: action))
+            
+            RoomChangeRolesScreenRow(member: .init(withProxy: RoomMemberProxyMock.mockCharlie),
+                                     imageProvider: MockMediaProvider(),
+                                     kind: .multiSelection(isSelected: true, action: action))
+                .disabled(true)
+            
+            RoomChangeRolesScreenRow(member: .init(withProxy: RoomMemberProxyMock(with: .init(userID: "@someone:matrix.org", membership: .join))),
+                                     imageProvider: MockMediaProvider(),
+                                     kind: .multiSelection(isSelected: false, action: action))
+                .disabled(true)
+            
+            RoomChangeRolesScreenRow(member: .init(withProxy: RoomMemberProxyMock(with: .init(userID: "@someone:matrix.org", membership: .join))),
+                                     imageProvider: MockMediaProvider(),
+                                     kind: .multiSelection(isSelected: false, action: action))
+        }
+        .compoundList()
+    }
+}
@@ -0,0 +1,80 @@
+//
+// Copyright 2023 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import SwiftUI
+
+struct RoomChangeRolesScreenSelectedItem: View {
+    let member: RoomMemberDetails
+    let imageProvider: ImageProviderProtocol?
+    let dismissAction: () -> Void
+    
+    var body: some View {
+        VStack(spacing: 4) {
+            avatar
+            
+            Text(member.name ?? member.id)
+                .font(.compound.bodyMD)
+                .foregroundColor(.compound.textPrimary)
+                .lineLimit(1)
+        }
+    }
+    
+    // MARK: - Private
+    
+    var avatar: some View {
+        LoadableAvatarImage(url: member.avatarURL,
+                            name: member.name,
+                            contentID: member.id,
+                            avatarSize: .user(on: .inviteUsers),
+                            imageProvider: imageProvider)
+            .overlay(alignment: .topTrailing) {
+                if member.role != .administrator {
+                    Button(action: dismissAction) {
+                        Image(systemName: "xmark.circle.fill")
+                            .resizable()
+                            .scaledFrame(size: 20)
+                            .symbolRenderingMode(.palette)
+                            .foregroundStyle(Color.compound.iconOnSolidPrimary, Color.compound.iconPrimary)
+                    }
+                    .offset(x: 4)
+                }
+            }
+    }
+}
+
+struct RoomChangeRolesScreenSelectedItem_Previews: PreviewProvider, TestablePreview {
+    static let members: [RoomMemberDetails] = [
+        RoomMemberProxyMock.mockAlice,
+        RoomMemberProxyMock.mockDan,
+        RoomMemberProxyMock.mockVerbose,
+        RoomMemberProxyMock(with: .init(userID: "@someone:server.org", membership: .join)),
+        RoomMemberProxyMock.mockAdmin
+    ]
+    .map { .init(withProxy: $0) }
+    
+    static var previews: some View {
+        HStack(spacing: 12) {
+            ForEach(members, id: \.id) { member in
+                RoomChangeRolesScreenSelectedItem(member: member,
+                                                  imageProvider: MockMediaProvider(),
+                                                  dismissAction: { })
+                    .frame(width: 72)
+            }
+        }
+        .padding()
+        .previewLayout(.sizeThatFits)
+    }
+}