Reader: Add "Your Tags" feed menu item (#22981)

WordPress/Classes/ViewRelated/Reader/ReaderHelpers.swift

@@ -629,7 +629,7 @@ extension ReaderHelpers {
 
     static let defaultSavedItemPosition = 2
 
-    /// Sorts the default tabs according to the order [Following, Discover, Likes], and adds the Saved tab
+    /// Sorts the default tabs according to the order [Discover, Subscriptions, Saved, Liked, Your Tags]
     class func rearrange(items: [ReaderTabItem]) -> [ReaderTabItem] {
 
         guard !items.isEmpty else {
@@ -642,23 +642,20 @@ extension ReaderHelpers {
                 return true
             }
 
-            // first item: Discover
             if topicIsDiscover(leftTopic) {
                 return true
             }
             if topicIsDiscover(rightTopic) {
                 return false
             }
 
-            // second item: Following/subscriptions
             if topicIsFollowing(leftTopic) {
                 return true
             }
             if topicIsFollowing(rightTopic) {
                 return false
             }
 
-            // third item: Likes
             if topicIsLiked(leftTopic) {
                 return true
             }
@@ -674,10 +671,13 @@ extension ReaderHelpers {
             return true
         }
 
-        // fourth item: Saved. It's manually inserted after the sorting
         let savedPosition = min(mutableItems.count, defaultSavedItemPosition)
         mutableItems.insert(ReaderTabItem(ReaderContent(topic: nil, contentType: .saved)), at: savedPosition)
 
+        if FeatureFlag.readerTagsFeed.enabled {
+            mutableItems.append(ReaderTabItem(ReaderContent(topic: nil, contentType: .tags)))
+        }
+
         // in case of log in with a self hosted site, prepend a 'dummy' Following tab
         if !isLoggedIn() {
             mutableItems.insert(ReaderTabItem(ReaderContent(topic: nil, contentType: .selfHostedFollowing)), at: 0)

WordPress/Classes/ViewRelated/Reader/Tab Navigation/ReaderNavigationButton.swift

@@ -6,23 +6,16 @@ struct ReaderNavigationButton: View {
 
     var body: some View {
         Menu {
-            ForEach(viewModel.filterItems, id: \.self) { item in
-                menuButton(for: item)
-            }
-            if viewModel.listItems.count > 0 {
+            ForEach(menuItemGroups, id: \.self) { group in
                 Section {
-                    if viewModel.listItems.count > 2 {
-                        Menu {
-                            ForEach(viewModel.listItems, id: \.self) { item in
-                                menuButton(for: item)
-                            }
-                        } label: {
-                            Text(Strings.lists)
-                        }
-                    } else {
-                        ForEach(viewModel.listItems, id: \.self) { item in
-                            menuButton(for: item)
+                    ForEach(group, id: \.self) { item in
+                        menuButton(for: item)
+                    }
+                    if group == menuItemGroups.last && viewModel.listItems.count > 0 {
+                        if !FeatureFlag.readerTagsFeed.enabled {
+                            Divider()
                         }
+                        listMenuItem
                     }
                 }
             }
@@ -38,6 +31,42 @@ struct ReaderNavigationButton: View {
         }
     }
 
+    private var menuItemGroups: [[ReaderTabItem]] {
+        var items: [[ReaderTabItem]] = [[]]
+        var currentGroup = 0
+        for item in viewModel.filterItems {
+            if item.content.type == .saved || item.content.type == .tags {
+                currentGroup += 1
+                items.append([item])
+                continue
+            }
+            items[currentGroup].append(item)
+        }
+
+        return items
+    }
+
+    @ViewBuilder
+    private var listMenuItem: some View {
+        if viewModel.listItems.count > 2 {
+            Menu {
+                ForEach(viewModel.listItems, id: \.self) { item in
+                    menuButton(for: item)
+                }
+            } label: {
+                HStack {
+                    Text(Strings.lists)
+                    Spacer()
+                    Image("reader-menu-list")
+                }
+            }
+        } else {
+            ForEach(viewModel.listItems, id: \.self) { item in
+                menuButton(for: item)
+            }
+        }
+    }
+
     private func menuLabel(for item: ReaderTabItem) -> some View {
         /// There's a bug/unexpected behavior with how `SwiftUI.Menu`'s label "twitches" when it's animated.
         /// Using `ZStack` is a hack to prevent the "container" view from twitching during animation.
@@ -100,6 +129,8 @@ private extension ReaderTabItem {
     var image: Image? {
         if content.type == .saved {
             return Image("reader-menu-saved")
+        } else if content.type == .tags {
+            return Image("reader-menu-tags")
         }
 
         switch content.topicType {
@@ -126,6 +157,8 @@ private extension ReaderTabItem {
 
         if content.type == .saved {
             return "saved"
+        } else if content.type == .tags {
+            return "tags"
         }
 
         switch content.topicType {

WordPress/Classes/ViewRelated/Reader/Tab Navigation/ReaderTabItem.swift

@@ -47,6 +47,8 @@ extension ReaderTabItem {
             return Titles.followingTitle
         case .saved:
             return Titles.savedTitle
+        case .tags:
+            return Titles.tagsTitle
         default:
             return Titles.emptyTitle
         }
@@ -68,6 +70,11 @@ extension ReaderTabItem {
             value: "Saved",
             comment: "Reader navigation menu item for the Saved filter"
         )
+        static let tagsTitle = NSLocalizedString(
+            "reader.navigation.menu.tags",
+            value: "Your Tags",
+            comment: "Reader navigation menu item for the Tags filter"
+        )
         static let emptyTitle = ""
     }
 }
@@ -77,6 +84,7 @@ enum ReaderContentType {
     case selfHostedFollowing
     case contentError
     case saved
+    case tags
     case topic
 }
 

WordPress/Jetpack/AppImages.xcassets/Reader/reader-menu-list.imageset/Contents.json

@@ -0,0 +1,15 @@
+{
+  "images" : [
+    {
+      "filename" : "reader-menu-list.svg",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
+  }
+}

WordPress/Jetpack/AppImages.xcassets/Reader/reader-menu-tags.imageset/Contents.json

@@ -0,0 +1,15 @@
+{
+  "images" : [
+    {
+      "filename" : "reader-menu-tags.svg",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
+  }
+}