Spaces:
Running
on
Zero
Running
on
Zero
Update app.py
Browse files
app.py
CHANGED
@@ -204,291 +204,11 @@ def chat_interface(message, history, max_tokens, temperature, top_p):
|
|
204 |
print("Initializing model...")
|
205 |
load_model()
|
206 |
|
207 |
-
#
|
208 |
custom_css = """
|
209 |
-
/*
|
210 |
-
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');
|
211 |
-
|
212 |
-
/* Global styling */
|
213 |
-
* {
|
214 |
-
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
215 |
-
}
|
216 |
-
|
217 |
-
/* Main container */
|
218 |
-
.gradio-container {
|
219 |
-
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
220 |
-
min-height: 100vh;
|
221 |
-
}
|
222 |
-
|
223 |
-
/* Header styling */
|
224 |
-
.header-container {
|
225 |
-
background: rgba(255, 255, 255, 0.95);
|
226 |
-
backdrop-filter: blur(20px);
|
227 |
-
border-radius: 20px;
|
228 |
-
padding: 24px;
|
229 |
-
margin-bottom: 24px;
|
230 |
-
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
|
231 |
-
border: 1px solid rgba(255, 255, 255, 0.2);
|
232 |
-
}
|
233 |
-
|
234 |
-
/* Main chat container */
|
235 |
-
.chat-container {
|
236 |
-
background: rgba(255, 255, 255, 0.95);
|
237 |
-
backdrop-filter: blur(20px);
|
238 |
-
border-radius: 20px;
|
239 |
-
padding: 24px;
|
240 |
-
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
|
241 |
-
border: 1px solid rgba(255, 255, 255, 0.2);
|
242 |
-
}
|
243 |
-
|
244 |
-
/* Chatbot styling */
|
245 |
.chatbot {
|
246 |
-
font-
|
247 |
-
font-family: 'Inter', sans-serif;
|
248 |
-
background: transparent;
|
249 |
-
border: none;
|
250 |
-
border-radius: 16px;
|
251 |
-
overflow: hidden;
|
252 |
-
}
|
253 |
-
|
254 |
-
.chatbot .message {
|
255 |
-
margin: 12px 0;
|
256 |
-
padding: 0;
|
257 |
-
background: transparent;
|
258 |
-
}
|
259 |
-
|
260 |
-
.chatbot .message.user {
|
261 |
-
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
262 |
-
color: white;
|
263 |
-
border-radius: 18px 18px 4px 18px;
|
264 |
-
padding: 16px 20px;
|
265 |
-
margin-left: 20%;
|
266 |
-
box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
|
267 |
-
}
|
268 |
-
|
269 |
-
.chatbot .message.bot {
|
270 |
-
background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
|
271 |
-
color: #2c3e50;
|
272 |
-
border-radius: 18px 18px 18px 4px;
|
273 |
-
padding: 16px 20px;
|
274 |
-
margin-right: 20%;
|
275 |
-
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
|
276 |
-
border: 1px solid rgba(0, 0, 0, 0.05);
|
277 |
-
}
|
278 |
-
|
279 |
-
/* Input styling */
|
280 |
-
.input-container {
|
281 |
-
background: rgba(255, 255, 255, 0.9);
|
282 |
-
border-radius: 25px;
|
283 |
-
padding: 8px;
|
284 |
-
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
|
285 |
-
border: 2px solid transparent;
|
286 |
-
transition: all 0.3s ease;
|
287 |
-
}
|
288 |
-
|
289 |
-
.input-container:focus-within {
|
290 |
-
border-color: #667eea;
|
291 |
-
box-shadow: 0 4px 20px rgba(102, 126, 234, 0.2);
|
292 |
-
}
|
293 |
-
|
294 |
-
.gradio-textbox {
|
295 |
-
border: none !important;
|
296 |
-
background: transparent !important;
|
297 |
-
font-size: 15px;
|
298 |
-
padding: 12px 20px;
|
299 |
-
border-radius: 20px;
|
300 |
-
font-family: 'Inter', sans-serif;
|
301 |
-
}
|
302 |
-
|
303 |
-
.gradio-textbox:focus {
|
304 |
-
outline: none !important;
|
305 |
-
box-shadow: none !important;
|
306 |
-
}
|
307 |
-
|
308 |
-
/* Button styling */
|
309 |
-
.gradio-button {
|
310 |
-
border-radius: 20px !important;
|
311 |
-
font-weight: 600 !important;
|
312 |
-
font-family: 'Inter', sans-serif !important;
|
313 |
-
transition: all 0.3s ease !important;
|
314 |
-
border: none !important;
|
315 |
-
font-size: 14px !important;
|
316 |
-
padding: 12px 24px !important;
|
317 |
-
}
|
318 |
-
|
319 |
-
.gradio-button.primary {
|
320 |
-
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
|
321 |
-
color: white !important;
|
322 |
-
box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3) !important;
|
323 |
-
}
|
324 |
-
|
325 |
-
.gradio-button.primary:hover {
|
326 |
-
transform: translateY(-2px) !important;
|
327 |
-
box-shadow: 0 6px 20px rgba(102, 126, 234, 0.4) !important;
|
328 |
-
}
|
329 |
-
|
330 |
-
.gradio-button.secondary {
|
331 |
-
background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%) !important;
|
332 |
-
color: #495057 !important;
|
333 |
-
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
|
334 |
-
}
|
335 |
-
|
336 |
-
.gradio-button.secondary:hover {
|
337 |
-
transform: translateY(-1px) !important;
|
338 |
-
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
|
339 |
-
}
|
340 |
-
|
341 |
-
/* Parameter panel styling */
|
342 |
-
.parameter-panel {
|
343 |
-
background: rgba(255, 255, 255, 0.9);
|
344 |
-
backdrop-filter: blur(20px);
|
345 |
-
border-radius: 20px;
|
346 |
-
padding: 24px;
|
347 |
-
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
|
348 |
-
border: 1px solid rgba(255, 255, 255, 0.2);
|
349 |
-
}
|
350 |
-
|
351 |
-
/* Slider styling */
|
352 |
-
.gradio-slider {
|
353 |
-
margin: 16px 0 !important;
|
354 |
-
}
|
355 |
-
|
356 |
-
.gradio-slider .wrap {
|
357 |
-
background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
|
358 |
-
border-radius: 12px;
|
359 |
-
padding: 16px;
|
360 |
-
border: 1px solid rgba(0, 0, 0, 0.05);
|
361 |
-
}
|
362 |
-
|
363 |
-
/* Examples styling */
|
364 |
-
.gradio-examples {
|
365 |
-
margin-top: 20px;
|
366 |
-
}
|
367 |
-
|
368 |
-
.gradio-examples .gradio-button {
|
369 |
-
background: rgba(255, 255, 255, 0.8) !important;
|
370 |
-
border: 1px solid rgba(102, 126, 234, 0.2) !important;
|
371 |
-
color: #667eea !important;
|
372 |
-
font-size: 13px !important;
|
373 |
-
padding: 10px 16px !important;
|
374 |
-
margin: 4px !important;
|
375 |
-
border-radius: 15px !important;
|
376 |
-
transition: all 0.2s ease !important;
|
377 |
-
}
|
378 |
-
|
379 |
-
.gradio-examples .gradio-button:hover {
|
380 |
-
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
|
381 |
-
color: white !important;
|
382 |
-
transform: translateY(-1px) !important;
|
383 |
-
box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3) !important;
|
384 |
-
}
|
385 |
-
|
386 |
-
/* Footer styling */
|
387 |
-
.footer-container {
|
388 |
-
background: rgba(255, 255, 255, 0.9);
|
389 |
-
backdrop-filter: blur(20px);
|
390 |
-
border-radius: 20px;
|
391 |
-
padding: 20px;
|
392 |
-
margin-top: 24px;
|
393 |
-
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
|
394 |
-
border: 1px solid rgba(255, 255, 255, 0.2);
|
395 |
-
text-align: center;
|
396 |
-
}
|
397 |
-
|
398 |
-
/* Animations */
|
399 |
-
@keyframes fadeInUp {
|
400 |
-
from {
|
401 |
-
opacity: 0;
|
402 |
-
transform: translateY(30px);
|
403 |
-
}
|
404 |
-
to {
|
405 |
-
opacity: 1;
|
406 |
-
transform: translateY(0);
|
407 |
-
}
|
408 |
-
}
|
409 |
-
|
410 |
-
@keyframes pulse {
|
411 |
-
0%, 100% {
|
412 |
-
opacity: 1;
|
413 |
-
}
|
414 |
-
50% {
|
415 |
-
opacity: 0.5;
|
416 |
-
}
|
417 |
-
}
|
418 |
-
|
419 |
-
@keyframes slideIn {
|
420 |
-
from {
|
421 |
-
opacity: 0;
|
422 |
-
transform: translateX(-20px);
|
423 |
-
}
|
424 |
-
to {
|
425 |
-
opacity: 1;
|
426 |
-
transform: translateX(0);
|
427 |
-
}
|
428 |
-
}
|
429 |
-
|
430 |
-
.animate-fade-in {
|
431 |
-
animation: fadeInUp 0.6s ease-out;
|
432 |
-
}
|
433 |
-
|
434 |
-
.animate-slide-in {
|
435 |
-
animation: slideIn 0.4s ease-out;
|
436 |
-
}
|
437 |
-
|
438 |
-
/* Loading states */
|
439 |
-
.loading {
|
440 |
-
position: relative;
|
441 |
-
overflow: hidden;
|
442 |
-
}
|
443 |
-
|
444 |
-
.loading::after {
|
445 |
-
content: '';
|
446 |
-
position: absolute;
|
447 |
-
top: 0;
|
448 |
-
left: -100%;
|
449 |
-
width: 100%;
|
450 |
-
height: 100%;
|
451 |
-
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
|
452 |
-
animation: shimmer 1.5s infinite;
|
453 |
-
}
|
454 |
-
|
455 |
-
@keyframes shimmer {
|
456 |
-
0% { left: -100%; }
|
457 |
-
100% { left: 100%; }
|
458 |
-
}
|
459 |
-
|
460 |
-
/* Responsive design */
|
461 |
-
@media (max-width: 768px) {
|
462 |
-
.chat-container, .parameter-panel, .header-container {
|
463 |
-
margin: 12px;
|
464 |
-
padding: 16px;
|
465 |
-
border-radius: 16px;
|
466 |
-
}
|
467 |
-
|
468 |
-
.chatbot .message.user {
|
469 |
-
margin-left: 10%;
|
470 |
-
}
|
471 |
-
|
472 |
-
.chatbot .message.bot {
|
473 |
-
margin-right: 10%;
|
474 |
-
}
|
475 |
-
}
|
476 |
-
|
477 |
-
/* Dark mode support */
|
478 |
-
@media (prefers-color-scheme: dark) {
|
479 |
-
.gradio-container {
|
480 |
-
background: linear-gradient(135deg, #2d3748 0%, #4a5568 100%);
|
481 |
-
}
|
482 |
-
|
483 |
-
.chat-container, .parameter-panel, .header-container, .footer-container {
|
484 |
-
background: rgba(45, 55, 72, 0.95);
|
485 |
-
color: #e2e8f0;
|
486 |
-
}
|
487 |
-
|
488 |
-
.chatbot .message.bot {
|
489 |
-
background: linear-gradient(135deg, #4a5568 0%, #2d3748 100%);
|
490 |
-
color: #e2e8f0;
|
491 |
-
}
|
492 |
}
|
493 |
"""
|
494 |
|
@@ -502,76 +222,29 @@ with gr.Blocks(
|
|
502 |
<meta name="description" content="Chat with Dhanishtha-2.0-preview - The world's first LLM with multi-step reasoning capabilities">
|
503 |
"""
|
504 |
) as demo:
|
505 |
-
# Header
|
506 |
-
|
507 |
-
|
508 |
-
|
509 |
-
|
510 |
-
|
511 |
-
|
512 |
-
|
513 |
-
|
514 |
-
|
515 |
-
|
516 |
-
|
517 |
-
|
518 |
-
|
519 |
-
# Feature highlights
|
520 |
-
with gr.Row():
|
521 |
-
with gr.Column(scale=1):
|
522 |
-
gr.HTML("""
|
523 |
-
<div style="text-align: center; padding: 15px; background: linear-gradient(135deg, #f0f8ff 0%, #e6f3ff 100%); border-radius: 15px; border-left: 4px solid #4a90e2;">
|
524 |
-
<div style="font-size: 2em; margin-bottom: 8px;">🧠</div>
|
525 |
-
<div style="font-weight: 600; color: #4a90e2;">Think Blocks</div>
|
526 |
-
<div style="font-size: 0.9em; color: #6c757d;">Internal reasoning process</div>
|
527 |
-
</div>
|
528 |
-
""")
|
529 |
-
with gr.Column(scale=1):
|
530 |
-
gr.HTML("""
|
531 |
-
<div style="text-align: center; padding: 15px; background: linear-gradient(135deg, #f0fff4 0%, #e6ffed 100%); border-radius: 15px; border-left: 4px solid #28a745;">
|
532 |
-
<div style="font-size: 2em; margin-bottom: 8px;">💚</div>
|
533 |
-
<div style="font-weight: 600; color: #28a745;">Ser Blocks</div>
|
534 |
-
<div style="font-size: 0.9em; color: #6c757d;">Emotional understanding</div>
|
535 |
-
</div>
|
536 |
-
""")
|
537 |
-
with gr.Column(scale=1):
|
538 |
-
gr.HTML("""
|
539 |
-
<div style="text-align: center; padding: 15px; background: linear-gradient(135deg, #fff5f5 0%, #fed7d7 100%); border-radius: 15px; border-left: 4px solid #e53e3e;">
|
540 |
-
<div style="font-size: 2em; margin-bottom: 8px;">⚡</div>
|
541 |
-
<div style="font-weight: 600; color: #e53e3e;">Real-time</div>
|
542 |
-
<div style="font-size: 0.9em; color: #6c757d;">Streaming responses</div>
|
543 |
-
</div>
|
544 |
-
""")
|
545 |
-
with gr.Column(scale=1):
|
546 |
-
gr.HTML("""
|
547 |
-
<div style="text-align: center; padding: 15px; background: linear-gradient(135deg, #fefcbf 0%, #fef08a 100%); border-radius: 15px; border-left: 4px solid #f59e0b;">
|
548 |
-
<div style="font-size: 2em; margin-bottom: 8px;">🎯</div>
|
549 |
-
<div style="font-weight: 600; color: #f59e0b;">Precise</div>
|
550 |
-
<div style="font-size: 0.9em; color: #6c757d;">Step-by-step solutions</div>
|
551 |
-
</div>
|
552 |
-
""")
|
553 |
|
554 |
# Main Chat Interface
|
555 |
with gr.Row():
|
556 |
with gr.Column(scale=4):
|
557 |
-
# Status indicator
|
558 |
-
gr.HTML("""
|
559 |
-
<div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; padding: 12px 20px; background: linear-gradient(135deg, #e8f5e8 0%, #f0fff4 100%); border-radius: 12px; border-left: 4px solid #28a745;">
|
560 |
-
<div style="display: flex; align-items: center;">
|
561 |
-
<div style="width: 8px; height: 8px; background: #28a745; border-radius: 50%; margin-right: 8px; animation: pulse 2s infinite;"></div>
|
562 |
-
<span style="font-weight: 600; color: #28a745;">Model Ready</span>
|
563 |
-
</div>
|
564 |
-
<div style="font-size: 0.9em; color: #6c757d;">
|
565 |
-
HelpingAI/Dhanishtha-2.0-preview
|
566 |
-
</div>
|
567 |
-
</div>
|
568 |
-
""")
|
569 |
-
|
570 |
chatbot = gr.Chatbot(
|
571 |
[],
|
572 |
elem_id="chatbot",
|
573 |
type='messages',
|
574 |
-
height=
|
575 |
show_copy_button=True,
|
576 |
show_share_button=True,
|
577 |
avatar_images=("👤", "🤖"),
|
@@ -580,51 +253,32 @@ with gr.Blocks(
|
|
580 |
latex_delimiters=[
|
581 |
{"left": "$$", "right": "$$", "display": True},
|
582 |
{"left": "$", "right": "$", "display": False}
|
583 |
-
]
|
584 |
-
container=True,
|
585 |
-
scale=1
|
586 |
)
|
587 |
|
588 |
-
#
|
589 |
with gr.Row():
|
590 |
-
|
591 |
-
|
592 |
-
|
593 |
-
|
594 |
-
|
595 |
-
|
596 |
-
|
597 |
-
|
598 |
-
|
599 |
-
|
600 |
-
|
601 |
-
|
602 |
-
|
603 |
-
|
604 |
-
|
605 |
-
)
|
606 |
-
clear_btn = gr.Button(
|
607 |
-
"🗑️",
|
608 |
-
variant="secondary",
|
609 |
-
size="lg"
|
610 |
-
)
|
611 |
-
|
612 |
-
with gr.Column(scale=1, min_width=320):
|
613 |
-
# Parameter header
|
614 |
-
gr.HTML("""
|
615 |
-
<div style="text-align: center; margin-bottom: 20px;">
|
616 |
-
<h3 style="margin: 0; color: #4a5568; font-weight: 600;">⚙️ Generation Settings</h3>
|
617 |
-
<p style="margin: 5px 0 0 0; color: #6c757d; font-size: 0.9em;">Fine-tune the AI's responses</p>
|
618 |
-
</div>
|
619 |
-
""")
|
620 |
-
|
621 |
-
# Enhanced sliders with better styling
|
622 |
max_tokens = gr.Slider(
|
623 |
minimum=50,
|
624 |
maximum=8192,
|
625 |
value=2048,
|
626 |
step=50,
|
627 |
-
label="
|
628 |
info="Maximum number of tokens to generate"
|
629 |
)
|
630 |
|
@@ -633,7 +287,7 @@ with gr.Blocks(
|
|
633 |
maximum=2.0,
|
634 |
value=0.7,
|
635 |
step=0.1,
|
636 |
-
label="
|
637 |
info="Higher = more creative, Lower = more focused"
|
638 |
)
|
639 |
|
@@ -642,73 +296,38 @@ with gr.Blocks(
|
|
642 |
maximum=1.0,
|
643 |
value=0.9,
|
644 |
step=0.05,
|
645 |
-
label="
|
646 |
info="Nucleus sampling threshold"
|
647 |
)
|
648 |
|
649 |
-
|
650 |
-
|
651 |
-
|
652 |
-
|
653 |
-
|
654 |
-
|
655 |
-
)
|
656 |
-
|
657 |
-
# Model information card
|
658 |
-
gr.HTML("""
|
659 |
-
<div style="margin-top: 24px; padding: 20px; background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%); border-radius: 16px; border: 1px solid rgba(0,0,0,0.05);">
|
660 |
-
<h4 style="margin: 0 0 12px 0; color: #4a5568; font-weight: 600; display: flex; align-items: center;">
|
661 |
-
<span style="margin-right: 8px;">🧠</span> Model Information
|
662 |
-
</h4>
|
663 |
-
<div style="space-y: 8px;">
|
664 |
-
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
|
665 |
-
<span style="color: #6c757d; font-size: 0.9em;">Model:</span>
|
666 |
-
<span style="color: #4a5568; font-weight: 500; font-size: 0.9em;">Dhanishtha-2.0-preview</span>
|
667 |
-
</div>
|
668 |
-
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
|
669 |
-
<span style="color: #6c757d; font-size: 0.9em;">Type:</span>
|
670 |
-
<span style="color: #4a5568; font-weight: 500; font-size: 0.9em;">Reasoning LLM</span>
|
671 |
-
</div>
|
672 |
-
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
|
673 |
-
<span style="color: #6c757d; font-size: 0.9em;">Features:</span>
|
674 |
-
<span style="color: #4a5568; font-weight: 500; font-size: 0.9em;">Think + Ser blocks</span>
|
675 |
-
</div>
|
676 |
-
<div style="margin-top: 12px; padding: 8px; background: rgba(74, 144, 226, 0.1); border-radius: 8px; border-left: 3px solid #4a90e2;">
|
677 |
-
<div style="font-size: 0.85em; color: #4a90e2; font-weight: 500;">💡 Tip</div>
|
678 |
-
<div style="font-size: 0.8em; color: #6c757d; margin-top: 4px;">Ask complex questions to see multi-step reasoning in action!</div>
|
679 |
-
</div>
|
680 |
-
</div>
|
681 |
-
</div>
|
682 |
-
""")
|
683 |
-
|
684 |
-
# Enhanced Examples Section
|
685 |
-
with gr.Row():
|
686 |
-
with gr.Column():
|
687 |
-
gr.HTML("""
|
688 |
-
<div style="text-align: center; margin: 24px 0 16px 0;">
|
689 |
-
<h3 style="margin: 0; color: #4a5568; font-weight: 600;">💡 Try These Examples</h3>
|
690 |
-
<p style="margin: 5px 0 0 0; color: #6c757d; font-size: 0.9em;">Click any example to see the AI's thinking process</p>
|
691 |
-
</div>
|
692 |
-
""")
|
693 |
-
|
694 |
-
gr.Examples(
|
695 |
-
examples=[
|
696 |
-
["🧮 Solve this step by step: What is 15% of 240?"],
|
697 |
-
["🔤 How many letter 'r' are in the words 'strawberry' and 'raspberry'?"],
|
698 |
-
["🤖 Hello! Can you introduce yourself and show me how you think?"],
|
699 |
-
["⚛️ Explain quantum entanglement in simple terms with examples"],
|
700 |
-
["🐍 Write a Python function to find the factorial of a number"],
|
701 |
-
["🌱 What are the pros and cons of renewable energy sources?"],
|
702 |
-
["🧠 What's the difference between AI and machine learning?"],
|
703 |
-
["🎨 Create a haiku about artificial intelligence and consciousness"],
|
704 |
-
["🌌 Why is the sky blue? Explain using physics principles"],
|
705 |
-
["📊 Compare bubble sort and quick sort algorithms"],
|
706 |
-
["🎯 Plan a 7-day trip to Japan with budget considerations"],
|
707 |
-
["🔬 How does CRISPR gene editing work in simple terms?"]
|
708 |
-
],
|
709 |
-
inputs=msg,
|
710 |
-
examples_per_page=6
|
711 |
)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
712 |
|
713 |
# Event handlers
|
714 |
def clear_chat():
|
@@ -739,62 +358,18 @@ with gr.Blocks(
|
|
739 |
show_progress=False
|
740 |
)
|
741 |
|
742 |
-
#
|
743 |
-
|
744 |
-
|
745 |
-
|
746 |
-
|
747 |
-
|
748 |
-
|
749 |
-
|
750 |
-
|
751 |
-
|
752 |
-
|
753 |
-
|
754 |
-
<div style="text-align: center;">
|
755 |
-
<div style="font-size: 1.5em; margin-bottom: 8px;">🧠</div>
|
756 |
-
<div style="font-weight: 600; color: #4a5568;">Model Architecture</div>
|
757 |
-
<div style="font-size: 0.9em; color: #6c757d;">Transformer-based reasoning</div>
|
758 |
-
</div>
|
759 |
-
<div style="text-align: center;">
|
760 |
-
<div style="font-size: 1.5em; margin-bottom: 8px;">⚡</div>
|
761 |
-
<div style="font-weight: 600; color: #4a5568;">Real-time Streaming</div>
|
762 |
-
<div style="font-size: 0.9em; color: #6c757d;">Token-by-token generation</div>
|
763 |
-
</div>
|
764 |
-
<div style="text-align: center;">
|
765 |
-
<div style="font-size: 1.5em; margin-bottom: 8px;">🎯</div>
|
766 |
-
<div style="font-weight: 600; color: #4a5568;">Advanced Reasoning</div>
|
767 |
-
<div style="font-size: 0.9em; color: #6c757d;">Multi-step thinking process</div>
|
768 |
-
</div>
|
769 |
-
<div style="text-align: center;">
|
770 |
-
<div style="font-size: 1.5em; margin-bottom: 8px;">🔧</div>
|
771 |
-
<div style="font-weight: 600; color: #4a5568;">Custom Sampling</div>
|
772 |
-
<div style="font-size: 0.9em; color: #6c757d;">Temperature & Top-p control</div>
|
773 |
-
</div>
|
774 |
-
</div>
|
775 |
-
|
776 |
-
<div style="background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%); border-radius: 12px; padding: 16px; margin: 16px 0; border: 1px solid rgba(0,0,0,0.05);">
|
777 |
-
<div style="font-weight: 600; color: #4a5568; margin-bottom: 8px;">🌟 Key Features</div>
|
778 |
-
<div style="display: flex; flex-wrap: wrap; gap: 8px; justify-content: center;">
|
779 |
-
<span style="background: #e3f2fd; color: #1976d2; padding: 4px 12px; border-radius: 20px; font-size: 0.85em;">Think Blocks</span>
|
780 |
-
<span style="background: #e8f5e8; color: #2e7d32; padding: 4px 12px; border-radius: 20px; font-size: 0.85em;">Ser Blocks</span>
|
781 |
-
<span style="background: #fff3e0; color: #f57c00; padding: 4px 12px; border-radius: 20px; font-size: 0.85em;">Real-time Streaming</span>
|
782 |
-
<span style="background: #fce4ec; color: #c2185b; padding: 4px 12px; border-radius: 20px; font-size: 0.85em;">LaTeX Support</span>
|
783 |
-
<span style="background: #f3e5f5; color: #7b1fa2; padding: 4px 12px; border-radius: 20px; font-size: 0.85em;">Code Highlighting</span>
|
784 |
-
</div>
|
785 |
-
</div>
|
786 |
-
|
787 |
-
<div style="margin-top: 20px; padding-top: 16px; border-top: 1px solid rgba(0,0,0,0.1);">
|
788 |
-
<div style="color: #6c757d; font-size: 0.9em;">
|
789 |
-
Built with ❤️ using <strong>Gradio</strong> and <strong>Transformers</strong> |
|
790 |
-
Model: <strong>HelpingAI/Dhanishtha-2.0-preview</strong>
|
791 |
-
</div>
|
792 |
-
<div style="color: #6c757d; font-size: 0.8em; margin-top: 4px;">
|
793 |
-
Experience the future of AI reasoning with transparent thinking processes
|
794 |
-
</div>
|
795 |
-
</div>
|
796 |
-
</div>
|
797 |
-
""")
|
798 |
|
799 |
if __name__ == "__main__":
|
800 |
# Launch with enhanced configuration
|
|
|
204 |
print("Initializing model...")
|
205 |
load_model()
|
206 |
|
207 |
+
# Minimal CSS - only for think and ser blocks
|
208 |
custom_css = """
|
209 |
+
/* Only essential styling for think and ser blocks */
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
210 |
.chatbot {
|
211 |
+
font-family: system-ui, -apple-system, sans-serif;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
212 |
}
|
213 |
"""
|
214 |
|
|
|
222 |
<meta name="description" content="Chat with Dhanishtha-2.0-preview - The world's first LLM with multi-step reasoning capabilities">
|
223 |
"""
|
224 |
) as demo:
|
225 |
+
# Simple Header
|
226 |
+
gr.Markdown(
|
227 |
+
"""
|
228 |
+
# 🧠 Dhanishtha-2.0-preview Chat
|
229 |
+
|
230 |
+
Chat with the **HelpingAI/Dhanishtha-2.0-preview** model - Advanced Reasoning AI with Multi-Step Thinking
|
231 |
+
|
232 |
+
### Features:
|
233 |
+
- 🧠 **Think Blocks**: Internal reasoning process (blue styling)
|
234 |
+
- 💚 **Ser Blocks**: Emotional understanding (green styling)
|
235 |
+
- ⚡ **Real-time Streaming**: Token-by-token generation
|
236 |
+
- 🎯 **Step-by-step Solutions**: Detailed problem solving
|
237 |
+
"""
|
238 |
+
)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
239 |
|
240 |
# Main Chat Interface
|
241 |
with gr.Row():
|
242 |
with gr.Column(scale=4):
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
243 |
chatbot = gr.Chatbot(
|
244 |
[],
|
245 |
elem_id="chatbot",
|
246 |
type='messages',
|
247 |
+
height=600,
|
248 |
show_copy_button=True,
|
249 |
show_share_button=True,
|
250 |
avatar_images=("👤", "🤖"),
|
|
|
253 |
latex_delimiters=[
|
254 |
{"left": "$$", "right": "$$", "display": True},
|
255 |
{"left": "$", "right": "$", "display": False}
|
256 |
+
]
|
|
|
|
|
257 |
)
|
258 |
|
259 |
+
# Simple input section
|
260 |
with gr.Row():
|
261 |
+
msg = gr.Textbox(
|
262 |
+
container=False,
|
263 |
+
placeholder="Ask me anything! I'll show you my thinking and reasoning process...",
|
264 |
+
label="Message",
|
265 |
+
autofocus=True,
|
266 |
+
lines=1,
|
267 |
+
max_lines=3,
|
268 |
+
scale=7
|
269 |
+
)
|
270 |
+
send_btn = gr.Button("Send", variant="primary", scale=1)
|
271 |
+
clear_btn = gr.Button("Clear", variant="secondary", scale=1)
|
272 |
+
|
273 |
+
with gr.Column(scale=1, min_width=300):
|
274 |
+
gr.Markdown("### ⚙️ Generation Parameters")
|
275 |
+
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
276 |
max_tokens = gr.Slider(
|
277 |
minimum=50,
|
278 |
maximum=8192,
|
279 |
value=2048,
|
280 |
step=50,
|
281 |
+
label="Max Tokens",
|
282 |
info="Maximum number of tokens to generate"
|
283 |
)
|
284 |
|
|
|
287 |
maximum=2.0,
|
288 |
value=0.7,
|
289 |
step=0.1,
|
290 |
+
label="Temperature",
|
291 |
info="Higher = more creative, Lower = more focused"
|
292 |
)
|
293 |
|
|
|
296 |
maximum=1.0,
|
297 |
value=0.9,
|
298 |
step=0.05,
|
299 |
+
label="Top-p",
|
300 |
info="Nucleus sampling threshold"
|
301 |
)
|
302 |
|
303 |
+
gr.Markdown("### 📊 Model Info")
|
304 |
+
gr.Markdown(
|
305 |
+
"""
|
306 |
+
**Model**: HelpingAI/Dhanishtha-2.0-preview
|
307 |
+
**Type**: Reasoning LLM with thinking blocks
|
308 |
+
**Features**: Multi-step reasoning, self-evaluation
|
309 |
+
**Blocks**: Think (blue) + Ser (green)
|
310 |
+
"""
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
311 |
)
|
312 |
+
|
313 |
+
# Examples Section
|
314 |
+
gr.Examples(
|
315 |
+
examples=[
|
316 |
+
["Solve this step by step: What is 15% of 240?"],
|
317 |
+
["How many letter 'r' are in the words 'strawberry' and 'raspberry'?"],
|
318 |
+
["Hello! Can you introduce yourself and show me how you think?"],
|
319 |
+
["Explain quantum entanglement in simple terms"],
|
320 |
+
["Write a Python function to find the factorial of a number"],
|
321 |
+
["What are the pros and cons of renewable energy?"],
|
322 |
+
["What's the difference between AI and machine learning?"],
|
323 |
+
["Create a haiku about artificial intelligence"],
|
324 |
+
["Why is the sky blue? Explain using physics principles"],
|
325 |
+
["Compare bubble sort and quick sort algorithms"]
|
326 |
+
],
|
327 |
+
inputs=msg,
|
328 |
+
label="Example Prompts - Try these to see the thinking process!",
|
329 |
+
examples_per_page=5
|
330 |
+
)
|
331 |
|
332 |
# Event handlers
|
333 |
def clear_chat():
|
|
|
358 |
show_progress=False
|
359 |
)
|
360 |
|
361 |
+
# Simple Footer
|
362 |
+
gr.Markdown(
|
363 |
+
"""
|
364 |
+
---
|
365 |
+
### 🔧 Technical Details
|
366 |
+
- **Model**: HelpingAI/Dhanishtha-2.0-preview
|
367 |
+
- **Reasoning**: Multi-step thinking with `<think>` and `<ser>` blocks
|
368 |
+
|
369 |
+
**Note**: This interface streams responses token by token and formats thinking blocks for better readability.
|
370 |
+
|
371 |
+
"""
|
372 |
+
)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
373 |
|
374 |
if __name__ == "__main__":
|
375 |
# Launch with enhanced configuration
|