Skip to content

Commit

Permalink
refactor group message view, put others messages date and checkmarks …
Browse files Browse the repository at this point in the history 
…on the left side of the message box
  • Loading branch information
@zoff99
zoff99 committed Mar 6, 2024
1 parent f18d7ef commit 3a979dc
Show file tree
Hide file tree
Showing 2 changed files with 123 additions and 103 deletions.
124 changes: 63 additions & 61 deletions src/main/kotlin/com/zoffcc/applications/trifa2/ChatMessage.kt
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import androidx.compose.desktop.ui.tooling.preview.Preview
import androidx.compose.foundation.ExperimentalFoundationApi
import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.combinedClickable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
Expand Down Expand Up @@ -43,7 +42,6 @@ import androidx.compose.ui.geometry.Size
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.Outline
import androidx.compose.ui.graphics.Path
import androidx.compose.ui.graphics.RectangleShape
import androidx.compose.ui.graphics.Shape
import androidx.compose.ui.graphics.painter.BitmapPainter
import androidx.compose.ui.graphics.vector.ImageVector
Expand Down Expand Up @@ -193,8 +191,9 @@ inline fun ChatMessage(isMyMessage: Boolean, message: UIMessage, ui_scale: Float
// ---------------- Filetransfer ----------------
// ---------------- Filetransfer ----------------
Row(
horizontalArrangement = Arrangement.End,
modifier = Modifier.randomDebugBorder().padding(all = 0.dp).align(Alignment.End)
horizontalArrangement = if (isMyMessage) Arrangement.End else Arrangement.Start,
modifier = Modifier.randomDebugBorder().padding(all = 0.dp)
.align(if (isMyMessage) Alignment.End else Alignment.Start)
) {
var msg_version_int: Int = 1
if (message.msg_version == 1) {
Expand All @@ -207,65 +206,13 @@ inline fun ChatMessage(isMyMessage: Boolean, message: UIMessage, ui_scale: Float
}
}

// ---------------- message checkmarks (push, delivery) ----------------
// ---------------- message checkmarks (push, delivery) ----------------
if (isMyMessage) {
if (message.read)
{
if (msg_version_int == 2)
{
Box(
modifier = Modifier.height(MESSAGE_CHECKMARKS_CONTAINER_SIZE)
.align(Alignment.Bottom)
.background(Color.Transparent, CircleShape),
) {
Tooltip(text = "Message delivery (confirmed)", textcolor = Color.Black) {
Icon(Icons.Filled.Check, tint = DELIVERY_CHECKMARK_COLOR,
contentDescription = "Message delivered")
Icon(Icons.Filled.Check, tint = DELIVERY_CONFIRM_CHECKMARK_COLOR,
modifier = Modifier.padding(
start = MESSAGE_CHECKMARKS_CONTAINER_SIZE * 0.4f),
contentDescription = "Message delivery (confirmed)")
}
}
}
else
{
IconButton(
modifier = Modifier.size(MESSAGE_CHECKMARKS_CONTAINER_SIZE)
.align(Alignment.Bottom)
.background(Color.Transparent, CircleShape),
icon = Icons.Filled.Check,
iconTint = DELIVERY_CHECKMARK_COLOR,
enabled = false,
iconSize = MESSAGE_CHECKMARKS_ICON_SIZE,
contentDescription = "Message delivered",
onClick = {}
)
}
}
else if (message.sent_push == 1)
{
IconButton(
modifier = Modifier.size(MESSAGE_CHECKMARKS_CONTAINER_SIZE)
.align(Alignment.Bottom)
.background(Color.Transparent, CircleShape),
icon = Icons.Filled.ArrowCircleUp,
iconTint = MESSAGE_PUSH_CHECKMARK_COLOR,
enabled = false,
iconSize = MESSAGE_CHECKMARKS_ICON_SIZE,
contentDescription = "Push Notification sent" + "\n"
+ "The Push Notification does not contain any data," + "\n"
+ "it is only a trigger to wake up the device of the friend",
onClick = {}
)
}
Spacer(modifier = Modifier.width(10.dp))
message_checkmarks(isMyMessage, message, msg_version_int)
message_timestamp_and_info(message, msg_version_int)
} else {
message_timestamp_and_info(message, msg_version_int)
message_checkmarks(isMyMessage, message, msg_version_int)
}
// ---------------- message checkmarks (push, delivery) ----------------
// ---------------- message checkmarks (push, delivery) ----------------

message_timestamp_and_info(message, msg_version_int)
}
}
// -------- Message Content Box --------
Expand All @@ -283,6 +230,61 @@ inline fun ChatMessage(isMyMessage: Boolean, message: UIMessage, ui_scale: Float
}
}

