all: flesh out comments UI and move to common

common/src/commonMain/kotlin/dev/msfjarvis/claw/common/NetworkState.kt

@@ -0,0 +1,7 @@
+package dev.msfjarvis.lobsters.ui.comments
+
+sealed class NetworkState {
+  class Success<T>(val data: T) : NetworkState()
+  class Error(val message: String) : NetworkState()
+  object Loading : NetworkState()
+}

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

@@ -0,0 +1,58 @@
+package dev.msfjarvis.claw.common.comments
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material.Divider
+import androidx.compose.material.Surface
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.dp
+import dev.msfjarvis.claw.common.posts.PostDetails
+import dev.msfjarvis.claw.common.posts.SubmitterName
+import dev.msfjarvis.claw.common.posts.toDbModel
+import dev.msfjarvis.claw.model.Comment
+import dev.msfjarvis.claw.model.LobstersPostDetails
+
+@Composable
+fun CommentsHeader(
+  postDetails: LobstersPostDetails,
+) {
+  Surface {
+    Column(
+      modifier = Modifier.padding(horizontal = 16.dp, vertical = 4.dp).fillMaxWidth(),
+      verticalArrangement = Arrangement.spacedBy(4.dp),
+    ) {
+      PostDetails(
+        post = postDetails.toDbModel(),
+      )
+    }
+  }
+}
+
+@Composable
+fun CommentEntry(
+  comment: Comment,
+  parseHtml: (String) -> String,
+) {
+  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 {
+      SubmitterName(
+        text = "Submitted by ${comment.user.username}",
+        avatarUrl = "https://lobste.rs/${comment.user.avatarUrl}",
+        contentDescription = "Submitted by ${comment.user.username}",
+      )
+      Text(text = text, modifier = Modifier.padding(top = 8.dp))
+    }
+  }
+}

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

@@ -0,0 +1,76 @@
+package dev.msfjarvis.claw.common.comments
+
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.items
+import androidx.compose.material.CircularProgressIndicator
+import androidx.compose.material.Divider
+import androidx.compose.material.MaterialTheme
+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.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.dp
+import dev.msfjarvis.claw.model.LobstersPostDetails
+import dev.msfjarvis.lobsters.ui.comments.NetworkState
+
+@Composable
+private fun CommentsPageInternal(
+  details: LobstersPostDetails,
+  parseHtml: (String) -> String,
+  bottomPadding: Dp,
+) {
+  LazyColumn(Modifier.padding(bottom = bottomPadding)) {
+    item { CommentsHeader(postDetails = details) }
+
+    item { Spacer(modifier = Modifier.height(8.dp)) }
+
+    items(details.comments) { item -> CommentEntry(item, parseHtml) }
+
+    item { Divider(color = Color.Gray.copy(0.4f)) }
+  }
+}
+
+@Suppress("UNCHECKED_CAST")
+@Composable
+fun CommentsPage(
+  postId: String,
+  getDetails: suspend (String) -> LobstersPostDetails,
+  parseHtml: (String) -> String,
+  paddingValues: PaddingValues,
+) {
+  var postDetails: NetworkState by remember { mutableStateOf(NetworkState.Loading) }
+
+  LaunchedEffect(postId) { postDetails = NetworkState.Success(getDetails(postId)) }
+
+  when (postDetails) {
+    is NetworkState.Success<*> -> {
+      CommentsPageInternal(
+        (postDetails as NetworkState.Success<LobstersPostDetails>).data,
+        parseHtml,
+        paddingValues.calculateBottomPadding(),
+      )
+    }
+    is NetworkState.Error -> TODO("Handle no network scenario")
+    NetworkState.Loading -> ProgressBar(paddingValues.calculateBottomPadding())
+  }
+}
+
+@Composable
+private fun ProgressBar(bottomPadding: Dp) {
+  Box(
+    modifier = Modifier.padding(bottom = bottomPadding).fillMaxSize(),
+    contentAlignment = Alignment.Center
+  ) { CircularProgressIndicator(color = MaterialTheme.colors.secondary) }
+}