Reader: Merge feature branch for UI updates to content navigation and filtering (#22536)

Author: dvdchr

API-Mocks/WordPressMocks/src/main/assets/mocks/mappings/wpcom/reader/rest_v2_read_tags_cards.json

@@ -15,6 +15,31 @@
       "page": 1,
       "refresh": 1,
       "cards": [
+        {
+          "type": "interests_you_may_like",
+          "data": [
+            {
+              "slug": "blogging",
+              "title": "Blogging",
+              "score": 278
+            },
+            {
+              "slug": "travel",
+              "title": "Travel",
+              "score": 251
+            },
+            {
+              "slug": "photos",
+              "title": "Photos",
+              "score": 173
+            },
+            {
+              "slug": "technology",
+              "title": "Technology",
+              "score": 139
+            }
+          ]
+        },
         {
           "type": "interests_you_may_like",
           "data": [
@@ -3934,13 +3959,12 @@
             "use_excerpt": false
           }
         }
-      ],
-      "next_page_handle": "ZnJvbT04JnJlZnJlc2g9MQ=="
+      ]
     },
     "headers": {
       "Content-Type": "application/json",
       "Connection": "keep-alive",
       "Cache-Control": "no-cache, must-revalidate, max-age=0"
     }
   }
-}
+}

RELEASE-NOTES.txt