@OptIn(ExperimentalFoundationApi::class)
@Composable
fun message_checkmarks(isMyMessage: Boolean, message: UIMessage, msg_version_int: Int)
{
if (isMyMessage)
{
if (message.read)
{
if (msg_version_int == 2)
{
Box(
modifier = Modifier.height(MESSAGE_CHECKMARKS_CONTAINER_SIZE)
.background(Color.Transparent, CircleShape),
) {
Tooltip(text = "Message delivery (confirmed)", textcolor = Color.Black) {
Icon(Icons.Filled.Check, tint = DELIVERY_CHECKMARK_COLOR,
contentDescription = "Message delivered")
Icon(Icons.Filled.Check, tint = DELIVERY_CONFIRM_CHECKMARK_COLOR,
modifier = Modifier.padding(
start = MESSAGE_CHECKMARKS_CONTAINER_SIZE * 0.4f),
contentDescription = "Message delivery (confirmed)")
}
}
} else
{
IconButton(
modifier = Modifier.size(MESSAGE_CHECKMARKS_CONTAINER_SIZE)
.background(Color.Transparent, CircleShape),
icon = Icons.Filled.Check,
iconTint = DELIVERY_CHECKMARK_COLOR,
enabled = false,
iconSize = MESSAGE_CHECKMARKS_ICON_SIZE,
contentDescription = "Message delivered",
onClick = {}
)
}
} else if (message.sent_push == 1)
{
IconButton(
modifier = Modifier.size(MESSAGE_CHECKMARKS_CONTAINER_SIZE)
.background(Color.Transparent, CircleShape),
icon = Icons.Filled.ArrowCircleUp,
iconTint = MESSAGE_PUSH_CHECKMARK_COLOR,
enabled = false,
iconSize = MESSAGE_CHECKMARKS_ICON_SIZE,
contentDescription = "Push Notification sent" + "\n"
+ "The Push Notification does not contain any data," + "\n"
+ "it is only a trigger to wake up the device of the friend",
onClick = {}
)
}
Spacer(modifier = Modifier.width(10.dp))
}
}

@OptIn(ExperimentalFoundationApi::class)
@Composable
fun outgoing_filetransfer(message: UIMessage, ui_scale: Float)
Expand Down
102 changes: 60 additions & 42 deletions src/main/kotlin/com/zoffcc/applications/trifa2/GroupChatMessage.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ import androidx.compose.material.Text
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Attachment
import androidx.compose.material.icons.filled.BrokenImage
import androidx.compose.material.icons.filled.QuestionMark
import androidx.compose.material.icons.filled.Info
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
Expand Down Expand Up @@ -59,9 +59,6 @@ import com.zoffcc.applications.trifa.HelperOSFile.show_containing_dir_in_explore
import com.zoffcc.applications.trifa.HelperOSFile.show_file_in_explorer_or_open
import com.zoffcc.applications.trifa.TRIFAGlobals
import kotlinx.coroutines.DelicateCoroutinesApi
import kotlinx.coroutines.GlobalScope
import kotlinx.coroutines.launch
import org.briarproject.briar.desktop.contact.getConnectionColor
import org.briarproject.briar.desktop.ui.Tooltip
import java.io.File

