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
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149 | class GradioAgentChatPack(BaseLlamaPack):
"""Gradio chatbot to chat with your own Agent."""
def __init__(
self,
agent: BaseAgent,
**kwargs: Any,
) -> None:
"""Init params."""
try:
from ansi2html import Ansi2HTMLConverter
except ImportError:
raise ImportError("Please install ansi2html via `pip install ansi2html`")
self.agent = agent
self.thoughts = ""
self.conv = Ansi2HTMLConverter()
def get_modules(self) -> Dict[str, Any]:
"""Get modules."""
return {"agent": self.agent}
def _handle_user_message(self, user_message, history):
"""Handle the user submitted message. Clear message box, and append
to the history.
"""
return "", [*history, (user_message, "")]
def _generate_response(
self, chat_history: List[Tuple[str, str]]
) -> Tuple[str, List[Tuple[str, str]]]:
"""Generate the response from agent, and capture the stdout of the
ReActAgent's thoughts.
"""
with Capturing() as output:
response = self.agent.stream_chat(chat_history[-1][0])
ansi = "\n========\n".join(output)
html_output = self.conv.convert(ansi)
for token in response.response_gen:
chat_history[-1][1] += token
yield chat_history, str(html_output)
def _reset_chat(self) -> Tuple[str, str]:
"""Reset the agent's chat history. And clear all dialogue boxes."""
# clear agent history
self.agent.reset()
return "", "", "" # clear textboxes
def run(self, *args: Any, **kwargs: Any) -> Any:
"""Run the pipeline."""
import gradio as gr
from gradio.themes.utils import colors, fonts, sizes
llama_theme = gr.themes.Soft(
primary_hue=colors.purple,
secondary_hue=colors.pink,
neutral_hue=colors.gray,
spacing_size=sizes.spacing_md,
radius_size=sizes.radius_md,
text_size=sizes.text_lg,
font=(
fonts.GoogleFont("Quicksand"),
"ui-sans-serif",
"sans-serif",
),
font_mono=(
fonts.GoogleFont("IBM Plex Mono"),
"ui-monospace",
"monospace",
),
)
llama_theme.set(
body_background_fill="#FFFFFF",
body_background_fill_dark="#000000",
button_primary_background_fill="linear-gradient(90deg, *primary_300, *secondary_400)",
button_primary_background_fill_hover="linear-gradient(90deg, *primary_200, *secondary_300)",
button_primary_text_color="white",
button_primary_background_fill_dark="linear-gradient(90deg, *primary_600, *secondary_800)",
slider_color="*secondary_300",
slider_color_dark="*secondary_600",
block_title_text_weight="600",
block_border_width="3px",
block_shadow="*shadow_drop_lg",
button_shadow="*shadow_drop_lg",
button_large_padding="32px",
)
demo = gr.Blocks(
theme=llama_theme,
css="#box { height: 420px; overflow-y: scroll !important} #logo { align-self: right }",
)
with demo:
with gr.Row():
gr.Markdown(
"# Gradio Chat With Your Agent Powered by LlamaIndex and LlamaHub 🦙\n"
"This Gradio app allows you to chat with your own agent (`BaseAgent`).\n"
)
gr.Markdown(
"[](https://llamaindex.ai)",
elem_id="logo",
)
with gr.Row():
chat_window = gr.Chatbot(
label="Message History",
scale=3,
)
console = gr.HTML(elem_id="box")
with gr.Row():
message = gr.Textbox(label="Write A Message", scale=4)
clear = gr.ClearButton()
message.submit(
self._handle_user_message,
[message, chat_window],
[message, chat_window],
queue=False,
).then(
self._generate_response,
chat_window,
[chat_window, console],
)
clear.click(self._reset_chat, None, [message, chat_window, console])
demo.launch(server_name="0.0.0.0", server_port=8080)
|