Repository: wordpress-mobile/WordPress-Android (language: kotlin)

Issue:
[Reader IA] Open existing subscription management screen from Filter sheets
Initially, both for the Blogs and Tags Filter sheet, we will add an "Edit" button on the top right, which should simply open the existing subscription management screen, the same way as the previous "Manage Subscription" top app bar button did.


Discussion hints:
nan

Pull request: [Reader IA] Open subscription management from Filter sheet
Fixes #19859 

> [!CAUTION]
> Should not be merged before #19856

Adds the `Edit` button to the Filter bottom sheet and opens the existing "Subscription Management" screen when tapping that button.

>[!Important]
> In the Reader IA project we are using the word "tag" instead of "topic" and "blog" instead of "site" but the existing subscription management UI uses the previous terminology. We are still figuring out what should be done with respect to that, a conversation started here: p1703879376821999-slack-C05N140C8H5

-----

## To Test:

1. Install and log into Jetpack
2. Go to the Reader
3. Select a Feed that contains filters (like "subscriptions")
4. Tap the "Blog" filter
5. **Verify** the "Edit" button is shown in the sheet (top right corner)
6. Tap the "Edit" button
7. **Verify** it opens the existing subs management screen in the "Sites" page
8. Go back
9. Tap the "Tag" filter
10.  Tap the "Edit" button
11. **Verify** it opens the existing subs management screen in the "Topics" page

-----

## Regression Notes

1. Potential unintended areas of impact

    - N/A

12. What I did to test those areas of impact (or what existing automated tests I relied on)

    - N/A

13. What automated tests I added (or what prevented me from doing so)

    - Updated existing test naming since an existing flow was used.

-----

## PR Submission Checklist:

- [x] I have completed the Regression Notes.
- [x] I have considered adding accessibility improvements for my changes.
- [x] I have considered if this change warrants user-facing release notes and have added them to `RELEASE-NOTES.txt` if necessary.

-----

## UI Changes Testing Checklist:

- [x] Portrait and landscape orientations.
- [x] Light and dark modes.
- [x] Fonts: Larger, smaller and bold text.
- [x] High contrast.
- [x] Talkback.
- [x] Languages with large words or with letters/accents not frequently used in English.
- [ ] Right-to-left languages. (Even if translation isn’t complete, formatting should still respect the right-to-left layout)
- [x] Large and small screen sizes. (Tablet and smaller phones)
- [x] Multi-tasking: Split screen and Pop-up view. (Android 10 or higher)

Test command: ./gradlew :WordPress:testWordpressVanillaDebugUnitTest --tests "org.wordpress.android.ui.reader.subfilter.SubFilterViewModelTest"

Fix patch:
diff --git a/WordPress/src/main/java/org/wordpress/android/ui/reader/ReaderPostListFragment.java b/WordPress/src/main/java/org/wordpress/android/ui/reader/ReaderPostListFragment.java
index b0c2e994c1fc..9836f0d2a617 100644
--- a/WordPress/src/main/java/org/wordpress/android/ui/reader/ReaderPostListFragment.java
+++ b/WordPress/src/main/java/org/wordpress/android/ui/reader/ReaderPostListFragment.java
@@ -107,6 +107,7 @@
 import org.wordpress.android.ui.reader.services.update.ReaderUpdateLogic.UpdateTask;
 import org.wordpress.android.ui.reader.services.update.ReaderUpdateServiceStarter;
 import org.wordpress.android.ui.reader.services.update.TagUpdateClientUtilsProvider;
+import org.wordpress.android.ui.reader.subfilter.ActionType.OpenLoginPage;
 import org.wordpress.android.ui.reader.subfilter.ActionType.OpenSubsAtPage;
 import org.wordpress.android.ui.reader.subfilter.BottomSheetUiState.BottomSheetVisible;
 import org.wordpress.android.ui.reader.subfilter.SubFilterViewModel;
@@ -647,14 +648,14 @@ private void initSubFilterViewModel(@Nullable Bundle savedInstanceState) {
             });
         });
 
