Merge pull request #5833 from selanthiraiyan/issue/4295-mark-all-reviews-as-read

Reviews screen - Mark all as read bar button: Replace checkmark button with menu button and action sheet.

Author: itsmeichigo

RELEASE-NOTES.txt

@@ -6,6 +6,7 @@
 - [**] System status report can now be viewed and copied directly from within the app. [https://github.com/woocommerce/woocommerce-ios/pull/5702]
 - [**] Product SKU input scanner is now available as a beta feature. To try it, enable it from settings and you can scan a barcode to use as the product SKU in product inventory settings! [https://github.com/woocommerce/woocommerce-ios/pull/5695]
 - [**] Now you chan share a payment link when creating a Simple Payments order [https://github.com/woocommerce/woocommerce-ios/pull/5819]
+- [*] Reviews: "Mark all as read" checkmark bar button item button replaced with menu button which launches an action sheet. Menu button is displayed only if there are unread reviews available.[https://github.com/woocommerce/woocommerce-ios/pull/5833]
 
 8.2
 -----

WooCommerce/Classes/ViewRelated/Reviews/ReviewsViewController.swift

@@ -15,12 +15,14 @@ final class ReviewsViewController: UIViewController {
     /// Mark all as read nav bar button
     ///
     private lazy var rightBarButton: UIBarButtonItem = {
-        let item = UIBarButtonItem(image: .checkmarkImage,
+        let item = UIBarButtonItem(image: .ellipsisImage,
                                    style: .plain,
                                    target: self,
-                                   action: #selector(markAllAsRead))
-        item.accessibilityIdentifier = "reviews-mark-all-as-read-button"
-
+                                   action: #selector(presentMoreActions))
+        item.accessibilityIdentifier = "reviews-open-menu-button"
+        item.accessibilityTraits = .button
+        item.accessibilityLabel = Localization.MenuButton.accessibilityLabel
+        item.accessibilityHint = Localization.MenuButton.accessibilityHint
         return item
     }()
 
@@ -132,7 +134,6 @@ final class ReviewsViewController: UIViewController {
         refreshTitle()
 
         configureSyncingCoordinator()
-        configureNavigationBarButtons()
         configureTableView()
         configureTableViewCells()
         configureResultsController()
@@ -183,21 +184,11 @@ private extension ReviewsViewController {
     /// Setup: TabBar
     ///
     func configureTabBarItem() {
-        tabBarItem.title = NSLocalizedString("Reviews", comment: "Title of the Reviews tab — plural form of Review")
+        tabBarItem.title = Localization.tabBarItemTitle
         tabBarItem.image = .starOutlineImage()
         tabBarItem.accessibilityIdentifier = "tab-bar-reviews-item"
     }
 
-    /// Setup: NavigationBar Buttons
-    ///
-    func configureNavigationBarButtons() {
-        rightBarButton.accessibilityTraits = .button
-        rightBarButton.accessibilityLabel = NSLocalizedString("Mark All as Read", comment: "Accessibility label for the Mark All Reviews as Read Button")
-        rightBarButton.accessibilityHint = NSLocalizedString("Marks Every Review as Read",
-                                                             comment: "VoiceOver accessibility hint for the Mark All Reviews as Read Action")
-        navigationItem.rightBarButtonItem = rightBarButton
-    }
-
     /// Setup: TableView
     ///
     func configureTableView() {
@@ -232,10 +223,7 @@ private extension ReviewsViewController {
     }
 
     func refreshTitle() {
-        title = NSLocalizedString(
-            "Reviews",
-            comment: "Title that appears on top of the main Reviews screen (plural form of the word Review)."
-        )
+        title = Localization.title
     }
 }
 
@@ -251,6 +239,20 @@ private extension ReviewsViewController {
         }
     }
 
+    /// Presents an action sheet on tapping the menu right bar button item.
+    ///
+    @IBAction func presentMoreActions() {
+        let actionSheet = UIAlertController(title: nil, message: nil, preferredStyle: .actionSheet)
+        actionSheet.view.tintColor = .text
+
+        actionSheet.addCancelActionWithTitle(Localization.ActionSheet.cancelAction)
+        actionSheet.addDefaultActionWithTitle(Localization.ActionSheet.markAsReadAction) { [weak self] _ in
+            self?.presentMarkAllAsReadConfirmationAlert()
+        }
+
+        present(actionSheet, animated: true)
+    }
+
     @IBAction func markAllAsRead() {
         ServiceLocator.analytics.track(.reviewsListReadAllTapped)
 
@@ -274,7 +276,7 @@ private extension ReviewsViewController {
                 tracks.track(.reviewsMarkAllReadSuccess)
             }
 
-            self.updateMarkAllReadButtonState()
+            self.updateRightBarButtonItem()
             self.tableView.reloadData()
         }
     }
@@ -336,11 +338,11 @@ private extension ReviewsViewController {
     ///
     func displayEmptyViewController() {
         let childController = emptyStateViewController
-        let emptyStateConfig = EmptyStateViewController.Config.withLink(message: NSAttributedString(string: Localization.emptyStateMessage),
-                                                              image: .emptyReviewsImage,
-                                                              details: Localization.emptyStateDetail,
-                                                              linkTitle: Localization.emptyStateAction,
-                                                              linkURL: WooConstants.URLs.productReviewInfo.asURL())
+        let emptyStateConfig = EmptyStateViewController.Config.withLink(message: NSAttributedString(string: Localization.EmptyState.message),
+                                                                        image: .emptyReviewsImage,
+                                                                        details: Localization.EmptyState.detail,
+                                                                        linkTitle: Localization.EmptyState.action,
+                                                                        linkURL: WooConstants.URLs.productReviewInfo.asURL())
 
         // Abort if we are already displaying this childController
         guard childController.parent == nil,
@@ -412,7 +414,7 @@ private extension ReviewsViewController {
     /// Note: Just because this func runs does not guarantee `didEnter()` or `didLeave()` will run as well.
     ///
     func willEnter(state: State) {
-        updateNavBarButtonsState()
+        updateRightBarButtonItem()
     }
 
     /// Runs whenever the FSM enters a State.
@@ -478,16 +480,10 @@ private extension ReviewsViewController {
 //
 private extension ReviewsViewController {
 
-    /// Enables/disables the navbar buttons if needed
-    ///
-    /// - Parameter filterEnabled: If true, the filter navbar buttons is enabled; if false, it's disabled
+    /// Show the rightBarButtonItem only if there are unread reviews available.
     ///
-    func updateNavBarButtonsState() {
-        updateMarkAllReadButtonState()
-    }
-
-    func updateMarkAllReadButtonState() {
-        rightBarButton.isEnabled = viewModel.hasUnreadNotifications
+    func updateRightBarButtonItem() {
+        navigationItem.rightBarButtonItem = viewModel.hasUnreadNotifications ? rightBarButton : nil
     }
 
     /// Displays the `Mark all as read` Notice if the number of times it was previously displayed is lower than the
@@ -499,10 +495,26 @@ private extension ReviewsViewController {
         }
 
         markAsReadCount += 1
-        let message = NSLocalizedString("All reviews marked as read", comment: "Mark all reviews as read notice")
-        let notice = Notice(title: message, feedbackType: .success)
+        let notice = Notice(title: Localization.Notice.allReviewsMarkedAsRead, feedbackType: .success)
         ServiceLocator.noticePresenter.enqueue(notice: notice)
     }
+
+    /// Presents an alert which asks the user for confirmation
+    /// before marking all reviews as read.
+    ///
+    func presentMarkAllAsReadConfirmationAlert() {
+        let alertController = UIAlertController(title: Localization.MarkAllAsReadAlert.title,
+                                                message: Localization.MarkAllAsReadAlert.message,
+                                                preferredStyle: .alert)
+        alertController.view.tintColor = .text
+
+        alertController.addActionWithTitle(Localization.MarkAllAsReadAlert.cancelButtonTitle, style: .destructive)
+        alertController.addDefaultActionWithTitle(Localization.MarkAllAsReadAlert.markAllButtonTitle) { [weak self] _ in
+            self?.markAllAsRead()
+        }
+
+        present(alertController, animated: true)
+    }
 }
 
 
@@ -602,9 +614,53 @@ private extension ReviewsViewController {
 //
 private extension ReviewsViewController {
     enum Localization {
-        static let emptyStateMessage = NSLocalizedString("Get your first reviews", comment: "Message shown in the Reviews tab if the list is empty")
-        static let emptyStateDetail = NSLocalizedString("Capture high-quality product reviews for your store.",
-                                                        comment: "Detailed message shown in the Reviews tab if the list is empty")
-        static let emptyStateAction = NSLocalizedString("Learn more", comment: "Title of button shown in the Reviews tab if the list is empty")
+        static let title = NSLocalizedString("Reviews",
+                                             comment: "Title that appears on top of the main Reviews screen (plural form of the word Review).")
+
+        static let tabBarItemTitle = NSLocalizedString("Reviews",
+                                                       comment: "Title of the Reviews tab — plural form of Review")
+
+        enum MenuButton {
+            static let accessibilityLabel = NSLocalizedString("Open menu",
+                                                        comment: "Accessibility label for the Menu button")
+            static let accessibilityHint = NSLocalizedString("Menu button which opens an action sheet with option to mark all reviews as read.",
+                                                       comment: "VoiceOver accessibility hint for the Menu button action")
+        }
+
+        enum ActionSheet {
+            static let markAsReadAction = NSLocalizedString("Mark all reviews as read",
+                                                            comment: "Option to mark all reviews as read from the action sheet in Reviews screen.")
+
+            static let cancelAction = NSLocalizedString("Cancel",
+                                                        comment: "Cancel the more menu action sheet in Reviews screen.")
+        }
+
+        enum MarkAllAsReadAlert {
+            static let title = NSLocalizedString("Mark all as read",
+                                                 comment: "Title of Alert which asks user for confirmation before marking all reviews as read.")
+
+            static let message = NSLocalizedString("Are you sure you want to mark all reviews as read?",
+                                                   comment: "Alert message to confirm a user meant to mark all reviews as read.")
+
+            static let cancelButtonTitle = NSLocalizedString("Cancel",
+                                                             comment: "Alert button title - dismisses alert, which cancels marking all as read attempt.")
+
+            static let markAllButtonTitle = NSLocalizedString("Mark all",
+                                                              comment: "Alert button title - confirms and marks all reviews as read")
+        }
+
+        enum Notice {
+            static let allReviewsMarkedAsRead = NSLocalizedString("All reviews marked as read",
+                                                                  comment: "Mark all reviews as read notice")
+        }
+
+        enum EmptyState {
+            static let message = NSLocalizedString("Get your first reviews",
+                                                             comment: "Message shown in the Reviews tab if the list is empty")
+            static let detail = NSLocalizedString("Capture high-quality product reviews for your store.",
+                                                            comment: "Detailed message shown in the Reviews tab if the list is empty")
+            static let action = NSLocalizedString("Learn more",
+                                                            comment: "Title of button shown in the Reviews tab if the list is empty")
+        }
     }
 }

WooCommerce/UITestsFoundation/Screens/Reviews/ReviewsScreen.swift

@@ -12,7 +12,7 @@ public final class ReviewsScreen: ScreenObject {
 
     public init(app: XCUIApplication = XCUIApplication()) throws {
         try super.init(
-            expectedElementGetters: [ { $0.buttons["reviews-mark-all-as-read-button"] } ],
+            expectedElementGetters: [ { $0.buttons["reviews-open-menu-button"] } ],
             app: app
         )
     }