Mirrors/NewPipe
1
0
Fork 0
mirror of https://github.com/TeamNewPipe/NewPipe.git synced 2024-11-22 02:53:09 +01:00
Code Issues Releases Activity

Improve comment replies dialog layout

Browse Source
This commit is contained in:
Stypox 2024-11-10 23:28:59 +01:00
parent e6b1341246
commit 802a094154
No known key found for this signature in database
GPG Key ID: 4BDF1B40A49FDD23
2 changed files with 53 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
app/src/main/java/org/schabi/newpipe/ui/components/video/comment/CommentRepliesDialog.kt
View File

@ -6,9 +6,7 @@ import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.rememberLazyListState import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.material3.ExperimentalMaterial3Api import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.HorizontalDivider import androidx.compose.material3.HorizontalDivider
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.ModalBottomSheet import androidx.compose.material3.ModalBottomSheet
import androidx.compose.material3.Surface
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.remember import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope import androidx.compose.runtime.rememberCoroutineScope
@ -65,41 +63,42 @@ private fun CommentRepliesDialog(
val state = rememberLazyListState() val state = rememberLazyListState()
ModalBottomSheet(onDismissRequest = onDismissRequest) { ModalBottomSheet(onDismissRequest = onDismissRequest) {
Surface(color = MaterialTheme.colorScheme.background) { LazyColumnScrollbar(
LazyColumnScrollbar( state = state,
state = state, settings = ScrollbarSettings.Default.copy(
settings = ScrollbarSettings.Default.copy( thumbSelectedColor = md_theme_dark_primary,
thumbSelectedColor = md_theme_dark_primary, thumbUnselectedColor = Color.Red
thumbUnselectedColor = Color.Red )
) ) {
LazyColumn(
modifier = Modifier.nestedScroll(nestedScrollInterop),
state = state
) { ) {
LazyColumn( item {
modifier = Modifier.nestedScroll(nestedScrollInterop), CommentRepliesHeader(comment = parentComment)
state = state HorizontalDivider(
) { thickness = 1.dp,
item { modifier = Modifier.padding(start = 24.dp, end = 24.dp, bottom = 8.dp)
CommentRepliesHeader(comment = parentComment) )
HorizontalDivider(thickness = 1.dp) }
}
if (comments.itemCount == 0) { if (comments.itemCount == 0) {
item { item {
val refresh = comments.loadState.refresh val refresh = comments.loadState.refresh
if (refresh is LoadState.Loading) { if (refresh is LoadState.Loading) {
LoadingIndicator(modifier = Modifier.padding(top = 8.dp)) LoadingIndicator(modifier = Modifier.padding(top = 8.dp))
} else {
val message = if (refresh is LoadState.Error) {
R.string.error_unable_to_load_comments
} else { } else {
val message = if (refresh is LoadState.Error) { R.string.no_comments
R.string.error_unable_to_load_comments
} else {
R.string.no_comments
}
NoItemsMessage(message)
} }
NoItemsMessage(message)
} }
} else { }
items(comments.itemCount) { } else {
Comment(comment = comments[it]!!) items(comments.itemCount) {
} Comment(comment = comments[it]!!)
} }
} }
} }

33
app/src/main/java/org/schabi/newpipe/ui/components/video/comment/CommentRepliesHeader.kt
View File

@ -20,6 +20,7 @@ import androidx.compose.ui.draw.clip
import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import coil.compose.AsyncImage import coil.compose.AsyncImage
@ -43,11 +44,13 @@ fun CommentRepliesHeader(comment: CommentsInfoItem) {
verticalAlignment = Alignment.CenterVertically verticalAlignment = Alignment.CenterVertically
) { ) {
Row( Row(
modifier = Modifier.clickable { modifier = Modifier
NavigationHelper.openCommentAuthorIfPresent(context, comment) .padding(end = 12.dp)
}, .clip(CircleShape)
.clickable { NavigationHelper.openCommentAuthorIfPresent(context, comment) }
.weight(1.0f, true),
horizontalArrangement = Arrangement.spacedBy(8.dp), horizontalArrangement = Arrangement.spacedBy(8.dp),
verticalAlignment = Alignment.CenterVertically verticalAlignment = Alignment.CenterVertically,
) { ) {
AsyncImage( AsyncImage(
model = ImageStrategy.choosePreferredImage(comment.uploaderAvatars), model = ImageStrategy.choosePreferredImage(comment.uploaderAvatars),
@ -60,14 +63,18 @@ fun CommentRepliesHeader(comment: CommentsInfoItem) {
) )
Column { Column {
Text(text = comment.uploaderName) Text(
text = comment.uploaderName,
maxLines = 1,
overflow = TextOverflow.Ellipsis,
style = MaterialTheme.typography.titleSmall,
)
Text( Text(
color = MaterialTheme.colorScheme.secondary,
style = MaterialTheme.typography.bodySmall,
text = Localization.relativeTimeOrTextual( text = Localization.relativeTimeOrTextual(
context, comment.uploadDate, comment.textualUploadDate context, comment.uploadDate, comment.textualUploadDate
) ),
style = MaterialTheme.typography.bodySmall,
) )
} }
} }
@ -80,7 +87,10 @@ fun CommentRepliesHeader(comment: CommentsInfoItem) {
painter = painterResource(R.drawable.ic_thumb_up), painter = painterResource(R.drawable.ic_thumb_up),
contentDescription = stringResource(R.string.detail_likes_img_view_description) contentDescription = stringResource(R.string.detail_likes_img_view_description)
) )
Text(text = Localization.likeCount(context, comment.likeCount)) Text(
text = Localization.likeCount(context, comment.likeCount),
maxLines = 1,
)
if (comment.isHeartedByUploader) { if (comment.isHeartedByUploader) {
Image( Image(
@ -100,7 +110,8 @@ fun CommentRepliesHeader(comment: CommentsInfoItem) {
DescriptionText( DescriptionText(
description = comment.commentText, description = comment.commentText,
style = MaterialTheme.typography.bodyMedium style = MaterialTheme.typography.bodyMedium,
modifier = Modifier.padding(8.dp)
) )
} }
} }
@ -111,7 +122,7 @@ fun CommentRepliesHeader(comment: CommentsInfoItem) {
fun CommentRepliesHeaderPreview() { fun CommentRepliesHeaderPreview() {
val comment = CommentsInfoItem( val comment = CommentsInfoItem(
commentText = Description("Hello world!", Description.PLAIN_TEXT), commentText = Description("Hello world!", Description.PLAIN_TEXT),
uploaderName = "Test", uploaderName = "Test really long lorem ipsum dolor sit",
likeCount = 1000, likeCount = 1000,
isPinned = true, isPinned = true,
isHeartedByUploader = true isHeartedByUploader = true