From c8ead4ab9fe53aa170dd48f8ef46a3a693636e28 Mon Sep 17 00:00:00 2001 From: ganfra Date: Tue, 16 May 2023 14:51:18 +0200 Subject: [PATCH] Media: update ui on media viewers --- .../preview/AttachmentsPreviewNode.kt | 12 ++-- .../preview/AttachmentsPreviewView.kt | 69 ++++++++++++++++--- .../impl/media/viewer/MediaViewerNode.kt | 11 +-- 3 files changed, 74 insertions(+), 18 deletions(-) diff --git a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewNode.kt b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewNode.kt index 2c96ece06b..33710d95d8 100644 --- a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewNode.kt +++ b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewNode.kt @@ -27,6 +27,7 @@ import io.element.android.anvilannotations.ContributesNode import io.element.android.features.messages.impl.attachments.Attachment import io.element.android.libraries.architecture.NodeInputs import io.element.android.libraries.architecture.inputs +import io.element.android.libraries.designsystem.theme.ElementTheme import io.element.android.libraries.di.RoomScope @ContributesNode(RoomScope::class) @@ -45,9 +46,12 @@ class AttachmentsPreviewNode @AssistedInject constructor( @Composable override fun View(modifier: Modifier) { val state = presenter.present() - AttachmentsPreviewView( - state = state, - modifier = modifier - ) + ElementTheme(darkTheme = true) { + AttachmentsPreviewView( + state = state, + onDismiss = this::navigateUp, + modifier = modifier + ) + } } } diff --git a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewView.kt b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewView.kt index 6b4449b620..c69f19e019 100644 --- a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewView.kt +++ b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewView.kt @@ -18,40 +18,88 @@ package io.element.android.features.messages.impl.attachments.preview +import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.defaultMinSize +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding import androidx.compose.material3.ExperimentalMaterial3Api 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.tooling.preview.Preview import androidx.compose.ui.tooling.preview.PreviewParameter +import androidx.compose.ui.unit.dp import io.element.android.features.messages.impl.attachments.Attachment import io.element.android.features.messages.impl.media.local.LocalMediaView import io.element.android.libraries.designsystem.preview.ElementPreviewDark -import io.element.android.libraries.designsystem.preview.ElementPreviewLight import io.element.android.libraries.designsystem.theme.components.Scaffold +import io.element.android.libraries.designsystem.theme.components.Text +import io.element.android.libraries.designsystem.theme.components.TextButton +import io.element.android.libraries.ui.strings.R as StringsR @Composable fun AttachmentsPreviewView( state: AttachmentsPreviewState, + onDismiss: () -> Unit, modifier: Modifier = Modifier, ) { + + fun onSendClicked() { + } + Scaffold(modifier) { - Box( - modifier = Modifier, - contentAlignment = Alignment.Center + Column( + modifier = Modifier.fillMaxWidth(), ) { - when (state.attachment) { - is Attachment.Media -> LocalMediaView(localMedia = state.attachment.localMedia) + Spacer( + modifier = Modifier.height(80.dp) + ) + Box( + modifier = Modifier + .fillMaxWidth() + .weight(1f) + ) { + when (state.attachment) { + is Attachment.Media -> LocalMediaView( + localMedia = state.attachment.localMedia + ) + } } + AttachmentsPreviewBottomActions( + onCancelClicked = onDismiss, + onSendClicked = ::onSendClicked, + modifier = Modifier + .fillMaxWidth() + .defaultMinSize(minHeight = 120.dp) + .padding(all = 24.dp) + ) } } } -@Preview @Composable -fun AttachmentsPreviewViewLightPreview(@PreviewParameter(AttachmentsPreviewStateProvider::class) state: AttachmentsPreviewState) = - ElementPreviewLight { ContentToPreview(state) } +private fun AttachmentsPreviewBottomActions( + onCancelClicked: () -> Unit, + onSendClicked: () -> Unit, + modifier: Modifier = Modifier +) { + Row( + modifier = modifier, + horizontalArrangement = Arrangement.SpaceBetween + ) { + TextButton(onClick = onCancelClicked) { + Text(stringResource(id = StringsR.string.action_cancel)) + } + TextButton(onClick = onSendClicked) { + Text(stringResource(id = StringsR.string.action_send)) + } + } +} @Preview @Composable @@ -62,5 +110,6 @@ fun AttachmentsPreviewViewDarkPreview(@PreviewParameter(AttachmentsPreviewStateP private fun ContentToPreview(state: AttachmentsPreviewState) { AttachmentsPreviewView( state = state, + onDismiss = {}, ) } diff --git a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/media/viewer/MediaViewerNode.kt b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/media/viewer/MediaViewerNode.kt index fe2167c786..ae82b222f7 100644 --- a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/media/viewer/MediaViewerNode.kt +++ b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/media/viewer/MediaViewerNode.kt @@ -26,6 +26,7 @@ import dagger.assisted.AssistedInject import io.element.android.anvilannotations.ContributesNode import io.element.android.libraries.architecture.NodeInputs import io.element.android.libraries.architecture.inputs +import io.element.android.libraries.designsystem.theme.ElementTheme import io.element.android.libraries.di.RoomScope import io.element.android.libraries.matrix.api.media.MediaSource @@ -49,9 +50,11 @@ class MediaViewerNode @AssistedInject constructor( @Composable override fun View(modifier: Modifier) { val state = presenter.present() - MediaViewerView( - state = state, - modifier = modifier - ) + ElementTheme(darkTheme = true) { + MediaViewerView( + state = state, + modifier = modifier + ) + } } }