New App Layout: Added missing empty states in room list and space bottom sheet

2026-04-20 00:24:43 +02:00 · 2022-08-19 17:12:33 +02:00
parent 1e0dfdb7d3
commit 74454d11cb
14 changed files with 355 additions and 16 deletions
@@ -23,8 +23,8 @@ enum MockSpaceSelectorScreenState: MockScreenState, CaseIterable {
    // A case for each state you want to represent
    // with specific, minimal associated data that will allow you
    // mock that screen.
-    case initialList
    case emptyList
+    case initialList
    case selection

    /// The associated screen
@@ -34,17 +34,17 @@ enum MockSpaceSelectorScreenState: MockScreenState, CaseIterable {
    
    /// A list of screen state definitions
    static var allCases: [MockSpaceSelectorScreenState] {
-        [.initialList, .emptyList, .selection]
+        [.emptyList, .initialList, .selection]
    }
    
    /// Generate the view struct for the screen state.
    var screenView: ([Any], AnyView)  {
        let service: MockSpaceSelectorService
        switch self {
+        case .emptyList:
+            service = MockSpaceSelectorService(spaceList: [])
        case .initialList:
            service = MockSpaceSelectorService()
-        case .emptyList:
-            service = MockSpaceSelectorService(spaceList: [MockSpaceSelectorService.homeItem])
        case .selection:
            service = MockSpaceSelectorService(selectedSpaceId: MockSpaceSelectorService.defaultSpaceList[2].id)
        }
@@ -29,19 +29,23 @@ class SpaceSelectorService: SpaceSelectorServiceProtocol {
    private let showHomeSpace: Bool

    private var spaceList: [SpaceSelectorListItemData] {
-        var itemList = showHomeSpace && parentSpaceId == nil ? [SpaceSelectorListItemData(id: SpaceSelectorConstants.homeSpaceId, icon: Asset.Images.sideMenuActionIconFeedback.image, displayName: VectorL10n.allChatsTitle)] : []
-        
        let notificationCounter = session.spaceService.notificationCounter
        
+        let childSpaces: [SpaceSelectorListItemData]
        if let parentSpaceId = parentSpaceId, let parentSpace = session.spaceService.getSpace(withId: parentSpaceId) {
-            itemList.append(contentsOf: parentSpace.childSpaces.compactMap { space in
+            childSpaces = parentSpace.childSpaces.compactMap { space in
                SpaceSelectorListItemData.itemData(with: space, notificationCounter: notificationCounter)
-            })
+            }
        } else {
-            itemList.append(contentsOf: session.spaceService.rootSpaces.compactMap { space in
+            childSpaces = session.spaceService.rootSpaces.compactMap { space in
                SpaceSelectorListItemData.itemData(with: space, notificationCounter: notificationCounter)
-            })
+            }
        }
+
+        var itemList = showHomeSpace && parentSpaceId == nil && !childSpaces.isEmpty ? [SpaceSelectorListItemData(id: SpaceSelectorConstants.homeSpaceId, icon: Asset.Images.sideMenuActionIconFeedback.image, displayName: VectorL10n.allChatsTitle)] : []
+        
+        itemList.append(contentsOf: childSpaces)
+        
        return itemList
    }
    
@@ -37,6 +37,28 @@ class SpaceSelectorUITests: MockScreenTestCase {
        for (index, item) in MockSpaceSelectorService.defaultSpaceList.enumerated() {
            XCTAssertEqual(item.displayName, spaceItemNameList[index].label)
        }
+        
+        checkIfEmptyPlaceholder(exists: false)
+    }
+    
+    func testEmptyList() {
+        app.goToScreenWithIdentifier(MockSpaceSelectorScreenState.emptyList.title)
+        
+        let disclosureButtons = app.buttons.matching(identifier: "disclosureButton").allElementsBoundByIndex
+        XCTAssertEqual(disclosureButtons.count, 0)
+        let notificationBadges = app.staticTexts.matching(identifier: "notificationBadge").allElementsBoundByIndex
+        XCTAssertEqual(notificationBadges.count, 0)
+        let spaceItemNameList = app.staticTexts.matching(identifier: "itemName").allElementsBoundByIndex
+        XCTAssertEqual(spaceItemNameList.count, 0)
+        checkIfEmptyPlaceholder(exists: true)
+    }
+    
+    // MARK: - Private methods
+    
+    private func checkIfEmptyPlaceholder(exists: Bool) {
+        XCTAssertEqual(app.staticTexts["emptyListPlaceholderTitle"].exists, exists)
+        XCTAssertEqual(app.staticTexts["emptyListPlaceholderMessage"].exists, exists)
+        XCTAssertEqual(app.buttons["createSpaceButton"].exists, exists)
    }

 }
@@ -29,6 +29,18 @@ struct SpaceSelector: View {
    @ObservedObject var viewModel: SpaceSelectorViewModel.Context
    
    var body: some View {
+        VStack {
+            if !viewModel.viewState.items.isEmpty {
+                itemListView
+            } else {
+                emptyListPlaceholder
+            }
+        }
+        .background(theme.colors.background.edgesIgnoringSafeArea(.all))
+        .accentColor(theme.colors.accent)
+    }
+    
+    private var itemListView: some View {
        ScrollView {
            LazyVStack {
                ForEach(viewModel.viewState.items) { item in
@@ -50,7 +62,6 @@ struct SpaceSelector: View {
            }
        }
        .frame(maxHeight: .infinity)
-        .background(theme.colors.background.edgesIgnoringSafeArea(.all))
        .navigationTitle(viewModel.viewState.navigationTitle)
        .toolbar {
            ToolbarItem(placement: .confirmationAction) {
@@ -66,7 +77,32 @@ struct SpaceSelector: View {
                }
            }
        }
-        .accentColor(theme.colors.accent)
+    }
+    
+    private var emptyListPlaceholder: some View {
+        VStack {
+            Spacer()
+            Text(VectorL10n.spaceSelectorEmptyViewTitle)
+                .foregroundColor(theme.colors.primaryContent)
+                .font(theme.fonts.title3SB)
+                .accessibility(identifier: "emptyListPlaceholderTitle")
+            Spacer()
+                .frame(height: 24)
+            Text(VectorL10n.spaceSelectorEmptyViewInformation)
+                .foregroundColor(theme.colors.secondaryContent)
+                .font(theme.fonts.callout)
+                .multilineTextAlignment(.center)
+                .accessibility(identifier: "emptyListPlaceholderMessage")
+            Spacer()
+            Button { viewModel.send(viewAction: .createSpace) } label: {
+                Text(VectorL10n.spaceSelectorCreateSpace)
+                    .font(theme.fonts.bodySB)
+            }
+            .buttonStyle(PrimaryActionButtonStyle())
+            .accessibility(identifier: "createSpaceButton")
+        }
+        .padding(.horizontal, 24)
+        .padding(.bottom, 24)
    }
 }