Fix/apple emojis in block action toolbar preview (#764)

CHANGELOG.md

@@ -4,6 +4,10 @@
 
 * Test flight for turn-into restrictions in edit-mode and multi-select mode (#376)
 
+### Design & UX 🔳
+
+* Apple emojis or uploaded image in block-action-toolbar link's preview (#630)
+
 ### Fixes & tech 🚒
 
 * Should not show toast when clicking on markup url (#698)

app/src/main/java/com/agileburo/anytype/ui/page/modals/actions/PageBlockActionToolbar.kt

@@ -6,12 +6,17 @@ import android.widget.ImageView
 import android.widget.TextView
 import com.agileburo.anytype.R
 import com.agileburo.anytype.core_ui.features.page.BlockView
+import com.agileburo.anytype.core_utils.ext.visible
+import com.agileburo.anytype.emojifier.Emojifier
+import com.bumptech.glide.Glide
+import com.bumptech.glide.load.engine.DiskCacheStrategy
 
 class PageBlockActionToolbar : BlockActionToolbar() {
 
     lateinit var block: BlockView.Page
     lateinit var icon: ImageView
-    lateinit var emoji: TextView
+    lateinit var emoji: ImageView
+    lateinit var image: ImageView
     lateinit var title: TextView
 
     override fun onCreate(savedInstanceState: Bundle?) {
@@ -23,16 +28,41 @@ class PageBlockActionToolbar : BlockActionToolbar() {
     override fun getBlock(): BlockView = block
 
     override fun initUi(view: View, colorView: ImageView?, backgroundView: ImageView?) {
-        icon = view.findViewById(R.id.pageIcon)
-        emoji = view.findViewById(R.id.emoji)
+
+        image = view.findViewById(R.id.linkImage)
+        emoji = view.findViewById(R.id.linkEmoji)
         title = view.findViewById(R.id.pageTitle)
 
         title.text = if (block.text.isNullOrEmpty()) getString(R.string.untitled) else block.text
+
         when {
-            block.emoji != null -> emoji.text = block.emoji
-            block.isEmpty -> icon.setImageResource(R.drawable.ic_block_empty_page)
-            else -> icon.setImageResource(R.drawable.ic_block_page_without_emoji)
+            block.emoji != null -> {
+                image.setImageDrawable(null)
+                Glide
+                    .with(emoji)
+                    .load(Emojifier.uri(block.emoji!!))
+                    .diskCacheStrategy(DiskCacheStrategy.ALL)
+                    .into(emoji)
+            }
+            block.image != null -> {
+                image.visible()
+                Glide
+                    .with(image)
+                    .load(block.image)
+                    .centerInside()
+                    .circleCrop()
+                    .into(image)
+            }
+            block.isEmpty -> {
+                icon.setImageResource(com.agileburo.anytype.core_ui.R.drawable.ic_block_empty_page)
+                image.setImageDrawable(null)
+            }
+            else -> {
+                icon.setImageResource(com.agileburo.anytype.core_ui.R.drawable.ic_block_page_without_emoji)
+                image.setImageDrawable(null)
+            }
         }
+
         setConstraints()
     }
 }

core-ui/src/main/res/layout/item_block_page_preview.xml

@@ -2,9 +2,13 @@
 <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:id="@+id/root"
-    android:paddingStart="@dimen/default_document_item_padding_start"
-    android:paddingEnd="@dimen/default_document_item_padding_end"
+    android:layout_marginStart="8dp"
+    android:layout_marginTop="1dp"
+    android:layout_marginEnd="8dp"
+    android:layout_marginBottom="1dp"
+    android:background="@drawable/item_block_multi_select_mode_selector"
+    android:paddingStart="12dp"
+    android:paddingEnd="12dp"
     android:layout_width="match_parent"
     android:layout_height="wrap_content">
 
@@ -30,12 +34,16 @@
             android:layout_gravity="center"
             android:contentDescription="@string/content_description_page_icon" />
 
-        <TextView
-            android:id="@+id/emoji"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_gravity="center"
-            android:textColor="@color/emoji_color" />
+        <ImageView
+            android:id="@+id/linkImage"
+            android:layout_width="match_parent"
+            android:layout_height="match_parent" />
+
+        <ImageView
+            android:id="@+id/linkEmoji"
+            android:layout_width="20dp"
+            android:layout_height="20dp"
+            android:layout_gravity="center" />
 
     </FrameLayout>
 
@@ -46,8 +54,8 @@
         android:layout_marginTop="3dp"
         android:layout_marginEnd="4dp"
         android:layout_marginBottom="3dp"
-        android:visibility="invisible"
         android:src="@drawable/ic_block_more"
+        android:visibility="invisible"
         android:contentDescription="@string/content_description_more_button"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toEndOf="parent"

presentation/src/test/java/com/agileburo/anytype/presentation/page/editor/EditorTurnIntoTest.kt

@@ -162,8 +162,8 @@ class EditorTurnIntoTest : EditorPresentationTestSetup() {
 
         // SETUP
 
-        val child = Block(
-            id = "CHILD",
+        val a = Block(
+            id = MockDataFactory.randomUuid(),
             fields = Block.Fields.empty(),
             children = emptyList(),
             content = Block.Content.Text(
@@ -173,10 +173,10 @@ class EditorTurnIntoTest : EditorPresentationTestSetup() {
             )
         )
 
-        val parent = Block(
-            id = "PARENT",
+        val b = Block(
+            id = MockDataFactory.randomUuid(),
             fields = Block.Fields.empty(),
-            children = listOf(child.id),
+            children = emptyList(),
             content = Block.Content.Text(
                 text = MockDataFactory.randomString(),
                 marks = emptyList(),
@@ -190,10 +190,10 @@ class EditorTurnIntoTest : EditorPresentationTestSetup() {
             content = Block.Content.Smart(
                 type = Block.Content.Smart.Type.PAGE
             ),
-            children = listOf(parent.id)
+            children = listOf(a.id, b.id)
         )
 
-        val document = listOf(page, parent, child)
+        val document = listOf(page, a, b)
 
         stubOpenDocument(document = document)
         stubInterceptEvents(InterceptEvents.Params(context = root))
@@ -204,10 +204,10 @@ class EditorTurnIntoTest : EditorPresentationTestSetup() {
 
         vm.apply {
             onStart(root)
-            onBlockFocusChanged(id = parent.id, hasFocus = true)
+            onBlockFocusChanged(id = a.id, hasFocus = true)
             onClickListener(
                 ListenerType.LongClick(
-                    target = child.id,
+                    target = b.id,
                     dimensions = BlockDimensions(
                         MockDataFactory.randomInt(),
                         MockDataFactory.randomInt(),
@@ -219,7 +219,7 @@ class EditorTurnIntoTest : EditorPresentationTestSetup() {
                 )
             )
             onActionMenuItemClicked(
-                id = child.id,
+                id = b.id,
                 action = ActionItemType.TurnInto
             )
         }
@@ -244,7 +244,7 @@ class EditorTurnIntoTest : EditorPresentationTestSetup() {
         )
 
         assertEquals(
-            expected = child.id,
+            expected = b.id,
             actual = result.target
         )