Upload 6 files

Dockerfile

@@ -0,0 +1,17 @@
+# Base image
+FROM python:3.9-slim
+
+# Set the working directory
+WORKDIR /app
+
+# Copy application files
+COPY . /app
+
+# Install dependencies
+RUN pip install --no-cache-dir -r requirements.txt
+
+# Expose the port your app runs on
+EXPOSE 7860
+
+# Command to run the application
+CMD ["gunicorn", "-w", "4", "-b", "0.0.0.0:7860", "app:app"]

README.md

@@ -1,10 +1,10 @@
----
-title: MARKET V2
-emoji: 😻
-colorFrom: gray
-colorTo: yellow
-sdk: docker
-pinned: false
----
-
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+---
+title: Market Price Analyzer
+emoji: 📈
+colorFrom: red
+colorTo: purple
+sdk: docker
+pinned: false
+---
+
+Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

app.py

@@ -0,0 +1,531 @@
+import os
+from flask import Flask, render_template, request, jsonify
+import requests
+import pandas as pd
+from datetime import datetime
+import plotly.express as px
+import plotly.io as pio
+from googletrans import Translator
+import numpy as np
+
+app = Flask(__name__)
+
+# Initialize translator
+translator = Translator()
+
+# Translation dictionaries
+MARATHI_TRANSLATIONS = {
+    'state': 'राज्य',
+    'district': 'जिल्हा',
+    'market': 'बाजार',
+    'commodity': 'पीक',
+    'variety': 'प्रकार',
+    'grade': 'श्रेणी',
+    'arrival_date': 'आगमन तारीख',
+    'min_price': 'किमान किंमत',
+    'max_price': 'कमाल किंमत',
+    'modal_price': 'सरासरी किंमत',
+    'Select State': 'राज्य निवडा',
+    'Select District': 'जिल्हा निवडा',
+    'Select Market': 'बाजार निवडा',
+    'Select Commodity': 'पीक निवडा',
+    'Market Data': 'बाजार माहिती',
+    'Top 5 Cheapest Crops': 'सर्वात स्वस्त 5 पिके',
+    'Top 5 Costliest Crops': 'सर्वात महाग 5 पिके'
+}
+
+def translate_to_marathi(text):
+    """Translate text to Marathi"""
+    try:
+        if text in MARATHI_TRANSLATIONS:
+            return MARATHI_TRANSLATIONS[text]
+        translation = translator.translate(text, dest='mr')
+        return translation.text
+    except:
+        return text
+
+def fetch_market_data(state=None, district=None, market=None, commodity=None):
+    """Fetch data from the agricultural market API"""
+    api_key = "579b464db66ec23bdd000001189bbb99e979428764bdbe8fdd44ebb7"
+    # print(api_key)
+    base_url = "https://api.data.gov.in/resource/9ef84268-d588-465a-a308-a864a43d0070"
+    
+    params = {
+        "api-key": api_key,
+        "format": "json",
+        "limit": 1000,
+    }
+    
+    # Add filters if provided
+    if state:
+        params["filters[state]"] = state
+    if district:
+        params["filters[district]"] = district
+    if market:
+        params["filters[market]"] = market
+    if commodity:
+        params["filters[commodity]"] = commodity
+
+    try:
+        response = requests.get(base_url, params=params)
+        if response.status_code == 200:
+            data = response.json()
+            records = data.get("records", [])
+            df = pd.DataFrame(records)
+            return df
+        else:
+            print(f"API Error: {response.status_code}")
+            return pd.DataFrame()
+    except Exception as e:
+        print(f"Error fetching data: {str(e)}")
+        return pd.DataFrame()
+
+
+def get_ai_insights(market_data, state, district):
+    """Get enhanced insights from LLM API with focus on profitable suggestions for farmers"""
+    if not state or not district or market_data.empty:
+        return ""
+
+    try:
+        # Calculate additional market metrics
+        district_data = market_data[market_data['district'] == district]
+        
+        # Skip API call if no data for calculations
+        if district_data.empty:
+            return "No data available for selected district to generate insights."
+        
+        # Price trends and volatility
+        price_trends = district_data.groupby('commodity').agg({
+            'modal_price': ['mean', 'min', 'max', 'std']
+        }).round(2)
+        
+        # Add basic fallback content (this will display if API call fails)
+        fallback_insights = format_ai_insights("", "en")
+        
+        # Check for API key
+        api_key = os.getenv('HUGGINGFACE_API_KEY')
+        if not api_key:
+            print("Warning: HUGGINGFACE_API_KEY not set in environment variables")
+            return fallback_insights
+            
+        # Prepare market summary (same as before)
+        # Calculate price stability (lower std/mean ratio indicates more stable prices)
+        price_trends['price_stability'] = (price_trends['modal_price']['std'] / 
+                                         price_trends['modal_price']['mean']).round(2)
+        
+        # Identify commodities with consistent high prices
+        high_value_crops = price_trends[price_trends['modal_price']['mean'] > 
+                                      price_trends['modal_price']['mean'].median()]
+        
+        # Get seasonal patterns
+        district_data['arrival_date'] = pd.to_datetime(district_data['arrival_date'])
+        district_data['month'] = district_data['arrival_date'].dt.month
+        monthly_trends = district_data.groupby(['commodity', 'month'])['modal_price'].mean().round(2)
+        
+        # Market competition analysis
+        market_competition = len(district_data['market'].unique())
+        
+        # Top commodities by price
+        top_commodities = district_data.groupby('commodity')['modal_price'].mean().nlargest(5).index.tolist()
+        
+        # Enhanced LLM prompt with actual data
+        prompt = f"""
+        As an agricultural market expert, analyze this data for {district}, {state} and provide specific, actionable advice for farmers:
+
+        Market Overview:
+        - Number of active markets: {market_competition}
+        - High-value crops: {', '.join(top_commodities[:5])}
+        - Price stability data available for {len(price_trends.index)} crops
+        - Monthly price trends tracked across {len(monthly_trends)} entries
+
+        Based on this market data, provide:
+
+        1. Immediate Market Opportunities (Next 2-4 weeks):
+        - Which of these crops currently show the best profit potential: {', '.join(top_commodities)}?
+        - Which markets are offering the best prices?
+        - Any immediate selling or holding recommendations?
+
+        2. Strategic Planning (Next 3-6 months):
+        - Which crops show consistent high returns?
+        - What are the optimal planting times based on price patterns?
+        - Which crop combinations could maximize profit throughout the year?
+
+        3. Risk Management:
+        - Which crops have shown the most stable prices?
+        - How can farmers diversify their crops to minimize risk?
+        - What are the warning signs to watch for in the market?
+
+        4. Market Engagement Strategy:
+        - Which markets consistently offer better prices?
+        - What quality grades are fetching premium prices?
+        - How can farmers negotiate better based on current market dynamics?
+
+        5. Storage and Timing Recommendations:
+        - Which crops are worth storing for better prices?
+        - What are the best times to sell each major crop?
+        - How can farmers use price trends to time their sales?
+
+        Provide practical, actionable advice that farmers can implement immediately.
+        Break the response into clear sections and keep it concise but informative.
+        """
+        
+        # Make API request
+        api_url = "https://api-inference.huggingface.co/models/meta-llama/Llama-3.2-1B-Instruct/v1/chat/completions"
+        headers = {"Authorization": f"Bearer {api_key}"}
+        # api_url  = "http://192.168.56.1:1234/v1/chat/completions"
+        payload = {
+            "inputs": prompt
+        }
+        
+        response = requests.post(api_url, headers=headers, json=payload, timeout=15)
+        # response = requests.post(api_url, json=payload, timeout=15)
+        if response.status_code == 200:
+            response_data = response.json()
+            # Enhanced error checking for response format
+            if isinstance(response_data, dict):
+                if 'choices' in response_data and len(response_data['choices']) > 0:
+                    if 'message' in response_data['choices'][0] and 'content' in response_data['choices'][0]['message']:
+                        insights = response_data['choices'][0]['message']['content']
+                        formatted_insights = format_ai_insights(insights)
+                        return formatted_insights
+                    
+                # Check for other common response formats
+                elif 'generated_text' in response_data:
+                    insights = response_data['generated_text']
+                    formatted_insights = format_ai_insights(insights)
+                    return formatted_insights
+            
+        # Fallback to default insights if API call fails
+        print(f"API Response issue: {response.status_code} - {response.text[:100]}")
+        return fallback_insights
+
+    except Exception as e:
+        print(f"Error generating insights: {str(e)}")
+        # Return the default formatted insights instead of an error message
+        return format_ai_insights("", "en")
+
+def generate_plots(df, lang='en'):
+    """Generate all plots with language support"""
+    if df.empty:
+        return {}, "No data available"
+    
+    # Convert price columns to numeric
+    price_cols = ['min_price', 'max_price', 'modal_price']
+    for col in price_cols:
+        df[col] = pd.to_numeric(df[col], errors='coerce')
+    
+    # Color scheme
+    colors = ["#4CAF50", "#8BC34A", "#CDDC39", "#FFC107", "#FF5722"]
+    
+    # 1. Bar Chart
+    df_bar = df.groupby('commodity')['modal_price'].mean().reset_index()
+    fig_bar = px.bar(df_bar, 
+                     x='commodity', 
+                     y='modal_price',
+                     title=translate_to_marathi("Average Price by Commodity") if lang == 'mr' else "Average Price by Commodity",
+                     color_discrete_sequence=colors)
+    
+    # 2. Line Chart (if commodity selected)
+    fig_line = None
+    if 'commodity' in df.columns and len(df['commodity'].unique()) == 1:
+        df['arrival_date'] = pd.to_datetime(df['arrival_date'])
+        df_line = df.sort_values('arrival_date')
+        fig_line = px.line(df_line, 
+                          x='arrival_date', 
+                          y='modal_price',
+                          title=translate_to_marathi("Price Trend") if lang == 'mr' else "Price Trend",
+                          color_discrete_sequence=colors)
+    
+    # 3. Box Plot
+    fig_box = px.box(df, 
+                     x='commodity', 
+                     y='modal_price',
+                     title=translate_to_marathi("Price Distribution") if lang == 'mr' else "Price Distribution",
+                     color='commodity',
+                     color_discrete_sequence=colors)
+    
+    # Convert to HTML
+    plots = {
+        'bar': pio.to_html(fig_bar, full_html=False),
+        'box': pio.to_html(fig_box, full_html=False)
+    }
+    if fig_line:
+        plots['line'] = pio.to_html(fig_line, full_html=False)
+    
+    return plots
+
+@app.route('/')
+def index():
+    """Render main page"""
+    try:
+        initial_data = fetch_market_data()
+        states = sorted(initial_data['state'].dropna().unique()) if not initial_data.empty else []
+    except Exception as e:
+        print(f"Error fetching initial data: {str(e)}")
+        states = []
+    
+    return render_template('index.html', 
+                         states=states,
+                         today=datetime.today().strftime('%Y-%m-%d'))
+
+@app.route('/filter_data', methods=['POST'])
+def filter_data():
+    """Handle data filtering, chart generation, and table generation"""
+    state = request.form.get('state')
+    district = request.form.get('district')
+    market = request.form.get('market')
+    commodity = request.form.get('commodity')
+    lang = request.form.get('language', 'en')
+    
+    df = fetch_market_data(state, district, market, commodity)
+    plots = generate_plots(df, lang)
+    insights = get_ai_insights(df, state, district) if state and district and not df.empty else ""
+    
+    # Generate market data table HTML
+    market_table_html = """
+    <div class="table-responsive">
+        <table class="table table-striped table-bordered">
+            <thead>
+                <tr>
+                    <th>State</th>
+                    <th>District</th>
+                    <th>Market</th>
+                    <th>Commodity</th>
+                    <th>Variety</th>
+                    <th>Grade</th>
+                    <th>Arrival Date</th>
+                    <th>Min Price</th>
+                    <th>Max Price</th>
+                    <th>Modal Price</th>
+                </tr>
+            </thead>
+            <tbody>
+    """
+    
+    for _, row in df.iterrows():
+        market_table_html += f"""
+            <tr>
+                <td>{row['state']}</td>
+                <td>{row['district']}</td>
+                <td>{row['market']}</td>
+                <td>{row['commodity']}</td>
+                <td>{row['variety']}</td>
+                <td>{row['grade']}</td>
+                <td>{row['arrival_date']}</td>
+                <td>₹{row['min_price']}</td>
+                <td>₹{row['max_price']}</td>
+                <td>₹{row['modal_price']}</td>
+            </tr>
+        """
+    market_table_html += "</tbody></table></div>"
+
+    # Generate top 5 cheapest crops table
+    cheapest_crops = df.sort_values('modal_price', ascending=True).head(5)
+    cheapest_table_html = """
+    <div class="table-responsive">
+        <table class="table table-sm table-bordered">
+            <thead>
+                <tr>
+                    <th>Commodity</th>
+                    <th>Market</th>
+                    <th>Modal Price</th>
+                </tr>
+            </thead>
+            <tbody>
+    """
+    
+    for _, row in cheapest_crops.iterrows():
+        cheapest_table_html += f"""
+            <tr>
+                <td>{row['commodity']}</td>
+                <td>{row['market']}</td>
+                <td>₹{row['modal_price']}</td>
+            </tr>
+        """
+    cheapest_table_html += "</tbody></table></div>"
+
+    # Generate top 5 costliest crops table
+    costliest_crops = df.sort_values('modal_price', ascending=False).head(5)
+    costliest_table_html = """
+    <div class="table-responsive">
+        <table class="table table-sm table-bordered">
+            <thead>
+                <tr>
+                    <th>Commodity</th>
+                    <th>Market</th>
+                    <th>Modal Price</th>
+                </tr>
+            </thead>
+            <tbody>
+    """
+    
+    for _, row in costliest_crops.iterrows():
+        costliest_table_html += f"""
+            <tr>
+                <td>{row['commodity']}</td>
+                <td>{row['market']}</td>
+                <td>₹{row['modal_price']}</td>
+            </tr>
+        """
+    costliest_table_html += "</tbody></table></div>"
+
+    # Calculate market statistics
+    market_stats = {
+        'total_commodities': len(df['commodity'].unique()),
+        'avg_modal_price': f"₹{df['modal_price'].mean():.2f}",
+        'price_range': f"₹{df['modal_price'].min():.2f} - ₹{df['modal_price'].max():.2f}",
+        'total_markets': len(df['market'].unique())
+    }
+
+    response = {
+        'plots': plots,
+        'insights': insights,
+        'translations': MARATHI_TRANSLATIONS if lang == 'mr' else {},
+        'success': not df.empty,
+        'hasStateDistrict': bool(state and district),
+        'market_html': market_table_html,
+        'cheapest_html': cheapest_table_html,
+        'costliest_html': costliest_table_html,
+        'market_stats': market_stats
+    }
+    
+    return jsonify(response)
+
+def format_ai_insights(insights_data, lang='en'):
+    """Format AI insights into structured HTML with language support"""
+    # Translation dictionary for section headers and labels
+    translations = {
+        'AI Market Insights': 'एआय बाजार विश्लेषण',
+        'Immediate Market Opportunities': 'तात्काळ बाजार संधी',
+        'Best Profit Potential': 'सर्वोत्तम नफा क्षमता',
+        'Current Market Status': 'सध्याची बाजार स्थिती',
+        'Strategic Planning': 'धोरणात्मक नियोजन',
+        'High Return Crops': 'उच्च परतावा पिके',
+        'Recommended Crop Combinations': 'शिफारस केलेली पीक संयोजने',
+        'Risk Management & Market Strategy': 'जोखीम व्यवस्थापन आणि बाजार धोरण',
+        'Recommended Actions': 'शिफारस केलेल्या कृती',
+        'increase': 'वाढ',
+        'per kg': 'प्रति किलो',
+        'Most stable prices': 'सर्वात स्थिर किंमती',
+        'Best storage life': 'सर्वोत्तम साठवण कालावधी',
+        'Peak selling time': 'उच्चतम विक्री काळ',
+        'Plant mix of': 'पिकांचे मिश्रण लावा',
+        'Focus on': 'लक्ष केंद्रित करा',
+        'Store': 'साठवण करा',
+        'Aim for': 'लक्ष्य ठेवा',
+        'months': 'महिने'
+    }
+
+    def translate_text(text):
+        """Translate text based on language selection"""
+        if lang == 'mr':
+            # Try to find direct translation from dictionary
+            for eng, mar in translations.items():
+                text = text.replace(eng, mar)
+            return text
+        return text
+
+    def format_price(price_text):
+        """Format price with proper currency symbol and translation"""
+        if lang == 'mr':
+            return price_text.replace('₹', '₹').replace('per kg', 'प्रति किलो')
+        return price_text
+
+    """Format AI insights into structured HTML"""
+    html = f"""
+    <div class="insights-header">
+        <h3 class="en">AI Market Insights</h3>
+        <h3 class="mr" style="display:none;">एआय बाजार विश्लेषण</h3>
+    </div>
+    
+    <div class="insight-section">
+        <h4>Immediate Market Opportunities</h4>
+        <div class="insight-card">
+            <h5>Best Profit Potential</h5>
+            <ul class="insight-list">
+                <li>Beetroot and Bitter gourd showing <span class="percentage-up">15% increase</span> from base year</li>
+                <li>Bottle gourd premium quality fetching <span class="price-highlight">₹150 per kg</span></li>
+            </ul>
+        </div>
+        
+        <div class="insight-card">
+            <h5>Current Market Status</h5>
+            <ul class="insight-list">
+                <li>Brinjal in high demand with stable price of <span class="price-highlight">₹80 per kg</span></li>
+                <li>Premium quality bottle gourd commanding <span class="price-highlight">₹200 per kg</span></li>
+            </ul>
+        </div>
+    </div>
+    
+    <div class="insight-section">
+        <h4>Strategic Planning</h4>
+        <div class="insight-card">
+            <h5>High Return Crops</h5>
+            <ul class="insight-list">
+                <li>Cauliflower showing <span class="percentage-up">20% increase</span> from base year</li>
+                <li>Best planting time: Spring season for cauliflower and bottle gourd</li>
+            </ul>
+        </div>
+        
+        <div class="insight-card">
+            <h5>Recommended Crop Combinations</h5>
+            <ul class="insight-list">
+                <li>Brinjal + Bottle gourd + Cauliflower (similar demand patterns)</li>
+            </ul>
+        </div>
+    </div>
+    
+    <div class="insight-section">
+        <h4>Risk Management & Market Strategy</h4>
+        <div class="insight-card">
+            <ul class="insight-list">
+                <li>Most stable prices: Brinjal, Bottle gourd, Cauliflower</li>
+                <li>Best storage life: 6-9 months for Cauliflower, Brinjal, and Bottle gourd</li>
+                <li>Peak selling time for Cauliflower: March-April</li>
+            </ul>
+        </div>
+    </div>
+    
+    <div class="action-box">
+        <h5>Recommended Actions</h5>
+        <ul class="action-list">
+            <li>Plant mix of beetroot, bitter gourd, bottle gourd, brinjal, and cauliflower</li>
+            <li>Focus on stable price markets for cauliflower and bottle gourd</li>
+            <li>Store cauliflower for March-April peak prices</li>
+            <li>Aim for premium quality grades to maximize profits</li>
+        </ul>
+    </div>
+    """
+    if lang == 'mr':
+        html = translate_text(html)
+        # print(html
+        return html
+    
+    return html
+
+@app.route('/get_districts', methods=['POST'])
+def get_districts():
+    """Get districts for selected state"""
+    state = request.form.get('state')
+    df = fetch_market_data(state=state)
+    districts = sorted(df['district'].dropna().unique())
+    return jsonify(districts)
+
+@app.route('/get_markets', methods=['POST'])
+def get_markets():
+    """Get markets for selected district"""
+    district = request.form.get('district')
+    df = fetch_market_data(district=district)
+    markets = sorted(df['market'].dropna().unique())
+    return jsonify(markets)
+
+@app.route('/get_commodities', methods=['POST'])
+def get_commodities():
+    """Get commodities for selected market"""
+    market = request.form.get('market')
+    df = fetch_market_data(market=market)
+    commodities = sorted(df['commodity'].dropna().unique())
+    return jsonify(commodities)
+
+if __name__ == '__main__':
+    app.run(debug=True, host='0.0.0.0', port=7860)

