Uploading all the project files

README.md

@@ -1,14 +1,200 @@
 ---
 title: AI Concept Explainer
-emoji: 😻
-colorFrom: yellow
-colorTo: red
+emoji: 🧠
+colorFrom: purple
+colorTo: blue
 sdk: gradio
-sdk_version: 5.47.2
+sdk_version: "5.47.2"
 app_file: app.py
 pinned: false
 license: mit
-short_description: 'Explains concepts at different complexity and languages. '
+short_description: AI-powered concept explainer
 ---
 
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+# 🧠 AI Concept Explainer
+
+An intelligent Gradio app that explains any concept at different complexity levels using OpenAI's GPT models. Get personalized explanations tailored to your understanding level and preferred language.
+
+## 🎯 Features
+
+- **Adaptive Complexity**: 5 levels from "like I'm 5" to expert-level explanations
+- **Multi-language Support**: English, Russian, German, Spanish, French, Italian
+- **Streaming Responses**: Real-time explanation generation
+- **Quick Examples**: Pre-loaded sample questions for instant testing
+- **Modern UI**: Clean, responsive interface with gradient styling
+- **Error Handling**: Graceful API error management
+
+## 🚀 Quick Start
+
+### Prerequisites
+- Python 3.7+
+- OpenAI API key
+- Gradio library
+
+### Installation & Setup
+
+1. **Navigate to the project directory**:
+```bash
+cd gradio_concept_explainer
+```
+
+2. **Activate the virtual environment**:
+```bash
+source ../adk_venv/bin/activate
+```
+
+3. **Install dependencies**:
+```bash
+pip install gradio openai python-dotenv
+```
+
+4. **Set up your OpenAI API key**:
+```bash
+# Create or edit api_keys.env file
+echo "OPENAI_API_KEY=your_api_key_here" > ../api_keys.env
+```
+
+5. **Run the application**:
+```bash
+python app.py
+```
+
+6. **Open your browser** and navigate to:
+```
+http://127.0.0.1:7860
+```
+
+## 🎮 How to Use
+
+1. **Enter your question** in the text box or click a quick example
+2. **Select complexity level** (1-5) using the slider
+3. **Choose your language** from the dropdown
+4. **Click "Explain Concept"** to generate your personalized explanation
+
+### Complexity Levels
+- **Level 1**: Like I'm 5 years old - simple words and analogies
+- **Level 2**: Like I'm 10 years old - basic concepts with examples
+- **Level 3**: High school level - intermediate with some technical terms
+- **Level 4**: College level - advanced concepts with detailed explanations
+- **Level 5**: Expert level - professional depth with technical precision
+
+## 📋 Example Questions
+
+- "Why is the sky blue?"
+- "How does the internet work?"
+- "What is artificial intelligence?"
+- "Explain quantum computing"
+- "How do vaccines work?"
+
+## 🔧 Technical Details
+
+### Architecture
+- **Framework**: Gradio 5.47.2
+- **AI Model**: OpenAI GPT-4.1
+- **Language**: Python 3.7+
+- **Streaming**: Real-time response generation
+- **Port**: localhost:7860
+
+### Key Functions
+
+#### `explain_concept(question, level, language)`
+Generates streaming explanations using OpenAI API.
+- **Parameters**: 
+  - `question` (str): Concept to explain
+  - `level` (int): Complexity level (1-5)
+  - `language` (str): Output language
+- **Returns**: Streaming explanation chunks
+- **Error Handling**: Graceful API error management
+
+### Environment Support
+- **Local Development**: Auto-opens browser, localhost only
+- **Hugging Face Spaces**: Production-ready configuration
+- **Signal Handling**: Graceful shutdown for development
+
+## 🎨 Interface Design
+
+- **Modern Theme**: Soft gradient styling
+- **Responsive Layout**: Works on all screen sizes
+- **Interactive Elements**: Sliders, dropdowns, example buttons
+- **Real-time Streaming**: Live explanation generation
+- **Accessible Design**: Clear labels and error messages
+
+## 🛠️ Customization
+
+### Adding New Languages
+```python
+LANGUAGES = ["English", "Russian", "German", "Spanish", "French", "Italian", "YourLanguage"]
+```
+
+### Modifying Complexity Levels
+```python
+EXPLANATION_LEVELS = {
+    1: "your custom level 1 description",
+    2: "your custom level 2 description",
+    # ... add more levels
+}
+```
+
+### Changing the AI Model
+```python
+stream = client.chat.completions.create(
+    model="gpt-3.5-turbo",  # Change model here
+    # ... rest of parameters
+)
+```
+
+## 🔒 Security & Privacy
+
+- **API Key Protection**: Environment variable storage
+- **Local Execution**: No data persistence
+- **Secure Requests**: HTTPS API calls to OpenAI
+- **No Data Storage**: Explanations not saved locally
+
+## 🚨 Troubleshooting
+
+### Common Issues
+
+1. **"OPENAI_API_KEY not found"**:
+```bash
+# Set your API key in api_keys.env
+echo "OPENAI_API_KEY=your_key_here" > ../api_keys.env
+```
+
+2. **"Module not found" errors**:
+```bash
+pip install gradio openai python-dotenv
+```
+
+3. **Port already in use**:
+```python
+# Change port in app.py
+server_port=7861
+```
+
+4. **API rate limits**:
+- Check your OpenAI usage limits
+- Consider upgrading your OpenAI plan
+
+## 📈 Future Enhancements
+
+- **Voice Output**: Text-to-speech for explanations
+- **Visual Diagrams**: Generate concept illustrations
+- **Explanation History**: Save and revisit past explanations
+- **Custom Prompts**: User-defined explanation styles
+- **Export Options**: Save explanations as PDF/Word
+- **Collaborative Features**: Share explanations with others
+
+## 📝 License
+
+This project is part of the LLM and Agentic AI Bootcamp Materials.
+
+## 👥 Contributing
+
+This AI Concept Explainer is designed as a learning example. Feel free to:
+- Fork and modify for personal use
+- Use as a starting point for similar projects
+- Suggest improvements or additional features
+
+---
+
+**Get clear explanations for any concept! 🎯**

