common: integrate CommentTreeColors into comments UI

common/src/commonMain/kotlin/dev/msfjarvis/claw/common/comments/CommentEntry.kt

@@ -1,10 +1,16 @@
 package dev.msfjarvis.claw.common.comments
 
+import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.IntrinsicSize
 import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
 import androidx.compose.material.Divider
 import androidx.compose.material.Surface
 import androidx.compose.material.Text
@@ -41,12 +47,14 @@ fun CommentEntry(
 ) {
   val indentLevel = comment.indentLevel.toInt() - 1
   val startPadding = ((10 * indentLevel) + 16).dp
-
-  Divider(color = Color.Gray.copy(0.4f))
-
-  Row(modifier = Modifier.padding(start = startPadding, end = 8.dp, top = 4.dp, bottom = 4.dp)) {
   val text = parseHtml(comment.comment)
-    Column {
+
+  Divider(color = Color.Gray.copy(0.4f))
+  Row(modifier = Modifier.height(IntrinsicSize.Min)) {
+    CommentTreeColors(indentLevel = indentLevel)
+    Column(
+      modifier = Modifier.padding(start = startPadding, end = 8.dp, top = 4.dp, bottom = 4.dp)
+    ) {
       SubmitterName(
         text = "Submitted by ${comment.user.username}",
         avatarUrl = "https://lobste.rs/${comment.user.avatarUrl}",
@@ -56,3 +64,21 @@ fun CommentEntry(
     }
   }
 }
+
+@Composable
+private fun CommentTreeColors(
+  indentLevel: Int,
+  modifier: Modifier = Modifier,
+) {
+  Box(modifier = modifier) {
+    for (level in 1..indentLevel) {
+      Box(
+        modifier =
+          Modifier.padding(start = (level * 12).dp)
+            .fillMaxHeight()
+            .width(1.dp)
+            .background(CommentTreeColor[level])
+      )
+    }
+  }
+}

common/src/commonMain/kotlin/dev/msfjarvis/claw/common/comments/CommentTreeColors.kt

@@ -24,7 +24,7 @@ object CommentTreeColor {
       Color(0xFFFF0097),
       Color(0xFF1E7145),
     )
-  private val size = colors.size
+  val size = colors.size
 
   operator fun get(idx: Int): Color = colors[idx % size]
 }