design(space): let divider be full width

# Conflicts:
#	features/home/impl/src/main/kotlin/io/element/android/features/home/impl/spaces/HomeSpacesView.kt
This commit is contained in:
ganfra 2025-10-23 16:01:47 +02:00
parent cec4e105ec
commit e689eaf73a
3 changed files with 92 additions and 90 deletions

View file

@ -10,6 +10,7 @@ package io.element.android.features.home.impl.spaces
import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.LazyListState import androidx.compose.foundation.lazy.LazyListState
import androidx.compose.foundation.lazy.rememberLazyListState import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.foundation.lazy.itemsIndexed
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.tooling.preview.PreviewParameter import androidx.compose.ui.tooling.preview.PreviewParameter
@ -57,20 +58,24 @@ fun HomeSpacesView(
item { item {
HorizontalDivider() HorizontalDivider()
} }
state.spaceRooms.forEach { spaceRoom -> itemsIndexed(
item(spaceRoom.roomId) { items = state.spaceRooms,
val isInvitation = spaceRoom.state == CurrentUserMembership.INVITED key = { _, spaceRoom -> spaceRoom.roomId }
SpaceRoomItemView( ) { index, spaceRoom ->
spaceRoom = spaceRoom, val isInvitation = spaceRoom.state == CurrentUserMembership.INVITED
showUnreadIndicator = isInvitation && spaceRoom.roomId !in state.seenSpaceInvites, SpaceRoomItemView(
hideAvatars = isInvitation && state.hideInvitesAvatar, spaceRoom = spaceRoom,
onClick = { showUnreadIndicator = isInvitation && spaceRoom.roomId !in state.seenSpaceInvites,
onSpaceClick(spaceRoom.roomId) hideAvatars = isInvitation && state.hideInvitesAvatar,
}, onClick = {
onLongClick = { onSpaceClick(spaceRoom.roomId)
// TODO },
}, onLongClick = {
) // TODO
},
)
if (index != state.spaceRooms.lastIndex) {
HorizontalDivider()
} }
} }
} }

View file

