Spaces:
Running
Running
| import gradio as gr | |
| from huggingface_hub import InferenceClient | |
| import os | |
| # 1. Verbindung zur KI | |
| hf_token = os.getenv("HF_TOKEN") | |
| client = InferenceClient("Qwen/Qwen2.5-7B-Instruct", token=hf_token) | |
| SYSTEM_PROMPT = "Du bist CocoAi von CocoEntertainment. Du bist loyal, schlau und nutzt Katzen-Emojis 🐱. Antworte immer auf Deutsch." | |
| def chat_fn(message, history): | |
| # In Gradio 6 ist die History standardmäßig eine Liste von Dictionaries | |
| api_messages = [{"role": "system", "content": SYSTEM_PROMPT}] | |
| for msg_obj in history: | |
| api_messages.append(msg_obj) | |
| api_messages.append({"role": "user", "content": str(message)}) | |
| # Neue Nachricht zur History für die Anzeige hinzufügen | |
| history.append({"role": "user", "content": message}) | |
| response = "" | |
| try: | |
| for msg in client.chat_completion(api_messages, max_tokens=1000, stream=True, temperature=0.7): | |
| if msg.choices and msg.choices[0].delta.content: | |
| token = msg.choices[0].delta.content | |
| response += token | |
| # Wir geben die aktualisierte Liste zurück | |
| yield history + [{"role": "assistant", "content": response}] | |
| except Exception as e: | |
| yield history + [{"role": "assistant", "content": f"Fehler: {str(e)}"}] | |
| # 2. Design & Styling (CSS) | |
| custom_css = """ | |
| .gradio-container { background-color: #f0f4ff !important; font-family: 'Arial', sans-serif !important; } | |
| .message { border-radius: 15px !important; box-shadow: 0px 4px 15px rgba(0,0,0,0.05) !important; } | |
| #input-box { background-color: #ffffff !important; border-radius: 30px !important; border: 2px solid #3b82f6 !important; } | |
| .primary-btn { border-radius: 30px !important; background-color: #3b82f6 !important; color: white !important; font-weight: bold !important; border: none !important; } | |
| footer { display: none !important; } | |
| """ | |
| # 3. GUI Aufbau (Gradio 6 Style) | |
| # 'theme' und 'css' wurden hier entfernt laut deiner Fehlermeldung | |
| with gr.Blocks(title="CocoAi Smooth") as demo: | |
| with gr.Column(): | |
| gr.Markdown("<h1 style='text-align: center; color: #1e40af;'>🐱 CocoAi</h1>") | |
| gr.Markdown("<p style='text-align: center; color: #1f2937;'>Intelligent • Loyal • CocoEntertainment</p>") | |
| # 'type="messages"' entfernt, da Gradio 6 dies nun intern anders oder als Standard handhabt | |
| chatbot = gr.Chatbot( | |
| elem_id="chat-box", | |
| show_label=False, | |
| height=450 | |
| ) | |
| with gr.Row(): | |
| msg = gr.Textbox( | |
| show_label=False, | |
| placeholder="Frag CocoAi etwas...", | |
| container=True, | |
| elem_id="input-box", | |
| scale=7 | |
| ) | |
| btn = gr.Button("Senden", variant="primary", elem_classes="primary-btn", scale=1) | |
| # Events | |
| submit_event = msg.submit(chat_fn, [msg, chatbot], [chatbot]) | |
| submit_event.then(lambda: "", None, [msg]) | |
| btn.click(chat_fn, [msg, chatbot], [chatbot]).then(lambda: "", None, [msg]) | |
| if __name__ == "__main__": | |
| # WICHTIG: In Gradio 6 müssen theme und css hier in launch() | |
| demo.launch( | |
| theme=gr.themes.Soft(), | |
| css=custom_css | |
| ) | |