|
|
|
@ -47,9 +47,6 @@ import androidx.compose.ui.tooling.preview.Preview |
|
|
|
import com.example.dattingapp.dataclass.CommentResponse |
|
|
|
import com.example.dattingapp.dataclass.Location |
|
|
|
|
|
|
|
// Color definitions matching the design palette |
|
|
|
val PrimaryDarkText = Color(0xFF1E1E1E) |
|
|
|
val SecondaryGrayText = Color(0xFF757575) |
|
|
|
val AccentPink = Color(0xFFD81B60) |
|
|
|
val CommentBubbleBg = Color(0xFFF6F6F6) |
|
|
|
|
|
|
|
@ -97,15 +94,6 @@ class ShowPostingActivity : ComponentActivity() { |
|
|
|
PostCard( |
|
|
|
post = state.post, |
|
|
|
comments = comments, |
|
|
|
onAddComment = { commentText -> |
|
|
|
val currentUserName = state.post.author?.full_name |
|
|
|
showPostViewModel.addCommentLocallyAndServer( |
|
|
|
context = context, |
|
|
|
postId = postId, |
|
|
|
content = commentText, |
|
|
|
currentUserName = currentUserName |
|
|
|
) |
|
|
|
} |
|
|
|
) |
|
|
|
} |
|
|
|
} |
|
|
|
@ -128,7 +116,6 @@ class ShowPostingActivity : ComponentActivity() { |
|
|
|
fun PostCard( |
|
|
|
post: ShowPostResponse, |
|
|
|
comments: List<CommentResponse>, |
|
|
|
onAddComment: (String) -> Unit = {}, |
|
|
|
modifier: Modifier = Modifier |
|
|
|
) { |
|
|
|
Column( |
|
|
|
@ -223,12 +210,12 @@ fun PostCard( |
|
|
|
) { |
|
|
|
IconButton(onClick = { /* Handle like action */ }) { |
|
|
|
Icon( |
|
|
|
imageVector = if (post.likedByMe) Icons.Filled.Favorite else Icons.Default.FavoriteBorder, |
|
|
|
imageVector = if (post.liked_by_me) Icons.Filled.Favorite else Icons.Default.FavoriteBorder, |
|
|
|
contentDescription = "Like", |
|
|
|
tint = if (post.likedByMe) Color.Red else Color.Black |
|
|
|
tint = if (post.liked_by_me) Color.Red else Color.Black |
|
|
|
) |
|
|
|
} |
|
|
|
Text(text = "${post.likeCount}") |
|
|
|
Text(text = "${post.like_count}") |
|
|
|
|
|
|
|
Spacer(modifier = Modifier.width(16.dp)) |
|
|
|
|
|
|
|
@ -238,13 +225,14 @@ fun PostCard( |
|
|
|
contentDescription = "Comments" |
|
|
|
) |
|
|
|
} |
|
|
|
Text(text = "${post.commentCount}") |
|
|
|
Text(text = "${comments.size}") |
|
|
|
} |
|
|
|
|
|
|
|
// --- 5. Comment Section UI --- |
|
|
|
CommentSection( |
|
|
|
comments = comments, |
|
|
|
onAddCommentClick = onAddComment |
|
|
|
postId = post.id, |
|
|
|
currentUserName = post.author?.full_name // see note below |
|
|
|
) |
|
|
|
} |
|
|
|
} |
|
|
|
@ -252,10 +240,14 @@ fun PostCard( |
|
|
|
@Composable |
|
|
|
fun CommentSection( |
|
|
|
comments: List<CommentResponse>, |
|
|
|
onAddCommentClick: (String) -> Unit |
|
|
|
postId: Int, |
|
|
|
currentUserName: String?, |
|
|
|
viewModel: ShowPostViewModel = viewModel() |
|
|
|
) { |
|
|
|
val context = LocalContext.current |
|
|
|
var newCommentText by remember { mutableStateOf("") } |
|
|
|
|
|
|
|
|
|
|
|
Column( |
|
|
|
modifier = Modifier |
|
|
|
.fillMaxWidth() |
|
|
|
@ -267,7 +259,54 @@ fun CommentSection( |
|
|
|
fontWeight = FontWeight.Bold, |
|
|
|
modifier = Modifier.padding(bottom = 8.dp) |
|
|
|
) |
|
|
|
// Bottom Comment Input Field Bar |
|
|
|
Row( |
|
|
|
modifier = Modifier |
|
|
|
.fillMaxWidth() |
|
|
|
.background(CommentBubbleBg, shape = RoundedCornerShape(24.dp)) |
|
|
|
.padding(horizontal = 12.dp, vertical = 4.dp), |
|
|
|
verticalAlignment = Alignment.CenterVertically |
|
|
|
) { |
|
|
|
BasicTextField( |
|
|
|
value = newCommentText, |
|
|
|
onValueChange = { newCommentText = it }, |
|
|
|
modifier = Modifier |
|
|
|
.weight(1f) |
|
|
|
.padding(vertical = 8.dp), |
|
|
|
decorationBox = { innerTextField -> |
|
|
|
if (newCommentText.isEmpty()) { |
|
|
|
Text( |
|
|
|
text = "Add a comment...", |
|
|
|
color = Color.Gray, |
|
|
|
style = MaterialTheme.typography.bodyMedium |
|
|
|
) |
|
|
|
} |
|
|
|
innerTextField() |
|
|
|
} |
|
|
|
) |
|
|
|
|
|
|
|
IconButton( |
|
|
|
onClick = { |
|
|
|
if (newCommentText.isNotBlank()) { |
|
|
|
viewModel.addCommentLocallyAndServer( |
|
|
|
context = context, |
|
|
|
postId = postId, |
|
|
|
content = newCommentText, |
|
|
|
currentUserName = currentUserName |
|
|
|
) |
|
|
|
newCommentText = "" |
|
|
|
} |
|
|
|
}, |
|
|
|
modifier = Modifier.size(32.dp) |
|
|
|
) { |
|
|
|
Icon( |
|
|
|
imageVector = Icons.Default.Send, |
|
|
|
contentDescription = "Send Comment", |
|
|
|
tint = AccentPink, |
|
|
|
modifier = Modifier.size(16.dp) |
|
|
|
) |
|
|
|
} |
|
|
|
} |
|
|
|
// List of fetched comments |
|
|
|
comments.reversed().forEach { comment -> |
|
|
|
Row( |
|
|
|
@ -314,49 +353,7 @@ fun CommentSection( |
|
|
|
|
|
|
|
Spacer(modifier = Modifier.height(8.dp)) |
|
|
|
|
|
|
|
// Bottom Comment Input Field Bar |
|
|
|
Row( |
|
|
|
modifier = Modifier |
|
|
|
.fillMaxWidth() |
|
|
|
.background(CommentBubbleBg, shape = RoundedCornerShape(24.dp)) |
|
|
|
.padding(horizontal = 12.dp, vertical = 4.dp), |
|
|
|
verticalAlignment = Alignment.CenterVertically |
|
|
|
) { |
|
|
|
BasicTextField( |
|
|
|
value = newCommentText, |
|
|
|
onValueChange = { newCommentText = it }, |
|
|
|
modifier = Modifier |
|
|
|
.weight(1f) |
|
|
|
.padding(vertical = 8.dp), |
|
|
|
decorationBox = { innerTextField -> |
|
|
|
if (newCommentText.isEmpty()) { |
|
|
|
Text( |
|
|
|
text = "Add a comment...", |
|
|
|
color = Color.Gray, |
|
|
|
style = MaterialTheme.typography.bodyMedium |
|
|
|
) |
|
|
|
} |
|
|
|
innerTextField() |
|
|
|
} |
|
|
|
) |
|
|
|
|
|
|
|
IconButton( |
|
|
|
onClick = { |
|
|
|
if (newCommentText.isNotBlank()) { |
|
|
|
onAddCommentClick(newCommentText) |
|
|
|
newCommentText = "" |
|
|
|
} |
|
|
|
}, |
|
|
|
modifier = Modifier.size(32.dp) |
|
|
|
) { |
|
|
|
Icon( |
|
|
|
imageVector = Icons.Default.Send, |
|
|
|
contentDescription = "Send Comment", |
|
|
|
tint = AccentPink, |
|
|
|
modifier = Modifier.size(16.dp) |
|
|
|
) |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
@Preview(showBackground = true, backgroundColor = 0xFFFFFFFF) |
|
|
|
@ -382,9 +379,9 @@ fun ShowPostScreenPreview() { |
|
|
|
country = "China", |
|
|
|
compatibilityPercentage = 95 |
|
|
|
), |
|
|
|
likeCount = 12, |
|
|
|
commentCount = 2, |
|
|
|
likedByMe = true, |
|
|
|
like_count = 12, |
|
|
|
comment_count = 2, |
|
|
|
liked_by_me = true, |
|
|
|
media = listOf( |
|
|
|
com.example.dattingapp.dataclass.MediaItem( |
|
|
|
id = 5, |
|
|
|
@ -438,9 +435,6 @@ fun ShowPostScreenPreview() { |
|
|
|
PostCard( |
|
|
|
post = mockPost, |
|
|
|
comments = mockComments, |
|
|
|
onAddComment = { newComment -> |
|
|
|
// Preview action handler |
|
|
|
} |
|
|
|
) |
|
|
|
} |
|
|
|
} |
|
|
|
|