Convert copy & toggle visibility to IconButton

2 files changed, 25 insertions, 43 deletions

diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/AnimatedIconButton.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/AnimatedIconButton.kt
index 919dc33bf0..04681400b8 100644
--- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/AnimatedIconButton.kt
+++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/AnimatedIconButton.kt
@@ -1,21 +1,17 @@
 package net.mullvad.mullvadvpn.compose.button
 
 import androidx.compose.animation.AnimatedContent
-import androidx.compose.foundation.Image
-import androidx.compose.foundation.clickable
-import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.padding
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.ColorFilter
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.painter.Painter
 import kotlinx.coroutines.delay
-import net.mullvad.mullvadvpn.lib.theme.Dimens
 
 internal const val PRESS_EFFECT_TIME_SPAN: Long = 1000
 
@@ -23,10 +19,9 @@ internal const val PRESS_EFFECT_TIME_SPAN: Long = 1000
 fun AnimatedIconButton(
     defaultIcon: Painter,
     secondaryIcon: Painter,
-    modifier: Modifier = Modifier,
     pressEffectDuration: Long = PRESS_EFFECT_TIME_SPAN,
-    defaultIconColorFilter: ColorFilter? = null,
-    secondaryIconColorFilter: ColorFilter? = null,
+    defaultIconTint: Color = Color.Unspecified,
+    secondaryIconTint: Color = Color.Unspecified,
     contentDescription: String,
     isToggleButton: Boolean = false,
     onClick: () -> Unit
@@ -38,52 +33,41 @@ fun AnimatedIconButton(
             state = ButtonState.IDLE
         }
     }
-    Box(
-        modifier =
-            modifier
-                .clickable {
-                    when (state) {
-                        ButtonState.IDLE -> {
-                            state = if (isToggleButton) ButtonState.TOGGLED else ButtonState.PRESSED
-                            onClick()
-                        }
-                        ButtonState.TOGGLED -> {
-                            state = ButtonState.IDLE
-                            onClick()
-                        }
-                        ButtonState.PRESSED -> {}
-                    }
+
+    IconButton(
+        onClick = {
+            when (state) {
+                ButtonState.IDLE -> {
+                    state = if (isToggleButton) ButtonState.TOGGLED else ButtonState.PRESSED
+                    onClick()
+                }
+                ButtonState.TOGGLED -> {
+                    state = ButtonState.IDLE
+                    onClick()
                 }
-                .padding(all = Dimens.smallPadding)
+                ButtonState.PRESSED -> {}
+            }
+        }
     ) {
         AnimatedContent(targetState = state, label = contentDescription) { targetState ->
             val iconPainter: Painter
-            val colorFilter: ColorFilter?
-            val imageModifier: Modifier
+            val tint: Color
             when (targetState) {
                 ButtonState.IDLE -> {
                     iconPainter = defaultIcon
-                    colorFilter = defaultIconColorFilter
-                    imageModifier = modifier
+                    tint = defaultIconTint
                 }
                 ButtonState.TOGGLED -> {
                     iconPainter = secondaryIcon
-                    colorFilter = secondaryIconColorFilter
-                    imageModifier = modifier
+                    tint = secondaryIconTint
                 }
                 ButtonState.PRESSED -> {
                     iconPainter = secondaryIcon
-                    colorFilter = secondaryIconColorFilter
-                    imageModifier = modifier
+                    tint = secondaryIconTint
                 }
             }
 
-            Image(
-                painter = iconPainter,
-                colorFilter = colorFilter,
-                contentDescription = contentDescription,
-                modifier = imageModifier
-            )
+            Icon(painter = iconPainter, contentDescription = contentDescription, tint = tint)
         }
     }
 }
diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/CopyableObfuscationView.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/CopyableObfuscationView.kt
index a435214732..3388eb2b85 100644
--- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/CopyableObfuscationView.kt
+++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/CopyableObfuscationView.kt
@@ -10,7 +10,6 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment.Companion.CenterVertically
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.ColorFilter
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
@@ -66,8 +65,7 @@ fun CopyAnimatedIconButton(onClick: () -> Unit) {
     AnimatedIconButton(
         defaultIcon = painterResource(id = R.drawable.icon_copy),
         secondaryIcon = painterResource(id = R.drawable.icon_tick),
-        secondaryIconColorFilter =
-            ColorFilter.tint(color = MaterialTheme.colorScheme.inversePrimary),
+        secondaryIconTint = MaterialTheme.colorScheme.inversePrimary,
         isToggleButton = false,
         contentDescription = stringResource(id = R.string.copy_account_number),
         onClick = onClick