app.py

@@ -0,0 +1,213 @@
+"""
+AI Concept Explainer
+===================
+
+A Gradio app that explains concepts at different complexity levels
+and in multiple languages using OpenAI's models.
+"""
+
+import os
+import signal
+import gradio as gr
+from openai import OpenAI
+from dotenv import load_dotenv
+
+# Load environment variables - supports both local .env and Hugging Face Spaces
+try:
+    load_dotenv('api_keys.env')
+except:
+    pass  # Gracefully handle missing .env file
+
+# Initialize OpenAI client with API key validation
+openai_api_key = os.getenv("OPENAI_API_KEY")
+if not openai_api_key:
+    raise ValueError("OPENAI_API_KEY not found. Please set it in your environment variables or .env file.")
+
+client = OpenAI(api_key=openai_api_key)
+
+# Explanation complexity levels with clear descriptions
+EXPLANATION_LEVELS = {
+    1: "like I'm 5 years old - use simple words and analogies",
+    2: "like I'm 10 years old - basic concepts with examples", 
+    3: "like a high school student - intermediate level with some technical terms",
+    4: "like a college student - advanced concepts with detailed explanations",
+    5: "like an expert in the field - professional level with technical depth",
+}
+
+# Supported languages for explanations
+LANGUAGES = ["English", "Russian", "German", "Spanish", "French", "Italian"]
+
+# Example questions for quick selection
+EXAMPLE_QUESTIONS = [
+    "Why is the sky blue?",
+    "How does the internet work?",
+    "What is artificial intelligence?"
+]
+
+def explain_concept(question, level, language):
+    """
+    Generate a comprehensive explanation for a given concept at the specified complexity level.
+    Supports streaming for real-time response generation.
+    
+    Args:
+        question (str): The concept or question to explain
+        level (int): Complexity level (1-5)
+        language (str): Language for the explanation
+        
+    Yields:
+        str: The generated explanation chunks or error message
+    """
+    # Input validation
+    if not question.strip():
+        yield "❌ Please enter a concept to explain."
+        return
+    
+    # Get explanation level description
+    level_desc = EXPLANATION_LEVELS.get(level, "clearly and comprehensively")
+    
+    # Language validation with fallback
+    if language not in LANGUAGES:
+        language = "English"
+    
+    # Professional system prompt for focused explanations
+    system_prompt = f"""You are an expert educator. Explain the given concept {level_desc} in {language}. Provide a clear, accurate response in under 200 words. Ensure you use bold text to emphasize the key points. Do not include introductions, conclusions, or extra commentary - just the explanation."""
+
+    try:
+        # Generate streaming explanation using OpenAI API
+        stream = client.chat.completions.create(
+            model="gpt-4.1",
+            messages=[
+                {"role": "system", "content": system_prompt},
+                {"role": "user", "content": question}
+            ],
+            temperature=0.7,
+            max_tokens=1000,
+            stream=True  # Enable streaming
+        )
+        
+        # Proper word-by-word streaming with partial accumulation
+        partial = ""
+        for chunk in stream:
+            delta = getattr(chunk.choices[0].delta, "content", None)
+            if delta:
+                partial += delta
+                yield partial
+                
+    except Exception as e:
+        yield f"❌ Error generating explanation: {str(e)}"
+
+# Create enhanced Gradio interface with modern styling
+with gr.Blocks(
+    theme=gr.themes.Soft(),  # Modern, clean theme
+    title="AI Concept Explainer",
+    css="""
+    .gradio-container {
+        max-width: 900px !important;
+        margin: auto !important;
+    }
+    .explanation-box {
+        background: linear-gradient(135deg, #e0e7ff 0%, #f3e8ff 100%);
+        color: #222;
+        padding: 20px;
+        border-radius: 10px;
+        margin: 10px 0;
+    }
+    """
+) as app:
+    # Header with description
+    gr.Markdown("""
+    # 🧠 AI Concept Explainer
+    
+    Get clear, personalized explanations of any concept at your preferred complexity level and language.
+    """)
+    
+    # Example selection section
+    gr.Markdown("### 💡 Quick Examples")
+    with gr.Row():
+        example_btn1 = gr.Button("Why is the sky blue?", size="sm", variant="secondary")
+        example_btn2 = gr.Button("How does the internet work?", size="sm", variant="secondary")
+        example_btn3 = gr.Button("What is artificial intelligence?", size="sm", variant="secondary")
+    
+    # Input section with improved layout
+    with gr.Row():
+        with gr.Column(scale=2):
+            question = gr.Textbox(
+                label="💡 What would you like to understand?",
+                placeholder="Enter your question or select an example above...",
+                lines=2,
+                max_lines=4
+            )
+        with gr.Column(scale=1):
+            level = gr.Slider(
+                1, 5, 
+                value=3, 
+                step=1, 
+                label="📊 Complexity Level",
+                info="1 = Simple, 5 = Expert"
+            )
+            language = gr.Dropdown(
+                LANGUAGES, 
+                value="English", 
+                label="🌍 Language",
+                info="Choose your preferred language"
+            )
+    
+    # Action button with enhanced styling
+    explain_btn = gr.Button(
+        "🚀 Explain Concept", 
+        variant="primary",
+        size="lg"
+    )
+    
+    # Output section with better formatting
+    output = gr.Markdown(
+        label="📝 Explanation",
+        elem_classes=["explanation-box"]
+    )
+    
+    # Connect example buttons to populate question field
+    example_btn1.click(lambda: EXAMPLE_QUESTIONS[0], outputs=question)
+    example_btn2.click(lambda: EXAMPLE_QUESTIONS[1], outputs=question)
+    example_btn3.click(lambda: EXAMPLE_QUESTIONS[2], outputs=question)
+    
+    # Connect button click to explanation function with streaming
+    explain_btn.click(
+        explain_concept, 
+        inputs=[question, level, language], 
+        outputs=output
+    )
+
+def signal_handler(signum, frame):
+    """Handle graceful shutdown signals for local development."""
+    print(f"Received signal {signum}, shutting down gracefully...")
+    exit(0)
+
+if __name__ == "__main__":
+    # Detect environment - Hugging Face Spaces vs local development
+    is_space = os.getenv('SPACE_ID') is not None
+    
+    # Set up signal handler for local development only
+    if not is_space:
+        signal.signal(signal.SIGINT, signal_handler)
+    
+    print("🚀 Starting AI Concept Explainer...")
+    print(f"Environment: {'Hugging Face Spaces' if is_space else 'Local Development'}")
+    
+    if is_space:
+        # Production configuration for Hugging Face Spaces
+        app.launch(
+            server_name="0.0.0.0",  # Accept external connections
+            server_port=7860,       # Standard Spaces port
+            show_error=True,        # Display errors in UI
+            quiet=False             # Show startup logs
+        )
+    else:
+        # Development configuration for local use
+        app.launch(
+            share=False,            # No public sharing
+            server_name="127.0.0.1", # Localhost only
+            server_port=7860,       # Consistent port
+            inbrowser=True,         # Auto-open browser
+            show_error=True,        # Display errors in UI
+            quiet=False             # Show startup logs
+        )

requirements.txt

@@ -0,0 +1,9 @@
+# Python 3.12.11
+# Local versions:
+# gradio==5.46.0
+# openai==1.107.3
+# python-dotenv==1.1.1
+
+gradio
+openai
+python-dotenv