@@ -3,6 +3,7 @@
 * [**] Prevent images from temporarily disappearing when uploading media [https://github.com/WordPress/gutenberg/pull/57869]
 * [**] Fix crash occurring on large post on Android [https://github.com/WordPress/gutenberg/pull/58266]
 * [*] [Jetpack-only] Site Monitoring: Add Metrics, PHP Logs, and Web Server Logs under Site Monitoring [#22475, #22499, #22504, #22500]
+* [***] [Jetpack-only] Reader: introduced new UI/UX for content navigation and filtering [#]
 
 24.0.1
 -----

WordPress/Classes/Extensions/NoResultsViewController+FollowedSites.swift

@@ -2,11 +2,21 @@ import Foundation
 
 extension NoResultsViewController {
     private struct Constants {
-        static let noFollowedSitesTitle = NSLocalizedString("No followed sites", comment: "Title for the no followed sites result screen")
-        static let noFollowedSitesSubtitle = NSLocalizedString("When you follow sites, you’ll see their content here.", comment: "Subtitle for the no followed sites result screen")
-        static let noFollowedSitesButtonTitle = NSLocalizedString("Discover Sites", comment: "Title for button on the no followed sites result screen")
-
-        static let noFollowedSitesImage = "wp-illustration-following-empty-results"
+        static let noFollowedSitesTitle = NSLocalizedString(
+            "reader.no.blogs.title",
+            value: "No blog subscriptions",
+            comment: "Title for the no followed blogs result screen"
+        )
+        static let noFollowedSitesSubtitle = NSLocalizedString(
+            "reader.no.blogs.subtitle",
+            value: "Subscribe to blogs in Discover and you’ll see their latest posts here. Or search for a blog that you like already.",
+            comment: "Subtitle for the no followed blogs result screen"
+        )
+        static let noFollowedSitesButtonTitle = NSLocalizedString(
+            "reader.no.blogs.button",
+            value: "Discover Blogs",
+            comment: "Title for button on the no followed blogs result screen"
+        )
     }
 
     class func noFollowedSitesController(showActionButton showButton: Bool) -> NoResultsViewController {
@@ -23,11 +33,23 @@ extension NoResultsViewController {
                              buttonTitle: showButton ? Constants.noFollowedSitesButtonTitle : nil,
                              attributedSubtitle: subtitleText,
                              attributedSubtitleConfiguration: { (attributedText: NSAttributedString) -> NSAttributedString? in
-                                return subtitleText },
-                             image: Constants.noFollowedSitesImage)
-        controller.labelStackViewSpacing = 12
+                                return subtitleText })
+        controller.hideImageView()
+        controller.labelStackViewSpacing = 8
         controller.labelButtonStackViewSpacing = 18
+        controller.loadViewIfNeeded()
+        controller.setupReaderButtonStyles()
 
         return controller
     }
 }
+
+extension NoResultsViewController {
+
+    func setupReaderButtonStyles() {
+        actionButton.primaryNormalBackgroundColor = .text
+        actionButton.primaryTitleColor = .systemBackground
+        actionButton.primaryHighlightBackgroundColor = .text
+    }
+
+}

WordPress/Classes/Extensions/Post+BloggingPrompts.swift

@@ -36,9 +36,9 @@ extension Post {
             """
     }
 
-    private enum Strings {
+    enum Strings {
         static let promptTag = "dailyprompt"
-        static let emptyParagraphBlock = """
+        fileprivate static let emptyParagraphBlock = """
         <!-- wp:paragraph -->
         <p></p>
         <!-- /wp:paragraph -->

WordPress/Classes/Services/Reader Post/ReaderPostService.m

@@ -768,8 +768,8 @@ - (void)mergePosts:(NSArray *)remotePosts
         [self deletePostsFromBlockedSitesInContext:context];
 
         BOOL spaceAvailable = ([self numberOfPostsForTopic:readerTopic inContext:context] < [self maxPostsToSaveForTopic:readerTopic]);
-        if ([ReaderHelpers isTopicTag:readerTopic]) {
-            // For tags, assume there is more content as long as more than zero results are returned.
+        if ([ReaderHelpers isTopicTag:readerTopic] || [ReaderHelpers isRSSFeed:readerTopic]) {
+            // For tags and RSS feeds, assume there is more content as long as more than zero results are returned.
             hasMore = (postsCount > 0 ) && spaceAvailable;
         } else {
             // For other topics, assume there is more content as long as the number of results requested is returned.
@@ -1153,8 +1153,8 @@ - (ReaderPost *)createOrReplaceFromRemotePost:(RemoteReaderPost *)remotePost for
 - (BOOL)canLoadMorePostsForTopic:(ReaderAbstractTopic * _Nonnull)readerTopic remotePosts:(NSArray * _Nonnull)remotePosts inContext: (NSManagedObjectContext * _Nonnull)context {
     BOOL hasMore = NO;
     BOOL spaceAvailable = ([self numberOfPostsForTopic:readerTopic inContext:context] < [self maxPostsToSaveForTopic:readerTopic]);
-    if ([ReaderHelpers isTopicTag:readerTopic]) {
-        // For tags, assume there is more content as long as more than zero results are returned.
+    if ([ReaderHelpers isTopicTag:readerTopic] || [ReaderHelpers isRSSFeed:readerTopic]) {
+        // For tags and RSS feeds, assume there is more content as long as more than zero results are returned.
         hasMore = ([remotePosts count] > 0 ) && spaceAvailable;
     } else {
         // For other topics, assume there is more content as long as the number of results requested is returned.

WordPress/Classes/Services/ReaderCardService.swift

@@ -52,6 +52,12 @@ class ReaderCardService {
                                     }
 
                                     cards.enumerated().forEach { index, remoteCard in
+                                        if isFirstPage && index == 0 && remoteCard.type == .interests {
+                                            // Removes displaying the tags recommendation card
+                                            // first in the Discover feed
+                                            return
+                                        }
+
                                         let card = ReaderCard(context: context, from: remoteCard)
 
                                         // Assign each interest an endpoint

WordPress/Classes/Services/ReaderSiteService.m

@@ -287,7 +287,12 @@ - (NSError *)errorForNotLoggedIn
 
 - (NSError *)errorForAlreadyFollowingSiteOrFeed
 {
-    NSString *description = NSLocalizedString(@"You are already following this site.", @"Error message informing the user that they are already following a site in their reader.");
+
+    NSString *description = NSLocalizedStringWithDefaultValue(@"reader.error.already.subscribed.message",
+                                                              nil,
+                                                              [NSBundle mainBundle],
+                                                              @"You are already subscribed to this blog.",
+                                                              @"Error message informing the user that they are already following a blog in their reader.");
     NSDictionary *userInfo = @{NSLocalizedDescriptionKey:description};
     NSError *error = [[NSError alloc] initWithDomain:ReaderSiteServiceErrorDomain code:ReaderSiteServiceErrorAlreadyFollowingSite userInfo:userInfo];
     return error;

WordPress/Classes/Utility/Analytics/WPAnalyticsEvent.swift

@@ -305,6 +305,10 @@ import Foundation
     case readerManageViewDisplayed
     case readerManageViewDismissed
 
+    // Reader: Navigation menu dropdown
+    case readerDropdownOpened
+    case readerDropdownItemTapped
+
     // App Settings
     case settingsDidChange
 
@@ -1097,6 +1101,12 @@ import Foundation
         case .readerManageViewDismissed:
             return "reader_manage_view_dismissed"
 
+        // Reader: Navigation menu dropdown
+        case .readerDropdownOpened:
+            return "reader_dropdown_menu_opened"
+        case .readerDropdownItemTapped:
+            return "reader_dropdown_menu_item_tapped"
+
         // App Settings
         case .settingsDidChange:
             return "settings_did_change"

WordPress/Classes/ViewRelated/Reader/Detail/Views/ReaderDetailHeaderView.swift

@@ -236,7 +236,11 @@ class ReaderDetailHeaderView: UIStackView, NibLoadable, ReaderDetailHeader {
 
         blogNameButton.isAccessibilityElement = true
         blogNameButton.accessibilityTraits = [.staticText, .button]
-        blogNameButton.accessibilityHint = NSLocalizedString("Shows the site's posts.", comment: "Accessibility hint for the site name and URL button on Reader's Post Details.")
+        blogNameButton.accessibilityHint = NSLocalizedString(
+            "reader.blog.name.accessibility.hint",
+            value: "Shows the blog's posts.",
+            comment: "Accessibility hint for the blog name and URL button on Reader's Post Details."
+        )
         if let label = blogNameLabel(post) {
             blogNameButton.accessibilityLabel = label
         }