Introduce an EmptyState, so that screenshot filename stays consistent.

This commit is contained in:
Benoit Marty
2026-09-15 10:52:45 +02:00
parent 25505d6e8a
commit c512e3f299
10 changed files with 34 additions and 17 deletions
@@ -17,16 +17,14 @@ import kotlin.time.Duration
* Ref: https://www.figma.com/design/0MMNu7cTOzLOlWb7ctTkv3/Element-X?node-id=1518-85323
*
* @param buildContext the [BuildContext] of the Node.
* @param delayBeforeShowingContent when finite, a loading indicator fades in after this delay. Use it for
* placeholders which can stay on screen for a long time, or forever, else the application looks frozen.
* Defaults to [Duration.INFINITE], i.e. the Node stays empty.
* @param state the [EmptyState] of the Node. Default value will render an empty node forever.
*/
fun emptyNode(
buildContext: BuildContext,
delayBeforeShowingContent: Duration = Duration.INFINITE,
state: EmptyState = EmptyState(Duration.INFINITE),
): Node = node(buildContext) { modifier ->
EmptyView(
delayBeforeShowingContent = delayBeforeShowingContent,
state = state,
modifier = modifier,
)
}
@@ -0,0 +1,18 @@
/*
* Copyright (c) 2026 Element Creations 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.ui.common.nodes
import kotlin.time.Duration
/**
* @property delayBeforeShowingContent when finite, a loading indicator fades in after this delay. Use it for
* placeholders which can stay on screen for a long time, or forever, else the application looks frozen.
*/
data class EmptyState(
val delayBeforeShowingContent: Duration,
)
@@ -11,10 +11,10 @@ import androidx.compose.ui.tooling.preview.PreviewParameterProvider
import kotlin.time.Duration
import kotlin.time.Duration.Companion.seconds
open class DurationPreviewParam : PreviewParameterProvider<Duration> {
override val values: Sequence<Duration>
open class EmptyStatePreviewParam : PreviewParameterProvider<EmptyState> {
override val values: Sequence<EmptyState>
get() = sequenceOf(
Duration.INFINITE,
1.seconds,
EmptyState(Duration.INFINITE),
EmptyState(1.seconds),
)
}
@@ -26,11 +26,10 @@ import io.element.android.libraries.designsystem.theme.components.CircularProgre
import io.element.android.libraries.designsystem.theme.components.Text
import io.element.android.libraries.designsystem.utils.DelayedVisibility
import io.element.android.libraries.ui.strings.CommonStrings
import kotlin.time.Duration
@Composable
fun EmptyView(
delayBeforeShowingContent: Duration,
state: EmptyState,
modifier: Modifier = Modifier,
) = Box(
modifier = modifier
@@ -38,8 +37,8 @@ fun EmptyView(
.background(ElementTheme.colors.bgCanvasDefault),
contentAlignment = Alignment.Center,
) {
if (delayBeforeShowingContent.isFinite()) {
DelayedVisibility(duration = delayBeforeShowingContent) {
if (state.delayBeforeShowingContent.isFinite()) {
DelayedVisibility(duration = state.delayBeforeShowingContent) {
LoadingContent()
}
}
@@ -62,7 +61,7 @@ private fun LoadingContent() = Column(
@PreviewsDayNight
@Composable
internal fun EmptyViewPreview(
@PreviewParameter(DurationPreviewParam::class) duration: Duration
@PreviewParameter(EmptyStatePreviewParam::class) state: EmptyState
) = ElementPreview {
EmptyView(delayBeforeShowingContent = duration)
EmptyView(state = state)
}