From b77d93b8a701d2e639076e9a00dac49afe4c7602 Mon Sep 17 00:00:00 2001
From: hiar <aryal.himali@gmail.com>
Date: Fri, 7 Jun 2024 15:55:59 +0200
Subject: [PATCH] Added VerticalBlueBar on expand

---
 .../nfc/uicomponent/VerticalBlueBar.kt        | 43 +++++++++++++++++++
 .../feature/nfc/view/WifiScannerView.kt       | 34 +++++++--------
 2 files changed, 60 insertions(+), 17 deletions(-)
 create mode 100644 feature/nfc/src/main/java/no/nordicsemi/android/wifi/provisioner/feature/nfc/uicomponent/VerticalBlueBar.kt

diff --git a/feature/nfc/src/main/java/no/nordicsemi/android/wifi/provisioner/feature/nfc/uicomponent/VerticalBlueBar.kt b/feature/nfc/src/main/java/no/nordicsemi/android/wifi/provisioner/feature/nfc/uicomponent/VerticalBlueBar.kt
new file mode 100644
index 00000000..bea0b86b
--- /dev/null
+++ b/feature/nfc/src/main/java/no/nordicsemi/android/wifi/provisioner/feature/nfc/uicomponent/VerticalBlueBar.kt
@@ -0,0 +1,43 @@
+package no.nordicsemi.android.wifi.provisioner.feature.nfc.uicomponent
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.ColumnScope
+import androidx.compose.foundation.layout.IntrinsicSize
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxHeight
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
+
+/**
+ * This composable is used to create a vertical blue bar with a content.
+ *
+ * @param content The content to be displayed in the blue bar.
+ */
+@Composable
+internal fun VerticalBlueBar(
+    content: @Composable ColumnScope.() -> Unit,
+) {
+    Row(
+        modifier = Modifier.height(IntrinsicSize.Min).padding(start = 8.dp, top = 8.dp, bottom = 8.dp)
+    ) {
+        Box(
+            modifier = Modifier
+                .fillMaxHeight()
+                .width(8.dp)
+                .background(MaterialTheme.colorScheme.primary, RoundedCornerShape(4.dp))
+        )
+        Column(
+            modifier = Modifier.padding(start = 8.dp),
+        ) {
+            content()
+        }
+    }
+}
\ No newline at end of file
diff --git a/feature/nfc/src/main/java/no/nordicsemi/android/wifi/provisioner/feature/nfc/view/WifiScannerView.kt b/feature/nfc/src/main/java/no/nordicsemi/android/wifi/provisioner/feature/nfc/view/WifiScannerView.kt
index bd9fd2bf..479de151 100644
--- a/feature/nfc/src/main/java/no/nordicsemi/android/wifi/provisioner/feature/nfc/view/WifiScannerView.kt
+++ b/feature/nfc/src/main/java/no/nordicsemi/android/wifi/provisioner/feature/nfc/view/WifiScannerView.kt
@@ -58,6 +58,7 @@ import no.nordicsemi.android.wifi.provisioner.feature.nfc.permission.RequireLoca
 import no.nordicsemi.android.wifi.provisioner.feature.nfc.permission.RequireWifi
 import no.nordicsemi.android.wifi.provisioner.feature.nfc.uicomponent.PasswordDialog
 import no.nordicsemi.android.wifi.provisioner.feature.nfc.uicomponent.RssiIconView
+import no.nordicsemi.android.wifi.provisioner.feature.nfc.uicomponent.VerticalBlueBar
 import no.nordicsemi.android.wifi.provisioner.feature.nfc.viewmodel.OnNavigateUpClickEvent
 import no.nordicsemi.android.wifi.provisioner.feature.nfc.viewmodel.OnNetworkSelectEvent
 import no.nordicsemi.android.wifi.provisioner.feature.nfc.viewmodel.OnPasswordCancelEvent
@@ -111,7 +112,7 @@ internal fun WifiScannerScreen() {
                             .clickable {
                                 isGroupedBySsid = !isGroupedBySsid
                             }
-                            .padding(8.dp, 8.dp, 16.dp, 8.dp)
+                            .padding(8.dp)
 
                     )
                 }
@@ -353,28 +354,27 @@ private fun GroupBySsid(
             Icon(
                 imageVector = expandIcon,
                 contentDescription = null,
-                modifier = Modifier.padding(8.dp, 8.dp, 16.dp, 8.dp)
+                modifier = Modifier.padding(8.dp)
             )
         }
         // Show networks under the same SSID.
         AnimatedVisibility(visible = isExpanded) {
             Column {
                 HorizontalDivider()
-                network.forEach { scanResult ->
-                    NetworkItem(
-                        network = scanResult,
-                        modifier = Modifier.padding(
-                            start = 16.dp,
-                            top = 8.dp,
-                            end = 16.dp,
-                            bottom = 8.dp
-                        ),
-                        onEvent = onEvent
-                    )
-                    HorizontalDivider(
-                        modifier = Modifier.padding(start = 16.dp),
-                        thickness = 0.5.dp
-                    )
+                VerticalBlueBar {
+                    network.forEach { scanResult ->
+                        NetworkItem(
+                            network = scanResult,
+                            modifier = Modifier.padding(8.dp),
+                            onEvent = onEvent
+                        )
+                        if (scanResult != network.last()) {
+                            HorizontalDivider(
+                                modifier = Modifier.padding(start = 16.dp),
+                                thickness = 0.5.dp
+                            )
+                        }
+                    }
                 }
             }
         }