common: integrate LinkMetadata

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

@@ -12,6 +12,7 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.Icon
 import androidx.compose.material3.MaterialTheme
@@ -31,9 +32,11 @@ import dev.msfjarvis.claw.common.posts.PostTitle
 import dev.msfjarvis.claw.common.posts.Submitter
 import dev.msfjarvis.claw.common.posts.TagRow
 import dev.msfjarvis.claw.common.res.ClawIcons
+import dev.msfjarvis.claw.common.ui.NetworkImage
 import dev.msfjarvis.claw.common.ui.ThemedRichText
 import dev.msfjarvis.claw.model.Comment
 import dev.msfjarvis.claw.model.ExtendedPostDetails
+import dev.msfjarvis.claw.model.LinkMetadata
 
 @Composable
 fun CommentsHeader(
@@ -54,7 +57,7 @@ fun CommentsHeader(
 
       if (postDetails.linkMetadata.url.isNotBlank()) {
         PostLink(
-          link = postDetails.linkMetadata.url,
+          linkMetadata = postDetails.linkMetadata,
           modifier =
             Modifier.clickable {
               postActions.viewPost(postDetails.linkMetadata.url, postDetails.commentsUrl)
@@ -82,7 +85,7 @@ fun CommentsHeader(
 
 @Composable
 fun PostLink(
-  link: String,
+  linkMetadata: LinkMetadata,
   modifier: Modifier = Modifier,
 ) {
   Box(
@@ -92,13 +95,22 @@ fun PostLink(
     )
   ) {
     Row(modifier = Modifier.padding(16.dp), horizontalArrangement = Arrangement.spacedBy(16.dp)) {
-      Icon(
+      if (linkMetadata.faviconUrl != null) {
-        painter = ClawIcons.Web,
+        NetworkImage(
-        contentDescription = null,
+          url = linkMetadata.faviconUrl!!,
-        tint = MaterialTheme.colorScheme.onSecondary,
+          placeholder = ClawIcons.Web,
-      )
+          contentDescription = "",
+          modifier = Modifier.size(24.dp),
+        )
+      } else {
+        Icon(
+          painter = ClawIcons.Web,
+          contentDescription = null,
+          tint = MaterialTheme.colorScheme.onSecondary,
+        )
+      }
       Text(
-        text = link,
+        text = linkMetadata.url,
         overflow = TextOverflow.Ellipsis,
         maxLines = 1,
         color = MaterialTheme.colorScheme.onSecondary,

common/src/main/kotlin/dev/msfjarvis/claw/common/posts/LobstersCard.kt

@@ -143,6 +143,7 @@ fun Submitter(
   ) {
     NetworkImage(
       url = avatarUrl,
+      placeholder = ClawIcons.Account,
       contentDescription = contentDescription,
       modifier = modifier.requiredSize(24.dp).clip(CircleShape),
     )

common/src/main/kotlin/dev/msfjarvis/claw/common/res/ClawIcons.kt

@@ -1,5 +1,6 @@
 package dev.msfjarvis.claw.common.res
 
+import dev.msfjarvis.claw.common.res.clawicons.account_circle_black_24dp
 import dev.msfjarvis.claw.common.res.clawicons.arrow_back_black_24dp
 import dev.msfjarvis.claw.common.res.clawicons.comment_black_24dp
 import dev.msfjarvis.claw.common.res.clawicons.favorite_black_24dp
@@ -12,6 +13,8 @@ import dev.msfjarvis.claw.common.res.clawicons.whatshot_filled_black_24dp
 
 object ClawIcons {
 
+  val Account = account_circle_black_24dp()
+
   val ArrowBack = arrow_back_black_24dp()
 
   val Comment = comment_black_24dp()

common/src/main/kotlin/dev/msfjarvis/claw/common/ui/NetworkImage.kt

@@ -4,16 +4,21 @@ import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.painter.Painter
 import coil.compose.AsyncImage
 
 @Composable
 fun NetworkImage(
   url: String,
+  placeholder: Painter,
   contentDescription: String,
-  modifier: Modifier,
+  modifier: Modifier = Modifier,
 ) {
   AsyncImage(
     model = url,
+    placeholder = placeholder,
+    error = placeholder,
+    fallback = placeholder,
     contentDescription = contentDescription,
     modifier = modifier.clip(CircleShape)
   )

common/src/main/kotlin/dev/msfjarvis/claw/common/user/UserProfile.kt

@@ -19,6 +19,7 @@ import androidx.compose.ui.unit.dp
 import dev.msfjarvis.claw.common.NetworkState
 import dev.msfjarvis.claw.common.NetworkState.Loading
 import dev.msfjarvis.claw.common.NetworkState.Success
+import dev.msfjarvis.claw.common.res.ClawIcons
 import dev.msfjarvis.claw.common.ui.NetworkError
 import dev.msfjarvis.claw.common.ui.NetworkImage
 import dev.msfjarvis.claw.common.ui.ProgressBar
@@ -57,6 +58,7 @@ private fun UserProfileInternal(
     ) {
       NetworkImage(
         url = "https://lobste.rs/${user.avatarUrl}",
+        placeholder = ClawIcons.Account,
         contentDescription = "Avatar of ${user.username}",
         modifier = Modifier.requiredSize(120.dp).clip(CircleShape),
       )

common/svgs/account_circle_black_24dp.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><rect fill="none" height="24" width="24"/></g><g><path d="M12,2C6.48,2,2,6.48,2,12s4.48,10,10,10s10-4.48,10-10S17.52,2,12,2z M12,6c1.93,0,3.5,1.57,3.5,3.5S13.93,13,12,13 s-3.5-1.57-3.5-3.5S10.07,6,12,6z M12,20c-2.03,0-4.43-0.82-6.14-2.88C7.55,15.8,9.68,15,12,15s4.45,0.8,6.14,2.12 C16.43,19.18,14.03,20,12,20z"/></g></svg>