[expressive design] Update TwoTargetPreference.

Add a ChevronRight icon in the middle.

Test: visual
Bug: 360916599
Flag: EXEMPT bug fix
Change-Id: Ib63324805c8bc27898ef20046831b2126bed77cd

1 files changed, 46 insertions, 14 deletions

diff --git a/packages/SettingsLib/Spa/spa/src/com/android/settingslib/spa/widget/preference/TwoTargetPreference.kt b/packages/SettingsLib/Spa/spa/src/com/android/settingslib/spa/widget/preference/TwoTargetPreference.kt
index 3f688045fa19..92b1005d07e4 100644
--- a/packages/SettingsLib/Spa/spa/src/com/android/settingslib/spa/widget/preference/TwoTargetPreference.kt
+++ b/packages/SettingsLib/Spa/spa/src/com/android/settingslib/spa/widget/preference/TwoTargetPreference.kt
@@ -17,18 +17,27 @@
 package com.android.settingslib.spa.widget.preference
 
 import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.ChevronRight
+import androidx.compose.material3.Icon
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
 import com.android.settingslib.spa.framework.theme.SettingsDimension
+import com.android.settingslib.spa.framework.theme.SettingsOpacity.alphaForEnabled
 import com.android.settingslib.spa.framework.theme.divider
+import com.android.settingslib.spa.framework.theme.isSpaExpressiveEnabled
+import com.android.settingslib.spa.framework.util.wrapOnClickWithLog
 
 @Composable
 internal fun TwoTargetPreference(
@@ -40,21 +49,45 @@ internal fun TwoTargetPreference(
     widget: @Composable () -> Unit,
 ) {
     Row(
-        modifier = Modifier
-            .fillMaxWidth()
-            .padding(end = SettingsDimension.itemPaddingEnd),
+        modifier = Modifier.fillMaxWidth().padding(end = SettingsDimension.itemPaddingEnd),
         verticalAlignment = Alignment.CenterVertically,
     ) {
-        Box(modifier = Modifier.weight(1f)) {
-            Preference(
-                object : PreferenceModel {
-                    override val title = title
-                    override val summary = summary
-                    override val icon = icon
-                    override val enabled = primaryEnabled
-                    override val onClick = primaryOnClick
+        if (isSpaExpressiveEnabled) {
+            val onClickWithLog = wrapOnClickWithLog(primaryOnClick)
+            val enabled = primaryEnabled()
+            val modifier =
+                if (onClickWithLog != null) {
+                    Modifier.clickable(enabled = enabled, onClick = onClickWithLog)
+                } else Modifier
+            Box(modifier = Modifier.weight(1f)) {
+                BasePreference(
+                    title = title,
+                    summary = summary,
+                    icon = icon,
+                    enabled = primaryEnabled,
+                    modifier = modifier,
+                    paddingEnd = 0.dp,
+                ) {
+                    val alphaModifier = Modifier.alphaForEnabled(primaryEnabled())
+                    Icon(
+                        imageVector = Icons.Filled.ChevronRight,
+                        contentDescription = null,
+                        modifier = alphaModifier.size(18.dp),
+                    )
                 }
-            )
+            }
+        } else {
+            Box(modifier = Modifier.weight(1f)) {
+                Preference(
+                    object : PreferenceModel {
+                        override val title = title
+                        override val summary = summary
+                        override val icon = icon
+                        override val enabled = primaryEnabled
+                        override val onClick = primaryOnClick
+                    }
+                )
+            }
         }
         PreferenceDivider()
         widget()
@@ -64,8 +97,7 @@ internal fun TwoTargetPreference(
 @Composable
 private fun PreferenceDivider() {
     Box(
-        Modifier
-            .padding(horizontal = SettingsDimension.itemPaddingEnd)
+        Modifier.padding(horizontal = SettingsDimension.itemPaddingEnd)
             .size(width = 1.dp, height = SettingsDimension.itemDividerHeight)
             .background(color = MaterialTheme.colorScheme.divider)
     )