From 0fcc90f64f95f398e1b6f10aa4cf07da5554b841 Mon Sep 17 00:00:00 2001 From: Benoit Marty Date: Mon, 2 Dec 2024 15:53:40 +0100 Subject: [PATCH 1/2] Add warning when adding a caption. --- .../messages/impl/MessagesPresenter.kt | 6 +- .../preview/AttachmentsPreviewPresenter.kt | 2 + .../preview/AttachmentsPreviewState.kt | 1 + .../AttachmentsPreviewStateProvider.kt | 3 + .../preview/AttachmentsPreviewView.kt | 5 +- .../messages/impl/MessagesPresenterTest.kt | 66 ++++++++++++- .../AttachmentsPreviewPresenterTest.kt | 16 ++- .../MessageComposerPresenterTest.kt | 7 +- .../libraries/featureflag/api/FeatureFlags.kt | 9 +- .../textcomposer/CaptionWarningBottomSheet.kt | 73 ++++++++++++++ .../libraries/textcomposer/TextComposer.kt | 97 ++++++++++++------- .../textcomposer/model/MessageComposerMode.kt | 16 ++- .../impl/src/main/res/values/localazy.xml | 2 +- 13 files changed, 260 insertions(+), 43 deletions(-) create mode 100644 libraries/textcomposer/impl/src/main/kotlin/io/element/android/libraries/textcomposer/CaptionWarningBottomSheet.kt diff --git a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/MessagesPresenter.kt b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/MessagesPresenter.kt index 5a68b5cc9e..4895390ab8 100644 --- a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/MessagesPresenter.kt +++ b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/MessagesPresenter.kt @@ -402,26 +402,28 @@ class MessagesPresenter @AssistedInject constructor( } } - private fun handleActionAddCaption( + private suspend fun handleActionAddCaption( targetEvent: TimelineItem.Event, composerState: MessageComposerState, ) { val composerMode = MessageComposerMode.EditCaption( eventOrTransactionId = targetEvent.eventOrTransactionId, content = "", + showCaptionCompatibilityWarning = featureFlagsService.isFeatureEnabled(FeatureFlags.MediaCaptionWarning), ) composerState.eventSink( MessageComposerEvents.SetMode(composerMode) ) } - private fun handleActionEditCaption( + private suspend fun handleActionEditCaption( targetEvent: TimelineItem.Event, composerState: MessageComposerState, ) { val composerMode = MessageComposerMode.EditCaption( eventOrTransactionId = targetEvent.eventOrTransactionId, content = (targetEvent.content as? TimelineItemEventContentWithAttachment)?.caption.orEmpty(), + showCaptionCompatibilityWarning = featureFlagsService.isFeatureEnabled(FeatureFlags.MediaCaptionWarning), ) composerState.eventSink( MessageComposerEvents.SetMode(composerMode) diff --git a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewPresenter.kt b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewPresenter.kt index 606e91863d..cda414934a 100644 --- a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewPresenter.kt +++ b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewPresenter.kt @@ -74,6 +74,7 @@ class AttachmentsPreviewPresenter @AssistedInject constructor( val userSentAttachment = remember { mutableStateOf(false) } val allowCaption by featureFlagService.isFeatureEnabledFlow(FeatureFlags.MediaCaptionCreation).collectAsState(initial = false) + val showCaptionCompatibilityWarning by featureFlagService.isFeatureEnabledFlow(FeatureFlags.MediaCaptionWarning).collectAsState(initial = false) val mediaUploadInfoState = remember { mutableStateOf>(AsyncData.Uninitialized) } LaunchedEffect(Unit) { @@ -145,6 +146,7 @@ class AttachmentsPreviewPresenter @AssistedInject constructor( sendActionState = sendActionState.value, textEditorState = textEditorState, allowCaption = allowCaption, + showCaptionCompatibilityWarning = showCaptionCompatibilityWarning, eventSink = ::handleEvents ) } diff --git a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewState.kt b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewState.kt index 0878b52f80..739efa8d24 100644 --- a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewState.kt +++ b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewState.kt @@ -16,6 +16,7 @@ data class AttachmentsPreviewState( val sendActionState: SendActionState, val textEditorState: TextEditorState, val allowCaption: Boolean, + val showCaptionCompatibilityWarning: Boolean, val eventSink: (AttachmentsPreviewEvents) -> Unit ) diff --git a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewStateProvider.kt b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewStateProvider.kt index 1a52316735..b718936a1c 100644 --- a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewStateProvider.kt +++ b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/attachments/preview/AttachmentsPreviewStateProvider.kt @@ -24,6 +24,7 @@ open class AttachmentsPreviewStateProvider : PreviewParameterProvider() + val presenter = createMessagesPresenter( + messageComposerPresenter = { aMessageComposerState(eventSink = composerRecorder) }, + featureFlagService = FakeFeatureFlagService( + initialState = mapOf(FeatureFlags.MediaCaptionWarning.key to false) + ) + ) + presenter.test { + val initialState = awaitItem() + initialState.eventSink(MessagesEvents.HandleAction(TimelineItemAction.EditCaption, messageEvent)) + awaitItem() + composerRecorder.assertSingle( + MessageComposerEvents.SetMode( + composerMode = MessageComposerMode.EditCaption( + eventOrTransactionId = AN_EVENT_ID.toEventOrTransactionId(), + content = A_CAPTION, + showCaptionCompatibilityWarning = false, ) ) ) @@ -1033,6 +1066,37 @@ class MessagesPresenterTest { composerMode = MessageComposerMode.EditCaption( eventOrTransactionId = AN_EVENT_ID.toEventOrTransactionId(), content = "", + showCaptionCompatibilityWarning = true, + ) + ) + ) + } + } + + @Test + fun `present - handle action add caption without warning`() = runTest { + val composerRecorder = EventsRecorder() + val presenter = createMessagesPresenter( + messageComposerPresenter = { aMessageComposerState(eventSink = composerRecorder) }, + featureFlagService = FakeFeatureFlagService( + initialState = mapOf(FeatureFlags.MediaCaptionWarning.key to false) + ) + ) + val messageEvent = aMessageEvent( + content = aTimelineItemImageContent( + caption = null, + ) + ) + presenter.test { + val initialState = awaitItem() + initialState.eventSink(MessagesEvents.HandleAction(TimelineItemAction.AddCaption, messageEvent)) + awaitItem() + composerRecorder.assertSingle( + MessageComposerEvents.SetMode( + composerMode = MessageComposerMode.EditCaption( + eventOrTransactionId = AN_EVENT_ID.toEventOrTransactionId(), + content = "", + showCaptionCompatibilityWarning = false, ) ) ) @@ -1097,6 +1161,7 @@ class MessagesPresenterTest { givenRoomInfo(aRoomInfo(id = roomId, name = "")) }, navigator: FakeMessagesNavigator = FakeMessagesNavigator(), + featureFlagService: FeatureFlagService = FakeFeatureFlagService(), clipboardHelper: FakeClipboardHelper = FakeClipboardHelper(), analyticsService: FakeAnalyticsService = FakeAnalyticsService(), timelineEventSink: (TimelineEvents) -> Unit = {}, @@ -1109,7 +1174,6 @@ class MessagesPresenterTest { }, actionListEventSink: (ActionListEvents) -> Unit = {}, ): MessagesPresenter { - val featureFlagService = FakeFeatureFlagService() return MessagesPresenter( room = matrixRoom, composerPresenter = messageComposerPresenter, diff --git a/features/messages/impl/src/test/kotlin/io/element/android/features/messages/impl/attachments/AttachmentsPreviewPresenterTest.kt b/features/messages/impl/src/test/kotlin/io/element/android/features/messages/impl/attachments/AttachmentsPreviewPresenterTest.kt index 095b770f08..92e43aa03a 100644 --- a/features/messages/impl/src/test/kotlin/io/element/android/features/messages/impl/attachments/AttachmentsPreviewPresenterTest.kt +++ b/features/messages/impl/src/test/kotlin/io/element/android/features/messages/impl/attachments/AttachmentsPreviewPresenterTest.kt @@ -67,10 +67,22 @@ class AttachmentsPreviewPresenterTest { @Test fun `present - initial state`() = runTest { createAttachmentsPreviewPresenter().test { - skipItems(1) + skipItems(1) val initialState = awaitItem() assertThat(initialState.sendActionState).isEqualTo(SendActionState.Idle) assertThat(initialState.allowCaption).isTrue() + assertThat(initialState.showCaptionCompatibilityWarning).isTrue() + } + } + + @Test + fun `present - initial state no caption warning`() = runTest { + createAttachmentsPreviewPresenter( + showCaptionCompatibilityWarning = false, + ).test { + skipItems(1) + val initialState = awaitItem() + assertThat(initialState.showCaptionCompatibilityWarning).isFalse() } } @@ -443,6 +455,7 @@ class AttachmentsPreviewPresenterTest { onDoneListener: OnDoneListener = OnDoneListener { lambdaError() }, mediaUploadOnSendQueueEnabled: Boolean = true, allowCaption: Boolean = true, + showCaptionCompatibilityWarning: Boolean = true, ): AttachmentsPreviewPresenter { return AttachmentsPreviewPresenter( attachment = aMediaAttachment(localMedia), @@ -454,6 +467,7 @@ class AttachmentsPreviewPresenterTest { initialState = mapOf( FeatureFlags.MediaUploadOnSendQueue.key to mediaUploadOnSendQueueEnabled, FeatureFlags.MediaCaptionCreation.key to allowCaption, + FeatureFlags.MediaCaptionWarning.key to showCaptionCompatibilityWarning, ), ) ) diff --git a/features/messages/impl/src/test/kotlin/io/element/android/features/messages/impl/messagecomposer/MessageComposerPresenterTest.kt b/features/messages/impl/src/test/kotlin/io/element/android/features/messages/impl/messagecomposer/MessageComposerPresenterTest.kt index d0b41bbb1e..a56da055aa 100644 --- a/features/messages/impl/src/test/kotlin/io/element/android/features/messages/impl/messagecomposer/MessageComposerPresenterTest.kt +++ b/features/messages/impl/src/test/kotlin/io/element/android/features/messages/impl/messagecomposer/MessageComposerPresenterTest.kt @@ -1586,7 +1586,12 @@ fun anEditMode( fun anEditCaptionMode( eventOrTransactionId: EventOrTransactionId = AN_EVENT_ID.toEventOrTransactionId(), caption: String = A_CAPTION, -) = MessageComposerMode.EditCaption(eventOrTransactionId, caption) + showCaptionCompatibilityWarning: Boolean = false, +) = MessageComposerMode.EditCaption( + eventOrTransactionId = eventOrTransactionId, + content = caption, + showCaptionCompatibilityWarning = showCaptionCompatibilityWarning, +) fun aReplyMode() = MessageComposerMode.Reply( replyToDetails = InReplyToDetails.Loading(AN_EVENT_ID), diff --git a/libraries/featureflag/api/src/main/kotlin/io/element/android/libraries/featureflag/api/FeatureFlags.kt b/libraries/featureflag/api/src/main/kotlin/io/element/android/libraries/featureflag/api/FeatureFlags.kt index 42d9f30920..7d21ed1138 100644 --- a/libraries/featureflag/api/src/main/kotlin/io/element/android/libraries/featureflag/api/FeatureFlags.kt +++ b/libraries/featureflag/api/src/main/kotlin/io/element/android/libraries/featureflag/api/FeatureFlags.kt @@ -144,7 +144,14 @@ enum class FeatureFlags( key = "feature.media_caption_creation", title = "Allow creation of media captions", description = null, - defaultValue = { buildMeta -> buildMeta.buildType != BuildType.RELEASE }, + defaultValue = { true }, + isFinished = false, + ), + MediaCaptionWarning( + key = "feature.media_caption_creation_warning", + title = "Show a compatibility warning on media captions creation", + description = null, + defaultValue = { true }, isFinished = false, ), } diff --git a/libraries/textcomposer/impl/src/main/kotlin/io/element/android/libraries/textcomposer/CaptionWarningBottomSheet.kt b/libraries/textcomposer/impl/src/main/kotlin/io/element/android/libraries/textcomposer/CaptionWarningBottomSheet.kt new file mode 100644 index 0000000000..832d95ef14 --- /dev/null +++ b/libraries/textcomposer/impl/src/main/kotlin/io/element/android/libraries/textcomposer/CaptionWarningBottomSheet.kt @@ -0,0 +1,73 @@ +/* + * Copyright 2024 New Vector Ltd. + * + * SPDX-License-Identifier: AGPL-3.0-only + * Please see LICENSE in the repository root for full details. + */ + +package io.element.android.libraries.textcomposer + +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.padding +import androidx.compose.material3.ExperimentalMaterial3Api +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.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.libraries.designsystem.components.BigIcon +import io.element.android.libraries.designsystem.preview.ElementPreview +import io.element.android.libraries.designsystem.preview.PreviewsDayNight +import io.element.android.libraries.designsystem.theme.components.ModalBottomSheet +import io.element.android.libraries.designsystem.theme.components.OutlinedButton +import io.element.android.libraries.ui.strings.CommonStrings + +@OptIn(ExperimentalMaterial3Api::class) +@Composable +fun CaptionWarningBottomSheet( + onDismiss: () -> Unit, + modifier: Modifier = Modifier, +) { + ModalBottomSheet( + modifier = modifier, + onDismissRequest = onDismiss, + ) { + Column( + modifier = Modifier + .fillMaxWidth() + .padding(horizontal = 16.dp), + horizontalAlignment = Alignment.CenterHorizontally, + verticalArrangement = Arrangement.spacedBy(16.dp), + ) { + BigIcon( + style = BigIcon.Style.AlertSolid, + ) + Text( + text = stringResource(CommonStrings.screen_media_upload_preview_caption_warning), + style = ElementTheme.typography.fontBodyMdRegular, + color = ElementTheme.colors.textPrimary, + textAlign = TextAlign.Center, + ) + OutlinedButton( + modifier = Modifier + .fillMaxWidth() + .padding(vertical = 16.dp), + onClick = onDismiss, + text = stringResource(CommonStrings.action_ok), + ) + } + } +} + +@PreviewsDayNight +@Composable +internal fun CaptionWarningBottomSheetPreview() = ElementPreview { + CaptionWarningBottomSheet( + onDismiss = {}, + ) +} diff --git a/libraries/textcomposer/impl/src/main/kotlin/io/element/android/libraries/textcomposer/TextComposer.kt b/libraries/textcomposer/impl/src/main/kotlin/io/element/android/libraries/textcomposer/TextComposer.kt index fe6034b8b6..9ebb5a7c22 100644 --- a/libraries/textcomposer/impl/src/main/kotlin/io/element/android/libraries/textcomposer/TextComposer.kt +++ b/libraries/textcomposer/impl/src/main/kotlin/io/element/android/libraries/textcomposer/TextComposer.kt @@ -10,8 +10,10 @@ package io.element.android.libraries.textcomposer import android.net.Uri import androidx.compose.foundation.background import androidx.compose.foundation.border +import androidx.compose.foundation.clickable import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.BoxScope import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.IntrinsicSize import androidx.compose.foundation.layout.Row @@ -26,8 +28,10 @@ import androidx.compose.foundation.layout.width import androidx.compose.runtime.Composable import androidx.compose.runtime.LaunchedEffect import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.runtime.rememberUpdatedState +import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip @@ -36,10 +40,12 @@ 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.components.media.createFakeWaveform import io.element.android.libraries.designsystem.preview.ElementPreview import io.element.android.libraries.designsystem.preview.PreviewsDayNight import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator +import io.element.android.libraries.designsystem.theme.components.Icon import io.element.android.libraries.designsystem.theme.components.Text import io.element.android.libraries.matrix.api.core.EventId import io.element.android.libraries.matrix.api.timeline.item.event.EventOrTransactionId @@ -66,6 +72,7 @@ import io.element.android.libraries.textcomposer.model.VoiceMessageRecorderEvent import io.element.android.libraries.textcomposer.model.VoiceMessageState import io.element.android.libraries.textcomposer.model.aTextEditorStateMarkdown import io.element.android.libraries.textcomposer.model.aTextEditorStateRich +import io.element.android.libraries.textcomposer.model.showCaptionCompatibilityWarning import io.element.android.libraries.ui.strings.CommonStrings import io.element.android.wysiwyg.compose.RichTextEditor import io.element.android.wysiwyg.compose.RichTextEditorState @@ -121,8 +128,8 @@ fun TextComposer( } val layoutModifier = modifier - .fillMaxSize() - .height(IntrinsicSize.Min) + .fillMaxSize() + .height(IntrinsicSize.Min) val composerOptionsButton: @Composable () -> Unit = remember(composerMode) { @Composable { @@ -146,7 +153,7 @@ fun TextComposer( val placeholder = if (composerMode.inThread) { stringResource(id = CommonStrings.action_reply_in_thread) - } else if (composerMode is MessageComposerMode.Attachment) { + } else if (composerMode is MessageComposerMode.Attachment || composerMode is MessageComposerMode.EditCaption) { stringResource(id = R.string.rich_text_editor_composer_caption_placeholder) } else { stringResource(id = R.string.rich_text_editor_composer_placeholder) @@ -182,7 +189,7 @@ fun TextComposer( composerMode = composerMode, onResetComposerMode = onResetComposerMode, placeholder = placeholder, - showPlaceholder = { state.state.text.value().isEmpty() }, + showPlaceholder = state.state.text.value().isEmpty(), subcomposing = subcomposing, ) { MarkdownTextInput( @@ -337,8 +344,8 @@ private fun StandardLayout( if (voiceMessageState is VoiceMessageState.Preview || voiceMessageState is VoiceMessageState.Recording) { Box( modifier = Modifier - .padding(bottom = 5.dp, top = 5.dp, end = 3.dp, start = 3.dp) - .size(48.dp), + .padding(bottom = 5.dp, top = 5.dp, end = 3.dp, start = 3.dp) + .size(48.dp), contentAlignment = Alignment.Center, ) { voiceDeleteButton() @@ -348,8 +355,8 @@ private fun StandardLayout( } Box( modifier = Modifier - .padding(bottom = 8.dp, top = 8.dp) - .weight(1f) + .padding(bottom = 8.dp, top = 8.dp) + .weight(1f) ) { voiceRecording() } @@ -362,16 +369,16 @@ private fun StandardLayout( } Box( modifier = Modifier - .padding(bottom = 8.dp, top = 8.dp) - .weight(1f) + .padding(bottom = 8.dp, top = 8.dp) + .weight(1f) ) { textInput() } } Box( - Modifier - .padding(bottom = 5.dp, top = 5.dp, end = 6.dp, start = 6.dp) - .size(48.dp), + Modifier + .padding(bottom = 5.dp, top = 5.dp, end = 6.dp, start = 6.dp) + .size(48.dp), contentAlignment = Alignment.Center, ) { endButton() @@ -393,8 +400,8 @@ private fun TextFormattingLayout( ) { Box( modifier = Modifier - .weight(1f) - .padding(horizontal = 12.dp) + .weight(1f) + .padding(horizontal = 12.dp) ) { textInput() } @@ -428,9 +435,9 @@ private fun TextInputBox( composerMode: MessageComposerMode, onResetComposerMode: () -> Unit, placeholder: String, - showPlaceholder: () -> Boolean, + showPlaceholder: Boolean, subcomposing: Boolean, - textInput: @Composable () -> Unit, + textInput: @Composable BoxScope.() -> Unit, ) { val bgColor = ElementTheme.colors.bgSubtleSecondary val borderColor = ElementTheme.colors.borderDisabled @@ -438,11 +445,11 @@ private fun TextInputBox( Column( modifier = Modifier - .clip(roundedCorners) - .border(0.5.dp, borderColor, roundedCorners) - .background(color = bgColor) - .requiredHeightIn(min = 42.dp) - .fillMaxSize(), + .clip(roundedCorners) + .border(0.5.dp, borderColor, roundedCorners) + .background(color = bgColor) + .requiredHeightIn(min = 42.dp) + .fillMaxSize(), ) { if (composerMode is MessageComposerMode.Special) { ComposerModeView( @@ -453,15 +460,15 @@ private fun TextInputBox( val defaultTypography = ElementTheme.typography.fontBodyLgRegular Box( modifier = Modifier - .padding(top = 4.dp, bottom = 4.dp, start = 12.dp, end = 12.dp) - // Apply test tag only once, otherwise 2 nodes will have it (both the normal and subcomposing one) and tests will fail - .then(if (!subcomposing) Modifier.testTag(TestTags.textEditor) else Modifier), + .padding(top = 4.dp, bottom = 4.dp, start = 12.dp, end = 12.dp) + // Apply test tag only once, otherwise 2 nodes will have it (both the normal and subcomposing one) and tests will fail + .then(if (!subcomposing) Modifier.testTag(TestTags.textEditor) else Modifier), contentAlignment = Alignment.CenterStart, ) { // Placeholder - if (showPlaceholder()) { + if (showPlaceholder) { Text( - placeholder, + text = placeholder, style = defaultTypography.copy( color = ElementTheme.colors.textSecondary, ), @@ -471,6 +478,24 @@ private fun TextInputBox( } textInput() + + if (showPlaceholder && composerMode.showCaptionCompatibilityWarning()) { + var showBottomSheet by remember { mutableStateOf(false) } + Icon( + modifier = Modifier + .clickable { showBottomSheet = true } + .padding(horizontal = 8.dp, vertical = 4.dp) + .align(Alignment.CenterEnd), + imageVector = CompoundIcons.InfoSolid(), + tint = ElementTheme.colors.iconCriticalPrimary, + contentDescription = null, + ) + if (showBottomSheet) { + CaptionWarningBottomSheet( + onDismiss = { showBottomSheet = false }, + ) + } + } } } } @@ -492,7 +517,7 @@ private fun TextInput( composerMode = composerMode, onResetComposerMode = onResetComposerMode, placeholder = placeholder, - showPlaceholder = { state.messageHtml.isEmpty() }, + showPlaceholder = state.messageHtml.isEmpty(), subcomposing = subcomposing, ) { RichTextEditor( @@ -501,8 +526,8 @@ private fun TextInput( // This prevents it gaining focus and mutating the state. registerStateUpdates = !subcomposing, modifier = Modifier - .padding(top = 6.dp, bottom = 6.dp) - .fillMaxWidth(), + .padding(top = 6.dp, bottom = 6.dp) + .fillMaxWidth(), style = ElementRichTextEditorStyle.composerStyle(hasFocus = state.hasFocus), resolveMentionDisplay = resolveMentionDisplay, resolveRoomMentionDisplay = resolveRoomMentionDisplay, @@ -602,13 +627,14 @@ internal fun TextComposerEditCaptionPreview() = ElementPreview { internal fun TextComposerAddCaptionPreview() = ElementPreview { PreviewColumn( items = aTextEditorStateRichList() - ) { _, textEditorState -> + ) { index, textEditorState -> ATextComposer( state = textEditorState, voiceMessageState = VoiceMessageState.Idle, composerMode = aMessageComposerModeEditCaption( // No caption so that the UI will be in add caption mode content = "", + showCompatibilityWarning = index == 0, ), enableVoiceMessages = false, ) @@ -657,7 +683,10 @@ internal fun TextComposerCaptionPreview() = ElementPreview { ATextComposer( state = textEditorState, voiceMessageState = VoiceMessageState.Idle, - composerMode = MessageComposerMode.Attachment(allowCaption = index < list.size), + composerMode = MessageComposerMode.Attachment( + allowCaption = index < list.size, + showCaptionCompatibilityWarning = index == 0, + ), enableVoiceMessages = false, ) } @@ -762,9 +791,11 @@ fun aMessageComposerModeEdit( fun aMessageComposerModeEditCaption( eventOrTransactionId: EventOrTransactionId = EventId("$1234").toEventOrTransactionId(), content: String, + showCompatibilityWarning: Boolean = false, ) = MessageComposerMode.EditCaption( eventOrTransactionId = eventOrTransactionId, - content = content + content = content, + showCaptionCompatibilityWarning = showCompatibilityWarning, ) fun aMessageComposerModeReply( diff --git a/libraries/textcomposer/impl/src/main/kotlin/io/element/android/libraries/textcomposer/model/MessageComposerMode.kt b/libraries/textcomposer/impl/src/main/kotlin/io/element/android/libraries/textcomposer/model/MessageComposerMode.kt index 4ef6cfc019..f698f7ffe9 100644 --- a/libraries/textcomposer/impl/src/main/kotlin/io/element/android/libraries/textcomposer/model/MessageComposerMode.kt +++ b/libraries/textcomposer/impl/src/main/kotlin/io/element/android/libraries/textcomposer/model/MessageComposerMode.kt @@ -18,7 +18,10 @@ import io.element.android.libraries.matrix.ui.messages.reply.eventId sealed interface MessageComposerMode { data object Normal : MessageComposerMode - data class Attachment(val allowCaption: Boolean) : MessageComposerMode + data class Attachment( + val allowCaption: Boolean, + val showCaptionCompatibilityWarning: Boolean, + ) : MessageComposerMode sealed interface Special : MessageComposerMode @@ -29,7 +32,8 @@ sealed interface MessageComposerMode { data class EditCaption( val eventOrTransactionId: EventOrTransactionId, - val content: String + val content: String, + val showCaptionCompatibilityWarning: Boolean, ) : Special data class Reply( @@ -51,3 +55,11 @@ sealed interface MessageComposerMode { replyToDetails.eventContent is MessageContent && (replyToDetails.eventContent as MessageContent).isThreaded } + +fun MessageComposerMode.showCaptionCompatibilityWarning(): Boolean { + return when (this) { + is MessageComposerMode.Attachment -> showCaptionCompatibilityWarning + is MessageComposerMode.EditCaption -> showCaptionCompatibilityWarning && content.isEmpty() + else -> false + } +} diff --git a/libraries/textcomposer/impl/src/main/res/values/localazy.xml b/libraries/textcomposer/impl/src/main/res/values/localazy.xml index e7cbb5da9a..fcc763db30 100644 --- a/libraries/textcomposer/impl/src/main/res/values/localazy.xml +++ b/libraries/textcomposer/impl/src/main/res/values/localazy.xml @@ -4,7 +4,7 @@ "Toggle bullet list" "Close formatting options" "Toggle code block" - "Optional caption…" + "Add a caption" "Message…" "Create a link" "Edit link" From 42a1dd3f533321fe837e4b5aebff54764f2a038b Mon Sep 17 00:00:00 2001 From: ElementBot Date: Mon, 2 Dec 2024 15:33:17 +0000 Subject: [PATCH 2/2] Update screenshots --- ...messages.impl.attachments.preview_AttachmentsView_0_en.png | 4 ++-- ...messages.impl.attachments.preview_AttachmentsView_1_en.png | 4 ++-- ...messages.impl.attachments.preview_AttachmentsView_2_en.png | 4 ++-- ...messages.impl.attachments.preview_AttachmentsView_3_en.png | 4 ++-- ...messages.impl.attachments.preview_AttachmentsView_5_en.png | 3 +++ ...raries.textcomposer_CaptionWarningBottomSheet_Day_0_en.png | 3 +++ ...ries.textcomposer_CaptionWarningBottomSheet_Night_0_en.png | 3 +++ ...libraries.textcomposer_TextComposerAddCaption_Day_0_en.png | 4 ++-- ...braries.textcomposer_TextComposerAddCaption_Night_0_en.png | 4 ++-- .../libraries.textcomposer_TextComposerCaption_Day_0_en.png | 4 ++-- .../libraries.textcomposer_TextComposerCaption_Night_0_en.png | 4 ++-- ...ibraries.textcomposer_TextComposerEditCaption_Day_0_en.png | 4 ++-- ...raries.textcomposer_TextComposerEditCaption_Night_0_en.png | 4 ++-- 13 files changed, 29 insertions(+), 20 deletions(-) create mode 100644 tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_5_en.png create mode 100644 tests/uitests/src/test/snapshots/images/libraries.textcomposer_CaptionWarningBottomSheet_Day_0_en.png create mode 100644 tests/uitests/src/test/snapshots/images/libraries.textcomposer_CaptionWarningBottomSheet_Night_0_en.png diff --git a/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_0_en.png b/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_0_en.png index 1a48fb35cf..d56a5de7d3 100644 --- a/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_0_en.png +++ b/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_0_en.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:2399ee4cd37cbafec07e87bfab90e66ee3df5b6aba602d5cd9bd1114c7365642 -size 397379 +oid sha256:7839db8763b29e38ad67380e09101e48fd3a650080967fb5e51a8bf6411d0427 +size 397423 diff --git a/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_1_en.png b/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_1_en.png index 8510d977be..fb0ca03ea3 100644 --- a/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_1_en.png +++ b/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_1_en.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:3a92cb782d97553f364fab3df3fe159557a26aad8b7e5c176b40616c2f05abdd -size 51410 +oid sha256:2c40163401ccd77a79d314bd373bb09d9b9bd0bd8d0afe281792c19d6fd593d3 +size 51465 diff --git a/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_2_en.png b/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_2_en.png index e799726c52..8c6edbaa98 100644 --- a/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_2_en.png +++ b/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_2_en.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:361ff23fd2ff99aecfdffd10b45e9235d86183d4856cb2a3e99f85b9e04c2d59 -size 51376 +oid sha256:1cba25287c6d2beee594937c3139b3800630379e1b5a552c5cca886f8646bbfe +size 51429 diff --git a/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_3_en.png b/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_3_en.png index df965394aa..350eb73178 100644 --- a/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_3_en.png +++ b/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_3_en.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:efbfed755b29293009f45fca33f58863b612772de9a1d55593c979dbb04ff6f2 -size 88981 +oid sha256:b4f33aa3545c29c25b3c40e6de90772e4e1f0685095429bdbcc4216e9020161c +size 89038 diff --git a/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_5_en.png b/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_5_en.png new file mode 100644 index 0000000000..d56a5de7d3 --- /dev/null +++ b/tests/uitests/src/test/snapshots/images/features.messages.impl.attachments.preview_AttachmentsView_5_en.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:7839db8763b29e38ad67380e09101e48fd3a650080967fb5e51a8bf6411d0427 +size 397423 diff --git a/tests/uitests/src/test/snapshots/images/libraries.textcomposer_CaptionWarningBottomSheet_Day_0_en.png b/tests/uitests/src/test/snapshots/images/libraries.textcomposer_CaptionWarningBottomSheet_Day_0_en.png new file mode 100644 index 0000000000..c8aedb734a --- /dev/null +++ b/tests/uitests/src/test/snapshots/images/libraries.textcomposer_CaptionWarningBottomSheet_Day_0_en.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:9bcb98d543eba3d43a58b9d17f753c65ccbae2df6f6ebf444c2eccae482a7466 +size 18474 diff --git a/tests/uitests/src/test/snapshots/images/libraries.textcomposer_CaptionWarningBottomSheet_Night_0_en.png b/tests/uitests/src/test/snapshots/images/libraries.textcomposer_CaptionWarningBottomSheet_Night_0_en.png new file mode 100644 index 0000000000..2053e6fa75 --- /dev/null +++ b/tests/uitests/src/test/snapshots/images/libraries.textcomposer_CaptionWarningBottomSheet_Night_0_en.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:e77770bc5d582ad53fc1ad7d3d86b8df85e2c0f8fb997145a1c695ca14cf1e93 +size 17258 diff --git a/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerAddCaption_Day_0_en.png b/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerAddCaption_Day_0_en.png index fadf662965..5f3d66edea 100644 --- a/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerAddCaption_Day_0_en.png +++ b/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerAddCaption_Day_0_en.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:97d9c333fdc5684971e22593b246ca2751657691dad90ec89d891379e7a0b47f -size 60161 +oid sha256:8c4220a5d9401d42a905dcf204bd273e8039d77a889209d4eb35de7c384ed05c +size 61113 diff --git a/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerAddCaption_Night_0_en.png b/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerAddCaption_Night_0_en.png index 068ccea0fd..80e866f801 100644 --- a/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerAddCaption_Night_0_en.png +++ b/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerAddCaption_Night_0_en.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:c08a7e954c11ff61a9130c54c0b273a5b8996c9095a4dae07cb4b5bc357fc15f -size 58458 +oid sha256:009a1fc06c9a2e2bc112c4483002b43e9710c5ced3b2668c40c91b7c54d43b30 +size 59382 diff --git a/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerCaption_Day_0_en.png b/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerCaption_Day_0_en.png index b5330db5c9..d284369893 100644 --- a/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerCaption_Day_0_en.png +++ b/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerCaption_Day_0_en.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:1b9b24eafbcaa2143c199a0522fa1aae98d9c7bddb80364602f0662567a2f1a1 -size 56485 +oid sha256:2eb0eaa26e48d182bd3dc78671cb43f02c24ef5f15fb4e6e8b47da2f3d37ce7b +size 56567 diff --git a/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerCaption_Night_0_en.png b/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerCaption_Night_0_en.png index dea84aaa40..101c090e86 100644 --- a/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerCaption_Night_0_en.png +++ b/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerCaption_Night_0_en.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:fc7a5491acff69b64ea73c1a62b7ae9e148ce57768697de2ec280327cd72298d -size 55402 +oid sha256:fcfa2769e764b164375e6f6ef5194ce9ef686b6f76e16848270380a88beb175a +size 55518 diff --git a/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerEditCaption_Day_0_en.png b/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerEditCaption_Day_0_en.png index 82475e58db..17daeade89 100644 --- a/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerEditCaption_Day_0_en.png +++ b/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerEditCaption_Day_0_en.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:1967fa34ef6bd37c373f68badaed4e41b04efbbf929187e6ded4cfb903715325 -size 59539 +oid sha256:4f6f448d800b741e7e59a44b0f660f4702603e394df6223b1d968c862266083e +size 59832 diff --git a/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerEditCaption_Night_0_en.png b/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerEditCaption_Night_0_en.png index db2e4e318d..270f2ab1d1 100644 --- a/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerEditCaption_Night_0_en.png +++ b/tests/uitests/src/test/snapshots/images/libraries.textcomposer_TextComposerEditCaption_Night_0_en.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:430b30b65f5908fce562be613afa41131c4fbe8849db3d3f5a3fa424417469a4 -size 57827 +oid sha256:81bfbaf9030bc40ca6744dd6bf8170243243ebcd98fbc3de71fed85798d60412 +size 58150