Update app.py

app.py

@@ -335,6 +335,141 @@ with gr.Blocks(theme=gr.themes.Soft(primary_hue="teal", secondary_hue="slate", n
       document.head.appendChild(style);
     }
     """)
+    
+# Add CSS styling
+with gr.Blocks() as demo: # Use blocks to add javascript styling
+    gr.Markdown("# Chat with Gemini 2.0 Flash and See its Thoughts 💭")
+    
+    gr.HTML("""<a href="https://visitorbadge.io/status?path=https%3A%2F%2Faiqcamp-Gemini2-Flash-Thinking.hf.space">
+               <img src="https://api.visitorbadge.io/api/visitors?path=https%3A%2F%2Faiqcamp-Gemini2-Flash-Thinking.hf.space&countColor=%23263759" />
+               </a>""")
+    
+    with gr.Tabs():
+       with gr.TabItem("Chat"):
+          chatbot = gr.Chatbot(
+             type="messages",
+             label="Gemini2.0 'Thinking' Chatbot (Streaming Output)", #Label now indicates streaming
+             render_markdown=True,
+             scale=1,
+             avatar_images=(None,"https://lh3.googleusercontent.com/oxz0sUBF0iYoN4VvhqWTmux-cxfD1rxuYkuFEfm1SFaseXEsjjE4Je_C_V3UQPuJ87sImQK3HfQ3RXiaRnQetjaZbjJJUkiPL5jFJ1WRl5FKJZYibUA=w214-h214-n-nu"),
+             elem_classes="chatbot-wrapper"  # Add a class for custom styling
+          )
+          
+          with gr.Row(equal_height=True):
+             input_box = gr.Textbox(
+                 lines=1,
+                 label="Chat Message",
+                 placeholder="Type your message here...",
+                 scale=4
+             )
+    
+             clear_button = gr.Button("Clear Chat", scale=1)
+          
+          # Add example prompts - removed file upload examples. Kept text focused examples.
+          example_prompts = [
+                ["Explain the interplay between CYP450 enzymes and drug metabolism, specifically focusing on how enzyme induction or inhibition might affect the therapeutic efficacy of a drug such as warfarin."],
+               ["만성 신장 질환 환자에서 빈혈 치료를 위해 사용하는 에리스로포이에틴 제제의 약동학적 및 약력학적 특성을 상세히 분석하고, 투여 용량 및 투여 간격 결정에 영향을 미치는 요인들을 설명해 주십시오.",""],
+               ["간경변 환자에서 약물 대사의 변화를 설명하고, 간 기능 저하가 약물 투여량 조절에 미치는 영향을 구체적인 약물 예시와 함께 논의해 주십시오. 특히, 간 대사 효소의 활성 변화와 그 임상적 중요성을 설명해 주십시오."],
+               ["알츠하이머병 치료에 효과적인 천연 식물 물질과 약리기전 등을 한방(한의학)적 관점에서 설명하고 알려줘"],
+               ["고혈압 치료 및 증상 완화에 효과적인 신약 개발을 위해 가능성이 매우 높은 천연 식물 물질과 약리기전 등을 한방(한의학)적 관점에서 설명하고 알려줘"],
+               ["Compare and contrast the mechanisms of action of ACE inhibitors and ARBs in managing hypertension, considering their effects on the renin-angiotensin-aldosterone system."],
+               ["Describe the pathophysiology of type 2 diabetes and explain how metformin achieves its glucose-lowering effects, including any key considerations for patients with renal impairment."],
+               ["Please discuss the mechanism of action and clinical significance of beta-blockers in the treatment of heart failure, with reference to specific beta-receptor subtypes and their effects on the cardiovascular system."],
+                 ["알츠하이머병의 병태생리학적 기전을 설명하고, 현재 사용되는 약물들이 작용하는 주요 타겟을 상세히 기술하십시오. 특히, 아세틸콜린에스테라제 억제제와 NMDA 수용체 길항제의 작용 방식과 임상적 의의를 비교 분석해 주십시오."]
+    
+           ]
+           
+          gr.Examples(
+                examples=example_prompts,
+                inputs=input_box,
+                label="Examples: Try these prompts to see Gemini's thinking!",
+                examples_per_page=3 # Adjust as needed
+           )
+           
+           
+          # Set up event handlers
+          msg_store = gr.State("")  # Store for preserving user message
+          
+          input_box.submit(
+                lambda msg: (msg, msg, ""),  # Store message and clear input
+                inputs=[input_box],
+                outputs=[msg_store, input_box, input_box],
+                queue=False
+           ).then(
+                user_message,  # Add user message to chat
+                inputs=[msg_store, chatbot],
+                outputs=[input_box, chatbot],
+                queue=False
+           ).then(
+                stream_gemini_response,  # Generate and stream response
+                inputs=[msg_store, chatbot],
+                outputs=chatbot
+            )
+           
+          clear_button.click(
+                lambda: ([], "", ""),
+                outputs=[chatbot, input_box, msg_store],
+                queue=False
+           )
+        
+       with gr.TabItem("Instructions"):
+          gr.Markdown(
+             """
+             ## PharmAI: Your Expert Pharmacology Assistant
+
+             Welcome to PharmAI, a specialized chatbot powered by Google's Gemini 2.0 Flash model. PharmAI is designed to provide expert-level information on pharmacology topics, leveraging a large dataset of pharmaceutical knowledge ("PharmKG").
+
+             **Key Features:**
+
+             *   **Advanced Pharmacology Insights**: PharmAI provides responses that are structured, detailed, and based on a vast knowledge graph of pharmacology.
+             *   **Inference and Reasoning**: The chatbot can handle complex, multi-faceted questions, showcasing its ability to reason and infer from available information.
+             *   **Structured Responses**: Responses are organized logically to include definitions, mechanisms of action, indications, dosages, side effects, drug interactions, pharmacokinetics, and references when applicable.
+             *   **Thinking Process Display**: You can observe the model's thought process as it generates a response (experimental feature).
+             *   **Conversation History**: PharmAI remembers the previous parts of the conversation to provide more accurate and relevant information across multiple turns.
+             *   **Streaming Output**: The chatbot streams responses for an interactive experience.
+
+             **How to Use PharmAI:**
+
+             1.  **Start a Conversation**: Type your pharmacology question into the input box under the "Chat" tab. The chatbot is specifically designed to handle complex pharmacology inquiries.
+
+             2.  **Use Example Prompts**: You can try out the example questions provided to see the model in action. These examples are formulated to challenge the chatbot to exhibit its expertise.
+             
+             3. **Example Prompt Guidance**:
+                 * **Mechanisms of Action**: Ask about how a specific drug works at the molecular level. Example: "Explain the mechanism of action of Metformin."
+                 * **Drug Metabolism**: Inquire about how the body processes drugs. Example: "Explain the interplay between CYP450 enzymes and drug metabolism..."
+                 * **Clinical Implications**: Pose questions about the clinical use of drugs in treating specific diseases. Example: "Discuss the mechanism of action and clinical significance of beta-blockers in heart failure..."
+                 * **Pathophysiology and Drug Targets**: Ask about diseases, what causes them, and how drugs can treat them. Example: "Explain the pathophysiology of type 2 diabetes and how metformin works..."
+                 * **Complex Multi-Drug Interactions**: Pose questions about how one drug can affect another drug in the body.
+                 * **Traditional Medicine Perspectives**: Ask about traditional medicine (like Hanbang) approaches to disease and treatment. Example: "Explain effective natural plant substances and their mechanisms for treating Alzheimer's from a Hanbang perspective."
+
+             4. **Review Responses**: The chatbot will then present its response with a "Thinking" section that reveals its internal processing. Then it provides the more structured response, with sections including definition, mechanism of action, indications, etc.
+
+             5. **Clear Conversation**: Use the "Clear Chat" button to start a new session.
+
+             **Important Notes:**
+
+             *  The 'thinking' feature is experimental, but it shows the steps the model took when creating the response.
+             *  The quality of the response is highly dependent on the user prompt. Please be as descriptive as possible when asking questions to the best results.
+             *   This model is focused specifically on pharmacology information, so questions outside this scope may not get relevant answers.
+             *   This chatbot is intended as an informational resource and should not be used for medical diagnosis or treatment recommendations. Always consult with a healthcare professional for any medical advice.
+
+              """
+           )
+    
+    
+    # Add CSS styling
+    demo.load(lambda: None, _js="""
+    () => {
+      const style = document.createElement('style');
+      style.textContent = `
+        .chatbot-wrapper .message {
+           white-space: pre-wrap; /* for preserving line breaks within the chatbot message */
+           word-wrap: break-word;  /* for breaking words when the text length exceed the available area */
+         }
+      `;
+      document.head.appendChild(style);
+    }
+    """)
 
 
 # Launch the interface