Merge pull request #20952 from wordpress-mobile/issue/Comment-Details…

…-Trash-moderation-redesign

Comment details trash moderation redesign

WordPress/src/main/java/org/wordpress/android/ui/comments/CommentDetailFragment.java

@@ -14,6 +14,7 @@
 import androidx.core.content.res.ResourcesCompat;
 import androidx.fragment.app.FragmentManager;
 import androidx.fragment.app.FragmentTransaction;
+import androidx.lifecycle.ViewModelProvider;
 
 import com.gravatar.AvatarQueryOptions;
 import com.gravatar.AvatarUrl;
@@ -138,6 +139,8 @@ public abstract class CommentDetailFragment extends ViewPagerFragment implements
 
     @Nullable protected CommentDetailFragmentBinding mBinding = null;
 
+    private CommentDetailViewModel mViewModel;
+
     private final OnActionClickListener mOnActionClickListener = new OnActionClickListener() {
         @Override public void onEditCommentClicked() {
             editComment();
@@ -168,7 +171,7 @@ public abstract class CommentDetailFragment extends ViewPagerFragment implements
     public void onCreate(@Nullable Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         ((WordPress) requireActivity().getApplication()).component().inject(this);
-
+        mViewModel = new ViewModelProvider(this).get(CommentDetailViewModel.class);
         mCommentSource = (CommentSource) requireArguments().getSerializable(KEY_MODE);
         setHasOptionsMenu(true);
     }
@@ -655,7 +658,7 @@ private void trackModerationEvent(final CommentStatus newStatus) {
     /*
      * approve, disapprove, spam, or trash the current comment
      */
-    private void moderateComment(
+    protected void moderateComment(
             @NonNull SiteModel site,
             @NonNull CommentModel comment,
             @Nullable Note note,
@@ -687,33 +690,14 @@ private void moderateComment(
         // Fire the appropriate listener if we have one
         if (note != null && mOnNoteCommentActionListener != null) {
             mOnNoteCommentActionListener.onModerateCommentForNote(note, newStatus);
-            dispatchModerationAction(site, comment, newStatus);
+            mViewModel.dispatchModerationAction(site, comment, newStatus);
         } else if (mOnCommentActionListener != null) {
             mOnCommentActionListener.onModerateComment(comment, newStatus);
             // Sad, but onModerateComment does the moderation itself (due to the undo bar), this should be refactored,
             // That's why we don't call dispatchModerationAction() here.
         }
     }
 
-    private void dispatchModerationAction(
-            @NonNull SiteModel site,
-            @NonNull CommentModel comment,
-            CommentStatus newStatus
-    ) {
-        if (newStatus == CommentStatus.DELETED) {
-            // For deletion, we need to dispatch a specific action.
-            mCommentsStoreAdapter.dispatch(
-                    CommentActionBuilder.newDeleteCommentAction(new RemoteCommentPayload(site, comment))
-            );
-        } else {
-            // Actual moderation (push the modified comment).
-            comment.setStatus(newStatus.toString());
-            mCommentsStoreAdapter.dispatch(
-                    CommentActionBuilder.newPushCommentAction(new RemoteCommentPayload(site, comment))
-            );
-        }
-    }
-
     /*
      * display the comment associated with the passed notification
      */

WordPress/src/main/java/org/wordpress/android/ui/comments/CommentDetailViewModel.kt

@@ -57,15 +57,21 @@ class CommentDetailViewModel @Inject constructor(
     }
 
     /**
-     * Dispatch a moderation action to the server, it does not include [CommentStatus.DELETED] status
+     * Dispatch a moderation action to the server
      */
     fun dispatchModerationAction(site: SiteModel, comment: CommentModel, status: CommentStatus) {
+        comment.apply { this.status = status.toString() }
         commentsStoreAdapter.dispatch(
-            CommentActionBuilder.newPushCommentAction(CommentStore.RemoteCommentPayload(site, comment))
+            if (status == CommentStatus.DELETED) {
+                // For deletion, we need to dispatch a specific action.
+                CommentActionBuilder.newDeleteCommentAction(CommentStore.RemoteCommentPayload(site, comment))
+            } else {
+                // Actual moderation (push the modified comment).
+                CommentActionBuilder.newPushCommentAction(CommentStore.RemoteCommentPayload(site, comment))
+            }
         )
 
-        comment.apply { this.status = status.toString() }
-            .let { _updatedComment.postValue(it) }
+        _updatedComment.postValue(comment)
     }
 
     /**

WordPress/src/main/java/org/wordpress/android/ui/comments/SharedCommentDetailFragment.kt

@@ -8,6 +8,7 @@ import android.widget.TextView
 import androidx.core.content.ContextCompat
 import androidx.core.view.isVisible
 import androidx.fragment.app.viewModels
+import com.google.android.material.dialog.MaterialAlertDialogBuilder
 import com.gravatar.AvatarQueryOptions
 import com.gravatar.AvatarUrl
 import com.gravatar.types.Email
@@ -16,6 +17,7 @@ import org.wordpress.android.R
 import org.wordpress.android.analytics.AnalyticsTracker
 import org.wordpress.android.databinding.CommentApprovedBinding
 import org.wordpress.android.databinding.CommentPendingBinding
+import org.wordpress.android.databinding.CommentTrashBinding
 import org.wordpress.android.fluxc.model.CommentModel
 import org.wordpress.android.fluxc.model.CommentStatus
 import org.wordpress.android.fluxc.model.SiteModel
@@ -79,29 +81,45 @@ abstract class SharedCommentDetailFragment : CommentDetailFragment() {
         // reset visibilities
         mBinding?.layoutCommentPending?.root?.isVisible = false
         mBinding?.layoutCommentApproved?.root?.isVisible = false
+        mBinding?.layoutCommentTrash?.root?.isVisible = false
 
         val commentStatus = CommentStatus.fromString(comment.status)
         when (commentStatus) {
             CommentStatus.APPROVED -> mBinding?.layoutCommentApproved?.bindApprovedView()
             CommentStatus.UNAPPROVED -> mBinding?.layoutCommentPending?.bindPendingView()
-            CommentStatus.SPAM -> {}
-            CommentStatus.TRASH -> {}
-            CommentStatus.DELETED -> {}
-            CommentStatus.ALL -> {}
-            CommentStatus.UNREPLIED -> {}
-            CommentStatus.UNSPAM -> {}
-            CommentStatus.UNTRASH -> {}
+            CommentStatus.SPAM, CommentStatus.TRASH -> mBinding?.layoutCommentTrash?.bindTrashView()
+            CommentStatus.DELETED,
+            CommentStatus.ALL,
+            CommentStatus.UNREPLIED,
+            CommentStatus.UNSPAM,
+            CommentStatus.UNTRASH -> {
+                // do nothing
+            }
         }
     }
 
+    private fun CommentTrashBinding.bindTrashView() {
+        root.isVisible = true
+        buttonDeleteComment.setOnClickListener {
+            showDeleteCommentDialog()
+        }
+    }
+
+    private fun showDeleteCommentDialog() {
+        MaterialAlertDialogBuilder(requireContext())
+            .setTitle(R.string.delete)
+            .setMessage(R.string.dlg_sure_to_delete_comment)
+            .setPositiveButton(R.string.yes) { _, _ ->
+                moderateComment(site, comment, mNote, CommentStatus.DELETED)
+            }
+            .setNegativeButton(R.string.no) { _, _ -> }
+            .show()
+    }
+
     private fun CommentPendingBinding.bindPendingView() {
         root.isVisible = true
         buttonApproveComment.setOnClickListener {
-            viewModel.dispatchModerationAction(
-                site,
-                comment,
-                CommentStatus.APPROVED
-            )
+            moderateComment(site, comment, mNote, CommentStatus.APPROVED)
         }
         textMoreOptions.setOnClickListener { showModerationBottomSheet() }
     }
@@ -168,7 +186,10 @@ abstract class SharedCommentDetailFragment : CommentDetailFragment() {
                 canTrash = enabledActions.canTrash(),
             )
         ).apply {
-            onApprovedClicked = { viewModel.dispatchModerationAction(site, comment, CommentStatus.APPROVED) }
+            onApprovedClicked = { moderateComment(site, comment, mNote, CommentStatus.APPROVED) }
+            onPendingClicked = { moderateComment(site, comment, mNote, CommentStatus.UNAPPROVED) }
+            onTrashClicked = { moderateComment(site, comment, mNote, CommentStatus.TRASH) }
+            onSpamClicked = { moderateComment(site, comment, mNote, CommentStatus.SPAM) }
         }.show(childFragmentManager, ModerationBottomSheetDialogFragment.TAG)
     }
 }

WordPress/src/main/java/org/wordpress/android/ui/notifications/NotificationsDetailActivity.java

@@ -568,7 +568,10 @@ public void onModerateCommentForNote(@NonNull Note note, @NonNull CommentStatus
         resultIntent.putExtra(NotificationsListFragment.NOTE_MODERATE_STATUS_EXTRA, newStatus.toString());
 
         setResult(RESULT_OK, resultIntent);
-        finish();
+
+        if (newStatus == CommentStatus.DELETED) {
+            finish();
+        }
     }
 
     @SuppressWarnings("unused")

WordPress/src/main/res/drawable/trash_24.xml

@@ -0,0 +1,9 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+  <path
+      android:pathData="M20.5,5H14.8C14.8,3.7 13.8,2.7 12.5,2.7C11.2,2.7 10.2,3.7 10.2,5H4.5V7H6V7.3L7.7,18.4C7.8,19.4 8.7,20.1 9.7,20.1H15.4C16.4,20.1 17.2,19.4 17.4,18.4L19.1,7.3V7H20.5V5ZM17.3,7L15.6,18.1C15.6,18.2 15.5,18.3 15.3,18.3H9.6C9.5,18.3 9.3,18.2 9.3,18.1L7.7,7H17.3Z"
+      android:fillColor="#ffffff"/>
+</vector>

WordPress/src/main/res/layout/comment_detail_fragment.xml

@@ -31,6 +31,13 @@
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:visibility="gone"/>
+
+        <include
+            android:id="@+id/layout_comment_trash"
+            layout="@layout/comment_trash"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:visibility="gone"/>
     </FrameLayout>
 
     <ProgressBar

WordPress/src/main/res/layout/comment_trash.xml

@@ -0,0 +1,38 @@
+<?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:orientation="vertical"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content">
+
+    <View
+        android:layout_width="match_parent"
+        android:layout_height="1px"
+        android:background="@color/divider_likes" />
+
+    <TextView
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_gravity="center_horizontal"
+        android:layout_marginTop="@dimen/margin_extra_large"
+        android:drawablePadding="@dimen/margin_small"
+        android:gravity="center_vertical"
+        android:includeFontPadding="false"
+        android:fontFamily="sans-serif-medium"
+        android:text="@string/comment_moderation_trash"
+        android:textColor="@color/menu_more"
+        android:textSize="@dimen/text_sz_small" />
+
+    <com.google.android.material.button.MaterialButton
+        android:id="@+id/button_delete_comment"
+        style="@style/Widget.ShareButton"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:layout_marginHorizontal="@dimen/margin_extra_large"
+        android:layout_marginTop="@dimen/margin_medium"
+        android:layout_marginBottom="@dimen/margin_extra_extra_medium_large"
+        android:text="@string/comment_moderation_delete"
+        app:icon="@drawable/trash_24"
+        app:iconGravity="textStart"
+        app:iconTint="?attr/colorSurface" />
+</LinearLayout>

WordPress/src/main/res/values/strings.xml

@@ -465,8 +465,10 @@
     <string name="comment_action_change_status">Change status</string>
 
     <string name="comment_moderation_pending">Comment pending moderation</string>
+    <string name="comment_moderation_trash">Comment in Trash</string>
     <string name="comment_moderation_approved">Comment Approved</string>
     <string name="comment_moderation_approve">Approve comment</string>
+    <string name="comment_moderation_delete">Delete permanently</string>
     <string name="comment_moderation_more">More options</string>
     <string name="comment_moderation_status_title">Choose status</string>
     <string name="comment_moderation_status_approved">Approved</string>