From d5d7ac4c445fc145fe3649a05abe3650efa2b62f Mon Sep 17 00:00:00 2001 From: Benoit Marty Date: Fri, 22 Aug 2025 11:49:49 +0200 Subject: [PATCH] Add SpaceInfoRow to display info about a space in a space header. --- .../ui/components/OrganizationHeader.kt | 17 +-- .../matrix/ui/components/SpaceInfoRow.kt | 135 ++++++++++++++++++ 2 files changed, 138 insertions(+), 14 deletions(-) create mode 100644 libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/SpaceInfoRow.kt diff --git a/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/OrganizationHeader.kt b/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/OrganizationHeader.kt index 9f98745a93..ebd5b5969c 100644 --- a/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/OrganizationHeader.kt +++ b/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/OrganizationHeader.kt @@ -16,8 +16,6 @@ import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier -import androidx.compose.ui.res.pluralStringResource -import androidx.compose.ui.res.stringResource import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.unit.dp import io.element.android.compound.theme.ElementTheme @@ -28,8 +26,6 @@ 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.ui.strings.CommonPlurals -import io.element.android.libraries.ui.strings.CommonStrings /** * Ref: https://www.figma.com/design/G1xy0HDZKJf5TCRFmKb5d5/Compound-Android-Components?node-id=3643-2048&m=dev @@ -60,16 +56,9 @@ fun OrganizationHeader( textAlign = TextAlign.Center, ) Spacer(modifier = Modifier.height(12.dp)) - val subtitle = stringResource( - id = CommonStrings.screen_space_list_details, - pluralStringResource(CommonPlurals.common_spaces, numberOfSpaces, numberOfSpaces), - pluralStringResource(CommonPlurals.common_rooms, numberOfRooms, numberOfRooms), - ) - Text( - text = subtitle, - style = ElementTheme.typography.fontBodyLgRegular, - color = ElementTheme.colors.textSecondary, - textAlign = TextAlign.Center, + SpaceInfoRow( + leftText = numberOfSpaces(numberOfSpaces), + rightText = numberOfRooms(numberOfRooms), ) } } diff --git a/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/SpaceInfoRow.kt b/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/SpaceInfoRow.kt new file mode 100644 index 0000000000..3d973d97ae --- /dev/null +++ b/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/SpaceInfoRow.kt @@ -0,0 +1,135 @@ +/* + * 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.ui.components + +import androidx.compose.foundation.layout.Arrangement.spacedBy +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.size +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.runtime.ReadOnlyComposable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.vector.ImageVector +import androidx.compose.ui.res.pluralStringResource +import androidx.compose.ui.res.stringResource +import androidx.compose.ui.text.style.TextAlign +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.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.ui.strings.CommonPlurals +import io.element.android.libraries.ui.strings.CommonStrings + +@Composable +fun SpaceInfoRow( + leftText: String, + rightText: String, + modifier: Modifier = Modifier, + iconVector: ImageVector? = null, +) { + Row( + modifier = modifier, + horizontalArrangement = spacedBy(4.dp), + verticalAlignment = Alignment.CenterVertically, + ) { + if (iconVector != null) { + Icon( + modifier = Modifier.size(20.dp), + imageVector = iconVector, + contentDescription = null, + tint = ElementTheme.colors.iconTertiary, + ) + } + val text = stringResource(id = CommonStrings.screen_space_list_details, leftText, rightText) + Text( + text = text, + style = ElementTheme.typography.fontBodyLgRegular, + color = ElementTheme.colors.textSecondary, + textAlign = TextAlign.Center, + ) + } +} + +@Composable +fun SpaceInfoRow( + joinRule: JoinRule, + numberOfRooms: Int, + 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, + modifier = modifier, + iconVector = icon, + ) +} + +@Composable +@ReadOnlyComposable +fun numberOfRooms(numberOfRooms: Int): String { + return pluralStringResource(CommonPlurals.common_rooms, numberOfRooms, numberOfRooms) +} + +@Composable +@ReadOnlyComposable +fun numberOfSpaces(numberOfSpaces: Int): String { + return pluralStringResource(CommonPlurals.common_spaces, numberOfSpaces, numberOfSpaces) +} + +@PreviewsDayNight +@Composable +internal fun SpaceInfoRowPreview() = ElementPreview { + Column( + modifier = Modifier.fillMaxWidth(), + verticalArrangement = spacedBy(4.dp), + horizontalAlignment = Alignment.CenterHorizontally, + ) { + SpaceInfoRow( + leftText = numberOfSpaces(5), + rightText = numberOfRooms(10), + ) + SpaceInfoRow( + leftText = "Element space", + rightText = numberOfRooms(16), + iconVector = CompoundIcons.Workspace(), + ) + SpaceInfoRow( + joinRule = JoinRule.Private, + numberOfRooms = 4, + ) + SpaceInfoRow( + joinRule = JoinRule.Public, + numberOfRooms = 10, + ) + } +}