chore: ensure CodeButton sizing remains consistent across states

app/src/main/java/com/getcode/util/PaddingValues.kt

@@ -0,0 +1,58 @@
+package com.getcode.util
+
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.calculateStartPadding
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.platform.LocalLayoutDirection
+import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.dp
+
+fun PaddingValues.calculateVerticalPadding() = calculateTopPadding() + calculateBottomPadding()
+
+@Composable
+fun PaddingValues.calculateStartPadding(): Dp {
+    val ldr = LocalLayoutDirection.current
+    return calculateLeftPadding(ldr)
+}
+
+@Composable
+fun PaddingValues.calculateEndPadding(): Dp {
+    val ldr = LocalLayoutDirection.current
+    return calculateRightPadding(ldr)
+}
+
+@Composable
+fun PaddingValues.calculateHorizontalPadding(): Dp {
+    val ldr = LocalLayoutDirection.current
+    return calculateLeftPadding(ldr) + calculateRightPadding(ldr)
+}
+
+@Composable
+fun PaddingValues.minus(
+    start: Dp = 0.dp,
+    top: Dp = 0.dp,
+    end: Dp = 0.dp,
+    bottom: Dp = 0.dp,
+): PaddingValues {
+    return PaddingValues(
+        start = calculateStartPadding() - start,
+        top = calculateTopPadding() - top,
+        end = calculateEndPadding() - end,
+        bottom = calculateBottomPadding() - bottom,
+    )
+}
+
+@Composable
+fun PaddingValues.plus(
+    start: Dp = 0.dp,
+    top: Dp = 0.dp,
+    end: Dp = 0.dp,
+    bottom: Dp = 0.dp,
+): PaddingValues {
+    return PaddingValues(
+        start = calculateStartPadding() + start,
+        top = calculateTopPadding() + top,
+        end = calculateEndPadding() + end,
+        bottom = calculateBottomPadding() + bottom,
+    )
+}

app/src/main/java/com/getcode/view/components/BottomBarView.kt

