Update app.py

app.py

@@ -2,13 +2,21 @@ import streamlit as st
 import json
 import os
 import uuid
-import base64
 from datetime import datetime
 from PIL import Image
-import io
+import base64
+from io import BytesIO
 import streamlit.components.v1 as components
 from translations import get_translation, SUPPORTED_LANGUAGES
-from utils import load_users, save_users, load_labels, save_labels, validate_image, get_categories
+from utils import load_users, save_users, load_labels, save_labels, validate_image, get_categories, calculate_statistics
+
+# Page configuration
+st.set_page_config(
+    page_title="LabelIt! 🇮🇳",
+    page_icon="🏷️",
+    layout="wide",
+    initial_sidebar_state="expanded"
+)
 
 # Initialize session state
 if 'user' not in st.session_state:
@@ -18,13 +26,15 @@ if 'language' not in st.session_state:
 if 'location_fetched' not in st.session_state:
     st.session_state.location_fetched = False
 if 'user_location' not in st.session_state:
-    st.session_state.user_location = {"lat": None, "lon": None}
+    st.session_state.user_location = {"lat": None, "lon": None, "accuracy": None, "method": None, "timestamp": None}
+if 'manual_location_mode' not in st.session_state:
+    st.session_state.manual_location_mode = False
 
-# Ensure data directory exists
-if not os.path.exists('data'):
-    os.makedirs('data')
+# Create data directories if they don't exist
+os.makedirs('data', exist_ok=True)
+os.makedirs('data/images', exist_ok=True)
 
-# Ensure data files exist
+# Initialize data files
 if not os.path.exists('data/users.json'):
     with open('data/users.json', 'w') as f:
         json.dump({}, f)
@@ -33,636 +43,763 @@ if not os.path.exists('data/labels.json'):
     with open('data/labels.json', 'w') as f:
         json.dump({}, f)
 
