Skip to content

Commit 00149be

Browse files
lambiengcodelambiengcode
committed
feat(chatgpt): show markdown answer
1 parent 1764c23 commit 00149be

File tree

8 files changed

+122
-40
lines changed

8 files changed

+122
-40
lines changed

‎app/build.gradle‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -105,6 +105,12 @@ dependencies {
105105
implementation "com.squareup.retrofit2:converter-gson:$retrofit_version"
106106
implementation "com.squareup.okhttp3:okhttp:$okhttp_version"
107107
implementation "com.squareup.okhttp3:logging-interceptor:$okhttp_version"
108+
109+
// UI/UX Utils
110+
def richtext_version = '0.16.0'
111+
implementation "com.halilibo.compose-richtext:richtext-commonmark:${richtext_version}"
112+
implementation "com.halilibo.compose-richtext:richtext-ui-material:${richtext_version}"
113+
implementation "com.halilibo.compose-richtext:richtext-ui-material3:${richtext_version}"
108114
}
109115

110116
// Allow references to generated code

‎app/src/main/java/com/chatgptlite/wanted/constants/Constants.kt‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
package com.chatgptlite.wanted.constants
22

3-
const val openAIApiKey = "api_key_here"
3+
const val openAIApiKey = "<api_key_here>"
44

55
const val urlToImageAppIcon = "https://res.cloudinary.com/apideck/image/upload/v1672442492/marketplaces/ckhg56iu1mkpc0b66vj7fsj3o/listings/-4-ans_frontend_assets.images.poe.app_icon.png-26-8aa0a2e5f237894d_tbragv.png"
66
const val urlToImageAuthor = "https://avatars.githubusercontent.com/u/60530946?v=4"

‎app/src/main/java/com/chatgptlite/wanted/data/remote/OpenAIRepositoryImpl.kt‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ import com.chatgptlite.wanted.models.toJson
88
import com.google.gson.Gson
99
import com.google.gson.JsonObject
1010
import kotlinx.coroutines.Dispatchers
11-
import kotlinx.coroutines.channels.awaitClose
1211
import kotlinx.coroutines.flow.Flow
1312
import kotlinx.coroutines.flow.callbackFlow
1413
import kotlinx.coroutines.withContext

‎app/src/main/java/com/chatgptlite/wanted/ui/conversations/Conversation.kt‎

Lines changed: 3 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,22 @@
11
package com.chatgptlite.wanted.ui.conversations
22

3-
import androidx.compose.foundation.background
43
import androidx.compose.foundation.layout.*
54
import androidx.compose.foundation.lazy.LazyColumn
65
import androidx.compose.foundation.lazy.rememberLazyListState
7-
import androidx.compose.foundation.shape.RoundedCornerShape
86
import androidx.compose.material3.Surface
9-
import androidx.compose.material3.Text
107
import androidx.compose.runtime.Composable
118
import androidx.compose.runtime.collectAsState
129
import androidx.compose.runtime.getValue
13-
import androidx.compose.ui.Alignment
1410
import androidx.compose.ui.Modifier
1511
import androidx.compose.ui.platform.testTag
16-
import androidx.compose.ui.text.style.TextAlign
1712
import androidx.compose.ui.tooling.preview.Preview
1813
import androidx.compose.ui.unit.dp
19-
import androidx.compose.ui.unit.sp
2014
import androidx.hilt.navigation.compose.hiltViewModel
2115
import com.chatgptlite.wanted.models.MessageModel
16+
import com.chatgptlite.wanted.ui.conversations.components.MessageCard
2217
import com.chatgptlite.wanted.ui.conversations.components.TextInput
2318
import com.chatgptlite.wanted.ui.conversations.ui.theme.ChatGPTLiteTheme
24-
import com.chatgptlite.wanted.ui.theme.*
19+
import com.chatgptlite.wanted.ui.theme.BackGroundColor
2520

2621
@Composable
2722
fun Conversation() {
@@ -84,33 +79,7 @@ fun MessageList(
8479
}
8580
}
8681

87-
@Composable
88-
fun MessageCard(message: MessageModel, isHuman: Boolean = false, isLast: Boolean = false) {
89-
Column(
90-
horizontalAlignment = if (isHuman) Alignment.End else Alignment.Start,
91-
modifier = Modifier
92-
.fillMaxWidth()
93-
.padding(vertical = 4.dp)
94-
.padding(top = if (isLast) 120.dp else 0.dp)
95-
) {
96-
Box(
97-
modifier = Modifier
98-
.widthIn(0.dp, 260.dp) //mention max width here
99-
.background(
100-
if (isHuman) BackGroundMessageHuman else BackGroundMessageGPT,
101-
shape = RoundedCornerShape(12.dp)
102-
),
103-
) {
104-
Text(
105-
text = if (isHuman) message.question else message.answer,
106-
fontSize = 13.sp,
107-
color = if (isHuman) ColorTextHuman else ColorTextGPT,
108-
modifier = Modifier.padding(horizontal = 18.dp, vertical = 12.dp),
109-
textAlign = TextAlign.Justify,
110-
)
111-
}
112-
}
113-
}
82+
11483

11584
@Preview(showBackground = true)
11685
@Composable

‎app/src/main/java/com/chatgptlite/wanted/ui/conversations/ConversationViewModel.kt‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -148,7 +148,12 @@ Bot:${if (message.answer == "Let me thinking...") "" else message.answer.trim()}
148148
val messagesMap: HashMap<String, MutableList<MessageModel>> =
149149
_messages.value.clone() as HashMap<String, MutableList<MessageModel>>
150150

