Use the new modifier based implementation of Expandable in QS

Bug: 285250939
Test: Manual, dialog and activity launches worked as expected
Flag: com.android.systemui.qs_ui_refactor_compose_fragment
Change-Id: Ic94f1f65f3134f534c4accb4132636abffb5c90c

3 files changed, 52 insertions, 10 deletions

diff --git a/packages/SystemUI/compose/features/src/com/android/systemui/qs/footer/ui/compose/FooterActions.kt b/packages/SystemUI/compose/features/src/com/android/systemui/qs/footer/ui/compose/FooterActions.kt
index f0d3f3e3f0a5..676b871d9721 100644
--- a/packages/SystemUI/compose/features/src/com/android/systemui/qs/footer/ui/compose/FooterActions.kt
+++ b/packages/SystemUI/compose/features/src/com/android/systemui/qs/footer/ui/compose/FooterActions.kt
@@ -80,6 +80,7 @@ import com.android.systemui.animation.Expandable
 import com.android.systemui.common.shared.model.Icon
 import com.android.systemui.common.ui.compose.Icon
 import com.android.systemui.compose.modifiers.sysuiResTag
+import com.android.systemui.qs.flags.QSComposeFragment
 import com.android.systemui.qs.footer.ui.viewmodel.FooterActionsButtonViewModel
 import com.android.systemui.qs.footer.ui.viewmodel.FooterActionsForegroundServicesButtonViewModel
 import com.android.systemui.qs.footer.ui.viewmodel.FooterActionsSecurityButtonViewModel
@@ -218,11 +219,24 @@ fun FooterActions(
                 Spacer(Modifier.weight(1f))
             }
 
-            security?.let { SecurityButton(it, Modifier.weight(1f)) }
-            foregroundServices?.let { ForegroundServicesButton(it) }
-            userSwitcher?.let { IconButton(it, Modifier.sysuiResTag("multi_user_switch")) }
-            IconButton(viewModel.settings, Modifier.sysuiResTag("settings_button_container"))
-            power?.let { IconButton(it, Modifier.sysuiResTag("pm_lite")) }
+            val useModifierBasedExpandable = remember { QSComposeFragment.isEnabled }
+            security?.let { SecurityButton(it, useModifierBasedExpandable, Modifier.weight(1f)) }
+            foregroundServices?.let { ForegroundServicesButton(it, useModifierBasedExpandable) }
+            userSwitcher?.let {
+                IconButton(
+                    it,
+                    useModifierBasedExpandable,
+                    Modifier.sysuiResTag("multi_user_switch"),
+                )
+            }
+            IconButton(
+                viewModel.settings,
+                useModifierBasedExpandable,
+                Modifier.sysuiResTag("settings_button_container"),
+            )
+            power?.let {
+                IconButton(it, useModifierBasedExpandable, Modifier.sysuiResTag("pm_lite"))
+            }
         }
     }
 }
