Use RoomPreviewAliasAtom in space and room headers

features/home/impl/src/main/kotlin/io/element/android/features/home/impl/spaces/HomeSpacesView.kt

@@ -76,6 +76,7 @@ fun HomeSpacesView(
                     item {
                         SpaceHeaderView(
                             avatarData = space.spaceRoom.getAvatarData(AvatarSize.SpaceHeader),
+                            alias = space.spaceRoom.canonicalAlias,
                             name = space.spaceRoom.displayName,
                             topic = space.spaceRoom.topic,
                             visibility = space.spaceRoom.visibility,

features/joinroom/impl/src/main/kotlin/io/element/android/features/joinroom/impl/JoinRoomView.kt

@@ -42,7 +42,7 @@ import io.element.android.compound.tokens.generated.CompoundIcons
 import io.element.android.features.invite.api.InviteData
 import io.element.android.libraries.designsystem.atomic.atoms.PlaceholderAtom
 import io.element.android.libraries.designsystem.atomic.atoms.RoomPreviewDescriptionAtom
-import io.element.android.libraries.designsystem.atomic.atoms.RoomPreviewSubtitleAtom
+import io.element.android.libraries.designsystem.atomic.atoms.RoomPreviewAliasAtom
 import io.element.android.libraries.designsystem.atomic.atoms.RoomPreviewTitleAtom
 import io.element.android.libraries.designsystem.atomic.molecules.ButtonRowMolecule
 import io.element.android.libraries.designsystem.atomic.molecules.IconTitlePlaceholdersRowMolecule
@@ -514,7 +514,7 @@ private fun IncompleteContent(
         title = {
             when (roomIdOrAlias) {
                 is RoomIdOrAlias.Alias -> {
-                    RoomPreviewSubtitleAtom(roomIdOrAlias.identifier)
+                    RoomPreviewAliasAtom(roomIdOrAlias.identifier)
                 }
                 is RoomIdOrAlias.Id -> {
                     PlaceholderAtom(width = 200.dp, height = 22.dp)
@@ -566,13 +566,12 @@ private fun DefaultLoadedContent(
             }
         },
         subtitle = {
-            when {
+            if (contentState.alias != null) {
-                contentState.details is LoadedDetails.Space -> {
+                RoomPreviewAliasAtom(contentState.alias.value)
-                    SpaceInfoRow(visibility = SpaceRoomVisibility.fromJoinRule(contentState.joinRule))
+            }
-                }
+            if (contentState.details is LoadedDetails.Space) {
-                contentState.alias != null -> {
+                Spacer(Modifier.height(8.dp))
-                    RoomPreviewSubtitleAtom(contentState.alias.value)
+                SpaceInfoRow(visibility = SpaceRoomVisibility.fromJoinRule(contentState.joinRule))
-                }
             }
         },
         description = {

features/roomaliasresolver/impl/src/main/kotlin/io/element/android/features/roomaliasresolver/impl/RoomAliasResolverView.kt

@@ -25,7 +25,7 @@ import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
 import io.element.android.libraries.architecture.AsyncData
 import io.element.android.libraries.designsystem.atomic.atoms.PlaceholderAtom
-import io.element.android.libraries.designsystem.atomic.atoms.RoomPreviewSubtitleAtom
+import io.element.android.libraries.designsystem.atomic.atoms.RoomPreviewAliasAtom
 import io.element.android.libraries.designsystem.atomic.organisms.RoomPreviewOrganism
 import io.element.android.libraries.designsystem.atomic.pages.HeaderFooterPage
 import io.element.android.libraries.designsystem.components.avatar.AvatarSize
@@ -54,7 +54,7 @@ fun RoomAliasResolverView(
             containerColor = Color.Transparent,
             contentPadding = PaddingValues(
                 horizontal = 16.dp,
-                vertical = 32.dp
+                vertical = 24.dp
             ),
             topBar = {
                 RoomAliasResolverTopBar(onBackClick = onBackClick)
@@ -121,7 +121,7 @@ private fun RoomAliasResolverContent(
             PlaceholderAtom(width = AvatarSize.RoomPreviewHeader.dp, height = AvatarSize.RoomPreviewHeader.dp)
         },
         title = {
-            RoomPreviewSubtitleAtom(roomAlias.value)
+            RoomPreviewAliasAtom(roomAlias.value)
         },
         subtitle = {
             if (isLoading) {

features/space/impl/src/main/kotlin/io/element/android/features/space/impl/root/SpaceView.kt

@@ -260,6 +260,7 @@ private fun SpaceViewContent(
                 Column {
                     SpaceHeaderView(
                         avatarData = spaceInfo.getAvatarData(AvatarSize.SpaceHeader),
+                        alias = spaceInfo.canonicalAlias,
                         name = spaceInfo.name,
                         topic = spaceInfo.topic,
                         topicMaxLines = 2,

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/atoms/RoomPreviewSubtitleAtom.kt

@@ -1,26 +0,0 @@
-/*
- * Copyright (c) 2025 Element Creations Ltd.
- * Copyright 2024, 2025 New Vector Ltd.
- *
- * SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial.
- * Please see LICENSE files in the repository root for full details.
- */
-
-package io.element.android.libraries.designsystem.atomic.atoms
-
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.text.style.TextAlign
-import io.element.android.compound.theme.ElementTheme
-import io.element.android.libraries.designsystem.theme.components.Text
-
-@Composable
-fun RoomPreviewSubtitleAtom(subtitle: String, modifier: Modifier = Modifier) {
-    Text(
-        modifier = modifier,
-        text = subtitle,
-        style = ElementTheme.typography.fontBodyLgRegular,
-        textAlign = TextAlign.Center,
-        color = ElementTheme.colors.textSecondary,
-    )
-}

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/organisms/RoomPreviewOrganism.kt

@@ -9,6 +9,7 @@
 package io.element.android.libraries.designsystem.atomic.organisms
 
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.ColumnScope
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
@@ -19,12 +20,12 @@ import androidx.compose.ui.unit.dp
 
 @Composable
 fun RoomPreviewOrganism(
-    avatar: @Composable () -> Unit,
+    avatar: @Composable ColumnScope.() -> Unit,
-    title: @Composable () -> Unit,
+    title: @Composable ColumnScope.() -> Unit,
-    subtitle: @Composable () -> Unit,
+    subtitle: @Composable ColumnScope.() -> Unit,
     modifier: Modifier = Modifier,
-    description: @Composable (() -> Unit)? = null,
+    description: @Composable (ColumnScope.() -> Unit)? = null,
-    memberCount: @Composable (() -> Unit)? = null,
+    memberCount: @Composable (ColumnScope.() -> Unit)? = null,
 ) {
     Column(
         modifier = modifier.fillMaxWidth(),

libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/SpaceHeaderView.kt

@@ -9,14 +9,18 @@
 package io.element.android.libraries.matrix.ui.components
 
 import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.padding
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontStyle
 import androidx.compose.ui.tooling.preview.datasource.LoremIpsum
 import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.atomic.atoms.RoomPreviewDescriptionAtom
+import io.element.android.libraries.designsystem.atomic.atoms.RoomPreviewAliasAtom
 import io.element.android.libraries.designsystem.atomic.atoms.RoomPreviewTitleAtom
 import io.element.android.libraries.designsystem.atomic.organisms.RoomPreviewOrganism
 import io.element.android.libraries.designsystem.components.avatar.Avatar
@@ -26,6 +30,7 @@ import io.element.android.libraries.designsystem.components.avatar.AvatarType
 import io.element.android.libraries.designsystem.components.avatar.anAvatarData
 import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.preview.PreviewsDayNight
+import io.element.android.libraries.matrix.api.core.RoomAlias
 import io.element.android.libraries.matrix.api.spaces.SpaceRoomVisibility
 import io.element.android.libraries.matrix.api.user.MatrixUser
 import io.element.android.libraries.ui.strings.CommonStrings
@@ -39,6 +44,7 @@ import kotlinx.collections.immutable.persistentListOf
 fun SpaceHeaderView(
     avatarData: AvatarData,
     name: String?,
+    alias: RoomAlias?,
     topic: String?,
     visibility: SpaceRoomVisibility,
     heroes: ImmutableList<MatrixUser>,
@@ -66,7 +72,15 @@ fun SpaceHeaderView(
             }
         },
         subtitle = {
-            SpaceInfoRow(visibility = visibility)
+            Column(
+                horizontalAlignment = Alignment.CenterHorizontally,
+                verticalArrangement = Arrangement.spacedBy(8.dp),
+            ){
+                if(alias != null){
+                    RoomPreviewAliasAtom(alias = alias.value)
+                }
+                SpaceInfoRow(visibility = visibility)
+            }
         },
         description = if (topic.isNullOrBlank()) {
             null
@@ -100,6 +114,7 @@ internal fun SpaceHeaderViewPreview() = ElementPreview {
             url = "anUrl",
             size = AvatarSize.SpaceHeader,
         ),
+        alias = RoomAlias("#spaceAlias:matrix.org"),
         name = "Space name",
         topic = "Space topic: " + LoremIpsum(40).values.first(),
         topicMaxLines = 2,