NT-2044: UI – Handle long translations for fail to post error message (…

…#1289) * refactored layout file * added custom error * fixed nested views * fixed lint errors
kickstarter · Jun 15, 2021 · 243bd5a · 243bd5a
1 parent a5648a9
commit 243bd5a
Show file tree

Hide file tree

Showing 7 changed files with 49 additions and 10 deletions.
diff --git a/app/src/main/java/com/kickstarter/libs/utils/extensions/GroupExt.kt b/app/src/main/java/com/kickstarter/libs/utils/extensions/GroupExt.kt
@@ -0,0 +1,10 @@
+package com.kickstarter.libs.utils.extensions
+
+import android.view.View
+import androidx.constraintlayout.widget.Group
+
+fun Group.setAllOnClickListener(listener: (View) -> Unit) {
+    referencedIds.forEach { id ->
+        rootView.findViewById<View>(id).setOnClickListener(listener)
+    }
+}
diff --git a/app/src/main/java/com/kickstarter/ui/views/CommentCard.kt b/app/src/main/java/com/kickstarter/ui/views/CommentCard.kt
@@ -12,6 +12,7 @@ import androidx.core.view.isInvisible
 import androidx.core.view.isVisible
 import com.kickstarter.R
 import com.kickstarter.databinding.CommentCardBinding
+import com.kickstarter.libs.utils.extensions.setAllOnClickListener
 import com.kickstarter.ui.extensions.loadCircleImage
 import com.kickstarter.ui.extensions.makeLinks
 import com.kickstarter.ui.extensions.parseHtmlTag
@@ -32,7 +33,7 @@ class CommentCard @JvmOverloads constructor(
 
         bindFlaggedMessage()
 
-        binding.retryButton.setOnClickListener {
+        binding.retryButtonGroup.setAllOnClickListener {
             onCommentCardClickedListener?.onRetryViewClicked(it)
         }
 
@@ -130,7 +131,7 @@ class CommentCard @JvmOverloads constructor(
             hideReplyButton()
         }
 
-        binding.retryButton.isVisible =
+        binding.retryButtonGroup.isVisible =
             cardCommentStatus == CommentCardStatus.FAILED_TO_SEND_COMMENT
 
         binding.postingButton.isVisible =

diff --git a/app/src/main/res/layout/comment_card.xml b/app/src/main/res/layout/comment_card.xml
@@ -63,19 +63,30 @@
         android:drawableStart="@drawable/ic_arrow_reply"
         android:text="@string/reply"
         android:layout_marginTop="@dimen/grid_3"
-        app:layout_goneMarginTop="0dp"
+        app:layout_goneMarginTop="@dimen/grid_none"
+        android:layout_marginStart="@dimen/grid_none"
         app:layout_constraintBottom_toTopOf="@+id/separtor"
         app:layout_constraintStart_toStartOf="@id/avatar"
         app:layout_constraintTop_toBottomOf="@id/replies" />
 
-    <androidx.appcompat.widget.AppCompatButton
+
+    <androidx.appcompat.widget.AppCompatImageView
         android:id="@+id/retry_button"
+        style="@style/CommentsReplayButton"
+        android:layout_marginStart="@dimen/grid_none"
+        android:layout_marginTop="@dimen/grid_0"
+        app:layout_constraintTop_toBottomOf="@id/replies"
+        app:layout_constraintStart_toStartOf="@id/avatar"
+        android:src="@drawable/ic_retry_send_comment" />
+
+    <androidx.appcompat.widget.AppCompatTextView
+        android:id="@+id/retry_message"
         style="@style/CommentsRetryButton"
-        android:drawableStart="@drawable/ic_retry_send_comment"
+        android:layout_width="@dimen/grid_none"
+        android:gravity="start"
         android:text="@string/Couldnt_post"
-        android:visibility="gone"
-        app:layout_constraintBottom_toTopOf="@+id/separtor"
-        app:layout_constraintStart_toStartOf="@id/avatar"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toEndOf="@id/retry_button"
         app:layout_constraintTop_toBottomOf="@id/replies" />
 
     <androidx.appcompat.widget.AppCompatButton
@@ -85,6 +96,7 @@
         android:drawableStart="@drawable/ic_retry_send_comment"
         android:text="@string/posting"
         android:visibility="gone"
+        android:layout_marginStart="@dimen/grid_none"
         app:layout_constraintBottom_toTopOf="@+id/separtor"
         app:layout_constraintStart_toStartOf="@id/avatar"
         app:layout_constraintTop_toBottomOf="@id/comment_body" />
@@ -96,6 +108,7 @@
         android:drawableStart="@drawable/ic_posted_check"
         android:text="@string/posted"
         android:visibility="gone"
+        android:layout_marginStart="@dimen/grid_none"
         app:layout_constraintBottom_toTopOf="@+id/separtor"
         app:layout_constraintStart_toStartOf="@id/avatar"
         app:layout_constraintTop_toBottomOf="@id/comment_body" />
@@ -133,6 +146,15 @@
         tools:visibility="visible"
         app:constraint_referenced_ids="flagged_message,info_button" />
 
+    <androidx.constraintlayout.widget.Group
+        android:id="@+id/retry_button_group"
+        android:layout_width="wrap_content"
+        android:visibility="gone"
+        app:layout_constraintBottom_toTopOf="@id/separtor"
+        android:layout_height="wrap_content"
+        tools:visibility="visible"
+        app:constraint_referenced_ids="retry_button,retry_message" />
+
     <androidx.constraintlayout.widget.Group
         android:id="@+id/comment_deleted_message_group"
         android:layout_width="wrap_content"

diff --git a/app/src/main/res/layout/comment_composer_view.xml b/app/src/main/res/layout/comment_composer_view.xml
@@ -1,6 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
 
-<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+<androidx.constraintlayout.widget.ConstraintLayout
+    xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"

diff --git a/app/src/main/res/values/dimens.xml b/app/src/main/res/values/dimens.xml
@@ -1,5 +1,6 @@
 <resources>
   <!-- Kickstarter six-point grid keylines-->
+  <dimen name="grid_none">0dp</dimen>
   <dimen name="grid_0">2dp</dimen>
   <dimen name="grid_1_half">3dp</dimen>
   <dimen name="grid_1">6dp</dimen>

diff --git a/app/src/main/res/values/styles.xml b/app/src/main/res/values/styles.xml
@@ -913,6 +913,9 @@
 
   <style name="CommentsReplayButton" parent="CommentsCardButton">
     <item name="android:textAllCaps">false</item>
+    <item name="android:layout_width">0dp</item>
+    <item name="android:layout_marginEnd">@dimen/grid_3</item>
+    <item name="android:layout_marginStart">@dimen/grid_1</item>
     <item name="android:textSize">@dimen/subheadline</item>
     <item name="android:fontFamily">@string/font_family_sans_serif</item>
     <item name="android:textColor">@color/kds_support_400</item>

diff --git a/app/src/test/java/com/kickstarter/ui/view/CommentCardTest.kt b/app/src/test/java/com/kickstarter/ui/view/CommentCardTest.kt
@@ -1,6 +1,7 @@
 package com.kickstarter.ui.view
 
 import android.view.LayoutInflater
+import android.view.View
 import androidx.appcompat.widget.AppCompatButton
 import androidx.appcompat.widget.AppCompatTextView
 import androidx.constraintlayout.widget.ConstraintLayout
@@ -20,7 +21,7 @@ class CommentCardTest : KSRobolectricTestCase() {
     private lateinit var commentBody: AppCompatTextView
     private lateinit var replyButton: AppCompatButton
     private lateinit var repliesButton: AppCompatTextView
-    private lateinit var retryButton: AppCompatButton
+    private lateinit var retryButton: View
     private lateinit var postingButton: AppCompatButton
     private lateinit var postedButton: AppCompatButton