From c62cb9c3b4b8a29a8f09a42539efd87754ec0c66 Mon Sep 17 00:00:00 2001
From: Karan Sharma <55722391+ksharma-xyz@users.noreply.github.com>
Date: Sat, 28 Sep 2024 22:02:11 +1000
Subject: [PATCH] UI: add borderEnabled field to TransportModeIcon (#76)

---
 .../system/components/TransportModeIcon.kt    | 60 +++++++++++++++++++
 1 file changed, 60 insertions(+)

diff --git a/core/design-system/src/main/kotlin/xyz/ksharma/krail/design/system/components/TransportModeIcon.kt b/core/design-system/src/main/kotlin/xyz/ksharma/krail/design/system/components/TransportModeIcon.kt
index c8228a63..b80d83fd 100644
--- a/core/design-system/src/main/kotlin/xyz/ksharma/krail/design/system/components/TransportModeIcon.kt
+++ b/core/design-system/src/main/kotlin/xyz/ksharma/krail/design/system/components/TransportModeIcon.kt
@@ -1,10 +1,13 @@
 package xyz.ksharma.krail.design.system.components
 
 import androidx.compose.foundation.background
+import androidx.compose.foundation.border
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.aspectRatio
+import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.requiredSize
 import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -24,9 +27,17 @@ import xyz.ksharma.krail.design.system.theme.KrailTheme
 fun TransportModeIcon(
     transportModeType: TransportModeType,
     modifier: Modifier = Modifier,
+    borderEnabled: Boolean = false,
 ) {
     Box(
         modifier = modifier
+            .clip(shape = CircleShape)
+            .borderIfEnabled(
+                width = 1.dp.toAdaptiveSize(),
+                color = Color.White,
+                shape = CircleShape,
+                enabled = borderEnabled,
+            )
             .clip(shape = CircleShape)
             .requiredSize(width = 18.dp.toAdaptiveSize(), height = 18.dp.toAdaptiveSize())
             .aspectRatio(1f)
@@ -41,6 +52,13 @@ fun TransportModeIcon(
     }
 }
 
+private fun Modifier.borderIfEnabled(
+    width: Dp,
+    color: Color,
+    shape: RoundedCornerShape,
+    enabled: Boolean,
+): Modifier = if (enabled) border(width = width, color = color, shape = shape) else this
+
 @Composable
 private fun Dp.toAdaptiveSize(): Dp {
     val density = LocalDensity.current
@@ -96,4 +114,46 @@ private fun FerryPreview() {
     }
 }
 
+
+@ComponentPreviewLightDark
+@Preview(fontScale = 2f)
+@Composable
+private fun TrainWithBackgroundPreview() {
+    KrailTheme {
+        TransportModeIcon(TransportModeType.Train, borderEnabled = true)
+    }
+}
+
+@ComponentPreviews
+@Composable
+private fun BusWithBackgroundPreview() {
+    KrailTheme {
+        TransportModeIcon(TransportModeType.Bus, borderEnabled = true)
+    }
+}
+
+@ComponentPreviews
+@Composable
+private fun MetroWithBackgroundPreview() {
+    KrailTheme {
+        TransportModeIcon(TransportModeType.Metro, borderEnabled = true)
+    }
+}
+
+@ComponentPreviews
+@Composable
+private fun LightRailWithBackgroundPreview() {
+    KrailTheme {
+        TransportModeIcon(TransportModeType.LightRail, borderEnabled = true)
+    }
+}
+
+@ComponentPreviews
+@Composable
+private fun FerryWithBackgroundPreview() {
+    KrailTheme {
+        TransportModeIcon(TransportModeType.Ferry, borderEnabled = true)
+    }
+}
+
 // endregion