-        mSubFilterViewModel.getBottomSheetEmptyViewAction().observe(getViewLifecycleOwner(), event -> {
+        mSubFilterViewModel.getBottomSheetAction().observe(getViewLifecycleOwner(), event -> {
             event.applyIfNotHandled(action -> {
                 if (action instanceof OpenSubsAtPage) {
                     ReaderActivityLauncher.showReaderSubs(
                             requireActivity(),
                             ((OpenSubsAtPage) action).getTabIndex()
                     );
-                } else {
+                } else if (action instanceof OpenLoginPage) {
                     wpMainActivityViewModel.onOpenLoginPage(
                             WPMainNavigationView.Companion.getPosition(PageType.MY_SITE)
                     );
diff --git a/WordPress/src/main/java/org/wordpress/android/ui/reader/SubfilterBottomSheetFragment.kt b/WordPress/src/main/java/org/wordpress/android/ui/reader/SubfilterBottomSheetFragment.kt
index 0dc4f27030d3..fb6bb483af71 100644
--- a/WordPress/src/main/java/org/wordpress/android/ui/reader/SubfilterBottomSheetFragment.kt
+++ b/WordPress/src/main/java/org/wordpress/android/ui/reader/SubfilterBottomSheetFragment.kt
@@ -16,6 +16,7 @@ import com.google.android.material.bottomsheet.BottomSheetDialog
 import com.google.android.material.bottomsheet.BottomSheetDialogFragment
 import org.wordpress.android.R
 import org.wordpress.android.WordPress
+import org.wordpress.android.ui.reader.subfilter.ActionType
 import org.wordpress.android.ui.reader.subfilter.SubFilterViewModel
 import org.wordpress.android.ui.reader.subfilter.SubfilterCategory
 import org.wordpress.android.ui.reader.subfilter.SubfilterCategory.SITES
@@ -78,6 +79,7 @@ class SubfilterBottomSheetFragment : BottomSheetDialogFragment() {
         // TODO thomashortadev: remove the pager and support only one category
         val pager = view.findViewById<ViewPager>(R.id.view_pager)
         val title = view.findViewById<TextView>(R.id.title)
+        val editSubscriptions = view.findViewById<View>(R.id.edit_subscriptions)
         title.text = bottomSheetTitle
         pager.adapter = SubfilterPagerAdapter(
             requireActivity(),
@@ -105,6 +107,15 @@ class SubfilterBottomSheetFragment : BottomSheetDialogFragment() {
             else -> SITES.ordinal
         }
 
+        editSubscriptions.setOnClickListener {
+            val category = categories.firstOrNull() ?: return@setOnClickListener
+            val subsPageIndex = when (category) {
+                SITES -> ReaderSubsActivity.TAB_IDX_FOLLOWED_BLOGS
+                TAGS -> ReaderSubsActivity.TAB_IDX_FOLLOWED_TAGS
+            }
+            viewModel.onBottomSheetActionClicked(ActionType.OpenSubsAtPage(subsPageIndex))
+        }
+
         dialog?.setOnShowListener { dialogInterface ->
             val sheetDialog = dialogInterface as? BottomSheetDialog
 
diff --git a/WordPress/src/main/java/org/wordpress/android/ui/reader/subfilter/BottomSheetPageEmptyUiState.kt b/WordPress/src/main/java/org/wordpress/android/ui/reader/subfilter/BottomSheetPageEmptyUiState.kt
index 273b2802c8c3..590316a74351 100644
--- a/WordPress/src/main/java/org/wordpress/android/ui/reader/subfilter/BottomSheetPageEmptyUiState.kt
+++ b/WordPress/src/main/java/org/wordpress/android/ui/reader/subfilter/BottomSheetPageEmptyUiState.kt
@@ -12,10 +12,10 @@ sealed class SubfilterBottomSheetEmptyUiState {
     ) : SubfilterBottomSheetEmptyUiState()
 }
 
-sealed class ActionType {
+sealed interface ActionType {
     data class OpenSubsAtPage(
         val tabIndex: Int
-    ) : ActionType()
+    ) : ActionType
 
-    object OpenLoginPage : ActionType()
+    data object OpenLoginPage : ActionType
 }
diff --git a/WordPress/src/main/java/org/wordpress/android/ui/reader/subfilter/SubFilterViewModel.kt b/WordPress/src/main/java/org/wordpress/android/ui/reader/subfilter/SubFilterViewModel.kt
index d5da10b5db38..9e6f9543523d 100644
--- a/WordPress/src/main/java/org/wordpress/android/ui/reader/subfilter/SubFilterViewModel.kt
+++ b/WordPress/src/main/java/org/wordpress/android/ui/reader/subfilter/SubFilterViewModel.kt
@@ -60,8 +60,8 @@ class SubFilterViewModel @Inject constructor(
     private val _bottomSheetUiState = MutableLiveData<Event<BottomSheetUiState>>()
     val bottomSheetUiState: LiveData<Event<BottomSheetUiState>> = _bottomSheetUiState
 
-    private val _bottomSheetEmptyViewAction = MutableLiveData<Event<ActionType>>()
-    val bottomSheetEmptyViewAction: LiveData<Event<ActionType>> = _bottomSheetEmptyViewAction
+    private val _bottomSheetAction = MutableLiveData<Event<ActionType>>()
+    val bottomSheetAction: LiveData<Event<ActionType>> = _bottomSheetAction
 
     private val _updateTagsAndSites = MutableLiveData<Event<EnumSet<UpdateTask>>>()
     val updateTagsAndSites: LiveData<Event<EnumSet<UpdateTask>>> = _updateTagsAndSites
@@ -296,7 +296,7 @@ class SubFilterViewModel @Inject constructor(
 
     fun onBottomSheetActionClicked(action: ActionType) {
         _bottomSheetUiState.postValue(Event(BottomSheetHidden))
-        _bottomSheetEmptyViewAction.postValue(Event(action))
+        _bottomSheetAction.postValue(Event(action))
     }
 
     private fun updateSubfilter(filter: SubfilterListItem) {
diff --git a/WordPress/src/main/res/color/on_surface_text_button_selector.xml b/WordPress/src/main/res/color/on_surface_text_button_selector.xml
new file mode 100644
index 000000000000..b4ee9ce42b5a
--- /dev/null
+++ b/WordPress/src/main/res/color/on_surface_text_button_selector.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <item android:alpha="@dimen/material_emphasis_disabled" android:color="?attr/colorOnSurface" android:state_pressed="true" />
+    <item android:color="?attr/colorOnSurface" />
+
+</selector>
diff --git a/WordPress/src/main/res/layout/subfilter_bottom_sheet.xml b/WordPress/src/main/res/layout/subfilter_bottom_sheet.xml
index ab3ee8f910bf..495409eda14d 100644
--- a/WordPress/src/main/res/layout/subfilter_bottom_sheet.xml
+++ b/WordPress/src/main/res/layout/subfilter_bottom_sheet.xml
@@ -1,6 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
-    xmlns:app="http://schemas.android.com/apk/res-auto"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:animateLayoutChanges="true"
@@ -12,11 +11,26 @@
         android:layout_width="match_parent"
         android:layout_height="wrap_content" />
 
-    <org.wordpress.android.widgets.WPTextView
-        android:id="@+id/title"
-        style="@style/SiteTagBottomSheetTitle"
+    <LinearLayout
         android:layout_width="match_parent"
-        android:text="@string/reader_filter_by_blog_title" />
+        android:layout_height="wrap_content"
+        android:orientation="horizontal"
+        android:gravity="center_vertical">
+
+        <org.wordpress.android.widgets.WPTextView
+            android:id="@+id/title"
+            style="@style/SiteTagBottomSheetTitle"
+            android:layout_width="0dp"
+            android:layout_weight="1"
+            android:text="@string/reader_filter_by_blog_title" />
+
+        <org.wordpress.android.widgets.WPTextView
+            android:id="@+id/edit_subscriptions"
+            style="@style/SiteTagBottomSheetAction"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:text="@string/edit"/>
+    </LinearLayout>
 
     <androidx.viewpager.widget.ViewPager
         android:id="@+id/view_pager"
diff --git a/WordPress/src/main/res/values/styles.xml b/WordPress/src/main/res/values/styles.xml
index f70113da5e8d..9318be6007c4 100644
--- a/WordPress/src/main/res/values/styles.xml
+++ b/WordPress/src/main/res/values/styles.xml
@@ -1181,6 +1181,16 @@
         <item name="android:textSize">@dimen/text_sz_larger</item>
     </style>
 
+    <style name="SiteTagBottomSheetAction">
+        <item name="android:textSize">@dimen/text_sz_large</item>
+        <item name="android:textColor">@color/on_surface_text_button_selector</item>
+        <item name="android:paddingStart">@dimen/content_margin_bottom_sheet_row_start</item>
+        <item name="android:paddingEnd">@dimen/content_margin_bottom_sheet_row_start</item>
+        <item name="android:paddingTop">@dimen/margin_large</item>
+        <item name="android:paddingBottom">@dimen/margin_large</item>
+        <item name="android:maxLines">1</item>
+    </style>
+
     <style name="SubfilterDividerItem">
         <item name="android:layout_height">@dimen/one_line_list_item_height</item>
     </style>


Test patch:
diff --git a/WordPress/src/test/java/org/wordpress/android/ui/reader/subfilter/SubFilterViewModelTest.kt b/WordPress/src/test/java/org/wordpress/android/ui/reader/subfilter/SubFilterViewModelTest.kt
index 5b03a80bee56..9e3565518c74 100644
--- a/WordPress/src/test/java/org/wordpress/android/ui/reader/subfilter/SubFilterViewModelTest.kt
+++ b/WordPress/src/test/java/org/wordpress/android/ui/reader/subfilter/SubFilterViewModelTest.kt
@@ -179,22 +179,22 @@ class SubFilterViewModelTest : BaseUnitTest() {
     }
 
     @Test
-    fun `when WPCOM user taps empty bottom sheet SITES cta the subs activity is opened on followed blogs page`() {
+    fun `when WPCOM user taps bottom sheet SITES cta the subs activity is opened on followed blogs page`() {
         val action = OpenSubsAtPage(ReaderSubsActivity.TAB_IDX_FOLLOWED_BLOGS)
         viewModel.onBottomSheetActionClicked(action)
 
         assertThat(viewModel.bottomSheetUiState.value!!.peekContent()).isEqualTo(BottomSheetHidden)
-        assertThat(viewModel.bottomSheetEmptyViewAction.value!!.peekContent())
+        assertThat(viewModel.bottomSheetAction.value!!.peekContent())
             .isEqualTo(action)
     }
 
     @Test
-    fun `when WPCOM user taps empty bottom sheet TAGS cta the subs activity is opened on followed tags page`() {
+    fun `when WPCOM user taps bottom sheet TAGS cta the subs activity is opened on followed tags page`() {
         val action = OpenSubsAtPage(ReaderSubsActivity.TAB_IDX_FOLLOWED_TAGS)
         viewModel.onBottomSheetActionClicked(action)
 
         assertThat(viewModel.bottomSheetUiState.value!!.peekContent()).isEqualTo(BottomSheetHidden)
-        assertThat(viewModel.bottomSheetEmptyViewAction.value!!.peekContent())
+        assertThat(viewModel.bottomSheetAction.value!!.peekContent())
             .isEqualTo(action)
     }
 
@@ -204,7 +204,7 @@ class SubFilterViewModelTest : BaseUnitTest() {
         viewModel.onBottomSheetActionClicked(action)
 
         assertThat(viewModel.bottomSheetUiState.value!!.peekContent()).isEqualTo(BottomSheetHidden)
-        assertThat(viewModel.bottomSheetEmptyViewAction.value!!.peekContent())
+        assertThat(viewModel.bottomSheetAction.value!!.peekContent())
             .isEqualTo(action)
     }