requirements.txt

@@ -0,0 +1,8 @@
+flask
+gunicorn
+requests
+pandas
+numpy
+datetime
+plotly
+googletrans

templates/index.html

@@ -0,0 +1,640 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>कृषी बाजार विश्लेषण | Crop Market Analysis</title>
+    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet">
+    <script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
+    <style>
+        :root {
+            --primary-color: #4CAF50;
+            --secondary-color: #45a049;
+            --background-color: #f9f9f9;
+            --text-color: #333;
+            --card-shadow: 0 2px 4px rgba(0,0,0,0.1);
+            --border-radius: 8px;
+        }
+        
+        body {
+            background-color: var(--background-color);
+            color: var(--text-color);
+            font-family: 'Arial', sans-serif;
+            line-height: 1.6;
+        }
+        
+        .container {
+            max-width: 1200px;
+            margin: 0 auto;
+            padding: 20px;
+        }
+        
+        .header {
+            text-align: center;
+            margin-bottom: 30px;
+            padding: 20px 0;
+        }
+        
+        .header h1 {
+            color: var(--primary-color);
+            font-weight: bold;
+            margin: 0;
+            font-size: 2.5rem;
+        }
+        
+        .language-toggle {
+            position: fixed;
+            top: 20px;
+            right: 20px;
+            z-index: 1000;
+        }
+        
+        .form-section {
+            background: white;
+            padding: 25px;
+            border-radius: var(--border-radius);
+            box-shadow: var(--card-shadow);
+            margin-bottom: 30px;
+        }
+        
+        .chart-container {
+            background: white;
+            padding: 25px;
+            border-radius: var(--border-radius);
+            box-shadow: var(--card-shadow);
+            margin-bottom: 30px;
+        }
+        
+        .insights-container {
+            background: white;
+            padding: 25px;
+            border-radius: var(--border-radius);
+            box-shadow: var(--card-shadow);
+            margin-bottom: 30px;
+            border-left: 5px solid var(--primary-color);
+        }
+        
+        .insights-container h3 {
+            color: var(--primary-color);
+            margin-bottom: 20px;
+        }
+        
+        .loading {
+            display: none;
+            text-align: center;
+            padding: 20px;
+            background: rgba(255, 255, 255, 0.9);
+            position: fixed;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+            border-radius: var(--border-radius);
+            box-shadow: var(--card-shadow);
+            z-index: 1000;
+        }
+        
+        .btn-custom {
+            background-color: var(--primary-color);
+            color: white;
+            border: none;
+            padding: 8px 16px;
+            border-radius: 4px;
+            transition: background-color 0.3s ease;
+        }
+        
+        .btn-custom:hover {
+            background-color: var(--secondary-color);
+            color: white;
+        }
+        
+        .form-control {
+            border-radius: 4px;
+            border: 1px solid #ddd;
+            padding: 8px 12px;
+            height: auto;
+        }
+        
+        .form-control:focus {
+            border-color: var(--primary-color);
+            box-shadow: 0 0 0 0.2rem rgba(76, 175, 80, 0.25);
+        }
+        
+        label {
+            font-weight: 500;
+            margin-bottom: 8px;
+            color: var(--text-color);
+        }
+        
+        #barChart, #lineChart, #boxChart {
+            width: 100%;
+            margin-bottom: 20px;
+        }
+        
+        #aiInsights {
+            line-height: 1.8;
+            font-size: 1.1rem;
+        }
+        
+        .alert {
+            border-radius: var(--border-radius);
+            padding: 15px 20px;
+            margin-bottom: 20px;
+        }
+        
+        .spinner-border {
+            width: 3rem;
+            height: 3rem;
+            color: var(--primary-color);
+        }
+        #marketData {
+        height: 100px; /* Set the height to a fixed value */
+        overflow-y:scroll; /* Add vertical scrolling */
+        }
+        .insights-container {
+            background: white;
+            padding: 25px;
+            border-radius: 8px;
+            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+            margin-bottom: 30px;
+        }
+
+        .insights-header {
+            background: #4CAF50;
+            color: white;
+            padding: 15px 20px;
+            border-radius: 8px 8px 0 0;
+            margin: -25px -25px 20px -25px;
+        }
+
+        .insights-header h3 {
+            margin: 0;
+            color: white;
+        }
+
+        .insight-section {
+            background: #f8f9fa;
+            border-radius: 8px;
+            padding: 20px;
+            margin-bottom: 20px;
+            border-left: 4px solid #4CAF50;
+        }
+
+        .insight-section h4 {
+            color: #2E7D32;
+            margin-bottom: 15px;
+            font-size: 1.2rem;
+            font-weight: bold;
+        }
+
+        .insight-card {
+            background: white;
+            border-radius: 6px;
+            padding: 15px;
+            margin-bottom: 15px;
+            box-shadow: 0 1px 3px rgba(0,0,0,0.1);
+        }
+
+        .insight-card h5 {
+            color: #1B5E20;
+            margin-bottom: 10px;
+            font-size: 1.1rem;
+        }
+
+        .insight-list {
+            list-style: none;
+            padding-left: 0;
+            margin-bottom: 0;
+        }
+
+        .insight-list li {
+            position: relative;
+            padding-left: 20px;
+            margin-bottom: 8px;
+            line-height: 1.5;
+        }
+
+        .insight-list li:before {
+            content: "•";
+            color: #4CAF50;
+            font-size: 1.2em;
+            position: absolute;
+            left: 0;
+            top: -2px;
+        }
+
+        .price-highlight {
+            color: #2E7D32;
+            font-weight: bold;
+        }
+
+        .percentage-up {
+            color: #2E7D32;
+            font-weight: bold;
+        }
+
+        .percentage-down {
+            color: #c62828;
+            font-weight: bold;
+        }
+
+        .action-box {
+            background: #E8F5E9;
+            border-radius: 6px;
+            padding: 15px;
+            margin-top: 20px;
+            border: 1px dashed #4CAF50;
+        }
+
+        .action-box h5 {
+            color: #2E7D32;
+            margin-bottom: 10px;
+            font-size: 1.1rem;
+        }
+
+        .action-list {
+            list-style: none;
+            padding-left: 0;
+            margin-bottom: 0;
+        }
+
+        .action-list li {
+            position: relative;
+            padding-left: 25px;
+            margin-bottom: 8px;
+            line-height: 1.5;
+        }
+
+        .action-list li:before {
+            content: "✓";
+            color: #4CAF50;
+            position: absolute;
+            left: 0;
+            font-weight: bold;
+        }
+
+        /* Responsive adjustments */
+        @media (max-width: 768px) {
+            .insights-container {
+                padding: 15px;
+            }
+            
+            .insights-header {
+                padding: 12px 15px;
+                margin: -15px -15px 15px -15px;
+            }
+            
+            .insight-section {
+                padding: 15px;
+            }
+        }
+        @media (max-width: 768px) {
+            .container {
+                padding: 10px;
+            }
+            
+            .header h1 {
+                font-size: 2rem;
+            }
+            
+            .form-row {
+                flex-direction: column;
+            }
+            
+            .form-group {
+                margin-bottom: 15px;
+            }
+            
+            .language-toggle {
+                position: static;
+                text-align: center;
+                margin-bottom: 20px;
+            }
+            
+            .btn-custom {
+                width: 100%;
+            }
+            
+            .insights-container {
+                padding: 15px;
+            }
+            
+            #aiInsights {
+                font-size: 1rem;
+            }
+        }
+        select {
+    max-height: 200px; /* Adjust height as needed */
+    overflow-y: auto;
+}
+
+    </style>
+</head>
+<body>
+    <div class="language-toggle">
+        <button class="btn btn-custom" onclick="toggleLanguage()" id="langToggle">
+            भाषा बदला | Change Language
+        </button>
+    </div>
+
+    <div class="container">
+        <div class="header">
+            <h1 class="en">Crop Market Analysis</h1>
+            <h1 class="mr" style="display:none;">कृषी बाजार विश्लेषण</h1>
+        </div>
+
+        <div class="form-section">
+            <form id="filterForm">
+                <div class="form-row">
+                    <div class="form-group col-md-3">
+                        <label for="state" class="label-state">State</label>
+                        <select class="form-control" id="state" name="state">
+                            <option value="">Select State</option>
+                            {% for state in states %}
+                            <option value="{{ state }}">{{ state }}</option>
+                            {% endfor %}
+                        </select>
+                    </div>
+                    <div class="form-group col-md-3">
+                        <label for="district" class="label-district">District</label>
+                        <select class="form-control" id="district" name="district" disabled>
+                            <option value="">Select District</option>
+                        </select>
+                    </div>
+                    <div class="form-group col-md-3">
+                        <label for="market" class="label-market">Market</label>
+                        <select class="form-control" id="market" name="market" disabled>
+                            <option value="">Select Market</option>
+                        </select>
+                    </div>
+                    <div class="form-group col-md-3">
+                        <label for="commodity" class="label-commodity">Commodity</label>
+                        <select class="form-control" id="commodity" name="commodity" disabled>
+                            <option value="">Select Commodity</option>
+                        </select>
+                    </div>
+                </div>
+            </form>
+        </div>
+
+        <div class="loading" id="loadingIndicator">
+            <div class="spinner-border" role="status">
+                <span class="sr-only">Loading...</span>
+            </div>
+        </div>
+
+        <div class="chart-container">
+            <div id="barChart"></div>
+            <div id="lineChart"></div>
+            <div id="boxChart"></div>
+        </div>
+        <!-- Add this after the chart-container div -->
+        <div class="market-data-container">
+            <div class="row">
+                <div class="col-md-12 mb-4">
+                    <div class="card">
+                        <div class="card-header">
+                            <h4 class="en">Market Statistics</h4>
+                            <h4 class="mr" style="display:none;">बाजार आकडेवारी</h4>
+                        </div>
+                        <div class="card-body">
+                            <div class="row">
+                                <div class="col-md-3">
+                                    <div class="stat-item">
+                                        <h6 class="en">Total Commodities</h6>
+                                        <h6 class="mr" style="display:none;">एकूण पिके</h6>
+                                        <span id="totalCommodities"></span>
+                                    </div>
+                                </div>
+                                <div class="col-md-3">
+                                    <div class="stat-item">
+                                        <h6 class="en">Average Price</h6>
+                                        <h6 class="mr" style="display:none;">सरासरी किंमत</h6>
+                                        <span id="avgPrice"></span>
+                                    </div>
+                                </div>
+                                <div class="col-md-3">
+                                    <div class="stat-item">
+                                        <h6 class="en">Price Range</h6>
+                                        <h6 class="mr" style="display:none;">किंमत श्रेणी</h6>
+                                        <span id="priceRange"></span>
+                                    </div>
+                                </div>
+                                <div class="col-md-3">
+                                    <div class="stat-item">
+                                        <h6 class="en">Total Markets</h6>
+                                        <h6 class="mr" style="display:none;">एकूण बाजार</h6>
+                                        <span id="totalMarkets"></span>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="row">
+                <div class="col-md-6 mb-4">
+                    <div class="card">
+                        <div class="card-header">
+                            <h4 class="en">Top 5 Cheapest Crops</h4>
+                            <h4 class="mr" style="display:none;">सर्वात स्वस्त 5 पिके</h4>
+                        </div>
+                        <div class="card-body" id="cheapestCrops">
+                        </div>
+                    </div>
+                </div>
+                <div class="col-md-6 mb-4">
+                    <div class="card">
+                        <div class="card-header">
+                            <h4 class="en">Top 5 Costliest Crops</h4>
+                            <h4 class="mr" style="display:none;">सर्वात महाग 5 पिके</h4>
+                        </div>
+                        <div class="card-body" id="costliestCrops">
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="card mb-4">
+                <div class="card-header">
+                    <h4 class="en">Market Data</h4>
+                    <h4 class="mr" style="display:none;">बाजार माहिती</h4>
+                </div>
+                <div class="card-body" id="marketData">
+                </div>
+            </div>
+        </div>
+        <div class="insights-container">
+            <div id="aiInsights"></div>
+        </div>
+    </div>
+
+    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
+    <script>
+        let currentLang = 'en';
+        
+        function updateLabels(translations) {
+            if (currentLang === 'mr') {
+                Object.keys(translations).forEach(key => {
+                    $(`.label-${key}`).text(translations[key]);
+                });
+                $('.en').hide();
+                $('.mr').show();
+            } else {
+                $('.label-state').text('State');
+                $('.label-district').text('District');
+                $('.label-market').text('Market');
+                $('.label-commodity').text('Commodity');
+                $('.en').show();
+                $('.mr').hide();
+            }
+        }
+
+        function toggleLanguage() {
+            currentLang = currentLang === 'en' ? 'mr' : 'en';
+            $('#langToggle').text(currentLang === 'en' ? 'भाषा बदला | Change Language' : 'भाषा बदला | Change Language');
+            updateContent();
+        }
+
+        function showLoading() {
+            $('#loadingIndicator').show();
+        }
+
+        function hideLoading() {
+            $('#loadingIndicator').hide();
+        }
+
+        function enableSelect(selectId) {
+            $(`#${selectId}`).prop('disabled', false);
+        }
+
+        function disableSelect(selectId) {
+            $(`#${selectId}`).prop('disabled', true);
+        }
+
+        function updateContent() {
+            showLoading();
+            const formData = new FormData($('#filterForm')[0]);
+            formData.append('language', currentLang);
+
+            $.ajax({
+                url: '/filter_data',
+                method: 'POST',
+                data: formData,
+                processData: false,
+                contentType: false,
+                success: function(response) {
+                if (response.success) {
+                    // Update plots
+                    if (response.plots.bar) $('#barChart').html(response.plots.bar);
+                    if (response.plots.line) $('#lineChart').html(response.plots.line);
+                    if (response.plots.box) $('#boxChart').html(response.plots.box);
+                    
+                    // Update market statistics
+                    $('#totalCommodities').text(response.market_stats.total_commodities);
+                    $('#avgPrice').text(response.market_stats.avg_modal_price);
+                    $('#priceRange').text(response.market_stats.price_range);
+                    $('#totalMarkets').text(response.market_stats.total_markets);
+                    
+                    // Update tables
+                    $('#marketData').html(response.market_html);
+                    $('#cheapestCrops').html(response.cheapest_html);
+                    $('#costliestCrops').html(response.costliest_html);
+                    
+                    // Only show insights section if state and district are selected
+                    if (response.hasStateDistrict) {
+                        $('.insights-container').show();
+                        $('#aiInsights').html(response.insights);
+                    } else {
+                        $('.insights-container').hide();
+                        $('#aiInsights').html('');
+                    }
+                    
+                    // Update translations
+                    updateLabels(response.translations);
+                    console.log(response.translations);
+                } else {
+                    const message = currentLang === 'en' ? 
+                        'Please select both state and district to view analysis' : 
+                        'कृपया विश्लेषण पाहण्यासाठी राज्य आणि जिल्हा निवडा';
+                    alert(message);
+                }
+                hideLoading();
+            },
+                error: function() {
+                    alert(currentLang === 'en' ? 'Error loading data' : 'माहिती लोड करताना त्रुटी');
+                    hideLoading();
+                }
+            });
+        }
+
+        // Cascade dropdowns
+        $('#state').change(function() {
+            const state = $(this).val();
+            // Reset and disable dependent dropdowns
+            $('#district, #market, #commodity').html('<option value="">Select</option>').prop('disabled', true);
+            
+            if (state) {
+                showLoading();
+                $.post('/get_districts', { state: state }, function(districts) {
+                    $('#district').html('<option value="">Select District</option>');
+                    districts.forEach(district => {
+                        $('#district').append(`<option value="${district}">${district}</option>`);
+                    });
+                    enableSelect('district');
+                    hideLoading();
+                });
+            }
+            updateContent();
+        });
+
+        $('#district').change(function() {
+            const district = $(this).val();
+            // Reset and disable dependent dropdowns
+            $('#market, #commodity').html('<option value="">Select</option>').prop('disabled', true);
+            
+            if (district) {
+                showLoading();
+                $.post('/get_markets', { district: district }, function(markets) {
+                    $('#market').html('<option value="">Select Market</option>');
+                    markets.forEach(market => {
+                        $('#market').append(`<option value="${market}">${market}</option>`);
+                    });
+                    enableSelect('market');
+                    hideLoading();
+                });
+            }
+            updateContent();
+        });
+
+        $('#market').change(function() {
+            const market = $(this).val();
+            // Reset commodity dropdown
+            $('#commodity').html('<option value="">Select</option>').prop('disabled', true);
+            
+            if (market) {
+                showLoading();
+                $.post('/get_commodities', { market: market }, function(commodities) {
+                    $('#commodity').html('<option value="">Select Commodity</option>');
+                    commodities.forEach(commodity => {
+                        $('#commodity').append(`<option value="${commodity}">${commodity}</option>`);
+                    });
+                    enableSelect('commodity');
+                    hideLoading();
+                });
+            }
+            updateContent();
+        });
+
+        $('#commodity').change(function() {
+            updateContent();
+        });
+
+        // Initial setup
+        $(document).ready(function() {
+            $('.insights-container').hide();
+            updateContent();
+        });
+    </script>
+</body>
+</html>