Skip to content

Commit bc6b0ad

Browse files
authored
Merge pull request #10205 from dani-zilla/feat/10083/message-list-item-account-indicator
feat(message-list): Create Message List Item Account Indicator Chip
2 parents 39afcf4 + 34a0a3a commit bc6b0ad

File tree

16 files changed

+468
-4
lines changed

16 files changed

+468
-4
lines changed

app-ui-catalog/src/main/kotlin/net/thunderbird/ui/catalog/ui/page/organism/items/message/CatalogMessageItems.kt

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ import androidx.compose.runtime.setValue
2323
import androidx.compose.ui.Alignment
2424
import androidx.compose.ui.Modifier
2525
import androidx.compose.ui.draw.clip
26+
import androidx.compose.ui.graphics.Color
2627
import androidx.compose.ui.unit.dp
2728
import app.k9mail.core.ui.compose.designsystem.atom.DividerHorizontal
2829
import app.k9mail.core.ui.compose.designsystem.atom.text.TextLabelSmall
@@ -71,6 +72,7 @@ fun LazyGridScope.messageItems() {
7172
swapSenderAndSubject = false,
7273
randomizeAttachment = false,
7374
maxPreviewLines = 2,
75+
showAccountIndicator = true,
7476
),
7577
)
7678
}
@@ -85,6 +87,7 @@ fun LazyGridScope.messageItems() {
8587
onSwapSenderAndSubjectChange = { config = config.copy(swapSenderAndSubject = it) },
8688
onRandomizeAttachmentChange = { config = config.copy(randomizeAttachment = it) },
8789
onMaxPreviewLines = { config = config.copy(maxPreviewLines = it) },
90+
onShowAccountIndicator = { config = config.copy(showAccountIndicator = it) },
8891
)
8992
DividerHorizontal(modifier = Modifier.padding(MainTheme.spacings.default))
9093
CatalogMessageItems(config = config)
@@ -101,6 +104,7 @@ private data class MessageItemConfiguration(
101104
val swapSenderAndSubject: Boolean,
102105
val randomizeAttachment: Boolean,
103106
val maxPreviewLines: Int,
107+
val showAccountIndicator: Boolean,
104108
)
105109

106110
@Suppress("LongMethod")
@@ -116,6 +120,7 @@ private fun MessageItemConfiguration(
116120
onSwapSenderAndSubjectChange: (Boolean) -> Unit = {},
117121
onRandomizeAttachmentChange: (Boolean) -> Unit = {},
118122
onMaxPreviewLines: (Int) -> Unit = {},
123+
onShowAccountIndicator: (Boolean) -> Unit = {},
119124
) {
120125
Column(
121126
modifier = modifier,
@@ -141,6 +146,11 @@ private fun MessageItemConfiguration(
141146
onCheckedChange = onRandomizeAttachmentChange,
142147
checked = config.randomizeAttachment,
143148
)
149+
CheckboxInput(
150+
text = "Show Account Indicator",
151+
onCheckedChange = onShowAccountIndicator,
152+
checked = config.showAccountIndicator,
153+
)
144154
TextFieldOutlined(
145155
value = config.sender,
146156
label = "Sender",
@@ -240,6 +250,8 @@ private fun ColumnScope.CatalogNewMessageItem(
240250
if (config.randomizeAttachment) Random.nextBoolean() else false
241251
},
242252
maxPreviewLines = config.maxPreviewLines,
253+
showAccountIndicator = config.showAccountIndicator,
254+
accountIndicatorColor = Color.Magenta,
243255
)
244256

245257
SnackbarHost(snackbarHostState)
@@ -295,6 +307,8 @@ private fun ColumnScope.CatalogUnreadMessageItem(
295307
if (config.randomizeAttachment) Random.nextBoolean() else false
296308
},
297309
maxPreviewLines = config.maxPreviewLines,
310+
showAccountIndicator = config.showAccountIndicator,
311+
accountIndicatorColor = Color.Magenta,
298312
)
299313

300314
SnackbarHost(snackbarHostState)
@@ -350,6 +364,8 @@ private fun ColumnScope.CatalogReadMessageItem(
350364
if (config.randomizeAttachment) Random.nextBoolean() else false
351365
},
352366
maxPreviewLines = config.maxPreviewLines,
367+
showAccountIndicator = config.showAccountIndicator,
368+
accountIndicatorColor = Color.Magenta,
353369
)
354370

355371
SnackbarHost(snackbarHostState)
@@ -405,6 +421,8 @@ private fun ColumnScope.CatalogActiveMessageItem(
405421
if (config.randomizeAttachment) Random.nextBoolean() else false
406422
},
407423
maxPreviewLines = config.maxPreviewLines,
424+
showAccountIndicator = config.showAccountIndicator,
425+
accountIndicatorColor = Color.Magenta,
408426
)
409427

