diff --git a/app/src/main/kotlin/com/wire/android/ui/common/bottomsheet/MenuBottomSheetItem.kt b/app/src/main/kotlin/com/wire/android/ui/common/bottomsheet/MenuBottomSheetItem.kt index 8ba4ebc7147..41f45c702a7 100644 --- a/app/src/main/kotlin/com/wire/android/ui/common/bottomsheet/MenuBottomSheetItem.kt +++ b/app/src/main/kotlin/com/wire/android/ui/common/bottomsheet/MenuBottomSheetItem.kt @@ -29,12 +29,15 @@ import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size import androidx.compose.foundation.layout.width import androidx.compose.material3.Icon +import androidx.compose.material3.LocalContentColor import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Text import androidx.compose.runtime.Composable +import androidx.compose.runtime.CompositionLocalProvider import androidx.compose.runtime.remember import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color import androidx.compose.ui.res.painterResource import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.tooling.preview.Preview @@ -57,24 +60,27 @@ fun MenuBottomSheetItem( icon: @Composable () -> Unit, action: (@Composable () -> Unit)? = null, clickBlockParams: ClickBlockParams = ClickBlockParams(), + itemProvidedColor: Color = MaterialTheme.colorScheme.secondary, onItemClick: () -> Unit = {} ) { - val clickable = remember(onItemClick, clickBlockParams) { Clickable(clickBlockParams = clickBlockParams, onClick = onItemClick) } - Row( - verticalAlignment = Alignment.CenterVertically, - modifier = Modifier - .defaultMinSize(minHeight = MaterialTheme.wireDimensions.conversationBottomSheetItemHeight) - .fillMaxWidth() - .clickable(clickable) - .padding(MaterialTheme.wireDimensions.conversationBottomSheetItemPadding) - ) { - icon() - Spacer(modifier = Modifier.width(12.dp)) - MenuItemTitle(title = title) - if (action != null) { - Spacer(modifier = Modifier.width(MaterialTheme.wireDimensions.spacing12x)) - Spacer(modifier = Modifier.weight(1f)) // combining both in one modifier doesn't work - action() + CompositionLocalProvider(LocalContentColor provides itemProvidedColor) { + val clickable = remember(onItemClick, clickBlockParams) { Clickable(clickBlockParams = clickBlockParams, onClick = onItemClick) } + Row( + verticalAlignment = Alignment.CenterVertically, + modifier = Modifier + .defaultMinSize(minHeight = MaterialTheme.wireDimensions.conversationBottomSheetItemHeight) + .fillMaxWidth() + .clickable(clickable) + .padding(MaterialTheme.wireDimensions.conversationBottomSheetItemPadding) + ) { + icon() + Spacer(modifier = Modifier.width(12.dp)) + MenuItemTitle(title = title) + if (action != null) { + Spacer(modifier = Modifier.width(MaterialTheme.wireDimensions.spacing12x)) + Spacer(modifier = Modifier.weight(1f)) // combining both in one modifier doesn't work + action() + } } } } diff --git a/app/src/main/kotlin/com/wire/android/ui/common/bottomsheet/ModalSheetHeaderItem.kt b/app/src/main/kotlin/com/wire/android/ui/common/bottomsheet/ModalSheetHeaderItem.kt index b0372d52524..4685573db52 100644 --- a/app/src/main/kotlin/com/wire/android/ui/common/bottomsheet/ModalSheetHeaderItem.kt +++ b/app/src/main/kotlin/com/wire/android/ui/common/bottomsheet/ModalSheetHeaderItem.kt @@ -25,9 +25,11 @@ import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.width +import androidx.compose.material3.LocalContentColor import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Text import androidx.compose.runtime.Composable +import androidx.compose.runtime.CompositionLocalProvider import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.unit.Dp @@ -40,22 +42,25 @@ fun ModalSheetHeaderItem(header: MenuModalSheetHeader = MenuModalSheetHeader.Gon MenuModalSheetHeader.Gone -> { Spacer(modifier = Modifier.height(dimensions().modalBottomSheetNoHeaderVerticalPadding)) } + is MenuModalSheetHeader.Visible -> { - Row( - verticalAlignment = Alignment.CenterVertically, - modifier = Modifier.padding( - start = dimensions().modalBottomSheetHeaderHorizontalPadding, - end = dimensions().modalBottomSheetHeaderHorizontalPadding, - top = dimensions().modalBottomSheetHeaderVerticalPadding, - bottom = header.customBottomPadding ?: dimensions().modalBottomSheetHeaderVerticalPadding - ) - ) { - header.leadingIcon() - Spacer(modifier = Modifier.width(dimensions().spacing8x)) - Text( - text = header.title, - style = MaterialTheme.wireTypography.title02 - ) + CompositionLocalProvider(LocalContentColor provides MaterialTheme.colorScheme.secondary) { + Row( + verticalAlignment = Alignment.CenterVertically, + modifier = Modifier.padding( + start = dimensions().modalBottomSheetHeaderHorizontalPadding, + end = dimensions().modalBottomSheetHeaderHorizontalPadding, + top = dimensions().modalBottomSheetHeaderVerticalPadding, + bottom = header.customBottomPadding ?: dimensions().modalBottomSheetHeaderVerticalPadding + ) + ) { + header.leadingIcon() + Spacer(modifier = Modifier.width(dimensions().spacing8x)) + Text( + text = header.title, + style = MaterialTheme.wireTypography.title02 + ) + } } } } @@ -63,7 +68,7 @@ fun ModalSheetHeaderItem(header: MenuModalSheetHeader = MenuModalSheetHeader.Gon sealed class MenuModalSheetHeader { - data class Visible ( + data class Visible( val title: String, val leadingIcon: @Composable () -> Unit = {}, val customBottomPadding: Dp? = null diff --git a/app/src/main/kotlin/com/wire/android/ui/common/bottomsheet/conversation/HomeSheetContent.kt b/app/src/main/kotlin/com/wire/android/ui/common/bottomsheet/conversation/HomeSheetContent.kt index 0484559490c..03c5034a7d3 100644 --- a/app/src/main/kotlin/com/wire/android/ui/common/bottomsheet/conversation/HomeSheetContent.kt +++ b/app/src/main/kotlin/com/wire/android/ui/common/bottomsheet/conversation/HomeSheetContent.kt @@ -24,10 +24,8 @@ import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.size import androidx.compose.material.Text -import androidx.compose.material3.LocalContentColor import androidx.compose.material3.MaterialTheme import androidx.compose.runtime.Composable -import androidx.compose.runtime.CompositionLocalProvider import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.res.stringResource @@ -164,102 +162,98 @@ internal fun ConversationMainSheetContent( conversationSheetContent.conversationId, conversationSheetContent.title, conversationSheetContent.conversationTypeDetail - ) + ) ) } ) } if (conversationSheetContent.canBlockUser()) { add { - CompositionLocalProvider(LocalContentColor provides MaterialTheme.colorScheme.error) { - MenuBottomSheetItem( - icon = { - MenuItemIcon( - id = R.drawable.ic_block, - contentDescription = stringResource(R.string.content_description_block_the_user), - ) - }, - title = stringResource(R.string.label_block), - clickBlockParams = ClickBlockParams(blockWhenSyncing = true, blockWhenConnecting = true), - onItemClick = { - blockUserClick( - BlockUserDialogState( - userName = conversationSheetContent.title, - userId = (conversationSheetContent.conversationTypeDetail as ConversationTypeDetail.Private).userId - ) + MenuBottomSheetItem( + icon = { + MenuItemIcon( + id = R.drawable.ic_block, + contentDescription = stringResource(R.string.content_description_block_the_user), + ) + }, + itemProvidedColor = MaterialTheme.colorScheme.error, + title = stringResource(R.string.label_block), + clickBlockParams = ClickBlockParams(blockWhenSyncing = true, blockWhenConnecting = true), + onItemClick = { + blockUserClick( + BlockUserDialogState( + userName = conversationSheetContent.title, + userId = (conversationSheetContent.conversationTypeDetail as ConversationTypeDetail.Private).userId ) - } - ) - } + ) + } + ) } } if (conversationSheetContent.canUnblockUser()) { add { - CompositionLocalProvider(LocalContentColor provides MaterialTheme.colorScheme.onBackground) { - MenuBottomSheetItem( - icon = { - MenuItemIcon( - id = R.drawable.ic_block, - contentDescription = stringResource(R.string.content_description_unblock_the_user) - ) - }, - title = stringResource(R.string.label_unblock), - onItemClick = { - unblockUserClick( - UnblockUserDialogState( - userName = conversationSheetContent.title, - userId = (conversationSheetContent.conversationTypeDetail as ConversationTypeDetail.Private).userId - ) + MenuBottomSheetItem( + icon = { + MenuItemIcon( + id = R.drawable.ic_block, + contentDescription = stringResource(R.string.content_description_unblock_the_user) + ) + }, + itemProvidedColor = MaterialTheme.colorScheme.onBackground, + title = stringResource(R.string.label_unblock), + onItemClick = { + unblockUserClick( + UnblockUserDialogState( + userName = conversationSheetContent.title, + userId = (conversationSheetContent.conversationTypeDetail as ConversationTypeDetail.Private).userId ) - } - ) - } + ) + } + ) } } if (conversationSheetContent.canLeaveTheGroup()) { add { - CompositionLocalProvider(LocalContentColor provides MaterialTheme.colorScheme.error) { - MenuBottomSheetItem( - icon = { - MenuItemIcon( - id = R.drawable.ic_leave, - contentDescription = stringResource(R.string.content_description_leave_the_group), - ) - }, - title = stringResource(R.string.label_leave_group), - onItemClick = { - leaveGroup( - GroupDialogState( - conversationSheetContent.conversationId, - conversationSheetContent.title - ) + MenuBottomSheetItem( + icon = { + MenuItemIcon( + id = R.drawable.ic_leave, + contentDescription = stringResource(R.string.content_description_leave_the_group), + ) + }, + itemProvidedColor = MaterialTheme.colorScheme.error, + title = stringResource(R.string.label_leave_group), + onItemClick = { + leaveGroup( + GroupDialogState( + conversationSheetContent.conversationId, + conversationSheetContent.title ) - } - ) - } + ) + } + ) } } if (conversationSheetContent.canDeleteGroup()) { add { - CompositionLocalProvider(LocalContentColor provides MaterialTheme.colorScheme.error) { - MenuBottomSheetItem( - icon = { - MenuItemIcon( - id = R.drawable.ic_remove, - contentDescription = stringResource(R.string.content_description_delete_the_group), - ) - }, - title = stringResource(R.string.label_delete_group), - onItemClick = { - deleteGroup( - GroupDialogState( - conversationSheetContent.conversationId, - conversationSheetContent.title - ) + MenuBottomSheetItem( + icon = { + MenuItemIcon( + id = R.drawable.ic_remove, + contentDescription = stringResource(R.string.content_description_delete_the_group), + ) + }, + title = stringResource(R.string.label_delete_group), + itemProvidedColor = MaterialTheme.colorScheme.error, + onItemClick = { + deleteGroup( + GroupDialogState( + conversationSheetContent.conversationId, + conversationSheetContent.title ) - } - ) - } + ) + } + ) } } } diff --git a/app/src/main/kotlin/com/wire/android/ui/edit/DownloadAssetExternallyOption.kt b/app/src/main/kotlin/com/wire/android/ui/edit/DownloadAssetExternallyOption.kt new file mode 100644 index 00000000000..775db8189df --- /dev/null +++ b/app/src/main/kotlin/com/wire/android/ui/edit/DownloadAssetExternallyOption.kt @@ -0,0 +1,38 @@ +/* + * Wire + * Copyright (C) 2023 Wire Swiss GmbH + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, see http://www.gnu.org/licenses/. + */ + +package com.wire.android.ui.edit + +import androidx.compose.runtime.Composable +import androidx.compose.ui.res.stringResource +import com.wire.android.R +import com.wire.android.ui.common.bottomsheet.MenuBottomSheetItem +import com.wire.android.ui.common.bottomsheet.MenuItemIcon + +@Composable +fun DownloadAssetExternallyOption(onDownloadClick: () -> Unit) = + MenuBottomSheetItem( + icon = { + MenuItemIcon( + id = R.drawable.ic_download, + contentDescription = stringResource(R.string.content_description_download_icon), + ) + }, + title = stringResource(R.string.label_download), + onItemClick = onDownloadClick + ) diff --git a/app/src/main/kotlin/com/wire/android/ui/edit/ReactionOption.kt b/app/src/main/kotlin/com/wire/android/ui/edit/ReactionOption.kt index b55b1ab4082..500db5e6c27 100644 --- a/app/src/main/kotlin/com/wire/android/ui/edit/ReactionOption.kt +++ b/app/src/main/kotlin/com/wire/android/ui/edit/ReactionOption.kt @@ -12,6 +12,7 @@ import androidx.compose.material3.ButtonDefaults import androidx.compose.material3.ExperimentalMaterial3Api import androidx.compose.material3.Icon import androidx.compose.material3.IconButton +import androidx.compose.material3.LocalContentColor import androidx.compose.material3.LocalMinimumTouchTargetEnforcement import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Text @@ -37,58 +38,61 @@ fun ReactionOption( onReactionClick: (emoji: String) -> Unit, emojiFontSize: TextUnit = 28.sp ) { - Column { - Row { - Spacer(modifier = Modifier.width(dimensions().spacing8x)) - Text( - ("${stringResource(R.string.label_reactions)} ${stringResource(id = R.string.label_more_comming_soon)}").uppercase(), - style = MaterialTheme.wireTypography.label01 - ) - } - Row( - modifier = Modifier.fillMaxWidth(), - verticalAlignment = Alignment.CenterVertically, - ) { - listOf("❤ī¸", "👍", "😁", "🙂", "☚ī¸", "👎").forEach { emoji -> - CompositionLocalProvider( - LocalMinimumTouchTargetEnforcement provides false - ) { - Button( - onClick = { - // TODO remove when all emojis will be available - if (emoji == "❤ī¸") { - // So we display the pretty emoji, - // but we match the ugly one sent from other platforms - val correctedEmoji = "❤" - onReactionClick(correctedEmoji) - } - }, - modifier = Modifier - .defaultMinSize(minWidth = 1.dp, minHeight = 1.dp) - // TODO remove when all emojis will be available - .alpha(if (emoji == "❤ī¸") 1F else 0.3F), - contentPadding = PaddingValues(dimensions().spacing8x), - colors = ButtonDefaults.buttonColors( - containerColor = MaterialTheme.wireColorScheme.surface, - contentColor = MaterialTheme.wireColorScheme.secondaryButtonSelectedOutline - ) + + CompositionLocalProvider(LocalContentColor provides MaterialTheme.colorScheme.secondary) { + Column { + Row { + Spacer(modifier = Modifier.width(dimensions().spacing8x)) + Text( + ("${stringResource(R.string.label_reactions)} ${stringResource(id = R.string.label_more_comming_soon)}").uppercase(), + style = MaterialTheme.wireTypography.label01 + ) + } + Row( + modifier = Modifier.fillMaxWidth(), + verticalAlignment = Alignment.CenterVertically, + ) { + listOf("❤ī¸", "👍", "😁", "🙂", "☚ī¸", "👎").forEach { emoji -> + CompositionLocalProvider( + LocalMinimumTouchTargetEnforcement provides false ) { - Text(emoji, style = TextStyle(fontSize = emojiFontSize)) + Button( + onClick = { + // TODO remove when all emojis will be available + if (emoji == "❤ī¸") { + // So we display the pretty emoji, + // but we match the ugly one sent from other platforms + val correctedEmoji = "❤" + onReactionClick(correctedEmoji) + } + }, + modifier = Modifier + .defaultMinSize(minWidth = 1.dp, minHeight = 1.dp) + // TODO remove when all emojis will be available + .alpha(if (emoji == "❤ī¸") 1F else 0.3F), + contentPadding = PaddingValues(dimensions().spacing8x), + colors = ButtonDefaults.buttonColors( + containerColor = MaterialTheme.wireColorScheme.surface, + contentColor = MaterialTheme.wireColorScheme.secondaryButtonSelectedOutline + ) + ) { + Text(emoji, style = TextStyle(fontSize = emojiFontSize)) + } } } - } - IconButton( - onClick = { - // TODO show more emojis - }, - modifier = Modifier - // TODO remove when all emojis will be available - .alpha(0.1F), - ) { - Icon( - painter = painterResource(id = R.drawable.ic_more_emojis), - contentDescription = stringResource(R.string.content_description_more_emojis) - ) + IconButton( + onClick = { + // TODO show more emojis + }, + modifier = Modifier + // TODO remove when all emojis will be available + .alpha(0.1F), + ) { + Icon( + painter = painterResource(id = R.drawable.ic_more_emojis), + contentDescription = stringResource(R.string.content_description_more_emojis) + ) + } } } } diff --git a/app/src/main/kotlin/com/wire/android/ui/home/conversations/edit/EditMessageMenuItems.kt b/app/src/main/kotlin/com/wire/android/ui/home/conversations/edit/EditMessageMenuItems.kt index 3180a8c80ce..2f4589fbbb1 100644 --- a/app/src/main/kotlin/com/wire/android/ui/home/conversations/edit/EditMessageMenuItems.kt +++ b/app/src/main/kotlin/com/wire/android/ui/home/conversations/edit/EditMessageMenuItems.kt @@ -20,10 +20,8 @@ package com.wire.android.ui.home.conversations.edit -import androidx.compose.material3.LocalContentColor import androidx.compose.material3.MaterialTheme import androidx.compose.runtime.Composable -import androidx.compose.runtime.CompositionLocalProvider import androidx.compose.runtime.remember import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.res.stringResource @@ -158,18 +156,17 @@ fun EditMessageMenuItems( } } add { - CompositionLocalProvider(LocalContentColor provides MaterialTheme.colorScheme.error) { - MenuBottomSheetItem( - icon = { - MenuItemIcon( - id = R.drawable.ic_delete, - contentDescription = stringResource(R.string.content_description_delete_the_message), - ) - }, - title = stringResource(R.string.label_delete), - onItemClick = onDeleteItemClick - ) - } + MenuBottomSheetItem( + icon = { + MenuItemIcon( + id = R.drawable.ic_delete, + contentDescription = stringResource(R.string.content_description_delete_the_message), + ) + }, + itemProvidedColor = MaterialTheme.colorScheme.error, + title = stringResource(R.string.label_delete), + onItemClick = onDeleteItemClick + ) } } } diff --git a/app/src/main/kotlin/com/wire/android/ui/home/gallery/MediaGalleryScreen.kt b/app/src/main/kotlin/com/wire/android/ui/home/gallery/MediaGalleryScreen.kt index 50199928a52..dc8973fa102 100644 --- a/app/src/main/kotlin/com/wire/android/ui/home/gallery/MediaGalleryScreen.kt +++ b/app/src/main/kotlin/com/wire/android/ui/home/gallery/MediaGalleryScreen.kt @@ -48,6 +48,7 @@ import com.wire.android.ui.common.bottomsheet.MenuItemIcon import com.wire.android.ui.common.bottomsheet.MenuModalSheetLayout import com.wire.android.ui.common.colorsScheme import com.wire.android.ui.common.snackbar.SwipeDismissSnackbarHost +import com.wire.android.ui.edit.DownloadAssetExternallyOption import com.wire.android.ui.edit.MessageDetailsMenuOption import com.wire.android.ui.edit.ReactionOption import com.wire.android.ui.edit.ReplyMessageOption @@ -190,19 +191,8 @@ fun EditGalleryMenuItems( add { ReactionOption(onReactionClick = onReactionClick) } add { MessageDetailsMenuOption(onMessageDetailsClick = onMessageDetails) } add { ReplyMessageOption(onReplyItemClick = onImageReplied) } + add { DownloadAssetExternallyOption(onDownloadClick = onDownloadImage) } add { - CompositionLocalProvider(LocalContentColor provides MaterialTheme.colorScheme.secondary) { - MenuBottomSheetItem( - icon = { - MenuItemIcon( - id = R.drawable.ic_download, - contentDescription = stringResource(R.string.content_description_download_icon), - ) - }, - title = stringResource(R.string.label_download), - onItemClick = onDownloadImage - ) - } CompositionLocalProvider(LocalContentColor provides MaterialTheme.colorScheme.secondary) { MenuBottomSheetItem( icon = {