app.py

import torch
import gradio as gr
from chat import KiswahiliChatbot
import os
import logging

# Set up logging
logging.basicConfig(level=logging.INFO)
logger = logging.getLogger(__name__)

# Initialize chatbot
try:
    chatbot = KiswahiliChatbot()
    logger.info("✅ Chatbot imeanzishwa kikamilifu!")
except Exception as e:
    logger.error(f"❌ Imeshindwa kuanzisha chatbot: {e}")
    chatbot = None

def chat_interface(message, history):
    """Handle chat interface interactions"""
    if chatbot is None:
        return "Samahani, kuna hitilafu ya mfumo. Tafadhali jaribu tena baadaye."
    
    if not message.strip():
        return "Tafadhali andika ujumbe..."
    
    response = chatbot.chat(message)
    return response

# Create Gradio interface with Tanzania flag colors
with gr.Blocks(
    title="KiswahiliChetu",
    theme=gr.themes.Soft(primary_hue="blue"),
    css="""
    .gradio-container { 
        max-width: 1200px; 
        margin: auto; 
        font-family: 'Arial', sans-serif;
        background: #f0f2f5;
    }
    
    .tanzania-title-shell {
        display: inline-block;
        padding: 12px 25px;
        background: white;
        border-radius: 25px;
        box-shadow: 0px 4px 10px rgba(0,0,0,0.15);
        margin-bottom: 15px !important;
    }
    
    .tanzania-title {
        font-size: 3em !important;
        font-weight: bold !important;
        text-align: center;
        background: linear-gradient(to bottom,
            #1DB954 0% 35%,   /* Green */
            #FFD700 35% 40%,  /* Thin Yellow */
            #000000 40% 60%,  /* Black */
            #FFD700 60% 65%,  /* Thin Yellow */
            #87CEEB 65% 100%  /* Sky Blue */
        );
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        display: inline-block;
    }
    
    .tanzania-subtitle {
        text-align: center;
        color: #666;
        margin-bottom: 30px !important;
        font-size: 1.2em;
    }
    
    .chat-container {
        background: #f8f9fa;
        padding: 20px;
        border-radius: 15px;
        border: 2px solid #e9ecef;
    }
    
    .input-container {
        background: #ffffff;
        padding: 20px;
        border-radius: 15px;
        border: 2px solid #e9ecef;
    }
    
    .gradio-button {
        border-radius: 8px;
        font-weight: bold;
    }
    
    .examples-section {
        background: #fffae6;
        padding: 15px;
        border-radius: 10px;
        border-left: 4px solid #FCD116;
    }
    """
) as demo:
    
    # Header with Tanzania flag colors
    gr.HTML("""
    <div style="text-align: center;">
        <div class="tanzania-title-shell">
            <span class="tanzania-title">KiswahiliChetu</span>
        </div>
        <p class="tanzania-subtitle">Jifunze kiswahili fasaha, uliza maswali na KiswahiliChetu akili Unde</p>
    </div>
    """)
    
    with gr.Row():
        # LEFT SIDE: Input section
        with gr.Column(scale=1, min_width=400):
            with gr.Column(elem_classes="input-container"):
                gr.Markdown("### ✍️ Ujumbe Wako")
                
                msg = gr.Textbox(
                    label="",
                    placeholder="Andika hapa kwa Kiswahili...",
                    lines=4,
                    max_lines=6,
                    show_label=False
                )
                
                with gr.Row():
                    submit_btn = gr.Button("📤 Tuma", variant="primary", size="lg")
                    clear_btn = gr.Button("🗑️ Futa Mazungumzo", variant="secondary")
                
                # Examples section
                with gr.Accordion("📚 Mifano ya Maswali", open=True):
                    gr.Examples(
                        examples=[
                            ["Habari yako?"],
                            ["Jina lako nani?"],
                            ["Unaweza kusema Kiswahili?"],
                            ["Eleza kuhusu Tanzania"],
                            ["Nini maana ya 'Hakuna matata'?"]
                        ],
                        inputs=msg,
                        label="Bonyeza mfano wa swali:"
                    )
        
        # RIGHT SIDE: Chat section
        with gr.Column(scale=2, min_width=600):
            with gr.Column(elem_classes="chat-container"):
                gr.Markdown("### 💬 Mazungumzo")
                chatbot_ui = gr.Chatbot(
                    height=500,
                    show_copy_button=True,
                    show_share_button=True,
                    avatar_images=(
                        None, 
                        "https://api.dicebear.com/7.x/bottts/svg?seed=swahili&backgroundColor=1eb53a"
                    )
                )
    
    # System info and footer
    with gr.Accordion("📊 Taarifa ya Mfumo", open=False):
        gr.Markdown(f"""
        **Gradio Version:** {gr.__version__}  
        **Device:** {'GPU' if torch.cuda.is_available() else 'CPU'}
        """)
    
    gr.Markdown("---")
    gr.Markdown("""
    <div style='text-align: center; color: #666;'>
        <strong>🇹🇿 Imetengenezwa kwa upendo wa lugha ya Kiswahili na Tanzania</strong>
    </div>
    """)
    
    # Event handlers
    def process_message(message, history):
        response = chat_interface(message, history)
        return history + [(message, response)], ""
    
    msg.submit(
        process_message,
        inputs=[msg, chatbot_ui],
        outputs=[chatbot_ui, msg]
    )
    
    submit_btn.click(
        process_message,
        inputs=[msg, chatbot_ui],
        outputs=[chatbot_ui, msg]
    )
    
    clear_btn.click(
        lambda: None,
        inputs=None,
        outputs=chatbot_ui
    )

if __name__ == "__main__":
    demo.launch(
        server_name="0.0.0.0",
        share=False,
        show_error=True
    )