Skip to content

Commit ed57879

Browse files
bmc08gtbmc08gt
committed
style(fc): add icons and destructive highlighting for context menu
Signed-off-by: Brandon McAnsh <git@bmcreations.dev>
1 parent 47f6476 commit ed57879

2 files changed

Lines changed: 112 additions & 41 deletions

File tree

‎flipchatApp/src/main/kotlin/xyz/flipchat/app/features/chat/conversation/MessageActionContextSheet.kt‎

Lines changed: 55 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,22 @@
11
package xyz.flipchat.app.features.chat.conversation
22

3+
import androidx.compose.foundation.Image
34
import androidx.compose.foundation.background
45
import androidx.compose.foundation.clickable
6+
import androidx.compose.foundation.layout.Arrangement
57
import androidx.compose.foundation.layout.Column
8+
import androidx.compose.foundation.layout.Row
69
import androidx.compose.foundation.layout.fillMaxWidth
710
import androidx.compose.foundation.layout.navigationBarsPadding
811
import androidx.compose.foundation.layout.padding
12+
import androidx.compose.foundation.layout.size
913
import androidx.compose.material.Divider
1014
import androidx.compose.material.Text
1115
import androidx.compose.runtime.Composable
16+
import androidx.compose.ui.Alignment
1217
import androidx.compose.ui.Modifier
1318
import androidx.compose.ui.graphics.Color
19+
import androidx.compose.ui.graphics.ColorFilter
1420
import androidx.compose.ui.res.stringResource
1521
import androidx.compose.ui.util.fastForEachIndexed
1622
import cafe.adriel.voyager.core.screen.Screen
@@ -31,47 +37,63 @@ internal data class MessageActionContextSheet(val actions: List<MessageControlAc
3137
.navigationBarsPadding()
3238
) {
3339
actions.fastForEachIndexed { index, action ->
34-
Text(
35-
text = when (action) {
36-
is MessageControlAction.Copy -> stringResource(R.string.action_copyMessage)
37-
is MessageControlAction.Delete -> stringResource(R.string.action_deleteMessage)
38-
is MessageControlAction.RemoveUser -> stringResource(
39-
R.string.action_removeUser,
40-
action.name
41-
)
42-
43-
is MessageControlAction.BlockUser -> stringResource(
44-
R.string.action_blockUser,
45-
action.name
46-
)
47-
48-
49-
is MessageControlAction.UnblockUser -> stringResource(
50-
R.string.action_unblockUser,
51-
action.name
52-
)
53-
54-
55-
is MessageControlAction.ReportUserForMessage -> stringResource(R.string.action_report)
56-
is MessageControlAction.MuteUser -> stringResource(
57-
R.string.action_muteUser,
58-
action.name
59-
)
60-
61-
is MessageControlAction.Reply -> stringResource(R.string.action_reply)
62-
},
63-
style = CodeTheme.typography.textMedium,
40+
Row(
6441
modifier = Modifier
65-
.fillMaxWidth()
6642
.clickable {
6743
navigator.hide()
6844
action.onSelect()
6945
}
46+
.fillMaxWidth()
7047
.padding(
7148
horizontal = CodeTheme.dimens.inset,
72-
vertical = CodeTheme.dimens.grid.x3
49+
vertical = CodeTheme.dimens.grid.x2
50+
),
51+
verticalAlignment = Alignment.CenterVertically,
52+
horizontalArrangement = Arrangement.spacedBy(CodeTheme.dimens.grid.x2)
53+
) {
54+
Image(
55+
modifier = Modifier.size(CodeTheme.dimens.staticGrid.x3),
56+
painter = action.painter,
57+
contentDescription = null,
58+
colorFilter = ColorFilter.tint(
59+
if (action.isDestructive) CodeTheme.colors.errorText else CodeTheme.colors.textMain
7360
)
74-
)
61+
)
62+
Text(
63+
text = when (action) {
64+
is MessageControlAction.Copy -> stringResource(R.string.action_copyMessage)
65+
is MessageControlAction.Delete -> stringResource(R.string.action_deleteMessage)
66+
is MessageControlAction.RemoveUser -> stringResource(
67+
R.string.action_removeUser,
68+
action.name
69+
)
70+
71+
is MessageControlAction.BlockUser -> stringResource(
72+
R.string.action_blockUser,
73+
action.name
74+
)
75+
76+
77+
is MessageControlAction.UnblockUser -> stringResource(
78+
R.string.action_unblockUser,
79+
action.name
80+
)
81+
82+
83+
is MessageControlAction.ReportUserForMessage -> stringResource(R.string.action_report)
84+
is MessageControlAction.MuteUser -> stringResource(
85+
R.string.action_muteUser,
86+
action.name
87+
)
88+
89+
is MessageControlAction.Reply -> stringResource(R.string.action_reply)
90+
},
91+
style = CodeTheme.typography.textSmall.copy(
92+
color = if (action.isDestructive) CodeTheme.colors.errorText else CodeTheme.colors.textMain
93+
),
94+
modifier = Modifier.weight(1f)
95+
)
96+
}
7597
if (index < actions.lastIndex) {
7698
Divider(color = White05)
7799
}

‎ui/components/src/main/kotlin/com/getcode/ui/components/chat/messagecontents/MessageTextContent.kt‎

Lines changed: 57 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,16 @@ import androidx.compose.foundation.layout.Row
99
import androidx.compose.foundation.layout.fillMaxWidth
1010
import androidx.compose.foundation.layout.padding
1111
import androidx.compose.material.Text
12+
import androidx.compose.material.icons.Icons
13+
import androidx.compose.material.icons.automirrored.filled.Reply
14+
import androidx.compose.material.icons.filled.Block
15+
import androidx.compose.material.icons.filled.ContentCopy
16+
import androidx.compose.material.icons.filled.Delete
17+
import androidx.compose.material.icons.filled.Flag
18+
import androidx.compose.material.icons.filled.Person
19+
import androidx.compose.material.icons.filled.PersonRemove
20+
import androidx.compose.material.icons.filled.Reply
21+
import androidx.compose.material.icons.filled.VoiceOverOff
1222
import androidx.compose.runtime.Composable
1323
import androidx.compose.runtime.State
1424
import androidx.compose.runtime.derivedStateOf
@@ -20,8 +30,11 @@ import androidx.compose.ui.Alignment
2030
import androidx.compose.ui.Modifier
2131
import androidx.compose.ui.draw.drawWithContent
2232
import androidx.compose.ui.graphics.Shape
33+
import androidx.compose.ui.graphics.painter.Painter
34+
import androidx.compose.ui.graphics.vector.rememberVectorPainter
2335
import androidx.compose.ui.input.pointer.pointerInput
2436
import androidx.compose.ui.platform.LocalDensity
37+
import androidx.compose.ui.res.painterResource
2538
import androidx.compose.ui.res.stringResource
2639
import androidx.compose.ui.text.AnnotatedString
2740
import androidx.compose.ui.text.SpanStyle
@@ -46,18 +59,54 @@ import kotlin.math.max
4659

4760
sealed interface MessageControlAction {
4861
val onSelect: () -> Unit
62+
@get:Composable
63+
val painter: Painter
64+
val isDestructive: Boolean
4965

50-
data class Copy(override val onSelect: () -> Unit) : MessageControlAction
51-
data class Reply(override val onSelect: () -> Unit) : MessageControlAction
52-
data class Delete(override val onSelect: () -> Unit) : MessageControlAction
66+
data class Copy(override val onSelect: () -> Unit) : MessageControlAction {
67+
override val isDestructive: Boolean = false
68+
69+
override val painter: Painter
70+
@Composable get() = rememberVectorPainter(Icons.Default.ContentCopy)
71+
}
72+
data class Reply(override val onSelect: () -> Unit) : MessageControlAction {
73+
override val isDestructive: Boolean = false
74+
override val painter: Painter
75+
@Composable get() = rememberVectorPainter(Icons.AutoMirrored.Default.Reply)
76+
}
77+
data class Delete(override val onSelect: () -> Unit) : MessageControlAction {
78+
override val isDestructive: Boolean = true
79+
override val painter: Painter
80+
@Composable get() = rememberVectorPainter(Icons.Default.Delete)
81+
}
5382
data class RemoveUser(val name: String, override val onSelect: () -> Unit) :
54-
MessageControlAction
83+
MessageControlAction {
84+
override val isDestructive: Boolean = true
85+
override val painter: Painter
86+
@Composable get() = rememberVectorPainter(Icons.Default.PersonRemove)
87+
}
5588

56-
data class MuteUser(val name: String, override val onSelect: () -> Unit) : MessageControlAction
89+
data class MuteUser(val name: String, override val onSelect: () -> Unit) : MessageControlAction {
90+
override val isDestructive: Boolean = true
91+
override val painter: Painter
92+
@Composable get() = rememberVectorPainter(Icons.Default.VoiceOverOff)
93+
}
5794
data class ReportUserForMessage(val name: String, override val onSelect: () -> Unit) :
58-
MessageControlAction
59-
data class BlockUser(val name: String, override val onSelect: () -> Unit): MessageControlAction
60-
data class UnblockUser(val name: String, override val onSelect: () -> Unit): MessageControlAction
95+
MessageControlAction {
96+
override val isDestructive: Boolean = true
97+
override val painter: Painter
98+
@Composable get() = rememberVectorPainter(Icons.Default.Flag)
99+
}
100+
data class BlockUser(val name: String, override val onSelect: () -> Unit): MessageControlAction {
101+
override val isDestructive: Boolean = true
102+
override val painter: Painter
103+
@Composable get() = rememberVectorPainter(Icons.Default.Block)
104+
}
105+
data class UnblockUser(val name: String, override val onSelect: () -> Unit): MessageControlAction {
106+
override val isDestructive: Boolean = false
107+
override val painter: Painter
108+
@Composable get() = rememberVectorPainter(Icons.Default.Person)
109+
}
61110
}
62111

63112
data class MessageControls(

0 commit comments

Comments
 (0)