410428
SnackbarHost(snackbarHostState)
@@ -457,6 +475,8 @@ private fun ColumnScope.CatalogJunkMessageItem(
457475
if (config.randomizeAttachment) Random.nextBoolean() else false
458476
},
459477
maxPreviewLines = config.maxPreviewLines,
478+
showAccountIndicator = config.showAccountIndicator,
479+
accountIndicatorColor = Color.Magenta,
460480
)
461481

462482
SnackbarHost(snackbarHostState)

core/ui/compose/designsystem/src/debug/kotlin/net/thunderbird/core/ui/compose/designsystem/organism/message/ActiveMessageItemPreview.kt

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import androidx.compose.foundation.shape.CircleShape
99
import androidx.compose.runtime.Composable
1010
import androidx.compose.ui.Alignment
1111
import androidx.compose.ui.Modifier
12+
import androidx.compose.ui.graphics.Color
1213
import androidx.compose.ui.tooling.preview.Preview
1314
import androidx.compose.ui.tooling.preview.PreviewParameter
1415
import androidx.compose.ui.tooling.preview.datasource.CollectionPreviewParameterProvider
@@ -118,6 +119,8 @@ private fun PreviewDefault(
118119
subject = params.subject,
119120
preview = params.preview,
120121
receivedAt = @OptIn(ExperimentalTime::class) Clock.System.now().toLocalDateTime(TimeZone.UTC),
122+
showAccountIndicator = true,
123+
accountIndicatorColor = Color.Red,
121124
avatar = {
122125
Box(
123126
modifier = Modifier
@@ -156,6 +159,8 @@ private fun PreviewCompact(
156159
subject = params.subject,
157160
preview = params.preview,
158161
receivedAt = @OptIn(ExperimentalTime::class) Clock.System.now().toLocalDateTime(TimeZone.UTC),
162+
showAccountIndicator = true,
163+
accountIndicatorColor = Color.Red,
159164
avatar = { },
160165
onClick = { },
161166
onLongClick = { },
@@ -183,6 +188,8 @@ private fun PreviewRelaxed(
183188
subject = params.subject,
184189
preview = params.preview,
185190
receivedAt = @OptIn(ExperimentalTime::class) Clock.System.now().toLocalDateTime(TimeZone.UTC),
191+
showAccountIndicator = true,
192+
accountIndicatorColor = Color.Red,
186193
avatar = { },
187194
onClick = { },
188195
onLongClick = { },
@@ -198,3 +205,43 @@ private fun PreviewRelaxed(
198205
)
199206
}
200207
}
208+
209+
@Preview
210+
@Composable
211+
private fun PreviewDefaultWithoutAccountIndicator(
212+
@PreviewParameter(ActiveMessageItemPrevParamCol::class) params: MessageItemPrevParams,
213+
) {
214+
PreviewWithThemes {
215+
ActiveMessageItem(
216+
sender = params.sender,
217+
subject = params.subject,
218+
preview = params.preview,
219+
receivedAt = @OptIn(ExperimentalTime::class) Clock.System.now().toLocalDateTime(TimeZone.UTC),
220+
avatar = {
221+
Box(
222+
modifier = Modifier
223+
.size(MainTheme.sizes.iconAvatar)
224+
.background(
225+
color = MainTheme.colors.primaryContainer.copy(alpha = 0.15f),
226+
shape = CircleShape,
227+
)
228+
.border(width = 1.dp, color = MainTheme.colors.primary, shape = CircleShape),
229+
) {
230+
TextTitleSmall(text = "SN", modifier = Modifier.align(Alignment.Center))
231+
}
232+
},
233+
onClick = { },
234+
onLongClick = { },
235+
onLeadingClick = { },
236+
onFavouriteChange = { },
237+
modifier = Modifier.padding(MainTheme.spacings.double),
238+
hasAttachments = params.hasAttachments,
239+
selected = params.selected,
240+
favourite = params.favourite,
241+
threadCount = params.threadCount,
242+
swapSenderWithSubject = params.swapSenderWithSubject,
243+
showAccountIndicator = false,
244+
accountIndicatorColor = null,
245+
)
246+
}
247+
}

core/ui/compose/designsystem/src/debug/kotlin/net/thunderbird/core/ui/compose/designsystem/organism/message/JunkMessageItemPreview.kt

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import androidx.compose.foundation.shape.CircleShape
99
import androidx.compose.runtime.Composable
1010
import androidx.compose.ui.Alignment
1111
import androidx.compose.ui.Modifier
12+
import androidx.compose.ui.graphics.Color
1213
import androidx.compose.ui.tooling.preview.Preview
1314
import androidx.compose.ui.tooling.preview.PreviewParameter
1415
import androidx.compose.ui.tooling.preview.datasource.CollectionPreviewParameterProvider
@@ -134,6 +135,8 @@ private fun PreviewDefault(
134135
selected = params.selected,
135136
threadCount = params.threadCount,
136137
swapSenderWithSubject = params.swapSenderWithSubject,
138+
showAccountIndicator = true,
139+
accountIndicatorColor = Color.Red,
137140
)
138141
}
139142
}
@@ -159,6 +162,8 @@ private fun PreviewCompact(
159162
threadCount = params.threadCount,
160163
swapSenderWithSubject = params.swapSenderWithSubject,
161164
contentPadding = MessageItemDefaults.compactContentPadding,
165+
showAccountIndicator = true,
166+
accountIndicatorColor = Color.Red,
162167
)
163168
}
164169
}
@@ -184,6 +189,46 @@ private fun PreviewRelaxed(
184189
threadCount = params.threadCount,
185190
swapSenderWithSubject = params.swapSenderWithSubject,
186191
contentPadding = MessageItemDefaults.relaxedContentPadding,
192+
showAccountIndicator = true,
193+
accountIndicatorColor = Color.Red,
194+
)
195+
}
196+
}
197+
198+
@Preview
199+
@Composable
200+
private fun PreviewDefaultWithoutAccountIndicator(
201+
@PreviewParameter(JunkMessageItemPrevParamCol::class) params: MessageItemPrevParams,
202+
) {
203+
PreviewWithThemes {
204+
JunkMessageItem(
205+
sender = params.sender,
206+
subject = params.subject,
207+
preview = params.preview,
208+
receivedAt = @OptIn(ExperimentalTime::class) Clock.System.now().toLocalDateTime(TimeZone.UTC),
209+
avatar = {
210+
Box(
211+
modifier = Modifier
212+
.size(MainTheme.sizes.iconAvatar)
213+
.background(
214+
color = MainTheme.colors.primaryContainer.copy(alpha = 0.15f),
215+
shape = CircleShape,
216+
)
217+
.border(width = 1.dp, color = MainTheme.colors.primary, shape = CircleShape),
218+
) {
219+
TextTitleSmall(text = "SN", modifier = Modifier.align(Alignment.Center))
220+
}
221+
},
222+
onClick = { },
223+
onLongClick = { },
224+
onLeadingClick = { },
225+
modifier = Modifier.padding(MainTheme.spacings.double),
226+
hasAttachments = params.hasAttachments,
227+
selected = params.selected,
228+
threadCount = params.threadCount,
229+
swapSenderWithSubject = params.swapSenderWithSubject,
230+
showAccountIndicator = false,
231+
accountIndicatorColor = null,
187232
)
188233
}
189234
}

