From f3632854ad34f1ba5b8695d81c368abe05bb4ad3 Mon Sep 17 00:00:00 2001 From: AbronStudio Date: Thu, 7 Aug 2025 11:18:09 +0330 Subject: [PATCH 1/6] Refactor: Enhance ChannelIcon and ChannelSideDrawer UI This commit improves the UI of the ChannelIcon and ChannelSideDrawer components by adding background styling and padding to the ChannelIcon for SavedMessages. Additionally, it introduces a FloatingActionButton in the ChannelSideDrawer for quick navigation to the Friends screen, enhancing user experience. - Updated ChannelIcon to include a circular background and padding for SavedMessages. - Added FloatingActionButton in ChannelSideDrawer for navigating to Friends screen. - Updated string resource for channel notes to "Saved Notes". --- .../composables/screens/chat/ChannelIcon.kt | 27 +- .../screens/chat/drawer/ChannelSideDrawer.kt | 732 +++++++++--------- .../revolt/screens/chat/ChatRouterScreen.kt | 1 - .../main/res/drawable/icn_message_24dp.xml | 11 + app/src/main/res/values/strings.xml | 3 +- 5 files changed, 402 insertions(+), 372 deletions(-) create mode 100644 app/src/main/res/drawable/icn_message_24dp.xml diff --git a/app/src/main/java/chat/revolt/composables/screens/chat/ChannelIcon.kt b/app/src/main/java/chat/revolt/composables/screens/chat/ChannelIcon.kt index 59e00931..87dd0907 100644 --- a/app/src/main/java/chat/revolt/composables/screens/chat/ChannelIcon.kt +++ b/app/src/main/java/chat/revolt/composables/screens/chat/ChannelIcon.kt @@ -1,13 +1,21 @@ package chat.revolt.composables.screens.chat +import androidx.compose.foundation.background +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.shape.CircleShape import androidx.compose.material3.Icon +import androidx.compose.material3.MaterialTheme import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.tooling.preview.PreviewParameter import androidx.compose.ui.tooling.preview.PreviewParameterProvider +import androidx.compose.ui.unit.dp import chat.revolt.R import chat.revolt.api.schemas.ChannelType @@ -31,11 +39,20 @@ fun ChannelIcon(channelType: ChannelType, modifier: Modifier = Modifier) { } ChannelType.SavedMessages -> { - Icon( - painter = painterResource(R.drawable.icn_note_stack_24dp), - contentDescription = stringResource(R.string.channel_notes), - modifier = modifier - ) + Box( + modifier = Modifier + .clip(CircleShape) + .size(32.dp) + .background(MaterialTheme.colorScheme.secondaryContainer) + ) { + Icon( + painter = painterResource(R.drawable.icn_note_stack_24dp), + contentDescription = stringResource(R.string.channel_notes), + modifier = modifier + .padding(6.dp) + + ) + } } ChannelType.DirectMessage -> { diff --git a/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt b/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt index 65bd40fc..122d961d 100644 --- a/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt +++ b/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt @@ -35,7 +35,14 @@ import androidx.compose.foundation.lazy.rememberLazyListState import androidx.compose.foundation.shape.CircleShape import androidx.compose.foundation.shape.CornerSize import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material.icons.Icons +import androidx.compose.material.icons.filled.Add +import androidx.compose.material.icons.filled.Close import androidx.compose.material3.ExperimentalMaterial3Api +import androidx.compose.material3.ExperimentalMaterial3ExpressiveApi +import androidx.compose.material3.FloatingActionButton +import androidx.compose.material3.FloatingActionButtonMenu +import androidx.compose.material3.FloatingActionButtonMenuItem import androidx.compose.material3.HorizontalDivider import androidx.compose.material3.Icon import androidx.compose.material3.IconButton @@ -43,6 +50,9 @@ import androidx.compose.material3.LocalContentColor import androidx.compose.material3.MaterialTheme import androidx.compose.material3.ModalBottomSheet import androidx.compose.material3.Text +import androidx.compose.material3.ToggleFloatingActionButton +import androidx.compose.material3.ToggleFloatingActionButtonDefaults.animateIcon +import androidx.compose.material3.animateFloatingActionButton import androidx.compose.material3.rememberModalBottomSheetState import androidx.compose.runtime.Composable import androidx.compose.runtime.CompositionLocalProvider @@ -60,9 +70,13 @@ import androidx.compose.ui.draw.drawBehind import androidx.compose.ui.geometry.Offset import androidx.compose.ui.graphics.Brush import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.vector.rememberVectorPainter import androidx.compose.ui.layout.ContentScale import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource +import androidx.compose.ui.semantics.isTraversalGroup +import androidx.compose.ui.semantics.semantics +import androidx.compose.ui.semantics.traversalIndex import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.text.style.TextOverflow @@ -73,7 +87,6 @@ import chat.revolt.api.RevoltAPI import chat.revolt.api.internals.CategorisedChannelList import chat.revolt.api.internals.ChannelUtils import chat.revolt.api.internals.DirectMessages -import chat.revolt.api.internals.FriendRequests import chat.revolt.api.schemas.Category import chat.revolt.api.schemas.Channel import chat.revolt.api.schemas.ChannelType @@ -93,13 +106,14 @@ import chat.revolt.composables.screens.chat.discover.DiscoverServersList import chat.revolt.screens.chat.ChatRouterDestination import chat.revolt.sheets.ChannelContextSheet -@OptIn(ExperimentalMaterial3Api::class, ExperimentalFoundationApi::class) +@OptIn(ExperimentalMaterial3Api::class, ExperimentalFoundationApi::class, + ExperimentalMaterial3ExpressiveApi::class +) @Composable fun ChannelSideDrawer( currentServer: String?, currentDestination: ChatRouterDestination, onDestinationChanged: (ChatRouterDestination) -> Unit, - onLongPressAvatar: () -> Unit, navigateToServer: (String) -> Unit, onShowServerContextSheet: (String) -> Unit, showSettingsIcon: Boolean, @@ -183,372 +197,388 @@ fun ChannelSideDrawer( } } - Row(modifier.fillMaxSize()) { - LazyColumn( - Modifier.width(64.dp), - verticalArrangement = Arrangement.spacedBy(6.dp), - horizontalAlignment = Alignment.CenterHorizontally, - ) { - stickyHeader(key = "self") { - Column(Modifier.background(MaterialTheme.colorScheme.background)) { - UserAvatar( - username = RevoltAPI.userCache[RevoltAPI.selfId]?.let { - User.resolveDefaultName( - it + + + Box { + Row(modifier.fillMaxSize()) { + LazyColumn( + Modifier.width(64.dp), + verticalArrangement = Arrangement.spacedBy(6.dp), + horizontalAlignment = Alignment.CenterHorizontally, + ) { + stickyHeader(key = "self") { + Column(Modifier.background(MaterialTheme.colorScheme.background)) { + Box( + Modifier + .padding(8.dp) + .clip(RoundedCornerShape(16.dp)) + .clickable { + onDestinationChanged(ChatRouterDestination.Home) + } + .size(48.dp) + .background(MaterialTheme.colorScheme.secondaryContainer), + contentAlignment = Alignment.Center + ) { + Icon( + painter = painterResource(R.drawable.ic_message_text_24dp), + contentDescription = stringResource(R.string.discover_alt) ) } - ?: "", - presence = presenceFromStatus( - RevoltAPI.userCache[RevoltAPI.selfId]?.status?.presence, - RevoltAPI.userCache[RevoltAPI.selfId]?.online ?: false - ), - userId = RevoltAPI.selfId ?: "", - avatar = RevoltAPI.userCache[RevoltAPI.selfId]?.avatar, - size = 48.dp, - presenceSize = 16.dp, - onClick = { - onDestinationChanged(ChatRouterDestination.Home) - }, - onLongClick = onLongPressAvatar, - modifier = Modifier - .padding(8.dp) - .size(48.dp) - ) + } } - } - items( - DirectMessages.unreadDMs().size, - key = { DirectMessages.unreadDMs()[it].id ?: it } - ) { - val dm = DirectMessages.unreadDMs()[it] - when (dm.channelType) { - ChannelType.Group -> GroupIcon( - name = dm.name ?: "?", - size = 48.dp, - onClick = { - dm.id?.let { id -> - onDestinationChanged(ChatRouterDestination.Channel(id)) - } - }, - icon = dm.icon, - modifier = Modifier - .padding(8.dp) - .size(48.dp) - ) - - else -> { - val partner = - if (dm.channelType == ChannelType.DirectMessage) { - RevoltAPI.userCache[ - ChannelUtils.resolveDMPartner( - dm - ) - ] - } else { - null - } - - UserAvatar( - username = partner?.let { p -> - User.resolveDefaultName( - p - ) - } ?: dm.name ?: "?", - presence = presenceFromStatus( - partner?.status?.presence, - partner?.online ?: false - ), - userId = partner?.id ?: dm.id ?: "", - avatar = partner?.avatar ?: dm.icon, + items( + count = DirectMessages.unreadDMs().size, + key = { DirectMessages.unreadDMs()[it].id ?: it } + ) { + val dm = DirectMessages.unreadDMs()[it] + when (dm.channelType) { + ChannelType.Group -> GroupIcon( + name = dm.name ?: "?", size = 48.dp, - presenceSize = 16.dp, onClick = { dm.id?.let { id -> onDestinationChanged(ChatRouterDestination.Channel(id)) } }, + icon = dm.icon, modifier = Modifier .padding(8.dp) .size(48.dp) ) - } - } - } - item(key = "divider") { - HorizontalDivider( - Modifier - .fillMaxWidth() - .padding(horizontal = 8.dp) - ) - } + else -> { + val partner = + if (dm.channelType == ChannelType.DirectMessage) { + RevoltAPI.userCache[ + ChannelUtils.resolveDMPartner( + dm + ) + ] + } else { + null + } - - item(key = "discover") { - Box( - Modifier - .padding(8.dp) - .clip(RoundedCornerShape(16.dp)) - .clickable { - onDestinationChanged( - ChatRouterDestination.Discover - ) - } - .size(48.dp) - .background(MaterialTheme.colorScheme.onPrimary), - contentAlignment = Alignment.Center - ) { - Icon( - painter = painterResource(R.drawable.icn_explore_24dp), - contentDescription = stringResource(R.string.discover_alt) - ) - } - } - - item(key = "add_server") { - Box( - Modifier - .padding(8.dp) - .clip(CircleShape) - .clickable { - onShowAddServerSheet() - } - .size(48.dp) - .background(MaterialTheme.colorScheme.onPrimary), - contentAlignment = Alignment.Center - ) { - Icon( - painter = painterResource(R.drawable.icn_add_24dp), - contentDescription = stringResource(R.string.server_plus_alt) - ) - } - } - - items( - serverList.size, - key = { serverList[it].id ?: it } - ) { - val serverInList = serverList[it] - val serverHasUnread = - serverInList.id?.let { srvId -> RevoltAPI.unreads.serverHasUnread(srvId) } - ?: false - val leftIndicatorHeight = animateDpAsState( - targetValue = if (serverInList.id == currentServer) 32.dp - else if (serverHasUnread) 8.dp - else 0.dp, - animationSpec = spring( - dampingRatio = Spring.DampingRatioMediumBouncy, - stiffness = Spring.StiffnessLow - ), label = "Left indicator width" - ) - val leftIndicatorColour = animateColorAsState( - targetValue = - if (serverInList.id == currentServer) - MaterialTheme.colorScheme.primary - else if (serverHasUnread) - MaterialTheme.colorScheme.onSurfaceVariant - else - Color.Transparent, - animationSpec = spring( - dampingRatio = Spring.DampingRatioMediumBouncy, - stiffness = Spring.StiffnessLow - ), - label = "Left indicator colour" - ) - - Box(Modifier.fillMaxWidth()) { - Box( - Modifier - .padding(8.dp) - .clip(CircleShape) - .clickable { - serverInList.id?.let { srvId -> navigateToServer(srvId) } - }) { - val icon = serverInList.icon?.id?.let { iconId -> - "${RevoltAPI.getCurrentFilesUrl()}/icons/$iconId" - } - if (icon != null) { - RemoteImage( - url = icon, - allowAnimation = false, + UserAvatar( + username = partner?.let { p -> + User.resolveDefaultName( + p + ) + } ?: dm.name ?: "?", + presence = presenceFromStatus( + partner?.status?.presence, + partner?.online ?: false + ), + userId = partner?.id ?: dm.id ?: "", + avatar = partner?.avatar ?: dm.icon, + size = 48.dp, + presenceSize = 16.dp, + onClick = { + dm.id?.let { id -> + onDestinationChanged(ChatRouterDestination.Channel(id)) + } + }, modifier = Modifier + .padding(8.dp) .size(48.dp) - .clip(CircleShape), - description = serverInList.name ?: stringResource(R.string.unknown) - ) - } else { - IconPlaceholder( - name = serverInList.name ?: stringResource(R.string.unknown), - modifier = Modifier - .size(48.dp) - .clip(CircleShape) ) } } + } - Box( + item(key = "divider") { + HorizontalDivider( Modifier - .height(leftIndicatorHeight.value) - .width(8.dp) - .offset(x = (-4).dp) - .clip(CircleShape) - .background(leftIndicatorColour.value) - .align(Alignment.CenterStart) + .fillMaxWidth() + .padding(horizontal = 8.dp) ) } - } - if (showSettingsIcon) { - item(key = "settings") { + + item(key = "discover") { Box( Modifier .padding(8.dp) - .clip(CircleShape) + .clip(RoundedCornerShape(16.dp)) .clickable { - onOpenSettings() + onDestinationChanged( + ChatRouterDestination.Discover + ) } - .size(48.dp), + .size(48.dp) + .background(MaterialTheme.colorScheme.onPrimary), contentAlignment = Alignment.Center ) { Icon( - painter = painterResource(R.drawable.icn_settings_24dp), - contentDescription = stringResource(R.string.settings) + painter = painterResource(R.drawable.icn_explore_24dp), + contentDescription = stringResource(R.string.discover_alt) + ) + } + } + + item(key = "add_server") { + Box( + Modifier + .padding(8.dp) + .clip(CircleShape) + .clickable { + onShowAddServerSheet() + } + .size(48.dp) + .background(MaterialTheme.colorScheme.onPrimary), + contentAlignment = Alignment.Center + ) { + Icon( + painter = painterResource(R.drawable.icn_add_24dp), + contentDescription = stringResource(R.string.server_plus_alt) + ) + } + } + + items( + serverList.size, + key = { serverList[it].id ?: it } + ) { + val serverInList = serverList[it] + val serverHasUnread = + serverInList.id?.let { srvId -> RevoltAPI.unreads.serverHasUnread(srvId) } + ?: false + val leftIndicatorHeight = animateDpAsState( + targetValue = if (serverInList.id == currentServer) 32.dp + else if (serverHasUnread) 8.dp + else 0.dp, + animationSpec = spring( + dampingRatio = Spring.DampingRatioMediumBouncy, + stiffness = Spring.StiffnessLow + ), label = "Left indicator width" + ) + val leftIndicatorColour = animateColorAsState( + targetValue = + if (serverInList.id == currentServer) + MaterialTheme.colorScheme.primary + else if (serverHasUnread) + MaterialTheme.colorScheme.onSurfaceVariant + else + Color.Transparent, + animationSpec = spring( + dampingRatio = Spring.DampingRatioMediumBouncy, + stiffness = Spring.StiffnessLow + ), + label = "Left indicator colour" + ) + + Box(Modifier.fillMaxWidth()) { + Box( + Modifier + .padding(8.dp) + .clip(CircleShape) + .clickable { + serverInList.id?.let { srvId -> navigateToServer(srvId) } + }) { + val icon = serverInList.icon?.id?.let { iconId -> + "${RevoltAPI.getCurrentFilesUrl()}/icons/$iconId" + } + if (icon != null) { + RemoteImage( + url = icon, + allowAnimation = false, + modifier = Modifier + .size(48.dp) + .clip(CircleShape), + description = serverInList.name + ?: stringResource(R.string.unknown) + ) + } else { + IconPlaceholder( + name = serverInList.name ?: stringResource(R.string.unknown), + modifier = Modifier + .size(48.dp) + .clip(CircleShape) + ) + } + } + + Box( + Modifier + .height(leftIndicatorHeight.value) + .width(8.dp) + .offset(x = (-4).dp) + .clip(CircleShape) + .background(leftIndicatorColour.value) + .align(Alignment.CenterStart) + ) + } + } + + if (showSettingsIcon) { + item(key = "settings") { + Box( + Modifier + .padding(8.dp) + .clip(CircleShape) + .clickable { + onOpenSettings() + } + .size(48.dp), + contentAlignment = Alignment.Center + ) { + Icon( + painter = painterResource(R.drawable.icn_settings_24dp), + contentDescription = stringResource(R.string.settings) + ) + } + } + } + } + Column( + Modifier + .clip(shape = RoundedCornerShape(topStart = 24.dp)) + .background(color = MaterialTheme.colorScheme.surfaceContainer) + .weight(weight = 1f) + .fillMaxHeight() + ) { + Box( + Modifier + .height(serverBannerHeight) + ) { + if (server?.banner != null) { + RemoteImage( + url = "${RevoltAPI.getCurrentFilesUrl()}/banners/${server.banner.id}", + description = null, + contentScale = ContentScale.Crop, + modifier = Modifier + .fillMaxSize() + ) + + with(MaterialTheme.colorScheme) { + Box( + Modifier + .fillMaxSize() + .drawBehind { + drawRect( + Brush.linearGradient( + listOf( + Color.Black.copy(alpha = 0.6f), + Color.Transparent + ), + Offset.Zero, + Offset.Infinite.copy(x = 0f) + ), + ) + }) + } + } + + Row( + Modifier + .padding(16.dp), + verticalAlignment = Alignment.CenterVertically + ) { + CompositionLocalProvider( + LocalContentColor provides + if (server?.banner != null) Color.White + else LocalContentColor.current + ) { + Row( + Modifier.weight(1f), + verticalAlignment = Alignment.CenterVertically, + horizontalArrangement = Arrangement.spacedBy(8.dp) + ) { + if (server?.flags has ServerFlags.Official) { + Icon( + painter = painterResource( + id = R.drawable.ic_revolt_decagram_24dp + ), + contentDescription = stringResource( + R.string.server_flag_official + ), + tint = LocalContentColor.current, + modifier = Modifier + .size(24.dp) + ) + } + if (server?.flags has ServerFlags.Verified) { + Icon( + painter = painterResource( + id = R.drawable.ic_check_decagram_24dp + ), + contentDescription = stringResource( + R.string.server_flag_verified + ), + tint = LocalContentColor.current, + modifier = Modifier + .size(24.dp) + ) + } + + Text( + text = when (currentServer) { + null -> stringResource(if (currentDestination is ChatRouterDestination.Discover) R.string.discover_servers else R.string.direct_messages) + else -> server?.name ?: stringResource(R.string.unknown) + }, + style = MaterialTheme.typography.titleMedium, + maxLines = 1, + overflow = TextOverflow.Ellipsis + ) + } + + if (currentServer != null) { + IconButton(onClick = { + server?.id?.let { srvId -> onShowServerContextSheet(srvId) } + }) { + Icon( + painter = painterResource(R.drawable.icn_more_vert_24dp), + contentDescription = stringResource(R.string.menu), + tint = LocalContentColor.current + ) + } + } else { + Spacer(Modifier.height(64.dp)) + } + } + } + } + if (currentDestination is ChatRouterDestination.Discover) { + DiscoverServersList( + onJoinToServerSuccess = navigateToServer + ) + } else { + if (currentServer == null) { + DirectMessagesChannelListRenderer( + currentDestination, + onDestinationChanged, + channelListState, + onOpenChannelContextSheet = { channelContextSheetTarget = it } + ) + } else { + ServerChannelListRenderer( + categorisedChannels, + currentDestination, + onDestinationChanged, + channelListState, + onOpenChannelContextSheet = { channelContextSheetTarget = it }, + serverId = currentServer ) } } } } - Column( - Modifier - .clip(shape = RoundedCornerShape(topStart = 24.dp)) - .background(color = MaterialTheme.colorScheme.surfaceContainer) - .weight(weight = 1f) - .fillMaxHeight() - ) { - Box( - Modifier - .height(serverBannerHeight) + if(currentDestination is ChatRouterDestination.Home){ + FloatingActionButton( + modifier = Modifier + .padding(16.dp) + .align(Alignment.BottomEnd), + onClick = { + onDestinationChanged(ChatRouterDestination.Friends) + }, + containerColor = MaterialTheme.colorScheme.primary, + contentColor = MaterialTheme.colorScheme.onPrimary, + shape = CircleShape ) { - if (server?.banner != null) { - RemoteImage( - url = "${RevoltAPI.getCurrentFilesUrl()}/banners/${server.banner.id}", - description = null, - contentScale = ContentScale.Crop, - modifier = Modifier - .fillMaxSize() - ) - - with(MaterialTheme.colorScheme) { - Box( - Modifier - .fillMaxSize() - .drawBehind { - drawRect( - Brush.linearGradient( - listOf( - Color.Black.copy(alpha = 0.6f), - Color.Transparent - ), - Offset.Zero, - Offset.Infinite.copy(x = 0f) - ), - ) - }) - } - } - - Row( - Modifier - .padding(16.dp), - verticalAlignment = Alignment.CenterVertically - ) { - CompositionLocalProvider( - LocalContentColor provides - if (server?.banner != null) Color.White - else LocalContentColor.current - ) { - Row( - Modifier.weight(1f), - verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.spacedBy(8.dp) - ) { - if (server?.flags has ServerFlags.Official) { - Icon( - painter = painterResource( - id = R.drawable.ic_revolt_decagram_24dp - ), - contentDescription = stringResource( - R.string.server_flag_official - ), - tint = LocalContentColor.current, - modifier = Modifier - .size(24.dp) - ) - } - if (server?.flags has ServerFlags.Verified) { - Icon( - painter = painterResource( - id = R.drawable.ic_check_decagram_24dp - ), - contentDescription = stringResource( - R.string.server_flag_verified - ), - tint = LocalContentColor.current, - modifier = Modifier - .size(24.dp) - ) - } - - Text( - text = when (currentServer) { - null -> stringResource(if (currentDestination is ChatRouterDestination.Discover) R.string.discover_servers else R.string.direct_messages) - else -> server?.name ?: stringResource(R.string.unknown) - }, - style = MaterialTheme.typography.titleMedium, - maxLines = 1, - overflow = TextOverflow.Ellipsis - ) - } - - if (currentServer != null) { - IconButton(onClick = { - server?.id?.let { srvId -> onShowServerContextSheet(srvId) } - }) { - Icon( - painter = painterResource(R.drawable.icn_more_vert_24dp), - contentDescription = stringResource(R.string.menu), - tint = LocalContentColor.current - ) - } - } else { - Spacer(Modifier.height(64.dp)) - } - } - } - } - if (currentDestination is ChatRouterDestination.Discover) { - DiscoverServersList( - onJoinToServerSuccess = navigateToServer + Icon( + painter = painterResource(R.drawable.icn_message_24dp), + contentDescription = stringResource(R.string.message_friends) ) - } else { - if (currentServer == null) { - DirectMessagesChannelListRenderer( - currentDestination, - onDestinationChanged, - channelListState, - onOpenChannelContextSheet = { channelContextSheetTarget = it } - ) - } else { - ServerChannelListRenderer( - categorisedChannels, - currentDestination, - onDestinationChanged, - channelListState, - onOpenChannelContextSheet = { channelContextSheetTarget = it }, - serverId = currentServer - ) - } } } } @@ -574,45 +604,18 @@ private fun ColumnScope.DirectMessagesChannelListRenderer( .fillMaxSize() .weight(1f) ) { - item(key = "overview") { - ChannelItem( - channel = Channel( - id = "overview", - name = stringResource(R.string.overview_screen_title), - channelType = ChannelType.TextChannel - ), - iconType = ChannelItemIconType.Painter(painterResource(R.drawable.icn_star_shine_24dp)), - isCurrent = currentDestination is ChatRouterDestination.Settings, - onDestinationChanged = { - onDestinationChanged(ChatRouterDestination.Settings) - }, - hasUnread = false, - onOpenChannelContextSheet = {} + item("top-divider") { + HorizontalDivider( + Modifier + .fillMaxWidth() + .padding(horizontal = 8.dp, vertical = 4.dp) ) - Spacer(Modifier.height(4.dp)) - } - - item(key = "friends") { - ChannelItem( - channel = Channel( - id = "friends", - name = stringResource(R.string.friends), - channelType = ChannelType.TextChannel - ), - iconType = ChannelItemIconType.Painter(painterResource(R.drawable.icn_group_24dp)), - isCurrent = currentDestination is ChatRouterDestination.Friends, - onDestinationChanged = { - onDestinationChanged(ChatRouterDestination.Friends) - }, - hasUnread = FriendRequests.getIncoming().isNotEmpty(), - onOpenChannelContextSheet = {}, - ) - Spacer(Modifier.height(4.dp)) } item(key = "saved_messages") { - val notesChannel = - RevoltAPI.channelCache.values.firstOrNull { it.channelType == ChannelType.SavedMessages } + val notesChannel = RevoltAPI.channelCache.values.firstOrNull { + it.channelType == ChannelType.SavedMessages + } if (notesChannel != null) { ChannelItem( @@ -629,11 +632,10 @@ private fun ColumnScope.DirectMessagesChannelListRenderer( hasUnread = false, onOpenChannelContextSheet = {}, ) - Spacer(Modifier.height(4.dp)) } } - item("divider") { + item("bottom-divider") { HorizontalDivider( Modifier .fillMaxWidth() diff --git a/app/src/main/java/chat/revolt/screens/chat/ChatRouterScreen.kt b/app/src/main/java/chat/revolt/screens/chat/ChatRouterScreen.kt index e01f0eb2..4ff99153 100644 --- a/app/src/main/java/chat/revolt/screens/chat/ChatRouterScreen.kt +++ b/app/src/main/java/chat/revolt/screens/chat/ChatRouterScreen.kt @@ -932,7 +932,6 @@ fun ChannelNavigator( else -> null }, navigateToServer = viewModel::navigateToServer, - onLongPressAvatar = onShowStatusSheet, onShowServerContextSheet = onShowServerContextSheet, showSettingsIcon = isTouchExplorationEnabled, onOpenSettings = { diff --git a/app/src/main/res/drawable/icn_message_24dp.xml b/app/src/main/res/drawable/icn_message_24dp.xml new file mode 100644 index 00000000..3329386f --- /dev/null +++ b/app/src/main/res/drawable/icn_message_24dp.xml @@ -0,0 +1,11 @@ + + + \ No newline at end of file diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml index 51939841..0ddae93a 100644 --- a/app/src/main/res/values/strings.xml +++ b/app/src/main/res/values/strings.xml @@ -16,6 +16,7 @@ Terms of Service Privacy Policy Community Guidelines + Message Friends Welcome to PepChat! Join endless chats and connections; PepChat is your place to vibe with friends! @@ -233,7 +234,7 @@ Text Channel Voice Channel Group - Notes + Saved Notes This is the start of your conversation There may be some messages missing here. From 22ceabe2ac15ef793aaffda6b4a6406bacde2947 Mon Sep 17 00:00:00 2001 From: AbronStudio Date: Thu, 7 Aug 2025 11:20:11 +0330 Subject: [PATCH 2/6] Refactor: Clean up imports in ChannelSideDrawer This commit removes unused imports from the ChannelSideDrawer component, streamlining the code and improving readability. - Removed unnecessary imports related to FloatingActionButton and ToggleFloatingActionButton. - Cleaned up imports for better maintainability. --- .../screens/chat/drawer/ChannelSideDrawer.kt | 12 ------------ 1 file changed, 12 deletions(-) diff --git a/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt b/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt index 122d961d..deeff584 100644 --- a/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt +++ b/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt @@ -35,14 +35,9 @@ import androidx.compose.foundation.lazy.rememberLazyListState import androidx.compose.foundation.shape.CircleShape import androidx.compose.foundation.shape.CornerSize import androidx.compose.foundation.shape.RoundedCornerShape -import androidx.compose.material.icons.Icons -import androidx.compose.material.icons.filled.Add -import androidx.compose.material.icons.filled.Close import androidx.compose.material3.ExperimentalMaterial3Api import androidx.compose.material3.ExperimentalMaterial3ExpressiveApi import androidx.compose.material3.FloatingActionButton -import androidx.compose.material3.FloatingActionButtonMenu -import androidx.compose.material3.FloatingActionButtonMenuItem import androidx.compose.material3.HorizontalDivider import androidx.compose.material3.Icon import androidx.compose.material3.IconButton @@ -50,9 +45,6 @@ import androidx.compose.material3.LocalContentColor import androidx.compose.material3.MaterialTheme import androidx.compose.material3.ModalBottomSheet import androidx.compose.material3.Text -import androidx.compose.material3.ToggleFloatingActionButton -import androidx.compose.material3.ToggleFloatingActionButtonDefaults.animateIcon -import androidx.compose.material3.animateFloatingActionButton import androidx.compose.material3.rememberModalBottomSheetState import androidx.compose.runtime.Composable import androidx.compose.runtime.CompositionLocalProvider @@ -70,13 +62,9 @@ import androidx.compose.ui.draw.drawBehind import androidx.compose.ui.geometry.Offset import androidx.compose.ui.graphics.Brush import androidx.compose.ui.graphics.Color -import androidx.compose.ui.graphics.vector.rememberVectorPainter import androidx.compose.ui.layout.ContentScale import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource -import androidx.compose.ui.semantics.isTraversalGroup -import androidx.compose.ui.semantics.semantics -import androidx.compose.ui.semantics.traversalIndex import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.text.style.TextOverflow From 4ed6a0aa9aec9c8d4eecdc5585b2a1a31ddc5e6b Mon Sep 17 00:00:00 2001 From: AbronStudio Date: Thu, 7 Aug 2025 11:55:17 +0330 Subject: [PATCH 3/6] Refactor: Enhance ChannelSideDrawer with DirectMessagesChannelListRendererPreview This commit adds a preview for the DirectMessagesChannelListRenderer in the ChannelSideDrawer component, improving the development experience by allowing for visual testing of the UI. Additionally, it cleans up the code by formatting and organizing imports. - Introduced @Preview for DirectMessagesChannelListRenderer. - Cleaned up import statements for better readability. - Adjusted spacing and formatting for improved code clarity. --- .../screens/chat/drawer/ChannelSideDrawer.kt | 199 ++++++++++++++---- .../drawable/empty_direct_messages_img.xml | 192 +++++++++++++++++ 2 files changed, 354 insertions(+), 37 deletions(-) create mode 100644 app/src/main/res/drawable/empty_direct_messages_img.xml diff --git a/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt b/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt index deeff584..174ee672 100644 --- a/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt +++ b/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt @@ -7,6 +7,7 @@ import androidx.compose.animation.core.animateFloatAsState import androidx.compose.animation.core.spring import androidx.compose.animation.core.tween import androidx.compose.foundation.ExperimentalFoundationApi +import androidx.compose.foundation.Image import androidx.compose.foundation.background import androidx.compose.foundation.clickable import androidx.compose.foundation.combinedClickable @@ -35,6 +36,7 @@ import androidx.compose.foundation.lazy.rememberLazyListState import androidx.compose.foundation.shape.CircleShape import androidx.compose.foundation.shape.CornerSize import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material3.Button import androidx.compose.material3.ExperimentalMaterial3Api import androidx.compose.material3.ExperimentalMaterial3ExpressiveApi import androidx.compose.material3.FloatingActionButton @@ -69,6 +71,7 @@ import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.unit.dp +import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.sp import chat.revolt.R import chat.revolt.api.RevoltAPI @@ -94,7 +97,8 @@ import chat.revolt.composables.screens.chat.discover.DiscoverServersList import chat.revolt.screens.chat.ChatRouterDestination import chat.revolt.sheets.ChannelContextSheet -@OptIn(ExperimentalMaterial3Api::class, ExperimentalFoundationApi::class, +@OptIn( + ExperimentalMaterial3Api::class, ExperimentalFoundationApi::class, ExperimentalMaterial3ExpressiveApi::class ) @Composable @@ -551,7 +555,7 @@ fun ChannelSideDrawer( } } } - if(currentDestination is ChatRouterDestination.Home){ + if (currentDestination is ChatRouterDestination.Home) { FloatingActionButton( modifier = Modifier .padding(16.dp) @@ -572,6 +576,84 @@ fun ChannelSideDrawer( } } +@Preview +@Composable +private fun DirectMessagesChannelListRendererPreview() { + val mockChannels = listOf( + Channel(id = "1", name = "Saved Messages", channelType = ChannelType.SavedMessages), + Channel( + id = "2", + name = "User One", + channelType = ChannelType.DirectMessage, + lastMessageID = "msg1" + ), + Channel( + id = "3", + name = "Group Chat Alpha", + channelType = ChannelType.Group, + icon = null, + lastMessageID = "msg2" + ), + Channel( + id = "4", + name = "User Two", + channelType = ChannelType.DirectMessage, + active = false + ), // inactive DM + Channel( + id = "5", + name = "Another Group", + channelType = ChannelType.Group, + icon = null, + lastMessageID = "msg3" + ) + ) + val mockUsers = mapOf( + "user1_id" to User(id = "user1_id", username = "User One", avatar = null, online = true), + "user2_id" to User(id = "user2_id", username = "User Two", avatar = null, online = false) + ) + + // Simulate RevoltAPI cache for preview + RevoltAPI.channelCache.clear() + mockChannels.forEach { RevoltAPI.channelCache[it.id!!] = it } + RevoltAPI.userCache.clear() + mockUsers.forEach { (id, user) -> RevoltAPI.userCache[id] = user } + + + //ColumnScope is required for DirectMessagesChannelListRenderer, let's provide a dummy one + Column(Modifier.background(MaterialTheme.colorScheme.surface)) { + DirectMessagesChannelListRenderer( + currentDestination = ChatRouterDestination.Home, + onDestinationChanged = {}, + channelListState = rememberLazyListState(), + onOpenChannelContextSheet = {} + ) + } +} + +@Preview +@Composable +private fun DirectMessagesChannelListRendererEmptyPreview() { + // Simulate RevoltAPI cache for preview - empty state + RevoltAPI.channelCache.clear() + RevoltAPI.channelCache["saved_notes_channel_id"] = Channel( + id = "saved_notes_channel_id", + name = "Saved Messages", + channelType = ChannelType.SavedMessages + ) + RevoltAPI.userCache.clear() + + //ColumnScope is required for DirectMessagesChannelListRenderer, let's provide a dummy one + Column(Modifier.background(MaterialTheme.colorScheme.surface)) { + DirectMessagesChannelListRenderer( + currentDestination = ChatRouterDestination.Home, + onDestinationChanged = {}, + channelListState = rememberLazyListState(), + onOpenChannelContextSheet = {} + ) + } +} + @Composable private fun ColumnScope.DirectMessagesChannelListRenderer( currentDestination: ChatRouterDestination, @@ -632,46 +714,89 @@ private fun ColumnScope.DirectMessagesChannelListRenderer( Spacer(Modifier.height(4.dp)) } - items( - dmAbleChannels.size, - key = { dmAbleChannels[it].id ?: it } - ) { - val channel = dmAbleChannels.getOrNull(it) ?: return@items - - val partner = - if (channel.channelType == ChannelType.DirectMessage) { - RevoltAPI.userCache[ - ChannelUtils.resolveDMPartner( - channel + if (dmAbleChannels.isEmpty()) { + item(key = "empty-list-state") { + Column( + Modifier.padding(24.dp), + horizontalAlignment = Alignment.CenterHorizontally, + verticalArrangement = Arrangement.Center + ) { + Image( + modifier = Modifier.size(100.dp), + painter = painterResource(R.drawable.empty_direct_messages_img), + contentDescription = "Empty Messages Sad Image" + ) + Spacer(Modifier.height(4.dp)) + Text( + text = "It’s Quiet Here...", + style = MaterialTheme.typography.labelLarge, + textAlign = TextAlign.Center, + fontSize = 24.sp + ) + Spacer(Modifier.height(4.dp)) + Text( + text = "Find friends to chat with or create a group conversation.", + style = MaterialTheme.typography.bodyMedium, + textAlign = TextAlign.Center + ) + Spacer(Modifier.height(16.dp)) + Button( + onClick = { + onDestinationChanged(ChatRouterDestination.Friends) + }, + shape = MaterialTheme.shapes.small.copy( + topStart = CornerSize(8.dp), + topEnd = CornerSize(8.dp), + bottomStart = CornerSize(8.dp), + bottomEnd = CornerSize(8.dp) ) - ] - } else { - null + ) { + Text(text = "New Conversation") + } } + } + } else { + items( + dmAbleChannels.size, + key = { dmAbleChannels[it].id ?: it } + ) { + val channel = dmAbleChannels.getOrNull(it) ?: return@items - DMOrGroupItem( - channel = channel, - partner = partner, - isCurrent = when (currentDestination) { - is ChatRouterDestination.Channel -> { - currentDestination.channelId == channel.id + val partner = + if (channel.channelType == ChannelType.DirectMessage) { + RevoltAPI.userCache[ + ChannelUtils.resolveDMPartner( + channel + ) + ] + } else { + null } - else -> false - }, - hasUnread = channel.lastMessageID?.let { lastMessageID -> - RevoltAPI.unreads.hasUnread( - channel.id!!, - lastMessageID, - serverId = null - ) - } ?: false, - isMuted = NotificationSettingsProvider.isChannelMuted(channel.id!!, null), - onDestinationChanged = { dest -> - onDestinationChanged(dest) - }, - onOpenChannelContextSheet = onOpenChannelContextSheet - ) + DMOrGroupItem( + channel = channel, + partner = partner, + isCurrent = when (currentDestination) { + is ChatRouterDestination.Channel -> { + currentDestination.channelId == channel.id + } + + else -> false + }, + hasUnread = channel.lastMessageID?.let { lastMessageID -> + RevoltAPI.unreads.hasUnread( + channel.id!!, + lastMessageID, + serverId = null + ) + } ?: false, + isMuted = NotificationSettingsProvider.isChannelMuted(channel.id!!, null), + onDestinationChanged = { dest -> + onDestinationChanged(dest) + }, + onOpenChannelContextSheet = onOpenChannelContextSheet + ) + } } item(key = "last") { diff --git a/app/src/main/res/drawable/empty_direct_messages_img.xml b/app/src/main/res/drawable/empty_direct_messages_img.xml new file mode 100644 index 00000000..11971bf6 --- /dev/null +++ b/app/src/main/res/drawable/empty_direct_messages_img.xml @@ -0,0 +1,192 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + From 26e0c3443e2fae898c1fd4f5d326cc980acc51c8 Mon Sep 17 00:00:00 2001 From: AbronStudio Date: Thu, 7 Aug 2025 12:06:12 +0330 Subject: [PATCH 4/6] Refactor: Update string resources in ChannelSideDrawer for improved localization This commit enhances the ChannelSideDrawer component by replacing hardcoded strings with string resources, improving localization support and maintainability. - Updated content description for empty messages image. - Replaced static text with string resources for empty messages heading and body. - Updated text for the new conversation button to use string resources. --- .../composables/screens/chat/drawer/ChannelSideDrawer.kt | 8 ++++---- app/src/main/res/values/strings.xml | 4 ++++ 2 files changed, 8 insertions(+), 4 deletions(-) diff --git a/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt b/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt index 174ee672..053fb925 100644 --- a/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt +++ b/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt @@ -724,18 +724,18 @@ private fun ColumnScope.DirectMessagesChannelListRenderer( Image( modifier = Modifier.size(100.dp), painter = painterResource(R.drawable.empty_direct_messages_img), - contentDescription = "Empty Messages Sad Image" + contentDescription = stringResource(R.string.empty_messages_content_description) ) Spacer(Modifier.height(4.dp)) Text( - text = "It’s Quiet Here...", + text = stringResource(R.string.empty_messages_heading), style = MaterialTheme.typography.labelLarge, textAlign = TextAlign.Center, fontSize = 24.sp ) Spacer(Modifier.height(4.dp)) Text( - text = "Find friends to chat with or create a group conversation.", + text = stringResource(R.string.empty_messages_body), style = MaterialTheme.typography.bodyMedium, textAlign = TextAlign.Center ) @@ -751,7 +751,7 @@ private fun ColumnScope.DirectMessagesChannelListRenderer( bottomEnd = CornerSize(8.dp) ) ) { - Text(text = "New Conversation") + Text(text = stringResource(R.string.new_conversation)) } } } diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml index 0ddae93a..cee96118 100644 --- a/app/src/main/res/values/strings.xml +++ b/app/src/main/res/values/strings.xml @@ -17,6 +17,10 @@ Privacy Policy Community Guidelines Message Friends + Empty Messages Sad Image + It\'s Quiet Here... + Find friends to chat with or create a group conversation. + New Conversation Welcome to PepChat! Join endless chats and connections; PepChat is your place to vibe with friends! From 99d47cd51a64661b5025b3d65db89a4664d422c7 Mon Sep 17 00:00:00 2001 From: AbronStudio Date: Thu, 7 Aug 2025 12:31:58 +0330 Subject: [PATCH 5/6] Refactor: Improve layout structure in ChannelSideDrawer This commit enhances the layout structure of the ChannelSideDrawer component by reorganizing the placement of UI elements for better readability and visual separation. - Moved the HorizontalDivider to encapsulate the ChannelItem for SavedMessages, improving the visual hierarchy. - Removed redundant divider items and adjusted spacing for a cleaner layout. - Ensured consistent padding and alignment for UI elements within the drawer. --- .../screens/chat/drawer/ChannelSideDrawer.kt | 56 +++++++++---------- 1 file changed, 26 insertions(+), 30 deletions(-) diff --git a/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt b/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt index 053fb925..b6f1e3bc 100644 --- a/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt +++ b/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt @@ -674,46 +674,42 @@ private fun ColumnScope.DirectMessagesChannelListRenderer( .fillMaxSize() .weight(1f) ) { - item("top-divider") { - HorizontalDivider( - Modifier - .fillMaxWidth() - .padding(horizontal = 8.dp, vertical = 4.dp) - ) - } - item(key = "saved_messages") { val notesChannel = RevoltAPI.channelCache.values.firstOrNull { it.channelType == ChannelType.SavedMessages } if (notesChannel != null) { - ChannelItem( - channel = Channel( - id = notesChannel.id, - name = stringResource(R.string.channel_notes), - channelType = ChannelType.SavedMessages - ), - isCurrent = currentDestination is ChatRouterDestination.Channel && - currentDestination.channelId == notesChannel.id, - onDestinationChanged = { - onDestinationChanged(it) - }, - hasUnread = false, - onOpenChannelContextSheet = {}, + HorizontalDivider( + Modifier + .fillMaxWidth() + .padding(horizontal = 8.dp, vertical = 4.dp) ) + Column(Modifier.fillMaxWidth()) { + ChannelItem( + channel = Channel( + id = notesChannel.id, + name = stringResource(R.string.channel_notes), + channelType = ChannelType.SavedMessages + ), + isCurrent = currentDestination is ChatRouterDestination.Channel && + currentDestination.channelId == notesChannel.id, + onDestinationChanged = { + onDestinationChanged(it) + }, + hasUnread = false, + onOpenChannelContextSheet = {}, + ) + HorizontalDivider( + Modifier + .fillMaxWidth() + .padding(horizontal = 8.dp, vertical = 4.dp) + ) + Spacer(Modifier.height(4.dp)) + } } } - item("bottom-divider") { - HorizontalDivider( - Modifier - .fillMaxWidth() - .padding(horizontal = 8.dp, vertical = 4.dp) - ) - Spacer(Modifier.height(4.dp)) - } - if (dmAbleChannels.isEmpty()) { item(key = "empty-list-state") { Column( From 7fc312b43f0a533706bb1e44f7eff77e3aa59d0d Mon Sep 17 00:00:00 2001 From: AbronStudio Date: Thu, 7 Aug 2025 15:14:34 +0330 Subject: [PATCH 6/6] Refactor: Update icons and background colors in ChannelSideDrawer and ChatRouterScreen This commit enhances the visual elements of the ChannelSideDrawer and ChatRouterScreen components by updating icons and background colors for improved aesthetics and consistency. - Replaced icons in ChannelSideDrawer with new resources for direct messages and friends. - Updated background colors in ChannelSideDrawer to use primaryContainer and secondaryContainer for better visual hierarchy. - Adjusted icon sizes in ChatRouterScreen's navigation bar for uniformity. - Introduced new drawable resources for bottom navigation icons, enhancing the overall UI experience. --- .../screens/chat/drawer/ChannelSideDrawer.kt | 20 ++++++++++--------- .../revolt/screens/chat/ChatRouterScreen.kt | 15 +++++++------- .../res/drawable/ic_bottom_navbar_friends.xml | 13 ++++++++++++ .../res/drawable/ic_bottom_navbar_home.xml | 9 +++++++++ .../res/drawable/ic_bottom_navbar_you.xml | 9 +++++++++ .../main/res/drawable/ic_direct_messages.xml | 9 +++++++++ app/src/main/res/drawable/ic_new_message.xml | 10 ++++++++++ 7 files changed, 69 insertions(+), 16 deletions(-) create mode 100644 app/src/main/res/drawable/ic_bottom_navbar_friends.xml create mode 100644 app/src/main/res/drawable/ic_bottom_navbar_home.xml create mode 100644 app/src/main/res/drawable/ic_bottom_navbar_you.xml create mode 100644 app/src/main/res/drawable/ic_direct_messages.xml create mode 100644 app/src/main/res/drawable/ic_new_message.xml diff --git a/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt b/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt index b6f1e3bc..02b44f11 100644 --- a/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt +++ b/app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt @@ -208,12 +208,13 @@ fun ChannelSideDrawer( onDestinationChanged(ChatRouterDestination.Home) } .size(48.dp) - .background(MaterialTheme.colorScheme.secondaryContainer), + .background(MaterialTheme.colorScheme.primaryContainer), contentAlignment = Alignment.Center ) { Icon( - painter = painterResource(R.drawable.ic_message_text_24dp), - contentDescription = stringResource(R.string.discover_alt) + painter = painterResource(R.drawable.ic_direct_messages), + contentDescription = stringResource(R.string.discover_alt), + tint = MaterialTheme.colorScheme.onPrimaryContainer ) } } @@ -298,7 +299,7 @@ fun ChannelSideDrawer( ) } .size(48.dp) - .background(MaterialTheme.colorScheme.onPrimary), + .background(MaterialTheme.colorScheme.secondaryContainer), contentAlignment = Alignment.Center ) { Icon( @@ -317,7 +318,7 @@ fun ChannelSideDrawer( onShowAddServerSheet() } .size(48.dp) - .background(MaterialTheme.colorScheme.onPrimary), + .background(MaterialTheme.colorScheme.secondaryContainer), contentAlignment = Alignment.Center ) { Icon( @@ -563,13 +564,14 @@ fun ChannelSideDrawer( onClick = { onDestinationChanged(ChatRouterDestination.Friends) }, - containerColor = MaterialTheme.colorScheme.primary, - contentColor = MaterialTheme.colorScheme.onPrimary, + containerColor = MaterialTheme.colorScheme.primaryContainer, + contentColor = MaterialTheme.colorScheme.onPrimaryContainer, shape = CircleShape ) { Icon( - painter = painterResource(R.drawable.icn_message_24dp), - contentDescription = stringResource(R.string.message_friends) + painter = painterResource(R.drawable.ic_new_message), + contentDescription = stringResource(R.string.message_friends), + tint = MaterialTheme.colorScheme.onPrimaryContainer ) } } diff --git a/app/src/main/java/chat/revolt/screens/chat/ChatRouterScreen.kt b/app/src/main/java/chat/revolt/screens/chat/ChatRouterScreen.kt index 4ff99153..ef660e5e 100644 --- a/app/src/main/java/chat/revolt/screens/chat/ChatRouterScreen.kt +++ b/app/src/main/java/chat/revolt/screens/chat/ChatRouterScreen.kt @@ -17,12 +17,9 @@ import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.only import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size import androidx.compose.foundation.layout.systemBars import androidx.compose.foundation.layout.windowInsetsPadding -import androidx.compose.material.icons.Icons -import androidx.compose.material.icons.filled.Face -import androidx.compose.material.icons.filled.Home -import androidx.compose.material.icons.filled.Person import androidx.compose.material3.AlertDialog import androidx.compose.material3.BottomAppBar import androidx.compose.material3.DrawerValue @@ -56,6 +53,7 @@ import androidx.compose.ui.platform.LocalView import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource import androidx.compose.ui.text.style.TextAlign +import androidx.compose.ui.unit.dp import androidx.core.app.NotificationManagerCompat import androidx.hilt.navigation.compose.hiltViewModel import androidx.lifecycle.Lifecycle @@ -851,8 +849,9 @@ fun ChannelNavigator( NavigationBarItem( icon = { Icon( - imageVector = Icons.Default.Home, + painter = painterResource(R.drawable.ic_bottom_navbar_home), contentDescription = "Home", + modifier = Modifier.size(32.dp) ) }, label = { @@ -873,8 +872,9 @@ fun ChannelNavigator( NavigationBarItem( icon = { Icon( - imageVector = Icons.Default.Person, + painter = painterResource(R.drawable.ic_bottom_navbar_friends), contentDescription = "Friends", + modifier = Modifier.size(32.dp) ) }, label = { @@ -889,8 +889,9 @@ fun ChannelNavigator( NavigationBarItem( icon = { Icon( - imageVector = Icons.Default.Face, + painter = painterResource(R.drawable.ic_bottom_navbar_you), contentDescription = "You", + modifier = Modifier.size(32.dp) ) }, label = { diff --git a/app/src/main/res/drawable/ic_bottom_navbar_friends.xml b/app/src/main/res/drawable/ic_bottom_navbar_friends.xml new file mode 100644 index 00000000..c0be1b7d --- /dev/null +++ b/app/src/main/res/drawable/ic_bottom_navbar_friends.xml @@ -0,0 +1,13 @@ + + + + + + diff --git a/app/src/main/res/drawable/ic_bottom_navbar_home.xml b/app/src/main/res/drawable/ic_bottom_navbar_home.xml new file mode 100644 index 00000000..a2bf4b8e --- /dev/null +++ b/app/src/main/res/drawable/ic_bottom_navbar_home.xml @@ -0,0 +1,9 @@ + + + diff --git a/app/src/main/res/drawable/ic_bottom_navbar_you.xml b/app/src/main/res/drawable/ic_bottom_navbar_you.xml new file mode 100644 index 00000000..0fde3ffb --- /dev/null +++ b/app/src/main/res/drawable/ic_bottom_navbar_you.xml @@ -0,0 +1,9 @@ + + + diff --git a/app/src/main/res/drawable/ic_direct_messages.xml b/app/src/main/res/drawable/ic_direct_messages.xml new file mode 100644 index 00000000..5efb937d --- /dev/null +++ b/app/src/main/res/drawable/ic_direct_messages.xml @@ -0,0 +1,9 @@ + + + diff --git a/app/src/main/res/drawable/ic_new_message.xml b/app/src/main/res/drawable/ic_new_message.xml new file mode 100644 index 00000000..24b2a720 --- /dev/null +++ b/app/src/main/res/drawable/ic_new_message.xml @@ -0,0 +1,10 @@ + + +