Simplify modifier extensions (#4657)

bitwarden · Jan 31, 2025 · f141465 · f141465
1 parent ecc5d4c
commit f141465
Show file tree

Hide file tree

Showing 23 changed files with 186 additions and 256 deletions.
diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/vaultunlock/VaultUnlockScreen.kt b/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/vaultunlock/VaultUnlockScreen.kt
@@ -46,8 +46,7 @@ import com.x8bit.bitwarden.ui.auth.feature.vaultunlock.util.unlockScreenMessage
 import com.x8bit.bitwarden.ui.auth.feature.vaultunlock.util.unlockScreenTitle
 import com.x8bit.bitwarden.ui.autofill.fido2.manager.Fido2CompletionManager
 import com.x8bit.bitwarden.ui.platform.base.util.EventsEffect
-import com.x8bit.bitwarden.ui.platform.base.util.cardBackground
-import com.x8bit.bitwarden.ui.platform.base.util.cardPadding
+import com.x8bit.bitwarden.ui.platform.base.util.cardStyle
 import com.x8bit.bitwarden.ui.platform.base.util.standardHorizontalMargin
 import com.x8bit.bitwarden.ui.platform.components.account.BitwardenAccountActionItem
 import com.x8bit.bitwarden.ui.platform.components.account.BitwardenAccountSwitcher
@@ -277,11 +276,6 @@ fun VaultUnlockScreen(
                         .fillMaxWidth(),
                 )
             }
