PM-13937: Consolidate button UI and logic (#4149)

2024-10-31 07:05:35 +03:00 · 2024-10-24 10:27:06 -05:00 · 2024-10-24 10:27:06 -05:00 · 28e87fe216
commit 28e87fe216
parent 1c10a94109
16 changed files with 232 additions and 373 deletions
--- a/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/login/LoginScreen.kt
+++ b/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/login/LoginScreen.kt
@ -41,7 +41,7 @@ import com.x8bit.bitwarden.ui.platform.components.appbar.BitwardenTopAppBar
 import com.x8bit.bitwarden.ui.platform.components.appbar.action.BitwardenOverflowActionItem
 import com.x8bit.bitwarden.ui.platform.components.appbar.action.OverflowMenuItemData
 import com.x8bit.bitwarden.ui.platform.components.button.BitwardenFilledButton
-import com.x8bit.bitwarden.ui.platform.components.button.BitwardenOutlinedButtonWithIcon
+import com.x8bit.bitwarden.ui.platform.components.button.BitwardenOutlinedButton
 import com.x8bit.bitwarden.ui.platform.components.dialog.BasicDialogState
 import com.x8bit.bitwarden.ui.platform.components.dialog.BitwardenBasicDialog
 import com.x8bit.bitwarden.ui.platform.components.dialog.BitwardenLoadingDialog
@ -273,7 +273,7 @@ private fun LoginScreenContent(
        Spacer(modifier = Modifier.height(12.dp))

        if (state.shouldShowLoginWithDevice) {
-            BitwardenOutlinedButtonWithIcon(
+            BitwardenOutlinedButton(
                label = stringResource(id = R.string.log_in_with_device),
                icon = rememberVectorPainter(id = R.drawable.ic_mobile),
                onClick = onLoginWithDeviceClick,
@ -286,7 +286,7 @@ private fun LoginScreenContent(
            Spacer(modifier = Modifier.height(12.dp))
        }

-        BitwardenOutlinedButtonWithIcon(
+        BitwardenOutlinedButton(
            label = stringResource(id = R.string.log_in_sso),
            icon = rememberVectorPainter(id = R.drawable.ic_briefcase),
            onClick = onSingleSignOnClick,
--- a/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/masterpasswordgenerator/MasterPasswordGeneratorScreen.kt
+++ b/app/src/main/java/com/x8bit/bitwarden/ui/auth/feature/masterpasswordgenerator/MasterPasswordGeneratorScreen.kt
@ -30,7 +30,7 @@ import com.x8bit.bitwarden.R
 import com.x8bit.bitwarden.ui.platform.base.util.EventsEffect
 import com.x8bit.bitwarden.ui.platform.base.util.standardHorizontalMargin
 import com.x8bit.bitwarden.ui.platform.components.appbar.BitwardenTopAppBar
-import com.x8bit.bitwarden.ui.platform.components.button.BitwardenFilledButtonWithIcon
+import com.x8bit.bitwarden.ui.platform.components.button.BitwardenFilledButton
 import com.x8bit.bitwarden.ui.platform.components.button.BitwardenTextButton
 import com.x8bit.bitwarden.ui.platform.components.field.BitwardenTextField
 import com.x8bit.bitwarden.ui.platform.components.scaffold.BitwardenScaffold
@ -151,7 +151,7 @@ private fun MasterPasswordGeneratorContent(
        )

        Spacer(modifier = Modifier.height(12.dp))
-        BitwardenFilledButtonWithIcon(
+        BitwardenFilledButton(
            label = stringResource(R.string.generate_button_label),
            onClick = onGenerateNewPassword,
            icon = rememberVectorPainter(id = R.drawable.ic_generate),
--- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledButton.kt
+++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledButton.kt
@ -1,14 +1,22 @@
 package com.x8bit.bitwarden.ui.platform.components.button

+import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.width
 import androidx.compose.material3.Button
+import androidx.compose.material3.ButtonColors
+import androidx.compose.material3.Icon
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.painter.Painter
 import androidx.compose.ui.semantics.semantics
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
+import com.x8bit.bitwarden.R
 import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenFilledButtonColors
+import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter
 import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme

 /**
@ -17,6 +25,7 @@ import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme
 * @param label The label for the button.
 * @param onClick The callback when the button is clicked.
 * @param modifier The [Modifier] to be applied to the button.
+ * @param icon The icon for the button.
 * @param isEnabled Whether or not the button is enabled.
 */
@Composable
@ -24,18 +33,27 @@ fun BitwardenFilledButton(
    label: String,
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
+    icon: Painter? = null,
    isEnabled: Boolean = true,
+    colors: ButtonColors = bitwardenFilledButtonColors(),
 ) {
    Button(
-        onClick = onClick,
        modifier = modifier.semantics(mergeDescendants = true) {},
+        onClick = onClick,
        enabled = isEnabled,
        contentPadding = PaddingValues(
            vertical = 10.dp,
            horizontal = 24.dp,
        ),
-        colors = bitwardenFilledButtonColors(),
+        colors = colors,
    ) {
+        icon?.let {
+            Icon(
+                painter = icon,
+                contentDescription = null,
+            )
+            Spacer(modifier = Modifier.width(8.dp))
+        }
        Text(
            text = label,
            style = BitwardenTheme.typography.labelLarge,
@ -45,20 +63,31 @@ fun BitwardenFilledButton(

@Preview
@Composable
-private fun BitwardenFilledButton_preview_isEnabled() {
-    BitwardenFilledButton(
-        label = "Label",
-        onClick = {},
-        isEnabled = true,
-    )
-}
-
-@Preview
-@Composable
-private fun BitwardenFilledButton_preview_isNotEnabled() {
-    BitwardenFilledButton(
-        label = "Label",
-        onClick = {},
-        isEnabled = false,
-    )
+private fun BitwardenFilledButton_preview() {
+    Column {
+        BitwardenFilledButton(
+            label = "Label",
+            onClick = {},
+            icon = null,
+            isEnabled = true,
+        )
+        BitwardenFilledButton(
+            label = "Label",
+            onClick = {},
+            icon = rememberVectorPainter(id = R.drawable.ic_question_circle),
+            isEnabled = true,
+        )
+        BitwardenFilledButton(
+            label = "Label",
+            onClick = {},
+            icon = null,
+            isEnabled = false,
+        )
+        BitwardenFilledButton(
+            label = "Label",
+            onClick = {},
+            icon = rememberVectorPainter(id = R.drawable.ic_question_circle),
+            isEnabled = false,
+        )
+    }
 }
--- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledButtonWithIcon.kt
+++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledButtonWithIcon.kt
@ -1,72 +0,0 @@
-package com.x8bit.bitwarden.ui.platform.components.button
-
-import androidx.compose.foundation.layout.PaddingValues
-import androidx.compose.foundation.layout.padding
-import androidx.compose.material3.Button
-import androidx.compose.material3.Icon
-import androidx.compose.material3.Text
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.painter.Painter
-import androidx.compose.ui.semantics.semantics
-import androidx.compose.ui.tooling.preview.Preview
-import androidx.compose.ui.unit.dp
-import com.x8bit.bitwarden.R
-import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenFilledButtonColors
-import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter
-import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme
-
-/**
- * Represents a Bitwarden-styled filled button with an icon.
- *
- * @param label The label for the button.
- * @param icon The icon for the button.
- * @param onClick The callback when the button is clicked.
- * @param modifier The [Modifier] to be applied to the button.
- * @param isEnabled Whether or not the button is enabled.
- */
-@Composable
-fun BitwardenFilledButtonWithIcon(
-    label: String,
-    icon: Painter,
-    onClick: () -> Unit,
-    modifier: Modifier = Modifier,
-    isEnabled: Boolean = true,
-) {
-    Button(
-        onClick = onClick,
-        modifier = modifier
-            .semantics(mergeDescendants = true) { },
-        enabled = isEnabled,
-        contentPadding = PaddingValues(
-            vertical = 10.dp,
-            horizontal = 24.dp,
-        ),
-        colors = bitwardenFilledButtonColors(),
-    ) {
-        Icon(
-            painter = icon,
-            contentDescription = null,
-            modifier = Modifier
-                .padding(end = 8.dp),
-        )
-
-        Text(
-            text = label,
-            style = BitwardenTheme.typography.labelLarge,
-        )
-    }
-}
-
-@Preview(showBackground = true)
-@Composable
-private fun BitwardenFilledButtonWithIcon_preview() {
-    BitwardenTheme {
-        BitwardenFilledButtonWithIcon(
-            label = "Test Button",
-            icon = rememberVectorPainter(id = R.drawable.ic_question_circle),
-            onClick = {},
-            isEnabled = true,
-        )
-    }
-}
--- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledErrorButton.kt
+++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledErrorButton.kt
@ -1,15 +1,14 @@
 package com.x8bit.bitwarden.ui.platform.components.button

-import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Column
 import androidx.compose.material3.Button
-import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.semantics.semantics
+import androidx.compose.ui.graphics.painter.Painter
 import androidx.compose.ui.tooling.preview.Preview
-import androidx.compose.ui.unit.dp
+import com.x8bit.bitwarden.R
 import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenFilledErrorButtonColors
-import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme
+import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter

 /**
 * Represents a Bitwarden-styled filled [Button] for error scenarios.
@ -17,6 +16,7 @@ import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme
 * @param label The label for the button.
 * @param onClick The callback when the button is clicked.
 * @param modifier The [Modifier] to be applied to the button.
+ * @param icon The icon for the button.
 * @param isEnabled Whether or not the button is enabled.
 */
@Composable
@ -24,44 +24,45 @@ fun BitwardenFilledErrorButton(
    label: String,
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
+    icon: Painter? = null,
    isEnabled: Boolean = true,
 ) {
-    Button(
+    BitwardenFilledButton(
+        label = label,
        onClick = onClick,
-        modifier = modifier.semantics(mergeDescendants = true) {},
-        enabled = isEnabled,
-        contentPadding = PaddingValues(
-            vertical = 10.dp,
-            horizontal = 24.dp,
-        ),
+        icon = icon,
+        modifier = modifier,
+        isEnabled = isEnabled,
        colors = bitwardenFilledErrorButtonColors(),
-    ) {
-        Text(
-            text = label,
-            style = BitwardenTheme.typography.labelLarge,
-        )
-    }
+    )
 }

@Preview
@Composable
-private fun BitwardenErrorButton_preview_isEnabled() {
-    BitwardenTheme {
+private fun BitwardenErrorButton_preview() {
+    Column {
        BitwardenFilledErrorButton(
            label = "Label",
            onClick = {},
+            icon = null,
            isEnabled = true,
        )
-    }
-}
-
-@Preview(showBackground = true)
-@Composable
-private fun BitwardenErrorButton_preview_isNotEnabled() {
-    BitwardenTheme {
        BitwardenFilledErrorButton(
            label = "Label",
            onClick = {},
+            icon = rememberVectorPainter(id = R.drawable.ic_question_circle),
+            isEnabled = true,
+        )
+        BitwardenFilledErrorButton(
+            label = "Label",
+            onClick = {},
+            icon = null,
+            isEnabled = false,
+        )
+        BitwardenFilledErrorButton(
+            label = "Label",
+            onClick = {},
+            icon = rememberVectorPainter(id = R.drawable.ic_question_circle),
            isEnabled = false,
        )
    }
--- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledTonalButton.kt
+++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledTonalButton.kt
@ -1,20 +1,28 @@
 package com.x8bit.bitwarden.ui.platform.components.button

+import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
-import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.width
 import androidx.compose.material3.Button
+import androidx.compose.material3.Icon
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.painter.Painter
+import androidx.compose.ui.semantics.semantics
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
+import com.x8bit.bitwarden.R
 import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenFilledTonalButtonColors
+import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter
 import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme

 /**
 * A filled tonal button for the Bitwarden UI with a customized appearance.
 *
 * @param label The text to be displayed on the button.
+ * @param icon The icon for the button.
 * @param onClick A lambda which will be invoked when the button is clicked.
 * @param isEnabled Whether or not the button is enabled.
 * @param modifier A [Modifier] for this composable, allowing for adjustments to its appearance
@ -25,9 +33,11 @@ fun BitwardenFilledTonalButton(
    label: String,
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
+    icon: Painter? = null,
    isEnabled: Boolean = true,
 ) {
    Button(
+        modifier = modifier.semantics(mergeDescendants = true) { },
        onClick = onClick,
        contentPadding = PaddingValues(
            vertical = 10.dp,
@ -35,8 +45,14 @@ fun BitwardenFilledTonalButton(
        ),
        enabled = isEnabled,
        colors = bitwardenFilledTonalButtonColors(),
-        modifier = modifier,
    ) {
+        icon?.let {
+            Icon(
+                painter = icon,
+                contentDescription = null,
+            )
+            Spacer(modifier = Modifier.width(8.dp))
+        }
        Text(
            text = label,
            style = BitwardenTheme.typography.labelLarge,
@ -47,11 +63,30 @@ fun BitwardenFilledTonalButton(
@Preview(showBackground = true)
@Composable
 private fun BitwardenFilledTonalButton_preview() {
-    BitwardenTheme {
+    Column {
        BitwardenFilledTonalButton(
-            label = "Sample Text",
+            label = "Label",
            onClick = {},
-            modifier = Modifier.padding(horizontal = 16.dp),
+            icon = null,
+            isEnabled = true,
+        )
+        BitwardenFilledTonalButton(
+            label = "Label",
+            onClick = {},
+            icon = rememberVectorPainter(id = R.drawable.ic_question_circle),
+            isEnabled = true,
+        )
+        BitwardenFilledTonalButton(
+            label = "Label",
+            onClick = {},
+            icon = null,
+            isEnabled = false,
+        )
+        BitwardenFilledTonalButton(
+            label = "Label",
+            onClick = {},
+            icon = rememberVectorPainter(id = R.drawable.ic_question_circle),
+            isEnabled = false,
        )
    }
 }
--- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledTonalButtonWithIcon.kt
+++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenFilledTonalButtonWithIcon.kt
@ -1,70 +0,0 @@
-package com.x8bit.bitwarden.ui.platform.components.button
-
-import androidx.compose.foundation.layout.PaddingValues
-import androidx.compose.foundation.layout.padding
-import androidx.compose.material3.Button
-import androidx.compose.material3.Icon
-import androidx.compose.material3.Text
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.painter.Painter
-import androidx.compose.ui.tooling.preview.Preview
-import androidx.compose.ui.unit.dp
-import com.x8bit.bitwarden.R
-import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenFilledTonalButtonColors
-import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter
-import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme
-
-/**
- * A filled tonal button for the Bitwarden UI with a customized appearance and an icon.
- *
- * @param label The text to be displayed on the button.
- * @param icon The icon for the button.
- * @param onClick A lambda which will be invoked when the button is clicked.
- * @param modifier A [Modifier] for this composable, allowing for adjustments to its appearance
- * or behavior. This can be used to apply padding, layout, and other Modifiers.
- * @param isEnabled Whether or not the button is enabled.
- */
-@Composable
-fun BitwardenFilledTonalButtonWithIcon(
-    label: String,
-    icon: Painter,
-    onClick: () -> Unit,
-    modifier: Modifier = Modifier,
-    isEnabled: Boolean = true,
-) {
-    Button(
-        onClick = onClick,
-        contentPadding = PaddingValues(
-            vertical = 10.dp,
-            horizontal = 24.dp,
-        ),
-        colors = bitwardenFilledTonalButtonColors(),
-        modifier = modifier,
-        enabled = isEnabled,
-    ) {
-        Icon(
-            painter = icon,
-            contentDescription = null,
-            modifier = Modifier
-                .padding(end = 8.dp),
-        )
-        Text(
-            text = label,
-            style = BitwardenTheme.typography.labelLarge,
-        )
-    }
-}
-
-@Preview(showBackground = true)
-@Composable
-private fun BitwardenFilledTonalButtonWithIcon_preview() {
-    BitwardenTheme {
-        BitwardenFilledTonalButtonWithIcon(
-            label = "Sample Text",
-            icon = rememberVectorPainter(id = R.drawable.ic_question_circle),
-            onClick = {},
-            modifier = Modifier.padding(horizontal = 16.dp),
-        )
-    }
-}
--- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenOutlinedButton.kt
+++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenOutlinedButton.kt
@ -1,18 +1,25 @@
 package com.x8bit.bitwarden.ui.platform.components.button

 import androidx.compose.foundation.BorderStroke
+import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.width
 import androidx.compose.material3.ButtonColors
+import androidx.compose.material3.Icon
 import androidx.compose.material3.OutlinedButton
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.Immutable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.painter.Painter
 import androidx.compose.ui.semantics.semantics
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
+import com.x8bit.bitwarden.R
 import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenOutlinedButtonColors
+import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter
 import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme

 /**
@ -21,6 +28,7 @@ import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme
 * @param label The label for the button.
 * @param onClick The callback when the button is clicked.
 * @param modifier The [Modifier] to be applied to the button.
+ * @param icon The icon for the button.
 * @param isEnabled Whether or not the button is enabled.
 */
@Composable
@ -28,13 +36,13 @@ fun BitwardenOutlinedButton(
    label: String,
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
+    icon: Painter? = null,
    isEnabled: Boolean = true,
    colors: BitwardenOutlinedButtonColors = bitwardenOutlinedButtonColors(),
 ) {
    OutlinedButton(
+        modifier = modifier.semantics(mergeDescendants = true) { },
        onClick = onClick,
-        modifier = modifier
-            .semantics(mergeDescendants = true) { },
        enabled = isEnabled,
        contentPadding = PaddingValues(
            vertical = 10.dp,
@ -50,6 +58,13 @@ fun BitwardenOutlinedButton(
            },
        ),
    ) {
+        icon?.let {
+            Icon(
+                painter = icon,
+                contentDescription = null,
+            )
+            Spacer(modifier = Modifier.width(8.dp))
+        }
        Text(
            text = label,
            style = BitwardenTheme.typography.labelLarge,
@ -69,20 +84,31 @@ data class BitwardenOutlinedButtonColors(

@Preview
@Composable
-private fun BitwardenOutlinedButton_preview_isEnabled() {
-    BitwardenOutlinedButton(
-        label = "Label",
-        onClick = {},
-        isEnabled = true,
-    )
-}
-
-@Preview
-@Composable
-private fun BitwardenOutlinedButton_preview_isNotEnabled() {
-    BitwardenOutlinedButton(
-        label = "Label",
-        onClick = {},
-        isEnabled = false,
-    )
+private fun BitwardenOutlinedButton_preview() {
+    Column {
+        BitwardenOutlinedButton(
+            label = "Label",
+            onClick = {},
+            icon = null,
+            isEnabled = true,
+        )
+        BitwardenOutlinedButton(
+            label = "Label",
+            onClick = {},
+            icon = rememberVectorPainter(id = R.drawable.ic_question_circle),
+            isEnabled = true,
+        )
+        BitwardenOutlinedButton(
+            label = "Label",
+            onClick = {},
+            icon = null,
+            isEnabled = false,
+        )
+        BitwardenOutlinedButton(
+            label = "Label",
+            onClick = {},
+            icon = rememberVectorPainter(id = R.drawable.ic_question_circle),
+            isEnabled = false,
+        )
+    }
 }
--- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenOutlinedButtonWithIcon.kt
+++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenOutlinedButtonWithIcon.kt
@ -1,91 +0,0 @@
-package com.x8bit.bitwarden.ui.platform.components.button
-
-import androidx.compose.foundation.BorderStroke
-import androidx.compose.foundation.layout.PaddingValues
-import androidx.compose.foundation.layout.padding
-import androidx.compose.material3.Icon
-import androidx.compose.material3.OutlinedButton
-import androidx.compose.material3.Text
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.painter.Painter
-import androidx.compose.ui.semantics.semantics
-import androidx.compose.ui.tooling.preview.Preview
-import androidx.compose.ui.unit.dp
-import com.x8bit.bitwarden.R
-import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenOutlinedButtonColors
-import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter
-import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme
-
-/**
- * Represents a Bitwarden-styled filled [OutlinedButton] with an icon.
- *
- * @param label The label for the button.
- * @param icon The icon for the button.
- * @param onClick The callback when the button is clicked.
- * @param modifier The [Modifier] to be applied to the button.
- * @param isEnabled Whether or not the button is enabled.
- */
-@Composable
-fun BitwardenOutlinedButtonWithIcon(
-    label: String,
-    icon: Painter,
-    onClick: () -> Unit,
-    modifier: Modifier = Modifier,
-    isEnabled: Boolean = true,
-    colors: BitwardenOutlinedButtonColors = bitwardenOutlinedButtonColors(),
-) {
-    OutlinedButton(
-        onClick = onClick,
-        modifier = modifier
-            .semantics(mergeDescendants = true) { },
-        enabled = isEnabled,
-        contentPadding = PaddingValues(
-            vertical = 10.dp,
-            horizontal = 24.dp,
-        ),
-        colors = colors.materialButtonColors,
-        border = BorderStroke(
-            width = 1.dp,
-            color = if (isEnabled) {
-                colors.outlineBorderColor
-            } else {
-                colors.outlinedDisabledBorderColor
-            },
-        ),
-    ) {
-        Icon(
-            painter = icon,
-            contentDescription = null,
-            modifier = Modifier
-                .padding(end = 8.dp),
-        )
-
-        Text(
-            text = label,
-            style = BitwardenTheme.typography.labelLarge,
-        )
-    }
-}
-
-@Preview
-@Composable
-private fun BitwardenOutlinedButtonWithIcon_preview_isEnabled() {
-    BitwardenOutlinedButtonWithIcon(
-        label = "Label",
-        icon = rememberVectorPainter(id = R.drawable.ic_light_bulb),
-        onClick = {},
-        isEnabled = true,
-    )
-}
-
-@Preview
-@Composable
-private fun BitwardenOutlinedButtonWithIcon_preview_isNotEnabled() {
-    BitwardenOutlinedButtonWithIcon(
-        label = "Label",
-        icon = rememberVectorPainter(id = R.drawable.ic_light_bulb),
-        onClick = {},
-        isEnabled = false,
-    )
-}
--- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenOutlinedErrorButton.kt
+++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenOutlinedErrorButton.kt
@ -1,15 +1,14 @@
 package com.x8bit.bitwarden.ui.platform.components.button

-import androidx.compose.foundation.BorderStroke
-import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Column
 import androidx.compose.material3.OutlinedButton
-import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.semantics.semantics
+import androidx.compose.ui.graphics.painter.Painter
 import androidx.compose.ui.tooling.preview.Preview
-import androidx.compose.ui.unit.dp
-import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenOutlinedErrorButtonColors
+import com.x8bit.bitwarden.R
+import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenOutlinedButtonColors
+import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter
 import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme

 /**
@ -18,6 +17,7 @@ import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme
 * @param label The label for the button.
 * @param onClick The callback when the button is clicked.
 * @param modifier The [Modifier] to be applied to the button.
+ * @param icon The icon for the button.
 * @param isEnabled Whether or not the button is enabled.
 */
@Composable
@ -25,47 +25,50 @@ fun BitwardenOutlinedErrorButton(
    label: String,
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
+    icon: Painter? = null,
    isEnabled: Boolean = true,
 ) {
-    OutlinedButton(
-        modifier = modifier.semantics(mergeDescendants = true) { },
+    BitwardenOutlinedButton(
+        label = label,
        onClick = onClick,
-        enabled = isEnabled,
-        contentPadding = PaddingValues(
-            vertical = 10.dp,
-            horizontal = 24.dp,
+        icon = icon,
+        modifier = modifier,
+        isEnabled = isEnabled,
+        colors = bitwardenOutlinedButtonColors(
+            contentColor = BitwardenTheme.colorScheme.status.error,
+            outlineColor = BitwardenTheme.colorScheme.status.error,
+            outlineColorDisabled = BitwardenTheme.colorScheme.status.error.copy(alpha = 0.12f),
        ),
-        colors = bitwardenOutlinedErrorButtonColors(),
-        border = BorderStroke(
-            width = 1.dp,
-            color = BitwardenTheme.colorScheme.status.error.copy(
-                alpha = if (isEnabled) 1f else 0.12f,
-            ),
-        ),
-    ) {
-        Text(
-            text = label,
-            style = BitwardenTheme.typography.labelLarge,
+    )
+}
+
+@Preview
+@Composable
+private fun BBitwardenOutlinedErrorButton_preview() {
+    Column {
+        BitwardenOutlinedErrorButton(
+            label = "Label",
+            onClick = {},
+            icon = null,
+            isEnabled = true,
+        )
+        BitwardenOutlinedErrorButton(
+            label = "Label",
+            onClick = {},
+            icon = rememberVectorPainter(id = R.drawable.ic_question_circle),
+            isEnabled = true,
+        )
+        BitwardenOutlinedErrorButton(
+            label = "Label",
+            onClick = {},
+            icon = null,
+            isEnabled = false,
+        )
+        BitwardenOutlinedErrorButton(
+            label = "Label",
+            onClick = {},
+            icon = rememberVectorPainter(id = R.drawable.ic_question_circle),
+            isEnabled = false,
        )
    }
 }
-
-@Preview
-@Composable
-private fun BitwardenOutlinedErrorButton_preview_isEnabled() {
-    BitwardenOutlinedErrorButton(
-        label = "Label",
-        onClick = {},
-        isEnabled = true,
-    )
-}
-
-@Preview
-@Composable
-private fun BBitwardenOutlinedErrorButton_preview_isNotEnabled() {
-    BitwardenOutlinedErrorButton(
-        label = "Label",
-        onClick = {},
-        isEnabled = false,
-    )
-}
--- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenTextButton.kt
+++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/BitwardenTextButton.kt
@ -1,11 +1,13 @@
 package com.x8bit.bitwarden.ui.platform.components.button

+import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.material3.Text
 import androidx.compose.material3.TextButton
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.semantics.semantics
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenTextButtonColors
@ -28,8 +30,8 @@ fun BitwardenTextButton(
    labelTextColor: Color = BitwardenTheme.colorScheme.outlineButton.foreground,
 ) {
    TextButton(
+        modifier = modifier.semantics(mergeDescendants = true) {},
        onClick = onClick,
-        modifier = modifier,
        enabled = isEnabled,
        contentPadding = PaddingValues(
            vertical = 10.dp,
@ -47,8 +49,16 @@ fun BitwardenTextButton(
@Preview
@Composable
 private fun BitwardenTextButton_preview() {
-    BitwardenTextButton(
-        label = "Label",
-        onClick = {},
-    )
+    Column {
+        BitwardenTextButton(
+            label = "Label",
+            onClick = {},
+            isEnabled = true,
+        )
+        BitwardenTextButton(
+            label = "Label",
+            onClick = {},
+            isEnabled = false,
+        )
+    }
 }
--- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/color/BitwardenButtonColors.kt
+++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/components/button/color/BitwardenButtonColors.kt
@ -59,17 +59,6 @@ fun bitwardenOutlinedButtonColors(
        outlinedDisabledBorderColor = outlineColorDisabled,
    )

-/**
- * Provides a default set of Bitwarden-styled colors for an outlined error button.
- */
-@Composable
-fun bitwardenOutlinedErrorButtonColors(): ButtonColors = ButtonColors(
-    containerColor = Color.Transparent,
-    contentColor = BitwardenTheme.colorScheme.status.error,
-    disabledContainerColor = Color.Transparent,
-    disabledContentColor = BitwardenTheme.colorScheme.outlineButton.foregroundDisabled,
-)
-
 /**
 * Provides a default set of Bitwarden-styled colors for a text button.
 */
--- a/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/settings/accountsecurity/pendingrequests/PendingRequestsScreen.kt
+++ b/app/src/main/java/com/x8bit/bitwarden/ui/platform/feature/settings/accountsecurity/pendingrequests/PendingRequestsScreen.kt
@ -45,7 +45,7 @@ import com.x8bit.bitwarden.ui.platform.base.util.LivecycleEventEffect
 import com.x8bit.bitwarden.ui.platform.base.util.bottomDivider
 import com.x8bit.bitwarden.ui.platform.base.util.standardHorizontalMargin
 import com.x8bit.bitwarden.ui.platform.components.appbar.BitwardenTopAppBar
-import com.x8bit.bitwarden.ui.platform.components.button.BitwardenOutlinedButtonWithIcon
+import com.x8bit.bitwarden.ui.platform.components.button.BitwardenOutlinedButton
 import com.x8bit.bitwarden.ui.platform.components.content.BitwardenErrorContent
 import com.x8bit.bitwarden.ui.platform.components.content.BitwardenLoadingContent
 import com.x8bit.bitwarden.ui.platform.components.dialog.BitwardenTwoButtonDialog
@ -212,7 +212,7 @@ private fun PendingRequestsContent(
        }
        Spacer(modifier = Modifier.height(16.dp))

-        BitwardenOutlinedButtonWithIcon(
+        BitwardenOutlinedButton(
            label = stringResource(id = R.string.decline_all_requests),
            icon = rememberVectorPainter(id = R.drawable.ic_trash),
            onClick = { shouldShowDeclineAllRequestsConfirm = true },
--- a/app/src/main/java/com/x8bit/bitwarden/ui/tools/feature/send/SendEmpty.kt
+++ b/app/src/main/java/com/x8bit/bitwarden/ui/tools/feature/send/SendEmpty.kt
@ -21,7 +21,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.standardHorizontalMargin
-import com.x8bit.bitwarden.ui.platform.components.button.BitwardenFilledButtonWithIcon
+import com.x8bit.bitwarden.ui.platform.components.button.BitwardenFilledButton
 import com.x8bit.bitwarden.ui.platform.components.card.BitwardenInfoCalloutCard
 import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter
 import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme
@ -81,7 +81,7 @@ fun SendEmpty(

        Spacer(modifier = Modifier.height(24.dp))

-        BitwardenFilledButtonWithIcon(
+        BitwardenFilledButton(
            onClick = onAddItemClick,
            label = stringResource(id = R.string.add_a_send),
            modifier = Modifier.standardHorizontalMargin(),
--- a/app/src/main/java/com/x8bit/bitwarden/ui/vault/feature/addedit/VaultAddEditLoginItems.kt
+++ b/app/src/main/java/com/x8bit/bitwarden/ui/vault/feature/addedit/VaultAddEditLoginItems.kt
@ -20,7 +20,6 @@ import com.x8bit.bitwarden.R
 import com.x8bit.bitwarden.ui.platform.base.util.Text
 import com.x8bit.bitwarden.ui.platform.components.button.BitwardenFilledIconButton
 import com.x8bit.bitwarden.ui.platform.components.button.BitwardenOutlinedButton
-import com.x8bit.bitwarden.ui.platform.components.button.BitwardenOutlinedButtonWithIcon
 import com.x8bit.bitwarden.ui.platform.components.button.BitwardenStandardIconButton
 import com.x8bit.bitwarden.ui.platform.components.dialog.BitwardenTwoButtonDialog
 import com.x8bit.bitwarden.ui.platform.components.dropdown.BitwardenMultiSelectButton
@ -144,7 +143,7 @@ fun LazyListScope.vaultAddEditLoginItems(
    } else {
        item {
            Spacer(modifier = Modifier.height(16.dp))
-            BitwardenOutlinedButtonWithIcon(
+            BitwardenOutlinedButton(
                label = stringResource(id = R.string.setup_totp),
                icon = rememberVectorPainter(id = R.drawable.ic_light_bulb),
                onClick = onTotpSetupClick,
--- a/app/src/main/java/com/x8bit/bitwarden/ui/vault/feature/vault/VaultNoItems.kt
+++ b/app/src/main/java/com/x8bit/bitwarden/ui/vault/feature/vault/VaultNoItems.kt
@ -22,7 +22,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.standardHorizontalMargin
-import com.x8bit.bitwarden.ui.platform.components.button.BitwardenFilledButtonWithIcon
+import com.x8bit.bitwarden.ui.platform.components.button.BitwardenFilledButton
 import com.x8bit.bitwarden.ui.platform.components.card.BitwardenInfoCalloutCard
 import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter
 import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme
@ -86,7 +86,7 @@ fun VaultNoItems(

        Spacer(modifier = Modifier.height(24.dp))

-        BitwardenFilledButtonWithIcon(
+        BitwardenFilledButton(
            icon = rememberVectorPainter(R.drawable.ic_plus_small),
            modifier = Modifier.standardHorizontalMargin(),
            onClick = addItemClickAction,