Merge pull request #2549 from vitorpamplona/claude/improve-desktop-design-iOokB

Add native OS theming and improve desktop UI layout

commons/src/commonMain/kotlin/com/vitorpamplona/amethyst/commons/icons/symbols/MaterialSymbolsFont.kt

@@ -47,24 +47,31 @@ private const val TEXT_MEASURER_CACHE_SIZE = 64
 /**
  * Builds the Material Symbols FontFamily and a shared TextMeasurer once for the subtree and
  * exposes them via CompositionLocal. Wrap app roots (AmethystTheme, desktop MaterialTheme) in this.
+ *
+ * The optional [weight] override lets callers pick a stroke thickness different from the
+ * library default — desktop uses per-OS weights (macOS likes the thinner SF-Symbols-ish
+ * look at 200, Windows Fluent icons sit closer to 400) while Android keeps the default.
  */
 @Composable
-fun ProvideMaterialSymbols(content: @Composable () -> Unit) {
+fun ProvideMaterialSymbols(
+    weight: Int = MaterialSymbolsDefaults.WEIGHT,
+    content: @Composable () -> Unit,
+) {
     val font =
         Font(
             resource = Res.font.material_symbols_outlined,
-            weight = FontWeight(MaterialSymbolsDefaults.WEIGHT),
+            weight = FontWeight(weight),
             variationSettings =
                 FontVariation.Settings(
-                    FontVariation.weight(MaterialSymbolsDefaults.WEIGHT),
+                    FontVariation.weight(weight),
                     FontVariation.Setting("FILL", MaterialSymbolsDefaults.FILL),
                     FontVariation.Setting("opsz", MaterialSymbolsDefaults.OPTICAL_SIZE),
                     FontVariation.Setting("GRAD", MaterialSymbolsDefaults.GRADE),
                 ),
         )
-    // Keyless remember: the Font wrapper identity changes every composition but the underlying
-    // resource is a compile-time constant, so one FontFamily for the lifetime of the subtree.
-    val fontFamily = remember { FontFamily(font) }
+    // Keyless remember is safe only when weight is stable; key on weight so a platform-
+    // preview override swap actually rebuilds the FontFamily.
+    val fontFamily = remember(weight) { FontFamily(font) }
     val textMeasurer = rememberTextMeasurer(cacheSize = TEXT_MEASURER_CACHE_SIZE)
     CompositionLocalProvider(
         LocalMaterialSymbolsFontFamily provides fontFamily,

commons/src/commonMain/kotlin/com/vitorpamplona/amethyst/commons/ui/chat/ChatBubbleLayout.kt

@@ -1,180 +0,0 @@
-/*
- * Copyright (c) 2025 Vitor Pamplona
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of
- * this software and associated documentation files (the "Software"), to deal in
- * the Software without restriction, including without limitation the rights to use,
- * copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the
- * Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
- * FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
- * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
- * WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-package com.vitorpamplona.amethyst.commons.ui.chat
-
-import androidx.compose.foundation.ExperimentalFoundationApi
-import androidx.compose.foundation.clickable
-import androidx.compose.foundation.combinedClickable
-import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.Row
-import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Surface
-import androidx.compose.runtime.Composable
-import androidx.compose.runtime.MutableState
-import androidx.compose.runtime.mutableStateOf
-import androidx.compose.runtime.remember
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.graphics.compositeOver
-import com.vitorpamplona.amethyst.commons.ui.theme.ChatBubbleMaxSizeModifier
-import com.vitorpamplona.amethyst.commons.ui.theme.ChatBubbleShapeMe
-import com.vitorpamplona.amethyst.commons.ui.theme.ChatBubbleShapeThem
-import com.vitorpamplona.amethyst.commons.ui.theme.ChatHalfHalfVertPadding
-import com.vitorpamplona.amethyst.commons.ui.theme.ChatPaddingInnerQuoteModifier
-import com.vitorpamplona.amethyst.commons.ui.theme.ChatPaddingModifier
-import com.vitorpamplona.amethyst.commons.ui.theme.ChatRowColSpacing5dp
-import com.vitorpamplona.amethyst.commons.ui.theme.MessageBubbleLimits
-import com.vitorpamplona.amethyst.commons.ui.theme.chatBubbleBackground
-import com.vitorpamplona.amethyst.commons.ui.theme.chatBubbleDraftBackground
-import com.vitorpamplona.amethyst.commons.ui.theme.chatBubbleMeBackground
-
-/**
- * Shared chat bubble layout used by both Android and Desktop.
- *
- * Renders a chat message bubble with appropriate shape, color, and alignment
- * depending on whether the message is from the logged-in user or another user.
- *
- * Content is provided via composable lambdas (slots) so platform-specific
- * implementations can plug in their own action menus, author lines, detail
- * rows, and message content.
- *
- * @param isLoggedInUser Whether this message was sent by the current user
- * @param isDraft Whether this message is a draft
- * @param innerQuote Whether this bubble is rendered as an inner quote (reply preview)
- * @param isComplete Whether the UI is in "complete" mode (always show details)
- * @param hasDetailsToShow Whether there are details (reactions, zaps) to display
- * @param drawAuthorInfo Whether to show the author avatar and name
- * @param parentBackgroundColor Background color of the parent (for compositing)
- * @param onClick Called on tap; return true if the click was consumed
- * @param onAuthorClick Called when the author line is tapped
- * @param actionMenu Composable for the long-press action menu popup
- * @param detailRow Composable for the detail row (time, reactions, relays)
- * @param drawAuthorLine Composable for the author avatar + name row
- * @param inner Composable for the message body content; receives the resolved background color
- */
-@OptIn(ExperimentalFoundationApi::class)
-@Composable
-fun ChatBubbleLayout(
-    isLoggedInUser: Boolean,
-    isDraft: Boolean,
-    innerQuote: Boolean,
-    isComplete: Boolean,
-    hasDetailsToShow: Boolean,
-    drawAuthorInfo: Boolean,
-    parentBackgroundColor: MutableState<Color>? = null,
-    onClick: () -> Boolean,
-    onAuthorClick: () -> Unit,
-    actionMenu: @Composable (onDismiss: () -> Unit) -> Unit,
-    detailRow: @Composable () -> Unit,
-    drawAuthorLine: @Composable () -> Unit,
-    inner: @Composable (MutableState<Color>) -> Unit,
-) {
-    val loggedInColors = MaterialTheme.colorScheme.chatBubbleMeBackground
-    val otherColors = MaterialTheme.colorScheme.chatBubbleBackground
-    val defaultBackground = MaterialTheme.colorScheme.background
-    val draftColor = MaterialTheme.colorScheme.chatBubbleDraftBackground
-
-    val bgColor =
-        remember {
-            if (isLoggedInUser) {
-                if (isDraft) {
-                    mutableStateOf(
-                        draftColor.compositeOver(parentBackgroundColor?.value ?: defaultBackground),
-                    )
-                } else {
-                    mutableStateOf(
-                        loggedInColors.compositeOver(parentBackgroundColor?.value ?: defaultBackground),
-                    )
-                }
-            } else {
-                mutableStateOf(otherColors.compositeOver(parentBackgroundColor?.value ?: defaultBackground))
-            }
-        }
-
-    Row(
-        modifier = if (innerQuote) ChatPaddingInnerQuoteModifier else ChatPaddingModifier,
-        horizontalArrangement = if (isLoggedInUser) Arrangement.End else Arrangement.Start,
-    ) {
-        val popupExpanded = remember { mutableStateOf(false) }
-
-        val showDetails =
-            remember {
-                mutableStateOf(
-                    if (isComplete) {
-                        true
-                    } else {
-                        hasDetailsToShow
-                    },
-                )
-            }
-
-        val clickableModifier =
-            remember {
-                Modifier.combinedClickable(
-                    onClick = {
-                        if (!onClick()) {
-                            if (!isComplete) {
-                                showDetails.value = !showDetails.value
-                            }
-                        }
-                    },
-                    onLongClick = { popupExpanded.value = true },
-                )
-            }
-
-        Row(
-            horizontalArrangement = if (isLoggedInUser) Arrangement.End else Arrangement.Start,
-            modifier = if (innerQuote) Modifier else ChatBubbleMaxSizeModifier,
-        ) {
-            Surface(
-                color = bgColor.value,
-                shape = if (isLoggedInUser) ChatBubbleShapeMe else ChatBubbleShapeThem,
-                modifier = clickableModifier,
-            ) {
-                Column(modifier = MessageBubbleLimits, verticalArrangement = ChatRowColSpacing5dp) {
-                    if (drawAuthorInfo) {
-                        Row(
-                            verticalAlignment = Alignment.CenterVertically,
-                            horizontalArrangement = if (isLoggedInUser) Arrangement.End else Arrangement.Start,
-                            modifier = ChatHalfHalfVertPadding.clickable(onClick = onAuthorClick),
-                        ) {
-                            drawAuthorLine()
-                        }
-                    }
-
-                    inner(bgColor)
-
-                    if (showDetails.value) {
-                        detailRow()
-                    }
-                }
-            }
-        }
-
-        if (popupExpanded.value) {
-            actionMenu {
-                popupExpanded.value = false
-            }
-        }
-    }
-}

commons/src/commonMain/kotlin/com/vitorpamplona/amethyst/commons/ui/chat/ChatMessageCompose.kt

@@ -1,90 +0,0 @@
-/*
- * Copyright (c) 2025 Vitor Pamplona
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of
- * this software and associated documentation files (the "Software"), to deal in
- * the Software without restriction, including without limitation the rights to use,
- * copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the
- * Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
- * FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
- * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
- * WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-package com.vitorpamplona.amethyst.commons.ui.chat
-
-import androidx.compose.foundation.layout.Row
-import androidx.compose.runtime.Composable
-import androidx.compose.runtime.MutableState
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.graphics.Color
-import com.vitorpamplona.amethyst.commons.model.Note
-
-/**
- * Shared chat message composable that provides structure without platform-specific dependencies.
- *
- * This is a simplified, slot-based version of the Android ChatroomMessageCompose.
- * Platform implementations provide the actual content via lambda slots, allowing
- * both Android and Desktop to use the same bubble layout with different content renderers.
- *
- * The Android app can wrap this or continue using its own deeper implementation.
- * The Desktop app uses this directly with simpler content slots.
- *
- * @param note The chat message note
- * @param isLoggedInUser Whether this note was authored by the current user
- * @param isDraft Whether this is a draft message
- * @param innerQuote Whether this is rendered as a quoted reply
- * @param isComplete Whether to always show detail row
- * @param hasDetailsToShow Whether there are reactions/zaps to display
- * @param drawAuthorInfo Whether to show author avatar and name
- * @param parentBackgroundColor Parent background for color compositing
- * @param onClick Called on tap; return true if consumed
- * @param onAuthorClick Called when author info is tapped
- * @param actionMenu Long-press action menu popup slot
- * @param authorLine Author avatar and name slot
- * @param detailRow Detail row slot (time, reactions)
- * @param messageContent Message body slot; receives the resolved background color
- */
-@Composable
-fun ChatMessageCompose(
-    note: Note,
-    isLoggedInUser: Boolean,
-    isDraft: Boolean,
-    innerQuote: Boolean = false,
-    isComplete: Boolean = true,
-    hasDetailsToShow: Boolean = false,
-    drawAuthorInfo: Boolean = false,
-    parentBackgroundColor: MutableState<Color>? = null,
-    onClick: () -> Boolean = { false },
-    onAuthorClick: () -> Unit = {},
-    actionMenu: @Composable (onDismiss: () -> Unit) -> Unit = {},
-    authorLine: @Composable () -> Unit = {},
-    detailRow: @Composable () -> Unit = {},
-    messageContent: @Composable (MutableState<Color>) -> Unit,
-) {
-    ChatBubbleLayout(
-        isLoggedInUser = isLoggedInUser,
-        isDraft = isDraft,
-        innerQuote = innerQuote,
-        isComplete = isComplete,
-        hasDetailsToShow = hasDetailsToShow,
-        drawAuthorInfo = drawAuthorInfo,
-        parentBackgroundColor = parentBackgroundColor,
-        onClick = onClick,
-        onAuthorClick = onAuthorClick,
-        actionMenu = actionMenu,
-        drawAuthorLine = authorLine,
-        detailRow = detailRow,
-    ) { bgColor ->
-        Row(verticalAlignment = Alignment.CenterVertically) {
-            messageContent(bgColor)
-        }
-    }
-}

commons/src/commonMain/kotlin/com/vitorpamplona/amethyst/commons/ui/chat/ChatroomHeader.kt

@@ -1,137 +0,0 @@
-/*
- * Copyright (c) 2025 Vitor Pamplona
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of
- * this software and associated documentation files (the "Software"), to deal in
- * the Software without restriction, including without limitation the rights to use,
- * copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the
- * Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
- * FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
- * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
- * WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-package com.vitorpamplona.amethyst.commons.ui.chat
-
-import androidx.compose.foundation.clickable
-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.material3.MaterialTheme
-import androidx.compose.material3.Text
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.text.font.FontWeight
-import androidx.compose.ui.text.style.TextOverflow
-import androidx.compose.ui.unit.dp
-import com.vitorpamplona.amethyst.commons.model.User
-import com.vitorpamplona.amethyst.commons.resources.Res
-import com.vitorpamplona.amethyst.commons.resources.accessibility_user_avatar
-import com.vitorpamplona.amethyst.commons.ui.components.UserAvatar
-import com.vitorpamplona.amethyst.commons.ui.theme.ChatSize34dp
-import com.vitorpamplona.amethyst.commons.ui.theme.ChatStdPadding
-import org.jetbrains.compose.resources.stringResource
-
-/**
- * Shared chatroom header for a single-user conversation.
- * Displays the user's avatar and display name.
- *
- * Uses the shared UserAvatar component from commons for image loading,
- * avoiding Android-specific dependencies.
- *
- * @param user The chat partner
- * @param modifier Layout modifier (defaults to standard padding)
- * @param onClick Called when the header is tapped (e.g., navigate to profile)
- */
-@Composable
-fun ChatroomHeader(
-    user: User,
-    modifier: Modifier = ChatStdPadding,
-    onClick: () -> Unit,
-) {
-    Column(
-        Modifier
-            .fillMaxWidth()
-            .clickable(onClick = onClick),
-    ) {
-        Column(modifier, Arrangement.Center) {
-            Row(verticalAlignment = Alignment.CenterVertically) {
-                UserAvatar(
-                    userHex = user.pubkeyHex,
-                    pictureUrl = user.profilePicture(),
-                    size = ChatSize34dp,
-                    contentDescription = stringResource(Res.string.accessibility_user_avatar),
-                )
-
-                Column(modifier = Modifier.padding(start = 10.dp)) {
-                    Text(
-                        text = user.toBestDisplayName(),
-                        style = MaterialTheme.typography.titleSmall,
-                        fontWeight = FontWeight.Bold,
-                        maxLines = 1,
-                        overflow = TextOverflow.Ellipsis,
-                    )
-                }
-            }
-        }
-    }
-}
-
-/**
- * Shared chatroom header for a group conversation.
- * Displays multiple user avatars and a combined room name.
- *
- * @param users List of users in the group conversation
- * @param modifier Layout modifier (defaults to standard padding)
- * @param onClick Called when the header is tapped
- */
-@Composable
-fun GroupChatroomHeader(
-    users: List<User>,
-    modifier: Modifier = ChatStdPadding,
-    onClick: () -> Unit,
-) {
-    Column(
-        modifier =
-            Modifier
-                .fillMaxWidth()
-                .clickable(onClick = onClick),
-    ) {
-        Column(
-            verticalArrangement = Arrangement.Center,
-            modifier = modifier,
-        ) {
-            Row(verticalAlignment = Alignment.CenterVertically) {
-                // Show first user's avatar as the group icon
-                users.firstOrNull()?.let { firstUser ->
-                    UserAvatar(
-                        userHex = firstUser.pubkeyHex,
-                        pictureUrl = firstUser.profilePicture(),
-                        size = ChatSize34dp,
-                        contentDescription = stringResource(Res.string.accessibility_user_avatar),
-                    )
-                }
-
-                Column(modifier = Modifier.padding(start = 10.dp)) {
-                    Text(
-                        text = users.joinToString(", ") { it.toBestDisplayName() },
-                        style = MaterialTheme.typography.titleSmall,
-                        fontWeight = FontWeight.Bold,
-                        maxLines = 1,
-                        overflow = TextOverflow.Ellipsis,
-                    )
-                }
-            }
-        }
-    }
-}

commons/src/commonMain/kotlin/com/vitorpamplona/amethyst/commons/ui/chat/DmBroadcastBanner.kt

@@ -1,139 +0,0 @@
-/*
- * Copyright (c) 2025 Vitor Pamplona
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of
- * this software and associated documentation files (the "Software"), to deal in
- * the Software without restriction, including without limitation the rights to use,
- * copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the
- * Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
- * FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
- * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
- * WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-package com.vitorpamplona.amethyst.commons.ui.chat
-
-import androidx.compose.animation.AnimatedVisibility
-import androidx.compose.animation.expandVertically
-import androidx.compose.animation.fadeIn
-import androidx.compose.animation.fadeOut
-import androidx.compose.animation.shrinkVertically
-import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.size
-import androidx.compose.foundation.layout.width
-import androidx.compose.material3.LinearProgressIndicator
-import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Surface
-import androidx.compose.material3.Text
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.unit.dp
-import com.vitorpamplona.amethyst.commons.icons.symbols.Icon
-import com.vitorpamplona.amethyst.commons.icons.symbols.MaterialSymbols
-
-@Composable
-fun DmBroadcastBanner(
-    status: DmBroadcastStatus,
-    modifier: Modifier = Modifier,
-) {
-    AnimatedVisibility(
-        visible = status !is DmBroadcastStatus.Idle,
-        enter = expandVertically() + fadeIn(),
-        exit = shrinkVertically() + fadeOut(),
-        modifier = modifier,
-    ) {
-        val isFailed = status is DmBroadcastStatus.Failed
-        val containerColor =
-            if (isFailed) {
-                MaterialTheme.colorScheme.errorContainer
-            } else {
-                MaterialTheme.colorScheme.surfaceContainerHigh
-            }
-        val contentColor =
-            if (isFailed) {
-                MaterialTheme.colorScheme.onErrorContainer
-            } else {
-                MaterialTheme.colorScheme.onSurface
-            }
-
-        Surface(
-            color = containerColor,
-            modifier = Modifier.fillMaxWidth(),
-        ) {
-            Column(
-                modifier = Modifier.padding(horizontal = 12.dp, vertical = 8.dp),
-            ) {
-                Row(
-                    verticalAlignment = Alignment.CenterVertically,
-                    horizontalArrangement = Arrangement.spacedBy(8.dp),
-                ) {
-                    val icon =
-                        when (status) {
-                            is DmBroadcastStatus.Subscribing,
-                            is DmBroadcastStatus.Sending,
-                            -> MaterialSymbols.Sync
-
-                            is DmBroadcastStatus.Sent -> MaterialSymbols.CheckCircle
-
-                            is DmBroadcastStatus.Failed -> MaterialSymbols.Error
-
-                            is DmBroadcastStatus.Idle -> MaterialSymbols.Sync
-                        }
-
-                    Icon(
-                        symbol = icon,
-                        contentDescription = null,
-                        modifier = Modifier.size(16.dp),
-                        tint = contentColor,
-                    )
-
-                    Spacer(Modifier.width(4.dp))
-
-                    Text(
-                        text =
-                            when (status) {
-                                is DmBroadcastStatus.Subscribing -> "Connecting to DM relays..."
-                                is DmBroadcastStatus.Sending -> "Sending message... [${status.successCount}/${status.totalRelays}]"
-                                is DmBroadcastStatus.Sent -> "Sent to ${status.relayCount} relays"
-                                is DmBroadcastStatus.Failed -> "Send failed: ${status.error}"
-                                is DmBroadcastStatus.Idle -> ""
-                            },
-                        style = MaterialTheme.typography.labelMedium,
-                        color = contentColor,
-                    )
-                }
-
-                if (status is DmBroadcastStatus.Sending) {
-                    LinearProgressIndicator(
-                        progress = { status.progress },
-                        modifier = Modifier.fillMaxWidth().padding(top = 4.dp),
-                        color = MaterialTheme.colorScheme.primary,
-                        trackColor = MaterialTheme.colorScheme.surfaceVariant,
-                    )
-                }
-
-                if (status is DmBroadcastStatus.Sent && status.relayUrls.isNotEmpty()) {
-                    Text(
-                        text = status.relayUrls.joinToString(", "),
-                        style = MaterialTheme.typography.bodySmall,
-                        color = contentColor.copy(alpha = 0.7f),
-                        modifier = Modifier.padding(start = 28.dp),
-                    )
-                }
-            }
-        }
-    }
-}

commons/src/commonMain/kotlin/com/vitorpamplona/amethyst/commons/ui/chat/DmBroadcastStatus.kt

@@ -1,47 +0,0 @@
-/*
- * Copyright (c) 2025 Vitor Pamplona
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of
- * this software and associated documentation files (the "Software"), to deal in
- * the Software without restriction, including without limitation the rights to use,
- * copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the
- * Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
- * FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
- * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
- * WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-package com.vitorpamplona.amethyst.commons.ui.chat
-
-import androidx.compose.runtime.Immutable
-
-@Immutable
-sealed class DmBroadcastStatus {
-    data object Idle : DmBroadcastStatus()
-
-    data object Subscribing : DmBroadcastStatus()
-
-    data class Sending(
-        val successCount: Int,
-        val totalRelays: Int,
-    ) : DmBroadcastStatus() {
-        val progress: Float
-            get() = if (totalRelays > 0) successCount.toFloat() / totalRelays else 0f
-    }
-
-    data class Sent(
-        val relayCount: Int,
-        val relayUrls: List<String> = emptyList(),
-    ) : DmBroadcastStatus()
-
-    data class Failed(
-        val error: String,
-    ) : DmBroadcastStatus()
-}

commons/src/commonMain/kotlin/com/vitorpamplona/amethyst/commons/ui/chat/UserDisplayNameLayout.kt

@@ -1,50 +0,0 @@
-/*
- * Copyright (c) 2025 Vitor Pamplona
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of
- * this software and associated documentation files (the "Software"), to deal in
- * the Software without restriction, including without limitation the rights to use,
- * copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the
- * Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
- * FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
- * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
- * WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-package com.vitorpamplona.amethyst.commons.ui.chat
-
-import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.BoxScope
-import androidx.compose.foundation.layout.Spacer
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Alignment
-import com.vitorpamplona.amethyst.commons.ui.theme.ChatAuthorBox
-import com.vitorpamplona.amethyst.commons.ui.theme.ChatStdHorzSpacer
-
-/**
- * Layout for displaying a user's picture and name in a chat message author line.
- * Shared between Android and Desktop.
- *
- * The picture slot uses a BoxScope so callers can overlay badges/icons
- * (e.g., following indicator, user cards) on top of the avatar.
- */
-@Composable
-fun UserDisplayNameLayout(
-    picture: @Composable BoxScope.() -> Unit,
-    name: @Composable () -> Unit,
-) {
-    Box(ChatAuthorBox, contentAlignment = Alignment.TopEnd) {
-        picture()
-    }
-
-    Spacer(modifier = ChatStdHorzSpacer)
-
-    name()
-}

commons/src/commonMain/kotlin/com/vitorpamplona/amethyst/commons/ui/feed/FeedHeader.kt

@@ -1,113 +0,0 @@
-/*
- * Copyright (c) 2025 Vitor Pamplona
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of
- * this software and associated documentation files (the "Software"), to deal in
- * the Software without restriction, including without limitation the rights to use,
- * copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the
- * Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
- * FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
- * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
- * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
- * WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-package com.vitorpamplona.amethyst.commons.ui.feed
-
-import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.size
-import androidx.compose.material3.IconButton
-import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Text
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.unit.dp
-import com.vitorpamplona.amethyst.commons.icons.symbols.Icon
-import com.vitorpamplona.amethyst.commons.icons.symbols.MaterialSymbols
-import com.vitorpamplona.amethyst.commons.ui.theme.RelayStatusColors
-
-/**
- * Header component for feed screens with title and relay connection status.
- *
- * @param title The feed title
- * @param connectedRelayCount Number of connected relays
- * @param onRefresh Callback when refresh button is clicked
- * @param modifier Modifier for the header row
- */
-@Composable
-fun FeedHeader(
-    title: String,
-    connectedRelayCount: Int,
-    onRefresh: () -> Unit,
-    modifier: Modifier = Modifier,
-) {
-    Row(
-        modifier = modifier.fillMaxWidth(),
-        horizontalArrangement = Arrangement.SpaceBetween,
-        verticalAlignment = Alignment.CenterVertically,
-    ) {
-        Text(
-            title,
-            style = MaterialTheme.typography.headlineMedium,
-            color = MaterialTheme.colorScheme.onBackground,
-        )
-
-        RelayStatusIndicator(
-            connectedCount = connectedRelayCount,
-            onRefresh = onRefresh,
-        )
-    }
-}
-
-/**
- * Compact relay connection status indicator with refresh button.
- */
-@Composable
-fun RelayStatusIndicator(
-    connectedCount: Int,
-    onRefresh: () -> Unit,
-    modifier: Modifier = Modifier,
-) {
-    Row(
-        modifier = modifier,
-        verticalAlignment = Alignment.CenterVertically,
-        horizontalArrangement = Arrangement.spacedBy(8.dp),
-    ) {
-        val statusColor =
-            when {
-                connectedCount == 0 -> RelayStatusColors.Disconnected
-                connectedCount < 3 -> RelayStatusColors.Connecting
-                else -> RelayStatusColors.Connected
-            }
-
-        Icon(
-            symbol = if (connectedCount > 0) MaterialSymbols.Check else MaterialSymbols.Close,
-            contentDescription = null,
-            tint = statusColor,
-            modifier = Modifier.size(16.dp),
-        )
-
-        Text(
-            "$connectedCount relay${if (connectedCount != 1) "s" else ""}",
-            color = MaterialTheme.colorScheme.onSurfaceVariant,
-            style = MaterialTheme.typography.bodySmall,
-        )
-
-        IconButton(onClick = onRefresh) {
-            Icon(
-                MaterialSymbols.Refresh,
-                contentDescription = "Reconnect",
-                tint = MaterialTheme.colorScheme.primary,
-            )
-        }
-    }
-}