@@ -231,6 +245,7 @@ fun FooterActions(
 @Composable
 private fun SecurityButton(
     model: FooterActionsSecurityButtonViewModel,
+    useModifierBasedExpandable: Boolean,
     modifier: Modifier = Modifier,
 ) {
     val onClick: ((Expandable) -> Unit)? =
@@ -239,13 +254,21 @@ private fun SecurityButton(
             { expandable -> onClick(context, expandable) }
         }
 
-    TextButton(model.icon, model.text, showNewDot = false, onClick = onClick, modifier)
+    TextButton(
+        model.icon,
+        model.text,
+        showNewDot = false,
+        onClick = onClick,
+        useModifierBasedExpandable,
+        modifier,
+    )
 }
 
 /** The foreground services button. */
 @Composable
 private fun RowScope.ForegroundServicesButton(
-    model: FooterActionsForegroundServicesButtonViewModel
+    model: FooterActionsForegroundServicesButtonViewModel,
+    useModifierBasedExpandable: Boolean,
 ) {
     if (model.displayText) {
         TextButton(
@@ -253,6 +276,7 @@ private fun RowScope.ForegroundServicesButton(
             model.text,
             showNewDot = model.hasNewChanges,
             onClick = model.onClick,
+            useModifierBasedExpandable,
             Modifier.weight(1f),
         )
     } else {
@@ -261,13 +285,18 @@ private fun RowScope.ForegroundServicesButton(
             contentDescription = model.text,
             showNewDot = model.hasNewChanges,
             onClick = model.onClick,
+            useModifierBasedExpandable,
         )
     }
 }
 
 /** A button with an icon. */
 @Composable
-fun IconButton(model: FooterActionsButtonViewModel, modifier: Modifier = Modifier) {
+fun IconButton(
+    model: FooterActionsButtonViewModel,
+    useModifierBasedExpandable: Boolean,
+    modifier: Modifier = Modifier,
+) {
     Expandable(
         color = colorAttr(model.backgroundColor),
         shape = CircleShape,
@@ -277,6 +306,7 @@ fun IconButton(model: FooterActionsButtonViewModel, modifier: Modifier = Modifie
                 color = MaterialTheme.colorScheme.secondary,
                 CornerSize(percent = 50),
             ),
+        useModifierBasedImplementation = useModifierBasedExpandable,
     ) {
         val tint = model.iconTint?.let { Color(it) } ?: Color.Unspecified
         Icon(model.icon, tint = tint, modifier = Modifier.size(20.dp))
@@ -290,6 +320,7 @@ private fun NumberButton(
     contentDescription: String,
     showNewDot: Boolean,
     onClick: (Expandable) -> Unit,
+    useModifierBasedExpandable: Boolean,
     modifier: Modifier = Modifier,
 ) {
     // By default Expandable will show a ripple above its content when clicked, and clip the content
@@ -309,6 +340,7 @@ private fun NumberButton(
                 color = MaterialTheme.colorScheme.secondary,
                 CornerSize(percent = 50),
             ),
+        useModifierBasedImplementation = useModifierBasedExpandable,
     ) {
         Box(Modifier.size(40.dp)) {
             Box(
@@ -355,6 +387,7 @@ private fun TextButton(
     text: String,
     showNewDot: Boolean,
     onClick: ((Expandable) -> Unit)?,
+    useModifierBasedExpandable: Boolean,
     modifier: Modifier = Modifier,
 ) {
     Expandable(
@@ -367,6 +400,7 @@ private fun TextButton(
                 .padding(horizontal = 4.dp)
                 .borderOnFocus(color = MaterialTheme.colorScheme.secondary, CornerSize(50)),
         onClick = onClick,
+        useModifierBasedImplementation = useModifierBasedExpandable,
     ) {
         Row(
             Modifier.padding(horizontal = dimensionResource(R.dimen.qs_footer_padding)),
diff --git a/packages/SystemUI/src/com/android/systemui/qs/panels/ui/compose/infinitegrid/Tile.kt b/packages/SystemUI/src/com/android/systemui/qs/panels/ui/compose/infinitegrid/Tile.kt
index 47238d176b36..d73dc870756b 100644
--- a/packages/SystemUI/src/com/android/systemui/qs/panels/ui/compose/infinitegrid/Tile.kt
+++ b/packages/SystemUI/src/com/android/systemui/qs/panels/ui/compose/infinitegrid/Tile.kt
@@ -245,6 +245,7 @@ private fun TileExpandable(
         color = color(),
         shape = shape,
         modifier = modifier.clip(shape).verticalSquish(squishiness),
+        useModifierBasedImplementation = true,
     ) {
         content(hapticsViewModel?.createStateAwareExpandable(it) ?: it)
     }
diff --git a/packages/SystemUI/src/com/android/systemui/qs/panels/ui/compose/toolbar/Toolbar.kt b/packages/SystemUI/src/com/android/systemui/qs/panels/ui/compose/toolbar/Toolbar.kt
index 59c554c28df6..7a2c51a49509 100644
--- a/packages/SystemUI/src/com/android/systemui/qs/panels/ui/compose/toolbar/Toolbar.kt
+++ b/packages/SystemUI/src/com/android/systemui/qs/panels/ui/compose/toolbar/Toolbar.kt
@@ -32,18 +32,25 @@ fun Toolbar(toolbarViewModelFactory: ToolbarViewModel.Factory, modifier: Modifie
 
     Row(modifier = modifier, verticalAlignment = Alignment.CenterVertically) {
         viewModel.userSwitcherViewModel?.let {
-            IconButton(it, Modifier.sysuiResTag("multi_user_switch"))
+            IconButton(
+                it,
+                useModifierBasedExpandable = true,
+                Modifier.sysuiResTag("multi_user_switch"),
+            )
         }
 
         EditModeButton(viewModel.editModeButtonViewModelFactory)
 
         IconButton(
             viewModel.settingsButtonViewModel,
+            useModifierBasedExpandable = true,
             Modifier.sysuiResTag("settings_button_container"),
         )
 
         Spacer(modifier = Modifier.weight(1f))
 
-        viewModel.powerButtonViewModel?.let { IconButton(it, Modifier.sysuiResTag("pm_lite")) }
+        viewModel.powerButtonViewModel?.let {
+            IconButton(it, useModifierBasedExpandable = true, Modifier.sysuiResTag("pm_lite"))
+        }
     }
 }