151-
val response: MutableList<MessageTurbo> = mutableListOf()
151+
val response: MutableList<MessageTurbo> = mutableListOf(
152+
MessageTurbo(
153+
role = TurboRole.system,
154+
content = "Markdown style if exists code"
155+
)
156+
)
152157

153158
for (message in messagesMap[conversationId]!!.reversed()) {
154159
response.add(MessageTurbo(content = message.question))

‎app/src/main/java/com/chatgptlite/wanted/ui/conversations/components/MessageCard.kt‎

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
package com.chatgptlite.wanted.ui.conversations.components
2+
3+
import androidx.compose.foundation.background
4+
import androidx.compose.foundation.layout.*
5+
import androidx.compose.foundation.shape.RoundedCornerShape
6+
import androidx.compose.material3.Text
7+
import androidx.compose.runtime.Composable
8+
import androidx.compose.ui.Alignment
9+
import androidx.compose.ui.Modifier
10+
import androidx.compose.ui.graphics.Color
11+
import androidx.compose.ui.text.TextStyle
12+
import androidx.compose.ui.text.font.FontFamily
13+
import androidx.compose.ui.text.font.FontWeight
14+
import androidx.compose.ui.text.style.TextAlign
15+
import androidx.compose.ui.unit.dp
16+
import androidx.compose.ui.unit.sp
17+
import com.chatgptlite.wanted.models.MessageModel
18+
import com.chatgptlite.wanted.ui.theme.*
19+
import com.halilibo.richtext.markdown.Markdown
20+
import com.halilibo.richtext.ui.CodeBlockStyle
21+
import com.halilibo.richtext.ui.RichText
22+
import com.halilibo.richtext.ui.RichTextStyle
23+
import com.halilibo.richtext.ui.material3.SetupMaterial3RichText
24+
25+
@Composable
26+
fun MessageCard(message: MessageModel, isHuman: Boolean = false, isLast: Boolean = false) {
27+
Column(
28+
horizontalAlignment = if (isHuman) Alignment.End else Alignment.Start,
29+
modifier = Modifier
30+
.fillMaxWidth()
31+
.padding(vertical = 4.dp)
32+
.padding(top = if (isLast) 120.dp else 0.dp)
33+
) {
34+
Box(
35+
modifier = Modifier
36+
.widthIn(0.dp, 260.dp) //mention max width here
37+
.background(
38+
if (isHuman) BackGroundMessageHuman else BackGroundMessageGPT,
39+
shape = RoundedCornerShape(12.dp)
40+
),
41+
) {
42+
if (isHuman) {
43+
HumanMessageCard(message = message)
44+
} else {
45+
BotMessageCard(message = message)
46+
}
47+
}
48+
}
49+
}
50+
51+
@Composable
52+
fun HumanMessageCard(message: MessageModel) {
53+
Text(
54+
text = message.question,
55+
fontSize = 14.sp,
56+
color = ColorTextHuman,
57+
modifier = Modifier.padding(horizontal = 18.dp, vertical = 12.dp),
58+
textAlign = TextAlign.Justify,
59+
)
60+
}
61+
62+
@Composable
63+
fun BotMessageCard(message: MessageModel) {
64+
ChatGPTLiteTheme {
65+
SetupMaterial3RichText {
66+
RichText(
67+
modifier = Modifier.padding(horizontal = 18.dp, vertical = 12.dp),
68+
style = RichTextStyle(
69+
codeBlockStyle = CodeBlockStyle(
70+
textStyle = TextStyle(
71+
fontFamily = FontFamily.Default,
72+
fontWeight = FontWeight.Normal,
73+
fontSize = 13.sp,
74+
color = ColorTextGPT,
75+
),
76+
wordWrap = true,
77+
modifier = Modifier.background(
78+
color = Color.Black,
79+
shape = RoundedCornerShape(6.dp)
80+
)
81+
)
82+
)
83+
) {
84+
Markdown(
85+
message.answer.trimIndent()
86+
)
87+
}
88+
}
89+
}
90+
}

‎app/src/main/java/com/chatgptlite/wanted/ui/conversations/ui/theme/Type.kt‎

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import androidx.compose.ui.text.TextStyle
55
import androidx.compose.ui.text.font.FontFamily
66
import androidx.compose.ui.text.font.FontWeight
77
import androidx.compose.ui.unit.sp
8+
import com.chatgptlite.wanted.ui.theme.ColorTextGPT
89

910
// Set of Material typography styles to start with
1011
val Typography = Typography(
@@ -13,8 +14,14 @@ val Typography = Typography(
1314
fontWeight = FontWeight.Normal,
1415
fontSize = 16.sp,
1516
lineHeight = 24.sp,
16-
letterSpacing = 0.5.sp
17-
)
17+
letterSpacing = 0.5.sp,
18+
),
19+
displaySmall = TextStyle(
20+
fontFamily = FontFamily.Default,
21+
fontWeight = FontWeight.Normal,
22+
fontSize = 13.sp,
23+
color = ColorTextGPT,
24+
),
1825
/* Other default text styles to override
1926
titleLarge = TextStyle(
2027
fontFamily = FontFamily.Default,

‎app/src/main/java/com/chatgptlite/wanted/ui/theme/Type.kt‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,13 @@ val Typography = Typography(
1414
fontSize = 16.sp,
1515
lineHeight = 24.sp,
1616
letterSpacing = 0.5.sp
17-
)
17+
),
18+
bodyMedium = TextStyle(
19+
fontFamily = FontFamily.Default,
20+
fontWeight = FontWeight.Normal,
21+
fontSize = 13.sp,
22+
color = ColorTextGPT
23+
),
1824
/* Other default text styles to override
1925
titleLarge = TextStyle(
2026
fontFamily = FontFamily.Default,

0 commit comments

Comments
 (0)