-def get_user_location():
-    """Get and store user's location in session state"""
-    # Session state is already initialized at the top of the file
-    if not st.session_state.location_fetched:
-        # Create a placeholder for location status
-        location_placeholder = st.empty()
-        
-        # JavaScript component to get location
-        location_data = components.html(
-            """
-            <script>
-            function getLocation() {
-                document.getElementById("status").innerHTML = "🔄 Requesting location permission...";
+def get_enhanced_location():
+    """Enhanced location capture with multiple fallback methods and accuracy indicators"""
+    if not st.session_state.location_fetched and not st.session_state.manual_location_mode:
+        st.markdown("### 📍 Location Capture for Image Upload")
+        
+        # Show importance message
+        st.info("📍 **Location Required**: Each image upload needs GPS coordinates for better dataset quality and regional insights.")
+        
+        col1, col2 = st.columns([2, 1])
+        
+        with col1:
+            # Enhanced JavaScript location component with multiple fallback methods
+            location_data = components.html(
+                """
+                <script>
+                let locationAttempts = 0;
+                const maxAttempts = 3;
                 
-                if (navigator.geolocation) {
-                    navigator.geolocation.getCurrentPosition(
-                        function(position) {
-                            const lat = position.coords.latitude;
-                            const lon = position.coords.longitude;
-                            document.getElementById("status").innerHTML = "📍 Location captured: " + lat.toFixed(6) + ", " + lon.toFixed(6);
-                            // Send data to Streamlit
-                            window.parent.postMessage({
-                                type: 'streamlit:setComponentValue', 
-                                value: {lat: lat, lon: lon, success: true}
-                            }, '*');
-                        },
-                        function(error) {
-                            let errorMsg = "📍 Location unavailable";
-                            switch(error.code) {
-                                case error.PERMISSION_DENIED:
-                                    errorMsg = "📍 Location access denied by user";
-                                    break;
-                                case error.POSITION_UNAVAILABLE:
-                                    errorMsg = "📍 Location information unavailable";
-                                    break;
-                                case error.TIMEOUT:
-                                    errorMsg = "📍 Location request timed out";
-                                    break;
+                function tryGetLocation() {
+                    locationAttempts++;
+                    document.getElementById("status").innerHTML = `🔄 Attempting high-accuracy GPS location (${locationAttempts}/${maxAttempts})...`;
+                    
+                    if (navigator.geolocation) {
+                        const options = {
+                            enableHighAccuracy: true,
+                            timeout: 20000,
+                            maximumAge: 30000
+                        };
+                        
+                        navigator.geolocation.getCurrentPosition(
+                            function(position) {
+                                const lat = position.coords.latitude;
+                                const lon = position.coords.longitude;
+                                const accuracy = position.coords.accuracy;
+                                const altitude = position.coords.altitude;
+                                const heading = position.coords.heading;
+                                const speed = position.coords.speed;
+                                const timestamp = new Date().toISOString();
+                                
+                                let accuracyLevel = "Low";
+                                let accuracyColor = "#e74c3c";
+                                let accuracyEmoji = "🟡";
+                                if (accuracy <= 10) {
+                                    accuracyLevel = "High";
+                                    accuracyColor = "#27ae60";
+                                    accuracyEmoji = "🟢";
+                                } else if (accuracy <= 50) {
+                                    accuracyLevel = "Medium";
+                                    accuracyColor = "#f39c12";
+                                    accuracyEmoji = "🟠";
+                                } else {
+                                    accuracyEmoji = "🔴";
+                                }
+                                
+                                document.getElementById("status").innerHTML = `
+                                    <div style="background: linear-gradient(45deg, #27ae60, #2ecc71); color: white; padding: 15px; border-radius: 10px; margin: 10px 0; box-shadow: 0 4px 15px rgba(39, 174, 96, 0.3);">
+                                        <div style="font-weight: bold; margin-bottom: 8px;">✅ GPS Location Captured Successfully!</div>
+                                        <div style="font-size: 0.95em; margin-bottom: 5px;">📍 <strong>${lat.toFixed(6)}, ${lon.toFixed(6)}</strong></div>
+                                        <div style="font-size: 0.85em; margin-bottom: 5px;">
+                                            ${accuracyEmoji} Accuracy: <span style="color: ${accuracyColor}; font-weight: bold;">${accuracyLevel}</span> (±${accuracy.toFixed(0)}m)
+                                        </div>
+                                        <div style="font-size: 0.8em; opacity: 0.9;">⏰ ${new Date(timestamp).toLocaleString()}</div>
+                                        ${altitude ? `<div style="font-size: 0.8em; opacity: 0.9;">⛰️ Altitude: ${altitude.toFixed(0)}m</div>` : ''}
+                                    </div>
+                                `;
+                                
+                                window.parent.postMessage({
+                                    type: 'streamlit:setComponentValue', 
+                                    value: {
+                                        lat: lat, 
+                                        lon: lon, 
+                                        accuracy: accuracy,
+                                        altitude: altitude,
+                                        heading: heading,
+                                        speed: speed,
+                                        method: "GPS",
+                                        timestamp: timestamp,
+                                        success: true
+                                    }
+                                }, '*');
+                            },
+                            function(error) {
+                                let errorMsg = "📍 GPS location unavailable";
+                                let errorDetail = "";
+                                switch(error.code) {
+                                    case error.PERMISSION_DENIED:
+                                        errorMsg = "🚫 Location access denied";
+                                        errorDetail = "Please allow location access in your browser settings";
+                                        break;
+                                    case error.POSITION_UNAVAILABLE:
+                                        errorMsg = "📍 GPS position unavailable";
+                                        errorDetail = "Your device's GPS might be disabled";
+                                        break;
+                                    case error.TIMEOUT:
+                                        errorMsg = "⏱️ GPS request timed out";
+                                        errorDetail = "GPS is taking too long to respond";
+                                        break;
+                                }
+                                
+                                if (locationAttempts < maxAttempts) {
+                                    document.getElementById("status").innerHTML = `
+                                        <div style="background: linear-gradient(45deg, #f39c12, #e67e22); color: white; padding: 15px; border-radius: 10px; margin: 10px 0;">
+                                            <div style="font-weight: bold; margin-bottom: 5px;">${errorMsg}</div>
+                                            <div style="font-size: 0.9em; margin-bottom: 5px;">${errorDetail}</div>
+                                            <div style="font-size: 0.8em;">🔄 Retrying in 2 seconds... (${locationAttempts}/${maxAttempts})</div>
+                                        </div>
+                                    `;
+                                    setTimeout(tryGetLocation, 2000);
+                                } else {
+                                    // Try IP-based location as fallback
+                                    tryIPLocation();
+                                }
+                            },
+                            options
+                        );
+                    } else {
+                        tryIPLocation();
+                    }
+                }
+                
+                function tryIPLocation() {
+                    document.getElementById("status").innerHTML = `
+                        <div style="background: linear-gradient(45deg, #3498db, #2980b9); color: white; padding: 15px; border-radius: 10px; margin: 10px 0;">
+                            <div style="font-weight: bold;">🌐 Trying IP-based location...</div>
+                            <div style="font-size: 0.9em; opacity: 0.9;">Falling back to approximate location</div>
+                        </div>
+                    `;
+                    
+                    // Multiple IP geolocation services for reliability
+                    const services = [
+                        'https://ipapi.co/json/',
+                        'https://api.ipify.org?format=json',
+                        'https://httpbin.org/ip'
+                    ];
+                    
+                    fetch('https://ipapi.co/json/')
+                        .then(response => response.json())
+                        .then(data => {
+                            if (data.latitude && data.longitude && !data.error) {
+                                document.getElementById("status").innerHTML = `
+                                    <div style="background: linear-gradient(45deg, #3498db, #2980b9); color: white; padding: 15px; border-radius: 10px; margin: 10px 0; box-shadow: 0 4px 15px rgba(52, 152, 219, 0.3);">
+                                        <div style="font-weight: bold; margin-bottom: 8px;">🌐 IP-based Location Found</div>
+                                        <div style="font-size: 0.95em; margin-bottom: 5px;">📍 <strong>${data.latitude.toFixed(6)}, ${data.longitude.toFixed(6)}</strong></div>
+                                        <div style="font-size: 0.85em; margin-bottom: 5px;">
+                                            🟠 Accuracy: <span style="color: #f39c12; font-weight: bold;">Approximate</span> (City-level)
+                                        </div>
+                                        <div style="font-size: 0.8em; opacity: 0.9;">🏙️ ${data.city || 'Unknown'}, ${data.country_name || data.country || 'Unknown'}</div>
+                                        <div style="font-size: 0.8em; opacity: 0.9;">🌐 ISP: ${data.org || 'Unknown'}</div>
+                                    </div>
+                                `;
+                                
+                                window.parent.postMessage({
+                                    type: 'streamlit:setComponentValue', 
+                                    value: {
+                                        lat: data.latitude, 
+                                        lon: data.longitude, 
+                                        accuracy: 10000,
+                                        method: "IP",
+                                        timestamp: new Date().toISOString(),
+                                        city: data.city,
+                                        country: data.country_name || data.country,
+                                        region: data.region,
+                                        timezone: data.timezone,
+                                        isp: data.org,
+                                        success: true
+                                    }
+                                }, '*');
+                            } else {
+                                showLocationUnavailable();
                             }
-                            document.getElementById("status").innerHTML = errorMsg;
-                            window.parent.postMessage({
-                                type: 'streamlit:setComponentValue', 
-                                value: {lat: null, lon: null, success: false}
-                            }, '*');
-                        },
-                        {enableHighAccuracy: true, timeout: 10000, maximumAge: 300000}
-                    );
-                } else {
-                    document.getElementById("status").innerHTML = "📍 Location not supported by this browser";
+                        })
+                        .catch(() => {
+                            showLocationUnavailable();
+                        });
+                }
+                
+                function showLocationUnavailable() {
+                    document.getElementById("status").innerHTML = `
+                        <div style="background: linear-gradient(45deg, #e74c3c, #c0392b); color: white; padding: 15px; border-radius: 10px; margin: 10px 0; box-shadow: 0 4px 15px rgba(231, 76, 60, 0.3);">
+                            <div style="font-weight: bold; margin-bottom: 8px;">⚠️ Location Not Available</div>
+                            <div style="font-size: 0.9em; margin-bottom: 5px;">Unable to detect your location automatically</div>
+                            <div style="font-size: 0.85em; opacity: 0.9;">• You can continue uploading without location data</div>
+                            <div style="font-size: 0.85em; opacity: 0.9;">• Or enter coordinates manually using the button</div>
+                        </div>
+                    `;
+                    
                     window.parent.postMessage({
                         type: 'streamlit:setComponentValue', 
                         value: {lat: null, lon: null, success: false}
                     }, '*');
                 }
-            }
-            
-            // Run immediately
-            getLocation();
-            </script>
-            <div id="status" style="padding: 12px; background: linear-gradient(45deg, #74b9ff, #0984e3); color: white; border-radius: 10px; text-align: center; font-weight: 500; box-shadow: 0 4px 15px rgba(116, 185, 255, 0.3);">
-                🔄 Getting your location...
-            </div>
-            """,
-            height=70
-        )
+                
+                // Start location capture immediately
+                tryGetLocation();
+                </script>
+                <div id="status" style="padding: 15px; background: linear-gradient(45deg, #74b9ff, #0984e3); color: white; border-radius: 10px; text-align: center; font-weight: 500; box-shadow: 0 4px 15px rgba(116, 185, 255, 0.3);">
+                    🔄 Initializing advanced location services...
+                </div>
+                """,
+                height=140
+            )
+        
+        with col2:
+            if st.button("📝 Enter Manually", help="Enter coordinates manually if automatic detection fails"):
+                st.session_state.manual_location_mode = True
+                st.rerun()
         
-        # Process location data
+        # Process the location data
         if location_data and isinstance(location_data, dict):
-            if location_data.get('success') == True:
+            if location_data.get('success') and location_data.get('lat') and location_data.get('lon'):
                 st.session_state.user_location = {
                     "lat": float(location_data['lat']),
-                    "lon": float(location_data['lon'])
+                    "lon": float(location_data['lon']),
+                    "accuracy": location_data.get('accuracy'),
+                    "method": location_data.get('method', 'Unknown'),
+                    "timestamp": location_data.get('timestamp'),
+                    "city": location_data.get('city'),
+                    "country": location_data.get('country')
                 }
                 st.session_state.location_fetched = True
-                location_placeholder.success(f"✅ Location captured: {st.session_state.user_location['lat']:.6f}, {st.session_state.user_location['lon']:.6f}")
+                st.rerun()
             elif location_data.get('success') == False:
                 st.session_state.location_fetched = True
-                location_placeholder.warning("⚠️ Location not available - uploads will continue without location data")
     
-    # Return the current location status
-    return st.session_state.user_location if st.session_state.location_fetched else None
+    elif st.session_state.manual_location_mode:
+        st.markdown("### 📝 Manual Location Entry")
+        
+        col1, col2, col3 = st.columns([1, 1, 1])
+        
+        with col1:
+            manual_lat = st.number_input(
+                "Latitude", 
+                value=0.0, 
+                format="%.6f",
+                help="Enter latitude (-90 to 90)"
+            )
+        
+        with col2:
+            manual_lon = st.number_input(
+                "Longitude", 
+                value=0.0, 
+                format="%.6f",
+                help="Enter longitude (-180 to 180)"
+            )
+        
+        with col3:
+            st.write("")  # Spacing
+            if st.button("✅ Use These Coordinates"):
+                if -90 <= manual_lat <= 90 and -180 <= manual_lon <= 180:
+                    st.session_state.user_location = {
+                        "lat": manual_lat,
+                        "lon": manual_lon,
+                        "accuracy": None,
+                        "method": "Manual",
+                        "timestamp": datetime.now().isoformat()
+                    }
+                    st.session_state.location_fetched = True
+                    st.session_state.manual_location_mode = False
+                    st.success("✅ Manual coordinates saved!")
+                    st.rerun()
+                else:
+                    st.error("❌ Invalid coordinates. Latitude: -90 to 90, Longitude: -180 to 180")
+        
+        if st.button("🔙 Back to Auto-Detection"):
+            st.session_state.manual_location_mode = False
+            st.rerun()
+    
+    return st.session_state.user_location
 
-def authenticate_user(username, password):
-    """Authenticate user with username and password"""
-    users = load_users()
-    if username in users and users[username]['password'] == password:
-        return users[username]
-    return None
+def display_analytics_sidebar():
+    """Display real-time analytics in the sidebar"""
+    with st.sidebar:
+        st.markdown("## 📊 Live Analytics")
+        
+        # Calculate statistics
+        stats = calculate_statistics()
+        
+        # Display key metrics with enhanced styling
+        st.markdown(f"""
+        <div style="background: linear-gradient(45deg, #667eea, #764ba2); color: white; padding: 15px; border-radius: 10px; margin: 10px 0; text-align: center;">
+            <h3 style="margin: 0; font-size: 2em;">👥 {stats['total_users']}</h3>
+            <p style="margin: 5px 0 0 0;">Total Contributors</p>
+        </div>
+        """, unsafe_allow_html=True)
+        
+        st.markdown(f"""
+        <div style="background: linear-gradient(45deg, #f093fb, #f5576c); color: white; padding: 15px; border-radius: 10px; margin: 10px 0; text-align: center;">
+            <h3 style="margin: 0; font-size: 2em;">🖼️ {stats['total_images']}</h3>
+            <p style="margin: 5px 0 0 0;">Total Images</p>
+        </div>
+        """, unsafe_allow_html=True)
+        
+        st.markdown(f"""
+        <div style="background: linear-gradient(45deg, #4facfe, #00f2fe); color: white; padding: 15px; border-radius: 10px; margin: 10px 0; text-align: center;">
+            <h3 style="margin: 0; font-size: 2em;">🏷️ {stats['total_labels']}</h3>
+            <p style="margin: 5px 0 0 0;">Total Labels</p>
+        </div>
+        """, unsafe_allow_html=True)
+        
+        st.markdown(f"""
+        <div style="background: linear-gradient(45deg, #43e97b, #38f9d7); color: white; padding: 15px; border-radius: 10px; margin: 10px 0; text-align: center;">
+            <h3 style="margin: 0; font-size: 2em;">🌍 {stats['languages_used']}</h3>
+            <p style="margin: 5px 0 0 0;">Languages Used</p>
+        </div>
+        """, unsafe_allow_html=True)
+        
+        # Location statistics
+        st.markdown(f"""
+        <div style="background: linear-gradient(45deg, #fd79a8, #e84393); color: white; padding: 15px; border-radius: 10px; margin: 10px 0; text-align: center;">
+            <h3 style="margin: 0; font-size: 2em;">🌍 {stats['images_with_location']}</h3>
+            <p style="margin: 5px 0 0 0;">Images with GPS Data</p>
+        </div>
+        """, unsafe_allow_html=True)
+        
+        # GPS accuracy breakdown
+        if stats['gps_accuracy_breakdown']:
+            st.markdown("### 🎯 GPS Accuracy Levels")
+            for accuracy_level, count in sorted(stats['gps_accuracy_breakdown'].items(), key=lambda x: x[1], reverse=True):
+                percentage = (count / stats['images_with_location'] * 100) if stats['images_with_location'] > 0 else 0
+                accuracy_emoji = {"High": "🟢", "Medium": "🟠", "Low": "🔴", "Unknown": "⚪"}.get(accuracy_level, "⚪")
+                st.markdown(f"{accuracy_emoji} **{accuracy_level}**: {count} ({percentage:.1f}%)")
+        
+        # Location methods breakdown
+        if stats['location_methods']:
+            st.markdown("### 📍 Location Capture Methods")
+            for method, count in sorted(stats['location_methods'].items(), key=lambda x: x[1], reverse=True):
+                percentage = (count / stats['images_with_location'] * 100) if stats['images_with_location'] > 0 else 0
+                method_emoji = {"GPS": "🛰️", "IP": "🌐", "Manual": "📝"}.get(method, "❓")
+                st.markdown(f"{method_emoji} **{method}**: {count} ({percentage:.1f}%)")
+        
+        # Language usage breakdown
+        if stats['language_breakdown']:
+            st.markdown("### 🗣️ Language Usage")
+            for lang_code, count in sorted(stats['language_breakdown'].items(), key=lambda x: x[1], reverse=True):
+                lang_name = SUPPORTED_LANGUAGES.get(lang_code, lang_code)
+                percentage = (count / stats['total_labels'] * 100) if stats['total_labels'] > 0 else 0
+                st.markdown(f"**{lang_name}**: {count} labels ({percentage:.1f}%)")
+        
+        # Category breakdown
+        if stats['category_breakdown']:
+            st.markdown("### 📂 Category Breakdown")
+            for category, count in sorted(stats['category_breakdown'].items(), key=lambda x: x[1], reverse=True):
+                percentage = (count / stats['total_images'] * 100) if stats['total_images'] > 0 else 0
+                st.markdown(f"**{get_translation(st.session_state.language, category.lower())}**: {count} ({percentage:.1f}%)")
+        
+        # Country/Region statistics
+        if stats['country_breakdown']:
+            st.markdown("### 🌏 Top Countries")
+            for country, count in sorted(stats['country_breakdown'].items(), key=lambda x: x[1], reverse=True)[:5]:
+                percentage = (count / stats['images_with_location'] * 100) if stats['images_with_location'] > 0 else 0
+                st.markdown(f"🏴 **{country}**: {count} ({percentage:.1f}%)")
 
-def register_user(username, password, full_name, email, phone, age, language_preference):
-    """Register a new user"""
-    users = load_users()
-    if username in users:
-        return False
-    
-    user_data = {
-        'password': password,
-        'full_name': full_name,
-        'email': email,
-        'phone': phone,
-        'age': age,
-        'language_preference': language_preference,
-        'registered_at': datetime.now().isoformat()
-    }
+def register_user():
+    """Enhanced user registration form"""
+    st.subheader(get_translation(st.session_state.language, "register"))
     
-    users[username] = user_data
-    save_users(users)
-    return True
-
-def login_logout_section():
-    """Handle login and logout functionality"""
-    if st.session_state.user:
-        # User is logged in - show user details and logout
-        with st.sidebar:
-            # Display user profile with clean formatting
-            user = st.session_state.user
-            
-            st.markdown("### 👤 Profile")
-            
-            # Create a clean profile display
-            profile_info = f"""
-            **Name:** {user.get('full_name', 'N/A')}
-            **Username:** {st.session_state.user['username']}
-            **Email:** {user.get('email', 'N/A')}
-            **Phone:** {user.get('phone', 'N/A')}
-            **Age:** {user.get('age', 'N/A')}
-            **Language:** {SUPPORTED_LANGUAGES.get(user.get('language_preference', 'en'), 'English')}
-            """
+    with st.form("register_form"):
+        col1, col2 = st.columns(2)
+        
+        with col1:
+            username = st.text_input(get_translation(st.session_state.language, "username"))
+            password = st.text_input(get_translation(st.session_state.language, "password"), type="password")
+            confirm_password = st.text_input(get_translation(st.session_state.language, "confirm_password"), type="password")
             
-            st.markdown(profile_info)
+        with col2:
+            full_name = st.text_input(get_translation(st.session_state.language, "full_name"))
+            email = st.text_input(get_translation(st.session_state.language, "email"))
+            phone = st.text_input(get_translation(st.session_state.language, "phone"))
+            age = st.number_input(get_translation(st.session_state.language, "age"), min_value=13, max_value=120, value=25)
+        
+        preferred_language = st.selectbox(
+            get_translation(st.session_state.language, "preferred_language"),
+            options=list(SUPPORTED_LANGUAGES.keys()),
+            format_func=lambda x: SUPPORTED_LANGUAGES[x]
+        )
+        
+        submitted = st.form_submit_button(get_translation(st.session_state.language, "register"))
+        
+        if submitted:
+            if not username or not password or not full_name or not email:
+                st.error(get_translation(st.session_state.language, "fill_all_fields"))
+                return
             
-            # Language selector
-            st.markdown("### 🌐 Language")
-            language_options = list(SUPPORTED_LANGUAGES.keys())
-            language_labels = [f"{SUPPORTED_LANGUAGES[lang]} ({lang})" for lang in language_options]
+            if password != confirm_password:
+                st.error(get_translation(st.session_state.language, "passwords_dont_match"))
+                return
             
-            current_index = language_options.index(st.session_state.language) if st.session_state.language in language_options else 0
+            users = load_users()
             
-            selected_language = st.selectbox(
-                "Select Language",
-                options=language_options,
-                format_func=lambda x: f"{SUPPORTED_LANGUAGES[x]} ({x})",
-                index=current_index,
-                key="language_selector"
-            )
+            if username in users:
+                st.error(get_translation(st.session_state.language, "username_exists"))
+                return
             
-            if selected_language != st.session_state.language:
-                st.session_state.language = selected_language
-                st.rerun()
+            users[username] = {
+                'password': password,
+                'preferred_language': preferred_language,
+                'created_at': datetime.now().isoformat(),
+                'user_details': {
+                    'full_name': full_name,
+                    'email': email,
+                    'phone': phone,
+                    'age': age
+                }
+            }
             
-            # Logout button
-            if st.button("🚪 " + get_translation("logout", st.session_state.language), use_container_width=True):
-                st.session_state.user = None
-                st.session_state.location_fetched = False
-                st.session_state.user_location = {"lat": None, "lon": None}
-                st.rerun()
-        
-        # Get user location automatically after login
-        get_user_location()
-        
-    else:
-        # User is not logged in - show login/register forms
-        st.header(get_translation("welcome", st.session_state.language))
-        
-        tab1, tab2 = st.tabs([get_translation("login", st.session_state.language), get_translation("register", st.session_state.language)])
+            save_users(users)
+            st.success(get_translation(st.session_state.language, "registration_successful"))
+            st.rerun()
+
+def login_user():
+    """User login form"""
+    st.subheader(get_translation(st.session_state.language, "login"))
+    
+    with st.form("login_form"):
+        username = st.text_input(get_translation(st.session_state.language, "username"))
+        password = st.text_input(get_translation(st.session_state.language, "password"), type="password")
         
-        with tab1:
-            # Login form
-            with st.form("login_form"):
-                username = st.text_input(get_translation("username", st.session_state.language))
-                password = st.text_input(get_translation("password", st.session_state.language), type="password")
-                login_button = st.form_submit_button(get_translation("login", st.session_state.language))
-                
-                if login_button:
-                    if username and password:
-                        user = authenticate_user(username, password)
-                        if user:
-                            user['username'] = username
-                            st.session_state.user = user
-                            # Set language preference
-                            st.session_state.language = user.get('language_preference', 'en')
-                            st.success(get_translation("login_success", st.session_state.language))
-                            st.rerun()
-                        else:
-                            st.error(get_translation("invalid_credentials", st.session_state.language))
-                    else:
-                        st.error(get_translation("please_fill_all_fields", st.session_state.language))
+        submitted = st.form_submit_button(get_translation(st.session_state.language, "login"))
         
-        with tab2:
-            # Registration form
-            with st.form("register_form"):
-                new_username = st.text_input(get_translation("username", st.session_state.language), key="reg_username")
-                new_password = st.text_input(get_translation("password", st.session_state.language), type="password", key="reg_password")
-                full_name = st.text_input(get_translation("full_name", st.session_state.language))
-                email = st.text_input(get_translation("email", st.session_state.language))
-                phone = st.text_input(get_translation("phone", st.session_state.language))
-                age = st.number_input(get_translation("age", st.session_state.language), min_value=1, max_value=120, value=25)
-                
-                # Language preference
-                language_options = list(SUPPORTED_LANGUAGES.keys())
-                language_pref = st.selectbox(
-                    get_translation("preferred_language", st.session_state.language),
-                    options=language_options,
-                    format_func=lambda x: f"{SUPPORTED_LANGUAGES[x]} ({x})",
-                    index=language_options.index('en')
-                )
-                
-                register_button = st.form_submit_button(get_translation("register", st.session_state.language))
-                
-                if register_button:
-                    if new_username and new_password and full_name and email:
-                        if register_user(new_username, new_password, full_name, email, phone, age, language_pref):
-                            st.success(get_translation("registration_success", st.session_state.language))
-                        else:
-                            st.error(get_translation("username_exists", st.session_state.language))
-                    else:
-                        st.error(get_translation("please_fill_required_fields", st.session_state.language))
+        if submitted:
+            if not username or not password:
+                st.error(get_translation(st.session_state.language, "fill_all_fields"))
+                return
+            
+            users = load_users()
+            
+            if username not in users:
+                st.error(get_translation(st.session_state.language, "invalid_credentials"))
+                return
+            
+            if users[username]['password'] != password:
+                st.error(get_translation(st.session_state.language, "invalid_credentials"))
+                return
+            
+            st.session_state.user = username
+            st.session_state.language = users[username]['preferred_language']
+            # Reset location fetch status for new login
+            st.session_state.location_fetched = False
+            st.session_state.manual_location_mode = False
+            st.success(get_translation(st.session_state.language, "login_successful"))
+            st.rerun()
 
-def upload_image_section():
-    """Image upload section"""
-    st.header(get_translation("upload_image", st.session_state.language))
+def upload_image():
+    """Enhanced image upload form with location display"""
+    st.subheader(f"📤 {get_translation(st.session_state.language, 'upload_image')}")
     
     # Initialize upload counter for form reset
     if 'upload_counter' not in st.session_state:
         st.session_state.upload_counter = 0
     
-    # Show current location status with coordinates
-    if st.session_state.get('user_location', {}).get('lat'):
-        lat, lon = st.session_state.user_location['lat'], st.session_state.user_location['lon']
-        st.markdown(f"""
-        <div style="background: linear-gradient(45deg, #00b894, #00cec9); color: white; padding: 12px; border-radius: 10px; margin: 10px 0; text-align: center; font-weight: 500; box-shadow: 0 4px 15px rgba(0, 184, 148, 0.3);">
-            📍 Location ready: {lat:.6f}, {lon:.6f}
-        </div>
-        """, unsafe_allow_html=True)
-    else:
+    # Show enhanced location status
+    location = get_enhanced_location()
+    
+    if location and location.get('lat'):
+        method_icon = "🛰️" if location.get('method') == "GPS" else "🌐" if location.get('method') == "IP" else "📝"
+        accuracy_text = ""
+        if location.get('accuracy'):
+            if location['accuracy'] <= 10:
+                accuracy_text = f" (±{location['accuracy']:.0f}m - High Accuracy)"
+            elif location['accuracy'] <= 50:
+                accuracy_text = f" (±{location['accuracy']:.0f}m - Medium Accuracy)"
+            else:
+                accuracy_text = f" (±{location['accuracy']:.0f}m - Low Accuracy)"
+        
         st.markdown(f"""
-        <div style="background: linear-gradient(45deg, #fd79a8, #e84393); color: white; padding: 12px; border-radius: 10px; margin: 10px 0; text-align: center; font-weight: 500; box-shadow: 0 4px 15px rgba(253, 121, 168, 0.3);">
-            📍 Location not available - uploads will continue without location data
+        <div style="background: linear-gradient(45deg, #00b894, #00cec9); color: white; padding: 15px; border-radius: 10px; margin: 15px 0; text-align: center; font-weight: 500; box-shadow: 0 4px 15px rgba(0, 184, 148, 0.3);">
+            {method_icon} Location Ready: {location['lat']:.6f}, {location['lon']:.6f}{accuracy_text}
+            <br><small>Method: {location.get('method', 'Unknown')} | Captured: {datetime.fromisoformat(location.get('timestamp', datetime.now().isoformat())).strftime('%H:%M:%S') if location.get('timestamp') else 'Unknown'}</small>
         </div>
         """, unsafe_allow_html=True)
+        
+        if st.button("🔄 Refresh Location"):
+            st.session_state.location_fetched = False
+            st.session_state.manual_location_mode = False
+            st.rerun()
     
-    with st.form(f"upload_form_{st.session_state.upload_counter}"):
+    # Use unique form key to ensure proper reset
+    with st.form(f"upload_form_{st.session_state.upload_counter}", clear_on_submit=True):
         uploaded_file = st.file_uploader(
-            get_translation("choose_image", st.session_state.language),
-            type=['png', 'jpg', 'jpeg', 'gif']
-        )
-        
-        title = st.text_input(get_translation("image_title", st.session_state.language))
-        description = st.text_area(get_translation("description", st.session_state.language))
-        
-        # Category selection
-        categories = get_categories()
-        category = st.selectbox(
-            get_translation("category", st.session_state.language),
-            options=categories,
-            format_func=lambda x: get_translation(x.lower(), st.session_state.language)
+            get_translation(st.session_state.language, "choose_image"),
+            type=['png', 'jpg', 'jpeg', 'gif'],
+            help=get_translation(st.session_state.language, "image_help")
         )
         
-        # Labels section
-        st.subheader(get_translation("labels", st.session_state.language))
+        col1, col2 = st.columns(2)
         
-        # Language selection for label
-        label_language = st.selectbox(
-            get_translation("label_language", st.session_state.language),
-            options=list(SUPPORTED_LANGUAGES.keys()),
-            format_func=lambda x: f"{SUPPORTED_LANGUAGES[x]} ({x})",
-            index=list(SUPPORTED_LANGUAGES.keys()).index(st.session_state.language)
-        )
-        
-        label_text = st.text_input(get_translation("label_text", st.session_state.language))
+        with col1:
+            title = st.text_input(get_translation(st.session_state.language, "image_title"))
+            description = st.text_area(get_translation(st.session_state.language, "image_description"))
+            
+        with col2:
+            label = st.text_input(get_translation(st.session_state.language, "native_language_label"))
+            category = st.selectbox(
+                get_translation(st.session_state.language, "category"),
+                options=get_categories(),
+                format_func=lambda x: get_translation(st.session_state.language, x.lower())
+            )
         
-        submit_button = st.form_submit_button(get_translation("upload_image", st.session_state.language))
+        submitted = st.form_submit_button(get_translation(st.session_state.language, "upload"))
         
-        if submit_button:
-            if uploaded_file and title and description and label_text:
-                # Validate image
-                validation_result = validate_image(uploaded_file)
-                if not validation_result['valid']:
-                    st.error(validation_result['error'])
-                    return
-                
-                # Process and save image
-                try:
-                    # Create images directory if it doesn't exist
-                    images_dir = 'data/images'
-                    if not os.path.exists(images_dir):
-                        os.makedirs(images_dir)
-                    
-                    # Generate unique filename
-                    file_extension = uploaded_file.name.split('.')[-1]
-                    unique_filename = f"{uuid.uuid4()}.{file_extension}"
-                    file_path = os.path.join(images_dir, unique_filename)
-                    
-                    # Save image file
-                    with open(file_path, 'wb') as f:
-                        f.write(uploaded_file.read())
-                    
-                    # Convert image to base64 for display
-                    uploaded_file.seek(0)  # Reset file pointer
-                    image = Image.open(uploaded_file)
-                    buffered = io.BytesIO()
-                    image.save(buffered, format="PNG")
-                    img_base64 = base64.b64encode(buffered.getvalue()).decode()
-                    
-                    # Prepare image data
-                    image_data = {
-                        'id': str(uuid.uuid4()),
-                        'title': title,
-                        'description': description,
-                        'category': category,
-                        'filename': unique_filename,
-                        'file_path': file_path,
-                        'image_base64': img_base64,
-                        'uploader': st.session_state.user['username'],
-                        'upload_time': datetime.now().isoformat(),
-                        'labels': [
-                            {
-                                'text': label_text,
-                                'language': label_language,
-                                'contributor': st.session_state.user['username'],
-                                'timestamp': datetime.now().isoformat()
-                            }
-                        ]
+        if submitted:
+            if not uploaded_file or not title or not description or not label:
+                st.error(get_translation(st.session_state.language, "fill_all_fields"))
+                return
+            
+            # Validate image
+            validation_result = validate_image(uploaded_file)
+            if not validation_result['valid']:
+                st.error(get_translation(st.session_state.language, validation_result['error']))
+                return
+            
+            # Check if location is available (but allow upload without it)
+            current_location = st.session_state.get('user_location', {})
+            location_status = "No location data"
+            if current_location and current_location.get('lat'):
+                location_status = f"📍 {current_location.get('method', 'Unknown')} location captured"
+            else:
+                st.warning("⚠️ **Location not captured** - Image will be uploaded without GPS coordinates. For better dataset quality, try refreshing location.")
+            
+            # Generate unique filename
+            file_extension = uploaded_file.name.split('.')[-1]
+            unique_filename = f"{uuid.uuid4()}.{file_extension}"
+            
+            # Save image
+            image_path = os.path.join('data/images', unique_filename)
+            image = Image.open(uploaded_file)
+            image.save(image_path)
+            
+            # Prepare comprehensive location metadata
+            location_metadata = None
+            if current_location and current_location.get('lat'):
+                location_metadata = {
+                    'latitude': current_location['lat'],
+                    'longitude': current_location['lon'],
+                    'accuracy': current_location.get('accuracy'),
+                    'altitude': current_location.get('altitude'),
+                    'heading': current_location.get('heading'),
+                    'speed': current_location.get('speed'),
+                    'method': current_location.get('method', 'Unknown'),
+                    'timestamp': current_location.get('timestamp', datetime.now().isoformat()),
+                    'city': current_location.get('city'),
+                    'country': current_location.get('country'),
+                    'region': current_location.get('region'),
+                    'timezone': current_location.get('timezone'),
+                    'isp': current_location.get('isp')
+                }
+            
+            # Save comprehensive label data
+            labels = load_labels()
+            entry_id = str(uuid.uuid4())
+            
+            labels[entry_id] = {
+                'image_path': image_path,
+                'filename': unique_filename,
+                'title': title,
+                'description': description,
+                'category': category,
+                'uploaded_by': st.session_state.user,
+                'uploaded_at': datetime.now().isoformat(),
+                'location': location_metadata,  # Comprehensive location data
+                'location_status': location_status,
+                'labels': [
+                    {
+                        'text': label,
+                        'language': st.session_state.language,
+                        'added_by': st.session_state.user,
+                        'added_at': datetime.now().isoformat()
                     }
-                    
-                    # Add location if available
-                    if st.session_state.get('user_location', {}).get('lat'):
-                        image_data['location'] = st.session_state.user_location.copy()
-                    
-                    # Save to labels.json
-                    labels_data = load_labels()
-                    labels_data[image_data['id']] = image_data
-                    save_labels(labels_data)
-                    
-                    st.success(get_translation("image_uploaded", st.session_state.language))
-                    
-                    # Reset form by incrementing counter
-                    st.session_state.upload_counter += 1
-                    st.rerun()
-                    
-                except Exception as e:
-                    st.error(f"Error uploading image: {str(e)}")
+                ]
+            }
+            
+            save_labels(labels)
+            
+            # Show success message with location info
+            if location_metadata:
+                success_msg = f"✅ {get_translation(st.session_state.language, 'upload_successful')} with {location_metadata['method']} coordinates!"
             else:
-                st.error(get_translation("please_fill_all_fields", st.session_state.language))
+                success_msg = f"✅ {get_translation(st.session_state.language, 'upload_successful')} (without location data)"
+            
+            st.success(success_msg)
+            st.session_state.upload_counter += 1
+            
+            # Reset location for next upload to get fresh coordinates
+            st.session_state.location_fetched = False
+            st.session_state.manual_location_mode = False
+            st.rerun()
 
-def view_images_section():
-    """View and label images section"""
-    st.header(get_translation("image_feed", st.session_state.language))
+def display_image_feed():
+    """Enhanced image feed with improved styling and functionality"""
+    st.subheader(f"📱 {get_translation(st.session_state.language, 'image_feed')}")
     
     # Category filter
     categories = ['All'] + get_categories()
-    category_filter = st.selectbox(
-        get_translation("filter_by_category", st.session_state.language),
+    selected_category = st.selectbox(
+        get_translation(st.session_state.language, "filter_by_category"),
         options=categories,
-        format_func=lambda x: get_translation(x.lower(), st.session_state.language) if x != 'All' else get_translation("all", st.session_state.language)
+        format_func=lambda x: get_translation(st.session_state.language, x.lower()) if x != 'All' else get_translation(st.session_state.language, 'all')
     )
     
-    # Load and display images
-    labels_data = load_labels()
+    labels = load_labels()
     
-    if not labels_data:
-        st.info(get_translation("no_images", st.session_state.language))
+    if not labels:
+        st.info(get_translation(st.session_state.language, "no_images_yet"))
         return
     
     # Filter by category
-    filtered_data = labels_data
-    if category_filter != 'All':
-        filtered_data = {k: v for k, v in labels_data.items() if v.get('category') == category_filter}
-    
-    if not filtered_data:
-        st.info(get_translation("no_images_in_category", st.session_state.language))
-        return
+    filtered_labels = labels
+    if selected_category != 'All':
+        filtered_labels = {k: v for k, v in labels.items() if v.get('category') == selected_category}
     
-    # Custom CSS for better image display
-    st.markdown("""
-    <style>
-    .image-container {
-        border: 2px solid #e0e0e0;
-        border-radius: 10px;
-        padding: 15px;
-        margin: 10px 0;
-        background: white;
-        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
-    }
-    .image-title {
-        font-size: 1.2em;
-        font-weight: bold;
-        color: #2c3e50;
-        margin-bottom: 8px;
-    }
-    .image-description {
-        color: #555;
-        margin-bottom: 10px;
-    }
-    .labels-section {
-        background: #f8f9fa;
-        padding: 10px;
-        border-radius: 8px;
-        margin: 10px 0;
-    }
-    .label-item {
-        background: linear-gradient(45deg, #74b9ff, #0984e3);
-        color: white;
-        padding: 5px 10px;
-        border-radius: 15px;
-        margin: 2px;
-        display: inline-block;
-        font-size: 0.9em;
-    }
-    .location-badge {
-        background: linear-gradient(45deg, #00b894, #00cec9);
-        color: white;
-        padding: 5px 10px;
-        border-radius: 15px;
-        margin: 5px 0;
-        display: inline-block;
-        font-size: 0.85em;
-        font-weight: 500;
-    }
-    </style>
-    """, unsafe_allow_html=True)
-    
-    # Display images
-    for image_id, data in filtered_data.items():
+    # Display images in a grid
+    for entry_id, entry_data in sorted(filtered_labels.items(), key=lambda x: x[1]['uploaded_at'], reverse=True):
         with st.container():
-            st.markdown('<div class="image-container">', unsafe_allow_html=True)
-            
             col1, col2 = st.columns([1, 2])
             
             with col1:
                 # Display image
-                try:
-                    if data.get('image_base64'):
-                        st.image(f"data:image/png;base64,{data['image_base64']}", width=250)
-                    else:
-                        st.error("Image not available")
-                except Exception as e:
-                    st.error(f"Error displaying image: {str(e)}")
+                image_path = entry_data['image_path']
+                if os.path.exists(image_path):
+                    image = Image.open(image_path)
+                    st.image(image, width=300, caption=entry_data['title'])
+                else:
+                    st.error(get_translation(st.session_state.language, "image_not_found"))
             
             with col2:
-                # Image details
-                st.markdown(f'<div class="image-title">{data.get("title", "Untitled")}</div>', unsafe_allow_html=True)
-                st.markdown(f'<div class="image-description">{data.get("description", "No description")}</div>', unsafe_allow_html=True)
-                
-                # Category
-                if data.get('category'):
-                    category_translation = get_translation(data['category'].lower(), st.session_state.language)
-                    st.write(f"🏷️ **{get_translation('category', st.session_state.language)}:** {category_translation}")
-                
-                # Upload info
-                if data.get('uploader'):
-                    st.write(f"👤 {data['uploader']}")
+                # Display metadata
+                st.markdown(f"### {entry_data['title']}")
+                st.markdown(f"**{get_translation(st.session_state.language, 'image_description')}:** {entry_data['description']}")
+                st.markdown(f"**{get_translation(st.session_state.language, 'category')}:** {get_translation(st.session_state.language, entry_data['category'].lower())}")
+                st.markdown(f"**📤 Uploaded by:** {entry_data['uploaded_by']}")
+                st.markdown(f"**📅 Date:** {datetime.fromisoformat(entry_data['uploaded_at']).strftime('%Y-%m-%d %H:%M')}")
                 
-                if data.get('upload_time'):
-                    try:
-                        upload_time = datetime.fromisoformat(data['upload_time']).strftime("%Y-%m-%d %H:%M")
-                    except:
-                        upload_time = data['upload_time']
-                    st.write(f"📅 {upload_time}")
-                
-                # Location information with enhanced display
-                if data.get('location') and data['location'].get('lat') and data['location'].get('lon'):
-                    lat, lon = data['location']['lat'], data['location']['lon']
-                    st.markdown(f"""
-                    <div class="location-badge">
-                        📍 Coordinates: {lat:.6f}, {lon:.6f}
-                    </div>
-                    """, unsafe_allow_html=True)
-                else:
-                    st.markdown(f"""
-                    <div class="location-badge" style="background: linear-gradient(45deg, #fd79a8, #e84393);">
-                        📍 Location not available
-                    </div>
-                    """, unsafe_allow_html=True)
-                
-                # Labels section
-                st.markdown('<div class="labels-section">', unsafe_allow_html=True)
-                st.write(f"**{get_translation('labels', st.session_state.language)}:**")
-                
-                if data.get('labels'):
-                    labels_html = ""
-                    for label in data['labels']:
-                        lang_name = SUPPORTED_LANGUAGES.get(label.get('language', 'en'), 'English')
-                        labels_html += f'<span class="label-item">{label.get("text", "")} ({lang_name})</span> '
-                    st.markdown(labels_html, unsafe_allow_html=True)
-                else:
-                    st.write(get_translation("no_labels", st.session_state.language))
+                # Enhanced location display
+                if entry_data.get('location') and entry_data['location'].get('lat'):
+                    loc = entry_data['location']
+                    method_icon = "🛰️" if loc.get('method') == "GPS" else "🌐" if loc.get('method') == "IP" else "📝"
+                    accuracy_info = ""
+                    if loc.get('accuracy'):
+                        accuracy_info = f" (±{loc['accuracy']:.0f}m accuracy)"
+                    
+                    location_text = f"{method_icon} {loc['lat']:.6f}, {loc['lon']:.6f}{accuracy_info}"
+                    if loc.get('city') and loc.get('country'):
+                        location_text += f" - {loc['city']}, {loc['country']}"
+                    
+                    st.markdown(f"**📍 Location:** {location_text}")
                 
-                st.markdown('</div>', unsafe_allow_html=True)
+                # Display labels
+                st.markdown(f"**{get_translation(st.session_state.language, 'labels')}:**")
+                for label_data in entry_data['labels']:
+                    lang_name = SUPPORTED_LANGUAGES.get(label_data['language'], label_data['language'])
+                    st.markdown(f"- **{label_data['text']}** ({lang_name}) - by {label_data['added_by']}")
                 
                 # Add new label form
-                with st.expander(get_translation("add_label", st.session_state.language)):
-                    with st.form(f"label_form_{image_id}"):
-                        new_label_language = st.selectbox(
-                            get_translation("label_language", st.session_state.language),
+                with st.expander(get_translation(st.session_state.language, "add_label")):
+                    with st.form(f"label_form_{entry_id}"):
+                        new_label = st.text_input(get_translation(st.session_state.language, "new_label"))
+                        label_language = st.selectbox(
+                            get_translation(st.session_state.language, "label_language"),
                             options=list(SUPPORTED_LANGUAGES.keys()),
-                            format_func=lambda x: f"{SUPPORTED_LANGUAGES[x]} ({x})",
-                            index=list(SUPPORTED_LANGUAGES.keys()).index(st.session_state.language),
-                            key=f"label_lang_{image_id}"
-                        )
-                        
-                        new_label_text = st.text_input(
-                            get_translation("label_text", st.session_state.language),
-                            key=f"label_text_{image_id}"
+                            format_func=lambda x: SUPPORTED_LANGUAGES[x]
                         )
                         
-                        add_label_button = st.form_submit_button(get_translation("add_label", st.session_state.language))
-                        
-                        if add_label_button and new_label_text:
-                            # Add new label
-                            new_label = {
-                                'text': new_label_text,
-                                'language': new_label_language,
-                                'contributor': st.session_state.user['username'],
-                                'timestamp': datetime.now().isoformat()
-                            }
-                            
-                            # Update labels data
-                            labels_data = load_labels()
-                            if 'labels' not in labels_data[image_id]:
-                                labels_data[image_id]['labels'] = []
-                            labels_data[image_id]['labels'].append(new_label)
-                            save_labels(labels_data)
-                            
-                            st.success(get_translation("label_added", st.session_state.language))
-                            st.rerun()
+                        if st.form_submit_button(get_translation(st.session_state.language, "add_label")):
+                            if not new_label:
+                                st.error(get_translation(st.session_state.language, "enter_label"))
+                            else:
+                                # Check if label already exists
+                                existing_labels = [l['text'].lower() for l in entry_data['labels']]
+                                if new_label.lower() in existing_labels:
+                                    st.error(get_translation(st.session_state.language, "label_exists"))
+                                else:
+                                    # Add new label
+                                    labels[entry_id]['labels'].append({
+                                        'text': new_label,
+                                        'language': label_language,
+                                        'added_by': st.session_state.user,
+                                        'added_at': datetime.now().isoformat()
+                                    })
+                                    save_labels(labels)
+                                    st.success(get_translation(st.session_state.language, "label_added"))
+                                    st.rerun()
             
-            st.markdown('</div>', unsafe_allow_html=True)
             st.markdown("---")
 
 def main():
     """Main application function"""
-    # Page configuration
-    st.set_page_config(
-        page_title="LabelIt! - Multilingual Image Labeling",
-        page_icon="🏷️",
-        layout="wide"
-    )
     
-    # Apply light theme styling
-    st.markdown("""
-    <style>
-    .main {
-        background-color: #ffffff;
-        color: #000000;
-    }
-    .stApp {
-        background-color: #ffffff;
-    }
-    /* Ensure all text is visible */
-    .stMarkdown, .stText, p, span, div {
-        color: #000000 !important;
-    }
-    /* Make form labels visible */
-    .stSelectbox label, .stTextInput label, .stTextArea label, .stFileUploader label {
-        color: #000000 !important;
-        font-weight: 500 !important;
-    }
-    /* Sidebar styling */
-    .css-1d391kg {
-        background-color: #f8f9fa;
-    }
-    /* Button styling */
-    .stButton > button {
-        background-color: #007bff;
-        color: white;
-        border: none;
-        border-radius: 5px;
-        padding: 0.5rem 1rem;
-    }
-    .stButton > button:hover {
-        background-color: #0056b3;
-    }
-    /* Tab styling */
-    .stTabs [data-baseweb="tab-list"] {
-        gap: 8px;
-    }
-    .stTabs [data-baseweb="tab"] {
-        background-color: #e9ecef;
-        color: #000000;
-        border-radius: 5px;
-        padding: 0.5rem 1rem;
-    }
-    .stTabs [aria-selected="true"] {
-        background-color: #007bff;
-        color: white;
-    }
-    /* Form styling */
-    .stForm {
-        background-color: #f8f9fa;
-        padding: 1rem;
-        border-radius: 10px;
-        border: 1px solid #dee2e6;
-    }
-    /* Success/Error message styling */
-    .stSuccess {
-        background-color: #d4edda;
-        color: #155724;
-        border: 1px solid #c3e6cb;
-    }
-    .stError {
-        background-color: #f8d7da;
-        color: #721c24;
-        border: 1px solid #f5c6cb;
-    }
-    </style>
-    """, unsafe_allow_html=True)
+    # Header with language selector
+    col1, col2, col3 = st.columns([2, 1, 1])
     
-    # Main title
-    st.title("🏷️ LabelIt! - " + get_translation("multilingual_image_labeling", st.session_state.language))
+    with col1:
+        st.title("🏷️ LabelIt! 🇮🇳")
+        st.markdown(get_translation(st.session_state.language, "app_subtitle"))
     
-    # Login/logout section
-    login_logout_section()
+    with col2:
+        # Language selector
+        selected_language = st.selectbox(
+            "🌍 Language",
+            options=list(SUPPORTED_LANGUAGES.keys()),
+            format_func=lambda x: SUPPORTED_LANGUAGES[x],
+            index=list(SUPPORTED_LANGUAGES.keys()).index(st.session_state.language)
+        )
+        
+        if selected_language != st.session_state.language:
+            st.session_state.language = selected_language
+            st.rerun()
     
-    # Main application content (only show if user is logged in)
-    if st.session_state.user:
-        # Navigation tabs
+    with col3:
+        if st.session_state.user:
+            if st.button(get_translation(st.session_state.language, "logout")):
+                st.session_state.user = None
+                st.session_state.location_fetched = False
+                st.session_state.manual_location_mode = False
+                st.rerun()
+    
+    # Display analytics sidebar
+    display_analytics_sidebar()
+    
+    # Main content
+    if not st.session_state.user:
+        # Authentication tabs
         tab1, tab2 = st.tabs([
-            get_translation("upload_image", st.session_state.language),
-            get_translation("view_images", st.session_state.language)
+            get_translation(st.session_state.language, "login"),
+            get_translation(st.session_state.language, "register")
         ])
         
         with tab1:
-            upload_image_section()
+            login_user()
         
         with tab2:
-            view_images_section()
+            register_user()
+    
     else:
-        # Show welcome message for non-logged in users
-        st.info(get_translation("please_login", st.session_state.language))
+        # User is logged in - show user details in sidebar
+        with st.sidebar:
+            st.markdown("---")
+            st.markdown(f"### 👤 {get_translation(st.session_state.language, 'welcome')}, {st.session_state.user}!")
+            
+            users = load_users()
+            user_details = users[st.session_state.user]['user_details']
+            
+            st.markdown(f"**{get_translation(st.session_state.language, 'full_name')}:** {user_details['full_name']}")
+            st.markdown(f"**{get_translation(st.session_state.language, 'email')}:** {user_details['email']}")
+            st.markdown(f"**{get_translation(st.session_state.language, 'phone')}:** {user_details['phone']}")
+            st.markdown(f"**{get_translation(st.session_state.language, 'age')}:** {user_details['age']}")
+        
+        # Main application tabs
+        tab1, tab2 = st.tabs([
+            get_translation(st.session_state.language, "upload_image"),
+            get_translation(st.session_state.language, "feed")
+        ])
+        
+        with tab1:
+            upload_image()
+        
+        with tab2:
+            display_image_feed()
 
 if __name__ == "__main__":
-    main()
+    main()