forked from kaarthik108/snowChat
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathsnowchat_ui.py
81 lines (70 loc) · 3.54 KB
/
snowchat_ui.py
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
import pandas
import streamlit as st
import re
import html
def format_message(text):
"""
This function is used to format the messages in the chatbot UI.
Parameters:
text (str): The text to be formatted.
"""
text_blocks = re.split(r"```[\s\S]*?```", text)
code_blocks = re.findall(r"```([\s\S]*?)```", text)
text_blocks = [html.escape(block) for block in text_blocks]
formatted_text = ""
for i in range(len(text_blocks)):
formatted_text += text_blocks[i].replace("\n", "<br>")
if i < len(code_blocks):
formatted_text += f'<pre style="white-space: pre-wrap; word-wrap: break-word;"><code>{html.escape(code_blocks[i])}</code></pre>'
return formatted_text
def message_func(text, is_user=False, is_df=False):
"""
This function is used to display the messages in the chatbot UI.
Parameters:
text (str): The text to be displayed.
is_user (bool): Whether the message is from the user or not.
is_df (bool): Whether the message is a dataframe or not.
"""
if is_user:
avatar_url = "https://avataaars.io/?avatarStyle=Transparent&topType=ShortHairShortFlat&accessoriesType=Prescription01&hairColor=Auburn&facialHairType=BeardLight&facialHairColor=Black&clotheType=Hoodie&clotheColor=PastelBlue&eyeType=Squint&eyebrowType=DefaultNatural&mouthType=Smile&skinColor=Tanned"
message_alignment = "flex-end"
message_bg_color = "linear-gradient(135deg, #00B2FF 0%, #006AFF 100%)"
avatar_class = "user-avatar"
st.write(
f"""
<div style="display: flex; align-items: center; margin-bottom: 10px; justify-content: {message_alignment};">
<div style="background: {message_bg_color}; color: white; border-radius: 20px; padding: 10px; margin-right: 5px; max-width: 75%; font-size: 14px;">
{text} \n </div>
<img src="{avatar_url}" class="{avatar_class}" alt="avatar" style="width: 50px; height: 50px;" />
</div>
""",
unsafe_allow_html=True,
)
else:
avatar_url = "https://avataaars.io/?avatarStyle=Transparent&topType=WinterHat2&accessoriesType=Kurt&hatColor=Blue01&facialHairType=MoustacheMagnum&facialHairColor=Blonde&clotheType=Overall&clotheColor=Gray01&eyeType=WinkWacky&eyebrowType=SadConcernedNatural&mouthType=Sad&skinColor=Light"
message_alignment = "flex-start"
message_bg_color = "#71797E"
avatar_class = "bot-avatar"
if is_df:
st.write(
f"""
<div style="display: flex; align-items: center; margin-bottom: 10px; justify-content: {message_alignment};">
<img src="{avatar_url}" class="{avatar_class}" alt="avatar" style="width: 50px; height: 50px;" />
</div>
""",
unsafe_allow_html=True,
)
st.write(text)
return
else:
text = format_message(text)
st.write(
f"""
<div style="display: flex; align-items: center; margin-bottom: 10px; justify-content: {message_alignment};">
<img src="{avatar_url}" class="{avatar_class}" alt="avatar" style="width: 50px; height: 50px;" />
<div style="background: {message_bg_color}; color: white; border-radius: 20px; padding: 10px; margin-right: 5px; max-width: 75%; font-size: 14px;">
{text} \n </div>
</div>
""",
unsafe_allow_html=True,
)