core/ui/compose/designsystem/src/debug/kotlin/net/thunderbird/core/ui/compose/designsystem/organism/message/MessageItemPreview.kt

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import androidx.compose.foundation.shape.CircleShape
99
import androidx.compose.material3.IconButton
1010
import androidx.compose.runtime.Composable
1111
import androidx.compose.ui.Modifier
12+
import androidx.compose.ui.graphics.Color
1213
import androidx.compose.ui.tooling.preview.Preview
1314
import androidx.compose.ui.tooling.preview.PreviewParameter
1415
import androidx.compose.ui.tooling.preview.datasource.CollectionPreviewParameterProvider
@@ -119,6 +120,8 @@ private fun PreviewDefault(
119120
hasAttachments = params.hasAttachments,
120121
selected = params.selected,
121122
colors = MessageItemDefaults.newMessageItemColors(),
123+
showAccountIndicator = true,
124+
accountIndicatorColor = Color.Red,
122125
)
123126
}
124127
}
@@ -157,6 +160,8 @@ private fun PreviewCompact(
157160
selected = params.selected,
158161
contentPadding = MessageItemDefaults.compactContentPadding,
159162
colors = MessageItemDefaults.unreadMessageItemColors(),
163+
showAccountIndicator = true,
164+
accountIndicatorColor = Color.Red,
160165
)
161166
}
162167
}
@@ -196,6 +201,48 @@ private fun PreviewRelaxed(
196201
selected = params.selected,
197202
contentPadding = MessageItemDefaults.relaxedContentPadding,
198203
colors = MessageItemDefaults.readMessageItemColors(),
204+
showAccountIndicator = true,
205+
accountIndicatorColor = Color.Red,
206+
)
207+
}
208+
}
209+
210+
@Preview
211+
@Composable
212+
private fun PreviewDefaultWithoutAccountIndicator(
213+
@PreviewParameter(MessageItemPrevParamCol::class) params: MessageItemPrevParams,
214+
) {
215+
PreviewWithThemes {
216+
MessageItem(
217+
leading = {
218+
Box(
219+
modifier = Modifier
220+
.size(MainTheme.sizes.iconAvatar)
221+
.padding(MainTheme.spacings.half)
222+
.background(color = MainTheme.colors.primary, shape = CircleShape),
223+
)
224+
},
225+
sender = { TextTitleSmall(text = params.sender) },
226+
subject = { TextLabelLarge(text = params.subject) },
227+
preview = params.preview,
228+
action = {
229+
IconButton(
230+
onClick = { },
231+
modifier = Modifier.size(MainTheme.sizes.iconLarge),
232+
) {
233+
Image(imageVector = Icons.Filled.Star, contentDescription = null)
234+
}
235+
},
236+
receivedAt = params.receivedAt,
237+
onClick = { },
238+
onLongClick = { },
239+
onLeadingClick = { },
240+
modifier = Modifier.padding(MainTheme.spacings.double),
241+
hasAttachments = params.hasAttachments,
242+
selected = params.selected,
243+
colors = MessageItemDefaults.newMessageItemColors(),
244+
showAccountIndicator = false,
245+
accountIndicatorColor = null,
199246
)
200247
}
201248
}

