Improve empty state for lists (IOS-287)

Localization/app.json

@@ -491,6 +491,9 @@
                 "offline": "Offline",
                 "new_posts": "New Posts",
                 "post_sent": "Post Sent"
+            },
+            "empty_state": {
+                "list_empty_message_title": "This list is empty"
             }
         },
         "suggestion_account": {

Mastodon/Scene/HomeTimeline/HomeTimelineViewController.swift

@@ -28,6 +28,10 @@ final class HomeTimelineViewController: UIViewController, NeedsDependency, Media
     var viewModel: HomeTimelineViewModel?
 
     let mediaPreviewTransitionController = MediaPreviewTransitionController()
+    
+    enum EmptyViewUseCase {
+        case timeline, list
+    }
 
     let friendsAssetImageView: UIImageView = {
         let imageView = UIImageView()
@@ -335,24 +339,24 @@ extension HomeTimelineViewController {
         
         viewModel?.timelineIsEmpty
             .receive(on: DispatchQueue.main)
-            .sink { [weak self] isEmpty in
+            .sink { [weak self] state in
-                if isEmpty {
+                guard let state else {
-                    self?.showEmptyView()
-
-                    let userDoesntFollowPeople: Bool
-                    if let authContext = self?.authContext,
-                       let me = authContext.mastodonAuthenticationBox.authentication.account() {
-                        userDoesntFollowPeople = me.followersCount == 0
-                    } else {
-                        userDoesntFollowPeople = true
-                    }
-
-                    if (self?.viewModel?.presentedSuggestions == false) && userDoesntFollowPeople {
-                        self?.findPeopleButtonPressed(self)
-                        self?.viewModel?.presentedSuggestions = true
-                    }
-                } else {
                     self?.emptyView.removeFromSuperview()
+                    return
+                }
+                self?.showEmptyView(state)
+
+                let userDoesntFollowPeople: Bool
+                if let authContext = self?.authContext,
+                   let me = authContext.mastodonAuthenticationBox.authentication.account() {
+                    userDoesntFollowPeople = me.followersCount == 0
+                } else {
+                    userDoesntFollowPeople = true
+                }
+
+                if (self?.viewModel?.presentedSuggestions == false) && userDoesntFollowPeople {
+                    self?.findPeopleButtonPressed(self)
+                    self?.viewModel?.presentedSuggestions = true
                 }
             }
             .store(in: &disposeBag)
@@ -478,7 +482,7 @@ extension HomeTimelineViewController {
 }
 
 extension HomeTimelineViewController {
-    func showEmptyView() {
+    func showEmptyView(_ state: HomeTimelineViewModel.EmptyViewState) {
         if emptyView.superview != nil {
             return
         }
@@ -494,48 +498,61 @@ extension HomeTimelineViewController {
         if emptyView.arrangedSubviews.count > 0 {
             return
         }
-        let findPeopleButton: PrimaryActionButton = {
-            let button = PrimaryActionButton()
-            button.setTitle(L10n.Common.Controls.Actions.findPeople, for: .normal)
-            button.addTarget(self, action: #selector(HomeTimelineViewController.findPeopleButtonPressed(_:)), for: .touchUpInside)
-            return button
-        }()
-        NSLayoutConstraint.activate([
-            findPeopleButton.heightAnchor.constraint(equalToConstant: 46)
-        ])
-        
-        let manuallySearchButton: HighlightDimmableButton = {
-            let button = HighlightDimmableButton()
-            button.titleLabel?.font = UIFontMetrics(forTextStyle: .headline).scaledFont(for: .systemFont(ofSize: 15, weight: .semibold))
-            button.setTitle(L10n.Common.Controls.Actions.manuallySearch, for: .normal)
-            button.setTitleColor(Asset.Colors.Brand.blurple.color, for: .normal)
-            button.addTarget(self, action: #selector(HomeTimelineViewController.manuallySearchButtonPressed(_:)), for: .touchUpInside)
-            return button
-        }()
 
-        let topPaddingView = UIView()
+        switch state {
-        let bottomPaddingView = UIView()
+        case .list:
+            let noStatusesLabel: UILabel = {
+                let label = UILabel()
+                label.text = L10n.Scene.HomeTimeline.EmptyState.listEmptyMessageTitle
+                label.textColor = Asset.Colors.Label.secondary.color
+                label.textAlignment = .center
+                return label
+            }()
+            emptyView.addArrangedSubview(noStatusesLabel)
+        case .timeline:
+            let findPeopleButton: PrimaryActionButton = {
+                let button = PrimaryActionButton()
+                button.setTitle(L10n.Common.Controls.Actions.findPeople, for: .normal)
+                button.addTarget(self, action: #selector(HomeTimelineViewController.findPeopleButtonPressed(_:)), for: .touchUpInside)
+                return button
+            }()
+            NSLayoutConstraint.activate([
+                findPeopleButton.heightAnchor.constraint(equalToConstant: 46)
+            ])
+            
+            let manuallySearchButton: HighlightDimmableButton = {
+                let button = HighlightDimmableButton()
+                button.titleLabel?.font = UIFontMetrics(forTextStyle: .headline).scaledFont(for: .systemFont(ofSize: 15, weight: .semibold))
+                button.setTitle(L10n.Common.Controls.Actions.manuallySearch, for: .normal)
+                button.setTitleColor(Asset.Colors.Brand.blurple.color, for: .normal)
+                button.addTarget(self, action: #selector(HomeTimelineViewController.manuallySearchButtonPressed(_:)), for: .touchUpInside)
+                return button
+            }()
 
-        emptyView.addArrangedSubview(topPaddingView)
+            let topPaddingView = UIView()
-        emptyView.addArrangedSubview(friendsAssetImageView)
+            let bottomPaddingView = UIView()
-        emptyView.addArrangedSubview(bottomPaddingView)
 
-        topPaddingView.translatesAutoresizingMaskIntoConstraints = false
+            emptyView.addArrangedSubview(topPaddingView)
-        bottomPaddingView.translatesAutoresizingMaskIntoConstraints = false
+            emptyView.addArrangedSubview(friendsAssetImageView)
-        NSLayoutConstraint.activate([
+            emptyView.addArrangedSubview(bottomPaddingView)
-            topPaddingView.heightAnchor.constraint(equalTo: bottomPaddingView.heightAnchor, multiplier: 0.8),
-            manuallySearchButton.heightAnchor.constraint(greaterThanOrEqualToConstant: 20),
-        ])
 
-        let buttonContainerStackView = UIStackView()
+            topPaddingView.translatesAutoresizingMaskIntoConstraints = false
-        emptyView.addArrangedSubview(buttonContainerStackView)
+            bottomPaddingView.translatesAutoresizingMaskIntoConstraints = false
-        buttonContainerStackView.isLayoutMarginsRelativeArrangement = true
+            NSLayoutConstraint.activate([
-        buttonContainerStackView.layoutMargins = UIEdgeInsets(top: 0, left: 32, bottom: 22, right: 32)
+                topPaddingView.heightAnchor.constraint(equalTo: bottomPaddingView.heightAnchor, multiplier: 0.8),
-        buttonContainerStackView.axis = .vertical
+                manuallySearchButton.heightAnchor.constraint(greaterThanOrEqualToConstant: 20),
-        buttonContainerStackView.spacing = 17
+            ])
 
-        buttonContainerStackView.addArrangedSubview(findPeopleButton)
+            let buttonContainerStackView = UIStackView()
-        buttonContainerStackView.addArrangedSubview(manuallySearchButton)
+            emptyView.addArrangedSubview(buttonContainerStackView)
+            buttonContainerStackView.isLayoutMarginsRelativeArrangement = true
+            buttonContainerStackView.layoutMargins = UIEdgeInsets(top: 0, left: 32, bottom: 22, right: 32)
+            buttonContainerStackView.axis = .vertical
+            buttonContainerStackView.spacing = 17
+
+            buttonContainerStackView.addArrangedSubview(findPeopleButton)
+            buttonContainerStackView.addArrangedSubview(manuallySearchButton)
+        }
     }
 }
 

Mastodon/Scene/HomeTimeline/HomeTimelineViewModel+LoadLatestState.swift

@@ -105,7 +105,8 @@ extension HomeTimelineViewModel.LoadLatestState {
 
         guard let viewModel else { return }
 
-
+        viewModel.timelineIsEmpty.send(nil)
+        
         Task { @MainActor in
             let latestFeedRecords = viewModel.dataController.records
 
@@ -170,8 +171,20 @@ extension HomeTimelineViewModel.LoadLatestState {
                     
                     viewModel.dataController.records = (toAdd + latestFeedRecords).removingDuplicates()
                 }
-                viewModel.timelineIsEmpty.value = latestStatusIDs.isEmpty && statuses.isEmpty
+
-                
+                viewModel.timelineIsEmpty.value = (latestStatusIDs.isEmpty && statuses.isEmpty) ? {
+                    switch viewModel.timelineContext {
+                    case .home:
+                        return .timeline
+                    case .public:
+                        return .timeline
+                    case .list:
+                        return .list
+                    case .hashtag:
+                        return .list
+                    }
+                }() : nil
+
                 if !isUserInitiated {
                     FeedbackGenerator.shared.generate(.impact(.light))
                 }

Mastodon/Scene/HomeTimeline/HomeTimelineViewModel.swift

@@ -43,11 +43,15 @@ final class HomeTimelineViewModel: NSObject {
             hasNewPosts.send(false)
         }
     }
+    
+    enum EmptyViewState {
+        case timeline, list
+    }
 
     weak var tableView: UITableView?
     weak var timelineMiddleLoaderTableViewCellDelegate: TimelineMiddleLoaderTableViewCellDelegate?
     
-    let timelineIsEmpty = CurrentValueSubject<Bool, Never>(false)
+    let timelineIsEmpty = CurrentValueSubject<EmptyViewState?, Never>(nil)
     let homeTimelineNeedRefresh = PassthroughSubject<Void, Never>()
     
     // output

MastodonSDK/Sources/MastodonLocalization/Generated/Strings.swift

@@ -857,6 +857,10 @@ public enum L10n {
     public enum HomeTimeline {
       /// Home
       public static let title = L10n.tr("Localizable", "Scene.HomeTimeline.Title", fallback: "Home")
+      public enum EmptyState {
+        /// This list is empty
+        public static let listEmptyMessageTitle = L10n.tr("Localizable", "Scene.HomeTimeline.EmptyState.ListEmptyMessageTitle", fallback: "This list is empty")
+      }
       public enum TimelineMenu {
         /// Following
         public static let following = L10n.tr("Localizable", "Scene.HomeTimeline.TimelineMenu.Following", fallback: "Following")

MastodonSDK/Sources/MastodonLocalization/Resources/Base.lproj/Localizable.strings

@@ -303,6 +303,7 @@ uploaded to Mastodon.";
 "Scene.Follower.Title" = "follower";
 "Scene.Following.Footer" = "Follows from other servers are not displayed.";
 "Scene.Following.Title" = "following";
+"Scene.HomeTimeline.EmptyState.ListEmptyMessageTitle" = "This list is empty";
 "Scene.HomeTimeline.TimelineMenu.Following" = "Following";
 "Scene.HomeTimeline.TimelineMenu.LocalCommunity" = "Local";
 "Scene.HomeTimeline.TimelineMenu.Lists.Title" = "Lists";