@ -14,6 +14,7 @@ import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.itemsIndexed
import androidx.compose.material3.ExperimentalMaterial3Api import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect import androidx.compose.runtime.LaunchedEffect
@ -182,32 +183,36 @@ private fun SpaceViewContent(
HorizontalDivider() HorizontalDivider()
} }
} }
state.children.forEach { spaceRoom -> itemsIndexed(
item { items = state.children,
val isInvitation = spaceRoom.state == CurrentUserMembership.INVITED key = { _, spaceRoom -> spaceRoom.roomId }
val isCurrentlyJoining = state.isJoining(spaceRoom.roomId) ) { index, spaceRoom ->
SpaceRoomItemView( val isInvitation = spaceRoom.state == CurrentUserMembership.INVITED
spaceRoom = spaceRoom, val isCurrentlyJoining = state.isJoining(spaceRoom.roomId)
showUnreadIndicator = isInvitation && spaceRoom.roomId !in state.seenSpaceInvites, SpaceRoomItemView(
hideAvatars = isInvitation && state.hideInvitesAvatar, spaceRoom = spaceRoom,
onClick = { showUnreadIndicator = isInvitation && spaceRoom.roomId !in state.seenSpaceInvites,
onRoomClick(spaceRoom) hideAvatars = isInvitation && state.hideInvitesAvatar,
onClick = {
onRoomClick(spaceRoom)
},
onLongClick = {
// TODO
},
trailingAction = spaceRoom.trailingAction(isCurrentlyJoining = isCurrentlyJoining) {
state.eventSink(SpaceEvents.Join(spaceRoom))
},
bottomAction = spaceRoom.inviteButtons(
onAcceptClick = {
state.eventSink(SpaceEvents.AcceptInvite(spaceRoom))
}, },
onLongClick = { onDeclineClick = {
// TODO state.eventSink(SpaceEvents.DeclineInvite(spaceRoom))
}, }
trailingAction = spaceRoom.trailingAction(isCurrentlyJoining = isCurrentlyJoining) {
state.eventSink(SpaceEvents.Join(spaceRoom))
},
bottomAction = spaceRoom.inviteButtons(
onAcceptClick = {
state.eventSink(SpaceEvents.AcceptInvite(spaceRoom))
},
onDeclineClick = {
state.eventSink(SpaceEvents.DeclineInvite(spaceRoom))
}
)
) )
)
if (index != state.children.lastIndex) {
HorizontalDivider()
} }
} }
if (state.hasMoreToLoad) { if (state.hasMoreToLoad) {
@ -328,10 +333,10 @@ private fun SpaceAvatarAndNameRow(
) )
Text( Text(
modifier = Modifier modifier = Modifier
.padding(horizontal = 8.dp) .padding(horizontal = 8.dp)
.semantics { .semantics {
heading() heading()
}, },
text = name ?: stringResource(CommonStrings.common_no_space_name), text = name ?: stringResource(CommonStrings.common_no_space_name),
style = ElementTheme.typography.fontBodyLgMedium, style = ElementTheme.typography.fontBodyLgMedium,
fontStyle = FontStyle.Italic.takeIf { name == null }, fontStyle = FontStyle.Italic.takeIf { name == null },

View file

@ -43,7 +43,6 @@ import io.element.android.libraries.designsystem.components.avatar.AvatarType
import io.element.android.libraries.designsystem.modifiers.onKeyboardContextMenuAction import io.element.android.libraries.designsystem.modifiers.onKeyboardContextMenuAction
import io.element.android.libraries.designsystem.preview.ElementPreview import io.element.android.libraries.designsystem.preview.ElementPreview
import io.element.android.libraries.designsystem.preview.PreviewsDayNight import io.element.android.libraries.designsystem.preview.PreviewsDayNight
import io.element.android.libraries.designsystem.theme.components.HorizontalDivider
import io.element.android.libraries.designsystem.theme.components.Icon 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.components.Text
import io.element.android.libraries.designsystem.theme.unreadIndicator import io.element.android.libraries.designsystem.theme.unreadIndicator
@ -81,56 +80,50 @@ fun SpaceRoomItemView(
interactionSource = remember { MutableInteractionSource() } interactionSource = remember { MutableInteractionSource() }
) )
.onKeyboardContextMenuAction { onLongClick } .onKeyboardContextMenuAction { onLongClick }
Box(modifier = modifier.then(clickModifier)) { Column(
Column( modifier = modifier
modifier = Modifier.padding(horizontal = 16.dp, vertical = 12.dp), .then(clickModifier)
.padding(horizontal = 16.dp, vertical = 12.dp),
) {
SpaceRoomItemScaffold(
avatarData = spaceRoom.getAvatarData(AvatarSize.SpaceListItem),
isSpace = spaceRoom.isSpace,
hideAvatars = hideAvatars,
heroes = spaceRoom.heroes
.map { hero -> hero.getAvatarData(AvatarSize.SpaceListItem) }
.toImmutableList(),
trailingAction = trailingAction,
) { ) {
SpaceRoomItemScaffold( NameAndIndicatorRow(
avatarData = spaceRoom.getAvatarData(AvatarSize.SpaceListItem), name = spaceRoom.displayName,
isSpace = spaceRoom.isSpace, showIndicator = showUnreadIndicator
hideAvatars = hideAvatars, )
heroes = spaceRoom.heroes Spacer(modifier = Modifier.height(1.dp))
.map { hero -> hero.getAvatarData(AvatarSize.SpaceListItem) } SubtitleRow(
.toImmutableList(), visibilityIcon = spaceRoom.visibilityIcon(),
trailingAction = trailingAction, subtitle = spaceRoom.subtitle()
) { )
NameAndIndicatorRow( Spacer(modifier = Modifier.height(1.dp))
name = spaceRoom.displayName, val info = spaceRoom.info()
showIndicator = showUnreadIndicator if (info.isNotBlank()) {
Text(
modifier = Modifier.weight(1f),
style = ElementTheme.typography.fontBodyMdRegular,
text = info,
color = ElementTheme.colors.textSecondary,
maxLines = 1,
overflow = TextOverflow.Ellipsis
) )
Spacer(modifier = Modifier.height(1.dp))
SubtitleRow(
visibilityIcon = spaceRoom.visibilityIcon(),
subtitle = spaceRoom.subtitle()
)
Spacer(modifier = Modifier.height(1.dp))
val info = spaceRoom.info()
if (info.isNotBlank()) {
Text(
modifier = Modifier.weight(1f),
style = ElementTheme.typography.fontBodyMdRegular,
text = info,
color = ElementTheme.colors.textSecondary,
maxLines = 1,
overflow = TextOverflow.Ellipsis
)
}
}
if (bottomAction != null) {
Spacer(modifier = Modifier.height(12.dp))
// Match the padding of the text content (avatar + spacer)
Box(modifier = Modifier.padding(start = AvatarSize.SpaceListItem.dp + 16.dp)) {
bottomAction()
}
Spacer(modifier = Modifier.height(4.dp))
} }
} }
HorizontalDivider( if (bottomAction != null) {
modifier = Modifier Spacer(modifier = Modifier.height(12.dp))
// Match the padding of the text content (padding + avatar + spacer) // Match the padding of the text content (avatar + spacer)
.padding(start = AvatarSize.SpaceListItem.dp + 16.dp + 16.dp) Box(modifier = Modifier.padding(start = AvatarSize.SpaceListItem.dp + 16.dp)) {
.align(Alignment.BottomCenter) bottomAction()
) }
Spacer(modifier = Modifier.height(4.dp))
}
} }
} }
@ -264,7 +257,6 @@ internal fun SpaceRoomItemViewPreview(@PreviewParameter(SpaceRoomProvider::class
hideAvatars = false, hideAvatars = false,
onClick = {}, onClick = {},
onLongClick = {}, onLongClick = {},
modifier = Modifier.fillMaxWidth().padding(8.dp),
bottomAction = if (spaceRoom.state == CurrentUserMembership.INVITED) { bottomAction = if (spaceRoom.state == CurrentUserMembership.INVITED) {
{ InviteButtonsRowMolecule({}, {}) } { InviteButtonsRowMolecule({}, {}) }
} else { } else {