core/ui/compose/designsystem/src/debug/kotlin/net/thunderbird/core/ui/compose/designsystem/organism/message/NewMessageItemPreview.kt

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import androidx.compose.foundation.shape.CircleShape
99
import androidx.compose.runtime.Composable
1010
import androidx.compose.ui.Alignment
1111
import androidx.compose.ui.Modifier
12+
import androidx.compose.ui.graphics.Color
1213
import androidx.compose.ui.tooling.preview.Preview
1314
import androidx.compose.ui.tooling.preview.PreviewParameter
1415
import androidx.compose.ui.tooling.preview.datasource.CollectionPreviewParameterProvider
@@ -141,6 +142,8 @@ private fun PreviewDefault(
141142
favourite = params.favourite,
142143
threadCount = params.threadCount,
143144
swapSenderWithSubject = params.swapSenderWithSubject,
145+
showAccountIndicator = true,
146+
accountIndicatorColor = Color.Red,
144147
)
145148
}
146149
}
@@ -168,6 +171,8 @@ private fun PreviewCompact(
168171
contentPadding = MessageItemDefaults.compactContentPadding,
169172
threadCount = params.threadCount,
170173
swapSenderWithSubject = params.swapSenderWithSubject,
174+
showAccountIndicator = true,
175+
accountIndicatorColor = Color.Red,
171176
)
172177
}
173178
}
@@ -195,6 +200,48 @@ private fun PreviewRelaxed(
195200
contentPadding = MessageItemDefaults.relaxedContentPadding,
196201
threadCount = params.threadCount,
197202
swapSenderWithSubject = params.swapSenderWithSubject,
203+
showAccountIndicator = true,
204+
accountIndicatorColor = Color.Red,
205+
)
206+
}
207+
}
208+
209+
@Preview
210+
@Composable
211+
private fun PreviewDefaultWithoutAccountIndicator(
212+
@PreviewParameter(NewMessageItemPrevParamCol::class) params: MessageItemPrevParams,
213+
) {
214+
PreviewWithThemes {
215+
NewMessageItem(
216+
sender = params.sender,
217+
subject = params.subject,
218+
preview = params.preview,
219+
receivedAt = @OptIn(ExperimentalTime::class) Clock.System.now().toLocalDateTime(TimeZone.UTC),
220+
avatar = {
221+
Box(
222+
modifier = Modifier
223+
.size(MainTheme.sizes.iconAvatar)
224+
.background(
225+
color = MainTheme.colors.primaryContainer.copy(alpha = 0.15f),
226+
shape = CircleShape,
227+
)
228+
.border(width = 1.dp, color = MainTheme.colors.primary, shape = CircleShape),
229+
) {
230+
TextTitleSmall(text = "SN", modifier = Modifier.align(Alignment.Center))
231+
}
232+
},
233+
onClick = { },
234+
onLongClick = { },
235+
onLeadingClick = { },
236+
onFavouriteChange = { },
237+
modifier = Modifier.padding(MainTheme.spacings.double),
238+
hasAttachments = params.hasAttachments,
239+
selected = params.selected,
240+
favourite = params.favourite,
241+
threadCount = params.threadCount,
242+
swapSenderWithSubject = params.swapSenderWithSubject,
243+
showAccountIndicator = false,
244+
accountIndicatorColor = null,
198245
)
199246
}
200247
}

0 commit comments

Comments
 (0)