compose: details: Build and show updateable version in compose manually

Works properly on RTL and LTR layouts

Signed-off-by: Aayush Gupta <aayushgupta219@gmail.com>

app/src/main/java/com/aurora/store/compose/ui/details/composable/Details.kt

@@ -14,16 +14,25 @@ import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.requiredSize
+import androidx.compose.foundation.text.InlineTextContent
+import androidx.compose.foundation.text.appendInlineContent
+import androidx.compose.material3.Icon
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.platform.LocalLayoutDirection
 import androidx.compose.ui.res.dimensionResource
+import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.Placeholder
+import androidx.compose.ui.text.PlaceholderVerticalAlign
+import androidx.compose.ui.text.buildAnnotatedString
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
+import androidx.compose.ui.unit.LayoutDirection
 import com.aurora.gplayapi.data.models.App
 import com.aurora.store.R
 import com.aurora.store.compose.composable.app.AnimatedAppIcon
@@ -52,6 +61,49 @@ fun Details(
     val speed = if (state is AppState.Downloading) state.speed else 0
     val timeRemaining = if (state is AppState.Downloading) state.timeRemaining else 0
 
+    @Composable
+    fun UpdatableVersion() {
+        val updateVersion = stringResource(R.string.version, versionName, versionCode)
+        val localVersion = stringResource(
+            R.string.version,
+            PackageUtil.getInstalledVersionName(context, app.packageName),
+            PackageUtil.getInstalledVersionCode(context, app.packageName)
+        )
+
+        Text(
+            style = MaterialTheme.typography.bodySmall,
+            text = buildAnnotatedString {
+                when (LocalLayoutDirection.current) {
+                    LayoutDirection.Ltr -> append(localVersion)
+                    LayoutDirection.Rtl -> append(updateVersion)
+                }
+
+                append(" ")
+                appendInlineContent("iconId", "[arrow]")
+                append(" ")
+
+                when (LocalLayoutDirection.current) {
+                    LayoutDirection.Ltr -> append(updateVersion)
+                    LayoutDirection.Rtl -> append(localVersion)
+                }
+            },
+            inlineContent = mapOf(
+                "iconId" to InlineTextContent(
+                    Placeholder(
+                        width = MaterialTheme.typography.bodySmall.fontSize,
+                        height = MaterialTheme.typography.bodySmall.fontSize,
+                        placeholderVerticalAlign = PlaceholderVerticalAlign.TextCenter
+                    )
+                ) {
+                    Icon(
+                        painter = painterResource(R.drawable.ic_arrow_forward),
+                        contentDescription = null
+                    )
+                }
+            )
+        )
+    }
+
     Row(modifier = Modifier.fillMaxWidth()) {
         AnimatedAppIcon(
             modifier = Modifier.requiredSize(dimensionResource(R.dimen.icon_size_large)),
@@ -76,6 +128,11 @@ fun Details(
                 color = MaterialTheme.colorScheme.primary
             )
             AnimatedContent(targetState = state::class) { cState ->
+                if (cState == AppState.Updatable::class) {
+                    UpdatableVersion()
+                    return@AnimatedContent
+                }
+
                 Text(
                     style = MaterialTheme.typography.bodySmall,
                     text = when (cState) {
@@ -85,16 +142,6 @@ fun Details(
                                 ", " + CommonUtil.getETAString(context, timeRemaining)
                         }
 
-                        AppState.Updatable::class -> {
-                            stringResource(
-                                R.string.version_update,
-                                PackageUtil.getInstalledVersionName(context, app.packageName),
-                                PackageUtil.getInstalledVersionCode(context, app.packageName),
-                                versionName,
-                                versionCode
-                            )
-                        }
-
                         AppState.Queued::class -> stringResource(R.string.status_queued)
 
                         AppState.Purchasing::class -> stringResource(R.string.preparing_to_install)

app/src/main/res/drawable/ic_arrow_forward.xml

@@ -0,0 +1,15 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+  ~ SPDX-FileCopyrightText: Material Design Authors / Google LLC
+  ~ SPDX-License-Identifier: Apache-2.0
+  -->
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="960"
+    android:viewportHeight="960"
+    android:autoMirrored="true">
+  <path
+      android:fillColor="@android:color/white"
+      android:pathData="M647,520L160,520L160,440L647,440L423,216L480,160L800,480L480,800L423,744L647,520Z"/>
+</vector>