Migrated to AndroidView

app/src/main/java/com/imashnake/animite/features/media/MediaPage.kt

@@ -64,6 +64,7 @@ import com.imashnake.animite.api.anilist.sanitize.media.Media
 import com.imashnake.animite.core.extensions.bannerParallax
 import com.imashnake.animite.core.extensions.landscapeCutoutPadding
 import com.imashnake.animite.core.ui.ScrollableText
+import com.imashnake.animite.core.ui.ScrollableTextView
 import com.imashnake.animite.core.ui.TranslucentStatusBarLayout
 import com.imashnake.animite.dev.internal.Constants
 import com.imashnake.animite.features.ui.MediaSmall
@@ -113,9 +114,7 @@ fun MediaPage(
                 ) {
                     MediaDetails(
                         title = media.title.orEmpty(),
-                        description = Html
-                            .fromHtml(media.description.orEmpty(), Html.FROM_HTML_MODE_COMPACT)
-                            .toString(),
+                        description = media.description.orEmpty(),
                         // TODO Can we do something about this Modifier chain?
                         modifier = Modifier
                             .padding(
@@ -254,7 +253,7 @@ fun MediaDetails(
             overflow = TextOverflow.Ellipsis
         )
 
-        ScrollableText(text = description)
+        ScrollableTextView(text = description)
     }
 }
 

core/src/main/kotlin/com/imashnake/animite/core/ui/ScrollableText.kt

@@ -1,5 +1,8 @@
 package com.imashnake.animite.core.ui
 
+import android.graphics.Typeface
+import android.text.method.LinkMovementMethod
+import android.widget.TextView
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxWidth
@@ -11,14 +14,20 @@ import androidx.compose.material.ContentAlpha
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Brush
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.Color.Companion.Transparent
+import androidx.compose.ui.graphics.toArgb
 import androidx.compose.ui.res.dimensionResource
 import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.viewinterop.AndroidView
+import androidx.core.content.res.ResourcesCompat
+import androidx.core.text.HtmlCompat
 import com.imashnake.animite.core.R
+import java.io.File
 
 @Composable
 fun ScrollableText(
@@ -70,3 +79,71 @@ fun ScrollableText(
         ) { }
     }
 }
+
+/**
+ * TODO: Get rid of this once Compose supports HTML/Markdown
+ *  https://issuetracker.google.com/issues/139326648
+ */
+@Composable
+fun ScrollableTextView(
+    text: String,
+    modifier: Modifier = Modifier,
+    gradientSize: Dp = dimensionResource(R.dimen.edge_gradient_size),
+    gradientColor: Color = MaterialTheme.colorScheme.background
+) {
+    val html = remember(text) {
+        HtmlCompat.fromHtml(text, HtmlCompat.FROM_HTML_MODE_LEGACY)
+    }
+
+    Box(modifier) {
+        val textColor = MaterialTheme.colorScheme.onBackground.copy(
+            alpha = ContentAlpha.medium
+        ).toArgb()
+
+        AndroidView(
+            factory = {
+                TextView(it).apply {
+                    movementMethod = LinkMovementMethod.getInstance()
+                    setTextColor(textColor)
+                    textSize = 14f
+                    // This is needed since `FontFamily` can't be used with `AndroidView`.
+                    typeface = ResourcesCompat.getFont(it, R.font.manrope_medium)
+                }
+            },
+            update = { it.text = html },
+            modifier = Modifier
+                .verticalScroll(rememberScrollState())
+                .padding(vertical = gradientSize)
+        )
+
+        Box(
+            modifier = Modifier
+                .height(gradientSize)
+                .fillMaxWidth()
+                .align(Alignment.TopCenter)
+                .background(
+                    Brush.verticalGradient(
+                        listOf(
+                            gradientColor,
+                            Transparent
+                        )
+                    )
+                )
+        ) { }
+
+        Box(
+            modifier = Modifier
+                .height(gradientSize)
+                .fillMaxWidth()
+                .align(Alignment.BottomCenter)
+                .background(
+                    Brush.verticalGradient(
+                        listOf(
+                            Transparent,
+                            gradientColor
+                        )
+                    )
+                )
+        ) { }
+    }
+}