Spaces:
Running
Running
Update app.py
Browse files
app.py
CHANGED
@@ -1,25 +1,19 @@
|
|
1 |
import gradio as gr
|
2 |
from huggingface_hub import InferenceClient
|
3 |
|
|
|
4 |
client = InferenceClient("lambdaindie/lambdai")
|
5 |
|
|
|
6 |
css = r"""
|
7 |
-
/* Fonte e cores gerais */
|
8 |
* { font-family: 'JetBrains Mono', monospace; }
|
9 |
.gradio-container { background-color: #111; color: #e0e0e0; }
|
10 |
-
/* Inputs e chat bubbles */
|
11 |
textarea, input, .block, .wrap, .chatbot {
|
12 |
background-color: #1a1a1a !important;
|
13 |
color: #e0e0e0 !important;
|
14 |
border: 1px solid #333 !important;
|
15 |
border-radius: 10px;
|
16 |
}
|
17 |
-
/* Botão com pulse animation */
|
18 |
-
@keyframes pulse {
|
19 |
-
0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255,255,255,0.5); }
|
20 |
-
70% { transform: scale(1.05); box-shadow: 0 0 0 10px rgba(255,255,255,0); }
|
21 |
-
100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255,255,255,0); }
|
22 |
-
}
|
23 |
button.pulse {
|
24 |
background-color: #272727 !important;
|
25 |
border: 1px solid #444 !important;
|
@@ -27,14 +21,10 @@ button.pulse {
|
|
27 |
border-radius: 10px;
|
28 |
animation: pulse 2s infinite;
|
29 |
}
|
30 |
-
|
31 |
-
|
32 |
-
|
33 |
-
}
|
34 |
-
/* Spinner de thinking */
|
35 |
-
@keyframes spin {
|
36 |
-
0% { transform: rotate(0deg); }
|
37 |
-
100% { transform: rotate(360deg); }
|
38 |
}
|
39 |
.loader {
|
40 |
border: 3px solid #2b2b2b;
|
@@ -43,11 +33,11 @@ button.pulse:hover {
|
|
43 |
width: 18px;
|
44 |
height: 18px;
|
45 |
animation: spin 1s linear infinite;
|
46 |
-
display: inline-block;
|
47 |
-
margin-right: 8px;
|
48 |
-
vertical-align: middle;
|
49 |
}
|
50 |
-
|
|
|
|
|
|
|
51 |
.thinking-html {
|
52 |
background-color: #2b2b2b;
|
53 |
padding: 8px;
|
@@ -58,81 +48,36 @@ button.pulse:hover {
|
|
58 |
display: flex;
|
59 |
align-items: center;
|
60 |
}
|
61 |
-
/* Opções de parâmetros ocultas até clique */
|
62 |
-
#settings-panel {
|
63 |
-
display: none;
|
64 |
-
background-color: #1a1a1a;
|
65 |
-
padding: 10px;
|
66 |
-
border-radius: 10px;
|
67 |
-
margin-top: 10px;
|
68 |
-
}
|
69 |
-
#settings-panel.show {
|
70 |
-
display: block;
|
71 |
-
}
|
72 |
"""
|
73 |
|
74 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
75 |
|
76 |
-
|
77 |
-
|
|
|
|
|
78 |
|
79 |
-
with gr.Row():
|
80 |
-
system_message = gr.Textbox(value="You are a helpful assistant.", label="System message", lines=1)
|
81 |
with gr.Row():
|
82 |
user_input = gr.Textbox(show_label=False, placeholder="Type your message here...", lines=2)
|
83 |
-
send_button = gr.Button("
|
84 |
-
|
85 |
-
with gr.Row():
|
86 |
-
settings_button = gr.Button("Show Settings", elem_classes="pulse")
|
87 |
-
settings_panel = gr.Column(
|
88 |
-
gr.Slider(128, 2048, value=512, step=1, label="Max tokens"),
|
89 |
-
gr.Slider(0.1, 1.5, value=0.7, step=0.1, label="Temperature"),
|
90 |
-
gr.Slider(0.1, 1.0, value=0.95, step=0.05, label="Top‑p"),
|
91 |
-
elem_id="settings-panel"
|
92 |
-
)
|
93 |
-
|
94 |
-
def toggle_settings():
|
95 |
-
return gr.update(visible=True) if not settings_panel.visible else gr.update(visible=False)
|
96 |
-
|
97 |
-
def respond(message, chat_history, system_message, max_tokens, temperature, top_p):
|
98 |
-
# Exibe o spinner + "thinking"
|
99 |
-
thinking_html = (
|
100 |
-
f"<div class='thinking-html'>"
|
101 |
-
f"<div class='loader'></div>"
|
102 |
-
f"Thinking… generating reasoning path…"
|
103 |
-
f"</div>"
|
104 |
-
)
|
105 |
-
yield chat_history + [{"role": "user", "content": message}, {"role": "assistant", "content": thinking_html}]
|
106 |
-
|
107 |
-
# Prepara payload para API
|
108 |
-
messages = [{"role": "system", "content": system_message}]
|
109 |
-
for u, a in chat_history:
|
110 |
-
if u: messages.append({"role":"user", "content":u})
|
111 |
-
if a: messages.append({"role":"assistant","content":a})
|
112 |
-
messages.append({"role": "user", "content": message})
|
113 |
-
|
114 |
-
# Chama API
|
115 |
-
response = ""
|
116 |
-
for chunk in client.chat_completion(
|
117 |
-
messages,
|
118 |
-
max_tokens=max_tokens,
|
119 |
-
temperature=temperature,
|
120 |
-
top_p=top_p,
|
121 |
-
stream=True
|
122 |
-
):
|
123 |
-
delta = chunk.choices[0].delta.content or ""
|
124 |
-
response += delta
|
125 |
-
yield chat_history + [{"role": "user", "content": message}, {"role": "assistant", "content": response}]
|
126 |
|
|
|
127 |
send_button.click(
|
128 |
fn=respond,
|
129 |
-
inputs=[user_input, chatbot
|
130 |
outputs=chatbot
|
131 |
)
|
132 |
|
133 |
-
settings_button.click(
|
134 |
-
fn=toggle_settings,
|
135 |
-
outputs=settings_panel
|
136 |
-
)
|
137 |
-
|
138 |
demo.launch()
|
|
|
1 |
import gradio as gr
|
2 |
from huggingface_hub import InferenceClient
|
3 |
|
4 |
+
# Inicia o cliente para o modelo
|
5 |
client = InferenceClient("lambdaindie/lambdai")
|
6 |
|
7 |
+
# CSS simples
|
8 |
css = r"""
|
|
|
9 |
* { font-family: 'JetBrains Mono', monospace; }
|
10 |
.gradio-container { background-color: #111; color: #e0e0e0; }
|
|
|
11 |
textarea, input, .block, .wrap, .chatbot {
|
12 |
background-color: #1a1a1a !important;
|
13 |
color: #e0e0e0 !important;
|
14 |
border: 1px solid #333 !important;
|
15 |
border-radius: 10px;
|
16 |
}
|
|
|
|
|
|
|
|
|
|
|
|
|
17 |
button.pulse {
|
18 |
background-color: #272727 !important;
|
19 |
border: 1px solid #444 !important;
|
|
|
21 |
border-radius: 10px;
|
22 |
animation: pulse 2s infinite;
|
23 |
}
|
24 |
+
@keyframes pulse {
|
25 |
+
0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255,255,255,0.5); }
|
26 |
+
70% { transform: scale(1.05); box-shadow: 0 0 0 10px rgba(255,255,255,0); }
|
27 |
+
100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255,255,255,0); }
|
|
|
|
|
|
|
|
|
28 |
}
|
29 |
.loader {
|
30 |
border: 3px solid #2b2b2b;
|
|
|
33 |
width: 18px;
|
34 |
height: 18px;
|
35 |
animation: spin 1s linear infinite;
|
|
|
|
|
|
|
36 |
}
|
37 |
+
@keyframes spin {
|
38 |
+
0% { transform: rotate(0deg); }
|
39 |
+
100% { transform: rotate(360deg); }
|
40 |
+
}
|
41 |
.thinking-html {
|
42 |
background-color: #2b2b2b;
|
43 |
padding: 8px;
|
|
|
48 |
display: flex;
|
49 |
align-items: center;
|
50 |
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
51 |
"""
|
52 |
|
53 |
+
# Função principal para responder
|
54 |
+
def respond(message, chat_history):
|
55 |
+
thinking_html = (
|
56 |
+
f"<div class='thinking-html'>"
|
57 |
+
f"<div class='loader'></div>"
|
58 |
+
f"Thinking… generating response..."
|
59 |
+
f"</div>"
|
60 |
+
)
|
61 |
+
yield chat_history + [{"role": "user", "content": message}, {"role": "assistant", "content": thinking_html}]
|
62 |
+
|
63 |
+
response = client.chat_completion([{"role": "user", "content": message}], stream=False)
|
64 |
+
answer = response['choices'][0]['message']['content']
|
65 |
+
yield chat_history + [{"role": "user", "content": message}, {"role": "assistant", "content": answer}]
|
66 |
|
67 |
+
# Interface Gradio
|
68 |
+
with gr.Blocks(css=css) as demo:
|
69 |
+
gr.Markdown("<h1 style='text-align:center;color:#e0e0e0;'>Lambdai-v1-1B</h1>")
|
70 |
+
chatbot = gr.Chatbot(elem_id="chatbot", height=480, render_markdown=True)
|
71 |
|
|
|
|
|
72 |
with gr.Row():
|
73 |
user_input = gr.Textbox(show_label=False, placeholder="Type your message here...", lines=2)
|
74 |
+
send_button = gr.Button("Send", elem_classes="pulse")
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
75 |
|
76 |
+
# Aciona a função ao clicar no botão
|
77 |
send_button.click(
|
78 |
fn=respond,
|
79 |
+
inputs=[user_input, chatbot],
|
80 |
outputs=chatbot
|
81 |
)
|
82 |
|
|
|
|
|
|
|
|
|
|
|
83 |
demo.launch()
|