-            val trailingTextCardStyle = if (state.hideInput) {
-                CardStyle.Full
-            } else {
-                CardStyle.Bottom
-            }
             Text(
                 text = stringResource(
                     id = R.string.logged_in_as_on,
@@ -293,13 +287,11 @@ fun VaultUnlockScreen(
                 modifier = Modifier
                     .testTag("UserAndEnvironmentDataLabel")
                     .standardHorizontalMargin()
-                    .cardBackground(cardStyle = trailingTextCardStyle)
-                    .cardPadding(
-                        cardStyle = trailingTextCardStyle,
-                        start = 16.dp,
-                        end = 16.dp,
-                        top = 0.dp,
-                        bottom = 12.dp,
+                    .cardStyle(
+                        cardStyle = if (state.hideInput) CardStyle.Full else CardStyle.Bottom,
+                        paddingStart = 16.dp,
+                        paddingEnd = 16.dp,
+                        paddingTop = 0.dp,
                     )
                     .fillMaxWidth(),
             )

diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/base/util/ModifierExtensions.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/base/util/ModifierExtensions.kt
@@ -6,6 +6,7 @@ import android.os.Build
 import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.interaction.MutableInteractionSource
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.TopAppBarScrollBehavior
@@ -256,6 +257,70 @@ private data class StandardHorizontalMarginElement(
     }
 }
 
+/**
+ * This is a [Modifier] extension that applies a card style to the content.
+ */
+@OmitFromCoverage
+@Stable
+@Composable
+fun Modifier.cardStyle(
+    cardStyle: CardStyle?,
+    onClick: (() -> Unit)? = null,
+    clickEnabled: Boolean = true,
+    paddingHorizontal: Dp = 0.dp,
+    paddingVertical: Dp = 12.dp,
+    containerColor: Color = BitwardenTheme.colorScheme.background.secondary,
+    indicationColor: Color = BitwardenTheme.colorScheme.background.pressed,
+): Modifier =
+    this.cardStyle(
+        cardStyle = cardStyle,
+        onClick = onClick,
+        clickEnabled = clickEnabled,
+        paddingStart = paddingHorizontal,
+        paddingTop = paddingVertical,
+        paddingEnd = paddingHorizontal,
+        paddingBottom = paddingVertical,
+        containerColor = containerColor,
+        indicationColor = indicationColor,
+    )
+
+/**
+ * This is a [Modifier] extension that applies a card style to the content.
+ */
+@OmitFromCoverage
+@Stable
+@Composable
+fun Modifier.cardStyle(
+    cardStyle: CardStyle?,
+    onClick: (() -> Unit)? = null,
+    clickEnabled: Boolean = true,
+    paddingStart: Dp = 0.dp,
+    paddingTop: Dp = 12.dp,
+    paddingEnd: Dp = 0.dp,
+    paddingBottom: Dp = 12.dp,
+    containerColor: Color = BitwardenTheme.colorScheme.background.secondary,
+    indicationColor: Color = BitwardenTheme.colorScheme.background.pressed,
+): Modifier =
+    this
+        .cardBackground(
+            cardStyle = cardStyle,
+            color = containerColor,
+        )
+        .nullableClickable(
+            onClick = onClick,
+            enabled = clickEnabled,
+            indicationColor = indicationColor,
+        )
+        .cardPadding(
+            cardStyle = cardStyle,
+            paddingValues = PaddingValues(
+                start = paddingStart,
+                top = paddingTop,
+                end = paddingEnd,
+                bottom = paddingBottom,
+            ),
+        )
+
 /**
  * This is a [Modifier] extension that applies a card background to the content.
  */
@@ -297,30 +362,8 @@ fun Modifier.cardBackground(
 @Composable
 fun Modifier.cardPadding(
     cardStyle: CardStyle?,
-    start: Dp = 0.dp,
-    top: Dp = 12.dp,
-    end: Dp = 0.dp,
-    bottom: Dp = 12.dp,
+    paddingValues: PaddingValues = PaddingValues(vertical = 12.dp),
 ): Modifier {
     cardStyle ?: return this
-    return this.padding(start = start, top = top, end = end, bottom = bottom)
+    return this.padding(paddingValues = paddingValues)
 }
-
-/**
- * This is a [Modifier] extension that applies card padding to the content.
- */
-@OmitFromCoverage
-@Stable
-@Composable
-fun Modifier.cardPadding(
-    cardStyle: CardStyle?,
-    vertical: Dp = 12.dp,
-    horizontal: Dp = 0.dp,
-): Modifier =
-    this.cardPadding(
-        cardStyle = cardStyle,
-        start = horizontal,
-        top = vertical,
-        end = horizontal,
-        bottom = vertical,
-    )
diff --git a/.../main/java/com/x8bit/bitwarden/ui/platform/components/dialog/BitwardenDateSelectButton.kt b/.../main/java/com/x8bit/bitwarden/ui/platform/components/dialog/BitwardenDateSelectButton.kt
@@ -1,7 +1,5 @@
 package com.x8bit.bitwarden.ui.platform.components.dialog
 
-import androidx.compose.foundation.clickable
-import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.defaultMinSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.DatePicker
@@ -14,7 +12,6 @@ import androidx.compose.material3.Text
 import androidx.compose.material3.TextField
 import androidx.compose.material3.minimumInteractiveComponentSize
 import androidx.compose.material3.rememberDatePickerState
-import androidx.compose.material3.ripple
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@@ -34,8 +31,7 @@ import androidx.compose.ui.semantics.testTag
 import androidx.compose.ui.semantics.testTagsAsResourceId
 import androidx.compose.ui.unit.dp
 import com.x8bit.bitwarden.R
-import com.x8bit.bitwarden.ui.platform.base.util.cardBackground
-import com.x8bit.bitwarden.ui.platform.base.util.cardPadding
+import com.x8bit.bitwarden.ui.platform.base.util.cardStyle
 import com.x8bit.bitwarden.ui.platform.components.button.BitwardenTextButton
 import com.x8bit.bitwarden.ui.platform.components.field.color.bitwardenTextFieldButtonColors
 import com.x8bit.bitwarden.ui.platform.components.field.color.bitwardenTextFieldColors
@@ -91,14 +87,11 @@ fun BitwardenDateSelectButton(
                 contentDescription = "$label, $formattedDate"
             }
             .defaultMinSize(minHeight = 60.dp)
-            .cardBackground(cardStyle = cardStyle)
-            .clickable(
-                enabled = isEnabled,
-                indication = ripple(color = BitwardenTheme.colorScheme.background.pressed),
-                interactionSource = remember { MutableInteractionSource() },
+            .cardStyle(
+                cardStyle = cardStyle,
+                clickEnabled = isEnabled,
                 onClick = { shouldShowDialog = !shouldShowDialog },
             )
-            .cardPadding(cardStyle = cardStyle)
             .padding(top = 4.dp),
         textStyle = BitwardenTheme.typography.bodyLarge,
         readOnly = true,

diff --git a/.../main/java/com/x8bit/bitwarden/ui/platform/components/dialog/BitwardenTimeSelectButton.kt b/.../main/java/com/x8bit/bitwarden/ui/platform/components/dialog/BitwardenTimeSelectButton.kt
@@ -1,15 +1,12 @@
 package com.x8bit.bitwarden.ui.platform.components.dialog
 
-import androidx.compose.foundation.clickable
-import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.defaultMinSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.Icon
 import androidx.compose.material3.OutlinedTextField
 import androidx.compose.material3.Text
 import androidx.compose.material3.TextField
 import androidx.compose.material3.minimumInteractiveComponentSize
-import androidx.compose.material3.ripple
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@@ -23,8 +20,7 @@ import androidx.compose.ui.semantics.contentDescription
 import androidx.compose.ui.semantics.role
 import androidx.compose.ui.unit.dp
 import com.x8bit.bitwarden.R
-import com.x8bit.bitwarden.ui.platform.base.util.cardBackground
-import com.x8bit.bitwarden.ui.platform.base.util.cardPadding
+import com.x8bit.bitwarden.ui.platform.base.util.cardStyle
 import com.x8bit.bitwarden.ui.platform.components.field.color.bitwardenTextFieldButtonColors
 import com.x8bit.bitwarden.ui.platform.components.model.CardStyle
 import com.x8bit.bitwarden.ui.platform.components.row.BitwardenRowOfActions
@@ -76,14 +72,11 @@ fun BitwardenTimeSelectButton(
                 contentDescription = "$label, $formattedTime"
             }
             .defaultMinSize(minHeight = 60.dp)
-            .cardBackground(cardStyle = cardStyle)
-            .clickable(
-                enabled = isEnabled,
-                indication = ripple(color = BitwardenTheme.colorScheme.background.pressed),
-                interactionSource = remember { MutableInteractionSource() },
+            .cardStyle(
+                cardStyle = cardStyle,
+                clickEnabled = isEnabled,
                 onClick = { shouldShowDialog = !shouldShowDialog },
             )
-            .cardPadding(cardStyle = cardStyle)
             .padding(top = 4.dp),
         textStyle = BitwardenTheme.typography.bodyLarge,
         readOnly = true,

diff --git a/...in/java/com/x8bit/bitwarden/ui/platform/components/dropdown/BitwardenMultiSelectButton.kt b/...in/java/com/x8bit/bitwarden/ui/platform/components/dropdown/BitwardenMultiSelectButton.kt
@@ -1,7 +1,5 @@
 package com.x8bit.bitwarden.ui.platform.components.dropdown
 
-import androidx.compose.foundation.clickable
-import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
@@ -19,11 +17,9 @@ import androidx.compose.material3.OutlinedTextField
 import androidx.compose.material3.Text
 import androidx.compose.material3.TextField
 import androidx.compose.material3.minimumInteractiveComponentSize
-import androidx.compose.material3.ripple
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
-import androidx.compose.runtime.remember
 import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
@@ -38,8 +34,7 @@ import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import com.x8bit.bitwarden.R
 import com.x8bit.bitwarden.ui.platform.base.util.asText
-import com.x8bit.bitwarden.ui.platform.base.util.cardBackground
-import com.x8bit.bitwarden.ui.platform.base.util.cardPadding
+import com.x8bit.bitwarden.ui.platform.base.util.cardStyle
 import com.x8bit.bitwarden.ui.platform.base.util.nullableTestTag
 import com.x8bit.bitwarden.ui.platform.components.button.BitwardenStandardIconButton
 import com.x8bit.bitwarden.ui.platform.components.dialog.BitwardenSelectionDialog
@@ -116,17 +111,12 @@ fun BitwardenMultiSelectButton(
                     },
                 )
             }
-            .cardBackground(cardStyle = cardStyle)
-            .clickable(
-                indication = ripple(
-                    color = BitwardenTheme.colorScheme.background.pressed,
-                ),
-                enabled = isEnabled,
-                interactionSource = remember { MutableInteractionSource() },
-            ) {
-                shouldShowDialog = !shouldShowDialog
-            }
-            .cardPadding(cardStyle = cardStyle, top = 6.dp, bottom = 0.dp)
+            .cardStyle(
+                cardStyle = cardStyle,
+                paddingTop = 6.dp,
+                paddingBottom = 0.dp,
+                onClick = { shouldShowDialog = !shouldShowDialog },
+            )
             .padding(paddingValues = insets),
     ) {
         TextField(

diff --git a/...ain/java/com/x8bit/bitwarden/ui/platform/components/field/BitwardenHiddenPasswordField.kt b/...ain/java/com/x8bit/bitwarden/ui/platform/components/field/BitwardenHiddenPasswordField.kt
@@ -11,8 +11,7 @@ import androidx.compose.ui.text.input.KeyboardType
 import androidx.compose.ui.text.input.PasswordVisualTransformation
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import com.x8bit.bitwarden.ui.platform.base.util.cardBackground
-import com.x8bit.bitwarden.ui.platform.base.util.cardPadding
+import com.x8bit.bitwarden.ui.platform.base.util.cardStyle
 import com.x8bit.bitwarden.ui.platform.base.util.nullableTestTag
 import com.x8bit.bitwarden.ui.platform.components.field.color.bitwardenTextFieldColors
 import com.x8bit.bitwarden.ui.platform.components.field.toolbar.BitwardenEmptyTextToolbar
@@ -39,8 +38,7 @@ fun BitwardenHiddenPasswordField(
     CompositionLocalProvider(value = LocalTextToolbar provides BitwardenEmptyTextToolbar) {
         TextField(
             modifier = modifier
-                .cardBackground(cardStyle = cardStyle)
-                .cardPadding(cardStyle = cardStyle, vertical = 6.dp)
+                .cardStyle(cardStyle = cardStyle, paddingVertical = 6.dp)
                 .nullableTestTag(tag = passwordFieldTestTag),
             textStyle = BitwardenTheme.typography.sensitiveInfoSmall,
             label = label?.let { { Text(text = it) } },

diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/field/BitwardenPasswordField.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/field/BitwardenPasswordField.kt
@@ -38,8 +38,7 @@ import androidx.compose.ui.text.input.VisualTransformation
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import com.x8bit.bitwarden.R
-import com.x8bit.bitwarden.ui.platform.base.util.cardBackground
-import com.x8bit.bitwarden.ui.platform.base.util.cardPadding
+import com.x8bit.bitwarden.ui.platform.base.util.cardStyle
 import com.x8bit.bitwarden.ui.platform.base.util.nullableTestTag
 import com.x8bit.bitwarden.ui.platform.base.util.tabNavigation
 import com.x8bit.bitwarden.ui.platform.components.button.BitwardenStandardIconButton
@@ -133,8 +132,11 @@ fun BitwardenPasswordField(
         Column(
             modifier = modifier
                 .defaultMinSize(minHeight = 60.dp)
-                .cardBackground(cardStyle = cardStyle)
-                .cardPadding(cardStyle = cardStyle, top = 6.dp, bottom = 0.dp)
+                .cardStyle(
+                    cardStyle = cardStyle,
+                    paddingTop = 6.dp,
+                    paddingBottom = 0.dp,
+                )
                 .tabNavigation()
                 .focusRequester(focusRequester = focusRequester),
         ) {

diff --git a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/field/BitwardenTextField.kt b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/field/BitwardenTextField.kt
@@ -41,8 +41,7 @@ import androidx.compose.ui.text.input.VisualTransformation
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.window.PopupProperties
-import com.x8bit.bitwarden.ui.platform.base.util.cardBackground
-import com.x8bit.bitwarden.ui.platform.base.util.cardPadding
+import com.x8bit.bitwarden.ui.platform.base.util.cardStyle
 import com.x8bit.bitwarden.ui.platform.base.util.nullableTestTag
 import com.x8bit.bitwarden.ui.platform.base.util.toPx
 import com.x8bit.bitwarden.ui.platform.base.util.withLineBreaksAtWidth
@@ -251,8 +250,11 @@ fun BitwardenTextField(
                     .onGloballyPositioned { widthPx = it.size.width }
                     .onFocusEvent { focusState -> hasFocused = focusState.hasFocus }
                     .focusRequester(focusRequester)
-                    .cardBackground(cardStyle = cardStyle)
-                    .cardPadding(cardStyle = cardStyle, top = 6.dp, bottom = 0.dp)
+                    .cardStyle(
+                        cardStyle = cardStyle,
+                        paddingTop = 6.dp,
+                        paddingBottom = 0.dp,
+                    )
                     .fillMaxWidth(),
             ) {
                 TextField(