Expand Down Expand Up @@ -230,45 +227,16 @@ inline fun GroupChatMessage(isMyMessage: Boolean, groupmessage: UIGroupMessage,
}
}
Row(
horizontalArrangement = Arrangement.End,
modifier = Modifier.randomDebugBorder().padding(all = 0.dp).align(Alignment.End)
horizontalArrangement = if (isMyMessage) Arrangement.End else Arrangement.Start,
modifier = Modifier.randomDebugBorder().padding(all = 0.dp)
.align(if (isMyMessage) Alignment.End else Alignment.Start)
) {
if (groupmessage.was_synced)
{
IconButton(
modifier = Modifier.size(15.dp),
icon = Icons.Filled.QuestionMark,
iconTint = Color.Magenta,
enabled = false,
iconSize = 13.dp,
contentDescription = "Message synced via History sync by other Peers" + "\n" +
"Message contents can not be fully verified",
onClick = {}
)
Spacer(modifier = Modifier.width(10.dp))
}
var message_size_in_bytes = 0
try
{
message_size_in_bytes = groupmessage.text.toByteArray().size
}
catch(_: Exception)
{
}
val is_prv_msg = if (groupmessage.is_private_msg == 1) "yes" else "no"
Tooltip("Message sent at: " + timeToString(groupmessage.timeMs) + "\n" +
"Message ID: " + groupmessage.message_id_tox + "\n" +
"is private Message: " + is_prv_msg + "\n" +
"Sender Peer Pubkey: " + groupmessage.toxpk + "\n" +
"Message size in bytes: " + (if (message_size_in_bytes == 0) "unknown" else message_size_in_bytes) + "\n" +
"was synced: " + groupmessage.was_synced.toString()) {
Text(
modifier = Modifier.padding(all = 0.dp),
text = timeToString(groupmessage.timeMs),
textAlign = TextAlign.End,
style = MaterialTheme.typography.subtitle1.copy(fontSize = 10.sp, lineHeight = TextUnit.Unspecified),
color = ChatColorsConfig.TIME_TEXT
)
if (isMyMessage) {
message_checkmarks(groupmessage, isMyMessage)
message_timestamp_and_info(groupmessage)
} else {
message_timestamp_and_info(groupmessage)
message_checkmarks(groupmessage, isMyMessage)
}
}
}
Expand All @@ -284,7 +252,57 @@ inline fun GroupChatMessage(isMyMessage: Boolean, groupmessage: UIGroupMessage,
}
}

@OptIn(ExperimentalFoundationApi::class)
@Composable
fun message_timestamp_and_info(groupmessage: UIGroupMessage)
{
var message_size_in_bytes = 0
try
{
message_size_in_bytes = groupmessage.text.toByteArray().size
} catch (_: Exception)
{
}
val is_prv_msg = if (groupmessage.is_private_msg == 1) "yes" else "no"
Tooltip("Message sent at: " + timeToString(groupmessage.timeMs) + "\n" +
"Message ID: " + groupmessage.message_id_tox + "\n" +
"is private Message: " + is_prv_msg + "\n" +
"Sender Peer Pubkey: " + groupmessage.toxpk + "\n" +
"Message size in bytes: " + (if (message_size_in_bytes == 0) "unknown" else message_size_in_bytes) + "\n" +
"was synced: " + groupmessage.was_synced.toString()) {
Text(
modifier = Modifier.padding(all = 0.dp),
text = timeToString(groupmessage.timeMs),
textAlign = TextAlign.End,
style = MaterialTheme.typography.subtitle1.copy(fontSize = 10.sp, lineHeight = TextUnit.Unspecified),
color = ChatColorsConfig.TIME_TEXT
)
}
}

@Composable
fun message_checkmarks(groupmessage: UIGroupMessage, isMyMessage: Boolean)
{
if (groupmessage.was_synced)
{
if (!isMyMessage) {
Spacer(modifier = Modifier.width(10.dp))
}
IconButton(
modifier = Modifier.size(15.dp),
icon = Icons.Filled.Info,
iconTint = Color.Magenta,
enabled = false,
iconSize = 13.dp,
contentDescription = "Message synced via History sync by other Peers" + "\n" +
"Message contents can not be fully verified",
onClick = {}
)
if (isMyMessage) {
Spacer(modifier = Modifier.width(10.dp))
}
}
}

// Adapted from https://stackoverflow.com/questions/65965852/jetpack-compose-create-chat-bubble-with-arrow-and-border-elevation
class GroupTriangleEdgeShape(val risingToTheRight: Boolean) : Shape {
Expand Down

0 comments on commit 3a979dc

Please sign in to comment.