Merge pull request #5468 from element-hq/feature/fga/space_tweaks

Spaces : some tweaks around ui
This commit is contained in:
ganfra
2025-10-07 10:55:05 +02:00
committed by GitHub
59 changed files with 248 additions and 173 deletions

View File

@@ -33,11 +33,7 @@ fun HomeSpacesView(
when (space) {
CurrentSpace.Root -> {
item {
SpaceHeaderRootView(
numberOfSpaces = state.spaceRooms.size,
// TODO
numberOfRooms = 0,
)
SpaceHeaderRootView(numberOfSpaces = state.spaceRooms.size)
}
}
is CurrentSpace.Space -> item {
@@ -45,10 +41,9 @@ fun HomeSpacesView(
avatarData = space.spaceRoom.getAvatarData(AvatarSize.SpaceHeader),
name = space.spaceRoom.name,
topic = space.spaceRoom.topic,
joinRule = space.spaceRoom.joinRule,
visibility = space.spaceRoom.visibility,
heroes = space.spaceRoom.heroes.toImmutableList(),
numberOfMembers = space.spaceRoom.numJoinedMembers,
numberOfRooms = space.spaceRoom.childrenCount,
)
}
}

View File

@@ -30,7 +30,7 @@ class SpaceRoomProvider : PreviewParameterProvider<SpaceRoom> {
roomId = RoomId("!spaceId1:example.com"),
),
aSpaceRoom(
name = null,
rawName = null,
numJoinedMembers = 5,
childrenCount = 10,
worldReadable = true,
@@ -39,7 +39,7 @@ class SpaceRoomProvider : PreviewParameterProvider<SpaceRoom> {
state = CurrentUserMembership.INVITED,
),
aSpaceRoom(
name = null,
rawName = null,
numJoinedMembers = 5,
childrenCount = 10,
worldReadable = true,

View File

@@ -74,7 +74,7 @@ import io.element.android.libraries.designsystem.theme.components.TextField
import io.element.android.libraries.designsystem.theme.components.TopAppBar
import io.element.android.libraries.designsystem.theme.placeholderBackground
import io.element.android.libraries.matrix.api.core.RoomIdOrAlias
import io.element.android.libraries.matrix.api.room.join.JoinRule
import io.element.android.libraries.matrix.api.spaces.SpaceRoomVisibility
import io.element.android.libraries.matrix.ui.components.SpaceInfoRow
import io.element.android.libraries.matrix.ui.components.SpaceMembersView
import io.element.android.libraries.matrix.ui.model.InviteSender
@@ -567,10 +567,7 @@ private fun DefaultLoadedContent(
subtitle = {
when {
contentState.details is LoadedDetails.Space -> {
SpaceInfoRow(
joinRule = contentState.joinRule ?: JoinRule.Public,
numberOfRooms = contentState.details.childrenCount,
)
SpaceInfoRow(visibility = SpaceRoomVisibility.fromJoinRule(contentState.joinRule))
}
contentState.alias != null -> {
RoomPreviewSubtitleAtom(contentState.alias.value)

View File

@@ -30,7 +30,7 @@ class LeaveSpaceStateProvider : PreviewParameterProvider<LeaveSpaceState> {
persistentListOf(
aSelectableSpaceRoom(
spaceRoom = aSpaceRoom(
name = "A long space name that should be truncated",
rawName = "A long space name that should be truncated",
worldReadable = true,
),
isLastAdmin = true,

View File

@@ -13,8 +13,10 @@ import io.element.android.features.invite.api.acceptdecline.anAcceptDeclineInvit
import io.element.android.libraries.architecture.AsyncAction
import io.element.android.libraries.matrix.api.core.RoomId
import io.element.android.libraries.matrix.api.room.CurrentUserMembership
import io.element.android.libraries.matrix.api.room.join.JoinRule
import io.element.android.libraries.matrix.api.spaces.SpaceRoom
import io.element.android.libraries.previewutils.room.aSpaceRoom
import kotlinx.collections.immutable.persistentListOf
import kotlinx.collections.immutable.toImmutableList
import kotlinx.collections.immutable.toImmutableMap
import kotlinx.collections.immutable.toImmutableSet
@@ -25,7 +27,17 @@ open class SpaceStateProvider : PreviewParameterProvider<SpaceState> {
aSpaceState(),
aSpaceState(
parentSpace = aSpaceRoom(
name = null,
joinRule = JoinRule.Public
)
),
aSpaceState(
parentSpace = aSpaceRoom(
joinRule = JoinRule.Restricted(persistentListOf())
)
),
aSpaceState(
parentSpace = aSpaceRoom(
rawName = null,
numJoinedMembers = 5,
childrenCount = 10,
worldReadable = true,

View File

@@ -134,10 +134,9 @@ private fun SpaceViewContent(
avatarData = currentSpace.getAvatarData(AvatarSize.SpaceHeader),
name = currentSpace.name,
topic = currentSpace.topic,
joinRule = currentSpace.joinRule,
visibility = currentSpace.visibility,
heroes = currentSpace.heroes.toImmutableList(),
numberOfMembers = currentSpace.numJoinedMembers,
numberOfRooms = currentSpace.childrenCount,
)
}
}

View File

@@ -29,7 +29,7 @@ import org.junit.Test
class LeaveSpacePresenterTest {
private val aSpace = aSpaceRoom(
roomId = A_SPACE_ID,
name = A_SPACE_NAME,
rawName = A_SPACE_NAME,
)
@Test
@@ -198,7 +198,7 @@ class LeaveSpacePresenterTest {
private fun aLeaveSpaceRoom(
spaceRoom: SpaceRoom = aSpaceRoom(
roomId = A_SPACE_ID,
name = A_SPACE_NAME,
rawName = A_SPACE_NAME,
),
isLastAdmin: Boolean = false,
) = LeaveSpaceRoom(

View File

@@ -52,7 +52,7 @@ class SpaceViewTest {
@Test
fun `clicking on a room name invokes the expected callback`() {
val aSpaceRoom = aSpaceRoom(roomId = A_ROOM_ID, name = A_ROOM_NAME)
val aSpaceRoom = aSpaceRoom(roomId = A_ROOM_ID, rawName = A_ROOM_NAME)
val eventsRecorder = EventsRecorder<SpaceEvents>(expectEvents = false)
ensureCalledOnceWithParam(aSpaceRoom) {
rule.setSpaceView(

View File

@@ -15,7 +15,7 @@ import io.element.android.libraries.matrix.api.room.join.JoinRule
import io.element.android.libraries.matrix.api.user.MatrixUser
data class SpaceRoom(
val name: String?,
val rawName: String?,
val avatarUrl: String?,
val canonicalAlias: RoomAlias?,
val childrenCount: Int,
@@ -32,6 +32,20 @@ data class SpaceRoom(
* The via parameters of the room.
*/
val via: List<String>,
val isDirect: Boolean?,
) {
val isSpace = roomType == RoomType.Space
/**
* Temporary logic to compute a name for direct rooms with no name.
* This will be replaced by sdk logic in the future.
*/
val name = if (rawName == null && isDirect == true && heroes.size == 1) {
val dmRecipient = heroes.first()
dmRecipient.displayName
} else {
rawName
}
val visibility = SpaceRoomVisibility.fromJoinRule(joinRule)
}

View File

@@ -0,0 +1,26 @@
/*
* Copyright 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.matrix.api.spaces
import androidx.compose.runtime.Immutable
import io.element.android.libraries.matrix.api.room.join.JoinRule
@Immutable
sealed interface SpaceRoomVisibility {
data object Private : SpaceRoomVisibility
data object Public : SpaceRoomVisibility
data object Restricted : SpaceRoomVisibility
companion object {
fun fromJoinRule(joinRule: JoinRule?): SpaceRoomVisibility = when (joinRule) {
JoinRule.Public -> Public
is JoinRule.Restricted, is JoinRule.KnockRestricted -> Restricted
// Else fallback to Private
else -> Private
}
}
}

View File

@@ -24,7 +24,7 @@ class SpaceRoomMapper {
guestCanJoin = spaceRoom.guestCanJoin,
heroes = spaceRoom.heroes.orEmpty().map { it.map() },
joinRule = spaceRoom.joinRule?.map(),
name = spaceRoom.name,
rawName = spaceRoom.name,
numJoinedMembers = spaceRoom.numJoinedMembers.toInt(),
roomId = RoomId(spaceRoom.roomId),
roomType = spaceRoom.roomType.map(),
@@ -32,6 +32,7 @@ class SpaceRoomMapper {
topic = spaceRoom.topic,
worldReadable = spaceRoom.worldReadable.orFalse(),
via = spaceRoom.via,
isDirect = spaceRoom.isDirect,
)
}
}

View File

@@ -31,7 +31,6 @@ import io.element.android.libraries.ui.strings.CommonStrings
@Composable
fun SpaceHeaderRootView(
numberOfSpaces: Int,
numberOfRooms: Int,
modifier: Modifier = Modifier,
) {
Column(
@@ -52,7 +51,7 @@ fun SpaceHeaderRootView(
)
SpaceInfoRow(
leftText = numberOfSpaces(numberOfSpaces),
rightText = numberOfRooms(numberOfRooms),
rightText = null,
)
Text(
text = stringResource(CommonStrings.screen_space_list_description),
@@ -68,6 +67,5 @@ fun SpaceHeaderRootView(
internal fun SpaceHeaderRootViewPreview() = ElementPreview {
SpaceHeaderRootView(
numberOfSpaces = 3,
numberOfRooms = 10,
)
}

View File

@@ -24,7 +24,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.room.join.JoinRule
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
import kotlinx.collections.immutable.ImmutableList
@@ -38,10 +38,9 @@ fun SpaceHeaderView(
avatarData: AvatarData,
name: String?,
topic: String?,
joinRule: JoinRule?,
visibility: SpaceRoomVisibility,
heroes: ImmutableList<MatrixUser>,
numberOfMembers: Int,
numberOfRooms: Int,
modifier: Modifier = Modifier,
topicMaxLines: Int = Int.MAX_VALUE,
) {
@@ -64,12 +63,7 @@ fun SpaceHeaderView(
}
},
subtitle = {
if (joinRule != null) {
SpaceInfoRow(
joinRule = joinRule,
numberOfRooms = numberOfRooms,
)
}
SpaceInfoRow(visibility = visibility)
},
description = if (topic.isNullOrBlank()) {
null
@@ -97,7 +91,7 @@ internal fun SpaceHeaderViewPreview() = ElementPreview {
name = "Space name",
topic = "Space topic: " + LoremIpsum(40).values.first(),
topicMaxLines = 2,
joinRule = JoinRule.Public,
visibility = SpaceRoomVisibility.Public,
heroes = persistentListOf(
aMatrixUser(id = "@1:d", displayName = "Alice", avatarUrl = "aUrl"),
aMatrixUser(id = "@2:d", displayName = "Bob"),
@@ -105,6 +99,5 @@ internal fun SpaceHeaderViewPreview() = ElementPreview {
aMatrixUser(id = "@4:d", displayName = "Dave"),
),
numberOfMembers = 999,
numberOfRooms = 10,
)
}

View File

@@ -27,14 +27,16 @@ import io.element.android.compound.tokens.generated.CompoundIcons
import io.element.android.libraries.designsystem.preview.ElementPreview
import io.element.android.libraries.designsystem.preview.PreviewsDayNight
import io.element.android.libraries.designsystem.theme.components.Icon
import io.element.android.libraries.matrix.api.room.join.JoinRule
import io.element.android.libraries.matrix.api.spaces.SpaceRoomVisibility
import io.element.android.libraries.matrix.ui.model.icon
import io.element.android.libraries.matrix.ui.model.label
import io.element.android.libraries.ui.strings.CommonPlurals
import io.element.android.libraries.ui.strings.CommonStrings
@Composable
fun SpaceInfoRow(
leftText: String,
rightText: String,
rightText: String?,
modifier: Modifier = Modifier,
iconVector: ImageVector? = null,
) {
@@ -51,7 +53,11 @@ fun SpaceInfoRow(
tint = ElementTheme.colors.iconTertiary,
)
}
val text = stringResource(id = CommonStrings.screen_space_list_details, leftText, rightText)
val text = if (rightText != null) {
stringResource(id = CommonStrings.screen_space_list_details, leftText, rightText)
} else {
leftText
}
Text(
text = text,
style = ElementTheme.typography.fontBodyLgRegular,
@@ -63,34 +69,14 @@ fun SpaceInfoRow(
@Composable
fun SpaceInfoRow(
joinRule: JoinRule,
numberOfRooms: Int,
visibility: SpaceRoomVisibility,
modifier: Modifier = Modifier,
) {
val (leftText, rightText, icon) = when (joinRule) {
JoinRule.Public -> Triple(
stringResource(id = CommonStrings.common_public_space),
numberOfRooms(numberOfRooms),
CompoundIcons.Public(),
)
// TODO External space
// JoinRule.Private -> Triple(
// stringResource(id = CommonStrings.common_external_space),
// numberOfRooms(numberOfRooms),
// CompoundIcons.Guest(),
// )
// JoinRule.Private,
else -> Triple(
stringResource(id = CommonStrings.common_private_space),
numberOfRooms(numberOfRooms),
CompoundIcons.Lock(),
)
}
SpaceInfoRow(
leftText = leftText,
rightText = rightText,
leftText = visibility.label,
rightText = null,
modifier = modifier,
iconVector = icon,
iconVector = visibility.icon,
)
}
@@ -124,12 +110,13 @@ internal fun SpaceInfoRowPreview() = ElementPreview {
iconVector = CompoundIcons.Workspace(),
)
SpaceInfoRow(
joinRule = JoinRule.Private,
numberOfRooms = 4,
visibility = SpaceRoomVisibility.Private,
)
SpaceInfoRow(
joinRule = JoinRule.Public,
numberOfRooms = 10,
visibility = SpaceRoomVisibility.Public
)
SpaceInfoRow(
visibility = SpaceRoomVisibility.Restricted
)
}
}

View File

@@ -34,7 +34,6 @@ import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.tooling.preview.PreviewParameter
import androidx.compose.ui.unit.dp
import io.element.android.compound.theme.ElementTheme
import io.element.android.compound.tokens.generated.CompoundIcons
import io.element.android.libraries.designsystem.atomic.atoms.UnreadIndicatorAtom
import io.element.android.libraries.designsystem.atomic.molecules.InviteButtonsRowMolecule
import io.element.android.libraries.designsystem.components.avatar.Avatar
@@ -48,9 +47,11 @@ import io.element.android.libraries.designsystem.theme.components.Icon
import io.element.android.libraries.designsystem.theme.components.Text
import io.element.android.libraries.designsystem.theme.unreadIndicator
import io.element.android.libraries.matrix.api.room.CurrentUserMembership
import io.element.android.libraries.matrix.api.room.join.JoinRule
import io.element.android.libraries.matrix.api.spaces.SpaceRoom
import io.element.android.libraries.matrix.api.spaces.SpaceRoomVisibility
import io.element.android.libraries.matrix.ui.model.getAvatarData
import io.element.android.libraries.matrix.ui.model.icon
import io.element.android.libraries.matrix.ui.model.label
import io.element.android.libraries.ui.strings.CommonPlurals
import io.element.android.libraries.ui.strings.CommonStrings
@@ -117,8 +118,8 @@ private fun SubtitleRow(
if (visibilityIcon != null) {
Icon(
modifier = Modifier
.size(16.dp)
.padding(end = 4.dp),
.size(16.dp)
.padding(end = 4.dp),
imageVector = visibilityIcon,
contentDescription = null,
tint = ElementTheme.colors.iconTertiary,
@@ -176,20 +177,20 @@ private fun SpaceRoomItemScaffold(
content: @Composable ColumnScope.() -> Unit,
) {
val clickModifier = Modifier
.combinedClickable(
onClick = onClick,
onLongClick = onLongClick,
onLongClickLabel = stringResource(CommonStrings.action_open_context_menu),
indication = ripple(),
interactionSource = remember { MutableInteractionSource() }
)
.onKeyboardContextMenuAction { onLongClick }
.combinedClickable(
onClick = onClick,
onLongClick = onLongClick,
onLongClickLabel = stringResource(CommonStrings.action_open_context_menu),
indication = ripple(),
interactionSource = remember { MutableInteractionSource() }
)
.onKeyboardContextMenuAction { onLongClick }
Row(
modifier = modifier
.fillMaxWidth()
.then(clickModifier)
.padding(horizontal = 16.dp, vertical = 8.dp)
.height(IntrinsicSize.Min),
.fillMaxWidth()
.then(clickModifier)
.padding(horizontal = 16.dp, vertical = 8.dp)
.height(IntrinsicSize.Min),
) {
Avatar(
avatarData = avatarData,
@@ -212,11 +213,7 @@ private fun SpaceRoomItemScaffold(
@ReadOnlyComposable
private fun SpaceRoom.subtitle(): String {
return if (isSpace) {
if (joinRule == JoinRule.Public) {
stringResource(CommonStrings.common_public_space)
} else {
stringResource(CommonStrings.common_private_space)
}
visibility.label
} else {
pluralStringResource(CommonPlurals.common_member_count, numJoinedMembers, numJoinedMembers)
}
@@ -226,11 +223,7 @@ private fun SpaceRoom.subtitle(): String {
@ReadOnlyComposable
private fun SpaceRoom.info(): String {
return if (isSpace) {
stringResource(
CommonStrings.screen_space_list_details,
pluralStringResource(CommonPlurals.common_rooms, childrenCount, childrenCount),
pluralStringResource(CommonPlurals.common_member_count, numJoinedMembers, numJoinedMembers),
)
pluralStringResource(CommonPlurals.common_member_count, numJoinedMembers, numJoinedMembers)
} else {
topic.orEmpty()
}
@@ -238,10 +231,11 @@ private fun SpaceRoom.info(): String {
@Composable
private fun SpaceRoom.visibilityIcon(): ImageVector? {
return if (joinRule == JoinRule.Public) {
CompoundIcons.Public()
// Don't show any icon for restricted rooms as it's the default and would add noise
return if (visibility == SpaceRoomVisibility.Restricted) {
null
} else {
CompoundIcons.LockSolid()
visibility.icon
}
}

View File

@@ -18,23 +18,31 @@ class SpaceRoomProvider : PreviewParameterProvider<SpaceRoom> {
override val values: Sequence<SpaceRoom> = sequenceOf(
aSpaceRoom(
roomType = RoomType.Room,
name = "Room name with topic",
rawName = "Room name with topic",
topic = "Room topic that is quite long and might be truncated"
),
aSpaceRoom(
roomType = RoomType.Room,
name = "Room name no topic",
rawName = "Room name no topic",
state = CurrentUserMembership.LEFT,
),
aSpaceRoom(
roomType = RoomType.Room,
name = "Room name with topic",
rawName = null,
isDirect = true,
heroes = listOf(aMatrixUser(displayName = "Alice")),
state = CurrentUserMembership.JOINED,
numJoinedMembers = 2,
),
aSpaceRoom(
roomType = RoomType.Room,
rawName = "Room name with topic",
topic = "Room topic that is quite long and might be truncated",
state = CurrentUserMembership.INVITED,
),
aSpaceRoom(
roomType = RoomType.Room,
name = "Room name no topic",
rawName = "Room name no topic",
state = CurrentUserMembership.INVITED,
),
aSpaceRoom(
@@ -52,7 +60,7 @@ class SpaceRoomProvider : PreviewParameterProvider<SpaceRoom> {
state = CurrentUserMembership.LEFT,
),
aSpaceRoom(
name = null,
rawName = null,
numJoinedMembers = 5,
childrenCount = 10,
worldReadable = true,
@@ -61,7 +69,7 @@ class SpaceRoomProvider : PreviewParameterProvider<SpaceRoom> {
state = CurrentUserMembership.INVITED,
),
aSpaceRoom(
name = null,
rawName = null,
numJoinedMembers = 5,
childrenCount = 10,
worldReadable = true,

View File

@@ -7,9 +7,16 @@
package io.element.android.libraries.matrix.ui.model
import androidx.compose.runtime.Composable
import androidx.compose.runtime.ReadOnlyComposable
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.res.stringResource
import io.element.android.compound.tokens.generated.CompoundIcons
import io.element.android.libraries.designsystem.components.avatar.AvatarData
import io.element.android.libraries.designsystem.components.avatar.AvatarSize
import io.element.android.libraries.matrix.api.spaces.SpaceRoom
import io.element.android.libraries.matrix.api.spaces.SpaceRoomVisibility
import io.element.android.libraries.ui.strings.CommonStrings
fun SpaceRoom.getAvatarData(size: AvatarSize) = AvatarData(
id = roomId.value,
@@ -17,3 +24,24 @@ fun SpaceRoom.getAvatarData(size: AvatarSize) = AvatarData(
url = avatarUrl,
size = size,
)
val SpaceRoomVisibility.icon: ImageVector
@Composable
get() {
return when (this) {
SpaceRoomVisibility.Private -> CompoundIcons.LockSolid()
SpaceRoomVisibility.Public -> CompoundIcons.Public()
SpaceRoomVisibility.Restricted -> CompoundIcons.Workspace()
}
}
val SpaceRoomVisibility.label: String
@Composable
@ReadOnlyComposable
get() {
return when (this) {
SpaceRoomVisibility.Private -> stringResource(CommonStrings.common_private_space)
SpaceRoomVisibility.Public -> stringResource(CommonStrings.common_public_space)
SpaceRoomVisibility.Restricted -> stringResource(CommonStrings.common_shared_space)
}
}

View File

@@ -16,7 +16,7 @@ import io.element.android.libraries.matrix.api.spaces.SpaceRoom
import io.element.android.libraries.matrix.api.user.MatrixUser
fun aSpaceRoom(
name: String? = "Space name",
rawName: String? = "Space name",
avatarUrl: String? = null,
canonicalAlias: RoomAlias? = null,
childrenCount: Int = 0,
@@ -29,9 +29,10 @@ fun aSpaceRoom(
state: CurrentUserMembership? = null,
topic: String? = null,
worldReadable: Boolean = false,
isDirect: Boolean? = null,
via: List<String> = emptyList(),
) = SpaceRoom(
name = name,
rawName = rawName,
avatarUrl = avatarUrl,
canonicalAlias = canonicalAlias,
childrenCount = childrenCount,
@@ -45,4 +46,5 @@ fun aSpaceRoom(
topic = topic,
worldReadable = worldReadable,
via = via,
isDirect = isDirect
)

View File

@@ -94,6 +94,7 @@
<string name="action_forgot_password">"Forgot password?"</string>
<string name="action_forward">"Forward"</string>
<string name="action_go_back">"Go back"</string>
<string name="action_go_to_settings">"Go to settings"</string>
<string name="action_ignore">"Ignore"</string>
<string name="action_invite">"Invite"</string>
<string name="action_invite_friends">"Invite people"</string>
@@ -319,6 +320,7 @@ Reason: %1$s."</string>
<string name="common_settings">"Settings"</string>
<string name="common_share_space">"Share space"</string>
<string name="common_shared_location">"Shared location"</string>
<string name="common_shared_space">"Shared space"</string>
<string name="common_signing_out">"Signing out"</string>
<string name="common_something_went_wrong">"Something went wrong"</string>
<string name="common_something_went_wrong_message">"We encountered an issue. Please try again."</string>
@@ -427,6 +429,7 @@ Are you sure you want to continue?"</string>
<string name="screen_create_poll_remove_accessibility_label">"Remove %1$s"</string>
<string name="screen_create_poll_settings_section_title">"Settings"</string>
<string name="screen_labs_enable_threads">"Enable thread replies"</string>
<string name="screen_labs_enable_threads_description">"Restarting the app is required to apply changes"</string>
<string name="screen_labs_header_description">"Try out our latest ideas in development. These features are not finalised; they may be unstable, may change."</string>
<string name="screen_labs_header_title">"Feeling experimental?"</string>
<string name="screen_labs_title">"Labs"</string>