@@ -64,6 +64,7 @@ fun BottomBarView(
             }
             Column(verticalArrangement = Arrangement.spacedBy(CodeTheme.dimens.grid.x2)) {
                 CodeButton(
+                    modifier = Modifier.fillMaxWidth(),
                     onClick = {
                         bottomBarMessage.onPositive()
                         onClose(BottomBarManager.BottomBarActionType.Positive)
@@ -77,6 +78,7 @@ fun BottomBarView(
                     text = bottomBarMessage.positiveText
                 )
                 CodeButton(
+                    modifier = Modifier.fillMaxWidth(),
                     onClick = {
                         bottomBarMessage.onNegative()
                         onClose(BottomBarManager.BottomBarActionType.Negative)

app/src/main/java/com/getcode/view/components/CodeButton.kt

@@ -10,15 +10,24 @@ import androidx.compose.material.ripple.RippleAlpha
 import androidx.compose.material.ripple.RippleTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
+import androidx.compose.runtime.derivedStateOf
+import androidx.compose.runtime.getValue
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.Shape
+import androidx.compose.ui.graphics.takeOrElse
+import androidx.compose.ui.platform.LocalLayoutDirection
 import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
 import com.getcode.R
 import com.getcode.theme.*
+import com.getcode.util.calculateHorizontalPadding
+import com.getcode.util.calculateVerticalPadding
+import com.getcode.util.minus
+import com.getcode.util.plus
 
 enum class ButtonState {
     Bordered,
@@ -27,6 +36,7 @@ enum class ButtonState {
     Subtle
 }
 
+@OptIn(ExperimentalMaterialApi::class)
 @Composable
 fun CodeButton(
     modifier: Modifier = Modifier,
@@ -38,75 +48,66 @@ fun CodeButton(
     enabled: Boolean = true,
     buttonState: ButtonState = ButtonState.Bordered,
     isPaddedVertical: Boolean = true,
-    textColor: Color? = null,
-    isMaxWidth: Boolean = true,
+    textColor: Color = Color.Unspecified,
     shape: Shape = CodeTheme.shapes.small,
 ) {
-    val isEnabledC = enabled && !isLoading && !isSuccess
+    val isEnabled by remember(enabled, isLoading, isSuccess) {
+        derivedStateOf { enabled && !isLoading && !isSuccess }
+    }
+    val isSuccessful by remember(isSuccess, isTextSuccess) {
+        derivedStateOf { isSuccess || isTextSuccess }
+    }
     val colors = getButtonColors(buttonState, textColor)
-    val border = getButtonBorder(buttonState, isEnabledC)
+    val border = getButtonBorder(buttonState, isEnabled)
     val ripple = getRipple(
         buttonState = buttonState,
-        contentColor = colors.contentColor(enabled = isEnabledC).value
+        contentColor = colors.contentColor(enabled = isEnabled).value
     )
 
-    CompositionLocalProvider(LocalRippleTheme provides ripple) {
+    CompositionLocalProvider(
+        LocalMinimumInteractiveComponentEnforcement provides false,
+        LocalRippleTheme provides ripple
+    ) {
         Button(
-            onClick = { onClick() },
-            modifier = modifier
-                .let { if (isMaxWidth) it.fillMaxWidth() else it },
+            onClick = onClick,
+            modifier = modifier,
             colors = colors,
             border = border,
-            enabled = isEnabledC,
+            enabled = isEnabled,
             elevation = elevation(
                 defaultElevation = 0.dp,
                 pressedElevation = 0.dp
             ),
             shape = shape,
+            contentPadding = ButtonDefaults.ContentPadding.plus(
+                top = if (isPaddedVertical) CodeTheme.dimens.grid.x3 else 0.dp,
+                bottom = if (isPaddedVertical) CodeTheme.dimens.grid.x3 else 0.dp,
+            )
         ) {
-            Box {
-                Text(
-                    text = " ",
-                    style = CodeTheme.typography.button,
-                    modifier = Modifier.padding(
-                        vertical = if (isPaddedVertical) CodeTheme.dimens.grid.x3 else 0.dp,
-                    ),
-                )
+            when {
+                isLoading -> {
+                    CodeCircularProgressIndicator(
+                        strokeWidth = CodeTheme.dimens.thickBorder,
+                        color = White,
+                        modifier = Modifier
+                            .size(CodeTheme.dimens.grid.x3)
+                    )
+                }
 
-                Row {
-                    if (isLoading) {
-                        CodeCircularProgressIndicator(
-                            strokeWidth = CodeTheme.dimens.thickBorder,
-                            color = White,
-                            modifier = Modifier
-                                .padding(vertical = if (isPaddedVertical) CodeTheme.dimens.grid.x3 else 0.dp)
-                                .size(CodeTheme.dimens.grid.x4)
-                                .align(Alignment.CenterVertically)
-                        )
-                    } else {
-                        if (isSuccess || isTextSuccess) {
-                            Image(
-                                painter = painterResource(id = R.drawable.ic_check),
-                                contentDescription = "",
-                                modifier = Modifier
-                                    .padding(
-                                        horizontal = CodeTheme.dimens.grid.x1,
-                                        vertical = if (isPaddedVertical) CodeTheme.dimens.grid.x3 else 0.dp
-                                    )
-                                    .align(Alignment.CenterVertically)
-                            )
-                        }
-                        if (!isSuccess) {
-                            Text(
-                                text = text,
-                                style = CodeTheme.typography.button,
-                                modifier = Modifier.padding(
-                                    vertical = if (isPaddedVertical) CodeTheme.dimens.grid.x3 else 0.dp,
-                                    horizontal = CodeTheme.dimens.grid.x2,
-                                )
-                            )
-                        }
-                    }
+                isSuccessful -> {
+                    Icon(
+                        modifier = Modifier.requiredSize(CodeTheme.dimens.grid.x3),
+                        painter = painterResource(id = R.drawable.ic_check),
+                        tint = Color.Unspecified,
+                        contentDescription = "",
+                    )
+                }
+
+                else -> {
+                    Text(
+                        text = text,
+                        style = CodeTheme.typography.button,
+                    )
                 }
             }
         }
@@ -144,32 +145,35 @@ fun getRipple(
 @Composable
 fun getButtonColors(
     buttonState: ButtonState = ButtonState.Bordered,
-    textColor: Color? = null,
+    textColor: Color = Color.Unspecified,
 ): ButtonColors {
     return when (buttonState) {
         ButtonState.Filled -> ButtonDefaults.buttonColors(
             backgroundColor = White,
-            contentColor = textColor ?: Color(0XFF121212),
+            contentColor = textColor.takeOrElse { Color(0XFF121212) },
             disabledBackgroundColor = White10,
             disabledContentColor = White10,
         )
+
         ButtonState.Bordered ->
             ButtonDefaults.outlinedButtonColors(
                 backgroundColor = Brand,
                 disabledContentColor = Color.LightGray,
-                contentColor = textColor ?: Color.LightGray,
+                contentColor = textColor.takeOrElse { Color.LightGray }
             )
+
         ButtonState.Filled10 ->
             ButtonDefaults.outlinedButtonColors(
                 backgroundColor = White10,
                 disabledContentColor = White50,
-                contentColor = textColor ?: White50,
+                contentColor = textColor.takeOrElse { White50 },
             )
+
         ButtonState.Subtle ->
             ButtonDefaults.outlinedButtonColors(
                 backgroundColor = Transparent,
                 disabledContentColor = Transparent,
-                contentColor = textColor ?: BrandLight,
+                contentColor = textColor.takeOrElse { BrandLight },
             )
     }
 }
@@ -181,7 +185,7 @@ fun getButtonBorder(buttonState: ButtonState, isEnabled: Boolean = true): Border
         if (buttonState == ButtonState.Bordered && isEnabled) {
             BorderStroke(border, White50)
         } else {
-            BorderStroke(border, Color.Transparent)
+            null
         }
     }
 }

app/src/main/java/com/getcode/view/login/AccessKey.kt

@@ -160,7 +160,7 @@ fun AccessKey(
                     .align(Alignment.BottomCenter)
                     .measured { buttonHeight = it.height }) {
                     CodeButton(
-                        modifier = Modifier,
+                        modifier = Modifier.fillMaxWidth(),
                         onClick = {
                             onExportClick()
                         },
@@ -172,7 +172,7 @@ fun AccessKey(
                     )
 
                     CodeButton(
-                        modifier = Modifier,
+                        modifier = Modifier.fillMaxWidth(),
                         onClick = {
                             BottomBarManager.showMessage(
                                 BottomBarManager.BottomBarMessage(

app/src/main/java/com/getcode/view/login/CameraPermission.kt

@@ -92,6 +92,7 @@ fun CameraPermission(navigator: CodeNavigator = LocalCodeNavigator.current) {
             text = stringResource(R.string.action_allowCameraAccess),
             buttonState = ButtonState.Filled,
             modifier = Modifier
+                .fillMaxWidth()
                 .padding(horizontal = CodeTheme.dimens.inset)
                 .constrainAs(button) {
                     linkTo(button.bottom, parent.bottom, bias = 1.0F)

app/src/main/java/com/getcode/view/login/InviteCode.kt

@@ -76,7 +76,11 @@ fun InviteCode(
                 .focusRequester(focusRequester)
                 .padding(top = CodeTheme.dimens.grid.x1)
                 .height(CodeTheme.dimens.grid.x12)
-                .border(width = CodeTheme.dimens.border, color = BrandLight, shape = CodeTheme.shapes.extraSmall)
+                .border(
+                    width = CodeTheme.dimens.border,
+                    color = BrandLight,
+                    shape = CodeTheme.shapes.extraSmall
+                )
                 .background(White05),
             value = dataState.inviteCode,
             textStyle = CodeTheme.typography.subtitle1,
@@ -121,6 +125,7 @@ fun InviteCode(
 
         CodeButton(
             modifier = Modifier
+                .fillMaxWidth()
                 .constrainAs(buttonAction) {
                     bottom.linkTo(parent.bottom)
                 },

app/src/main/java/com/getcode/view/login/LoginHome.kt

@@ -86,6 +86,7 @@ fun LoginHome() {
 
             CodeButton(
                 Modifier
+                    .fillMaxWidth()
                     .constrainAs(buttonCreate) {
                         top.linkTo(logo.bottom) //possibly remove!!
                         bottom.linkTo(buttonLogin.top)
@@ -99,6 +100,7 @@ fun LoginHome() {
             )
             CodeButton(
                 Modifier
+                    .fillMaxWidth()
                     .constrainAs(buttonLogin) {
                         top.linkTo(buttonCreate.bottom)
                     }

app/src/main/java/com/getcode/view/login/NotificationPermission.kt

@@ -73,6 +73,7 @@ fun NotificationPermission(navigator: CodeNavigator = LocalCodeNavigator.current
             text = stringResource(R.string.action_allowPushNotifications),
             buttonState = ButtonState.Filled,
             modifier = Modifier
+                .fillMaxWidth()
                 .padding(horizontal = CodeTheme.dimens.inset)
                 .constrainAs(button) {
                     start.linkTo(parent.start)
@@ -83,6 +84,7 @@ fun NotificationPermission(navigator: CodeNavigator = LocalCodeNavigator.current
 
         CodeButton(
             modifier = Modifier
+                .fillMaxWidth()
                 .padding(bottom = CodeTheme.dimens.grid.x2)
                 .padding(horizontal = CodeTheme.dimens.inset)
                 .constrainAs(buttonSkip) {

app/src/main/java/com/getcode/view/login/PhoneConfirm.kt

@@ -177,6 +177,7 @@ fun PhoneConfirm(
         }
 
         CodeButton(
+            modifier = Modifier.fillMaxWidth(),
             onClick = {
                 viewModel.onSubmit()
             },

app/src/main/java/com/getcode/view/login/PhoneVerify.kt

@@ -15,6 +15,7 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.imePadding
 import androidx.compose.foundation.layout.navigationBars
@@ -128,6 +129,7 @@ internal fun PhoneVerify(
 
 
         CodeButton(
+            modifier = Modifier.fillMaxWidth(),
             onClick = {
                 viewModel.onSubmit(navigator, context.getActivity())
             },

app/src/main/java/com/getcode/view/login/SeedInput.kt

@@ -134,6 +134,7 @@ fun SeedInput(
 
         CodeButton(
             modifier = Modifier
+                .fillMaxWidth()
                 .padding(
                     top = CodeTheme.dimens.grid.x3,
                     bottom = CodeTheme.dimens.grid.x4

app/src/main/java/com/getcode/view/main/account/AccountDeposit.kt

@@ -97,6 +97,7 @@ fun AccountDeposit() {
 
         CodeButton(
             modifier = Modifier
+                .fillMaxWidth()
                 .padding(bottom = CodeTheme.dimens.grid.x2),
             onClick = {
                 localClipboardManager.setText(AnnotatedString(address))