Rename src/streamlit_app.py to app.py

app.py

@@ -0,0 +1,382 @@
+import streamlit as st
+import plotly.express as px
+import plotly.graph_objects as go
+from plotly.subplots import make_subplots
+import pandas as pd
+import numpy as np
+import json
+import uuid
+from datetime import datetime, timedelta
+import time
+from huggingface_hub import HfApi, login
+from streamlit_option_menu import option_menu
+import requests
+import hashlib
+import os
+
+# Configure page
+st.set_page_config(
+    page_title="ML Tracker - Free W&B Alternative",
+    page_icon="📊",
+    layout="wide",
+    initial_sidebar_state="expanded"
+)
+
+# Initialize session state
+if 'authenticated' not in st.session_state:
+    st.session_state.authenticated = False
+if 'user_token' not in st.session_state:
+    st.session_state.user_token = None
+if 'api_key' not in st.session_state:
+    st.session_state.api_key = None
+if 'experiments' not in st.session_state:
+    st.session_state.experiments = {}
+if 'current_experiment' not in st.session_state:
+    st.session_state.current_experiment = None
+
+# Custom CSS for better styling
+st.markdown("""
+<style>
+    .main-header {
+        background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
+        padding: 1rem;
+        border-radius: 10px;
+        margin-bottom: 1rem;
+    }
+    .metric-card {
+        background: #f8f9fa;
+        padding: 1rem;
+        border-radius: 8px;
+        border-left: 4px solid #667eea;
+        margin-bottom: 1rem;
+    }
+    .api-key-box {
+        background: #f1f3f4;
+        padding: 1rem;
+        border-radius: 8px;
+        font-family: monospace;
+        margin: 1rem 0;
+    }
+    .stButton > button {
+        background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
+        color: white;
+        border: none;
+        border-radius: 6px;
+        padding: 0.5rem 1rem;
+        font-weight: 500;
+    }
+</style>
+""", unsafe_allow_html=True)
+
+def generate_api_key(user_token):
+    """Generate a unique API key for the user"""
+    return hashlib.sha256(f"{user_token}_{datetime.now().isoformat()}".encode()).hexdigest()[:32]
+
+def authenticate_user():
+    """Handle HuggingFace authentication"""
+    st.markdown('<div class="main-header"><h1 style="color: white; margin: 0;">🤗 ML Tracker</h1><p style="color: white; margin: 0;">Free W&B Alternative on HuggingFace Spaces</p></div>', unsafe_allow_html=True)
+    
+    col1, col2, col3 = st.columns([1, 2, 1])
+    
+    with col2:
+        st.markdown("### 🔐 Connect with HuggingFace")
+        st.markdown("Enter your HuggingFace token to get started with experiment tracking!")
+        
+        hf_token = st.text_input(
+            "HuggingFace Token",
+            type="password",
+            placeholder="hf_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
+            help="Get your token from https://huggingface.co/settings/tokens"
+        )
+        
+        if st.button("🚀 Connect & Generate API Key", use_container_width=True):
+            if hf_token:
+                try:
+                    # Verify token
+                    api = HfApi(token=hf_token)
+                    user_info = api.whoami()
+                    
+                    # Store authentication
+                    st.session_state.authenticated = True
+                    st.session_state.user_token = hf_token
+                    st.session_state.api_key = generate_api_key(hf_token)
+                    st.session_state.username = user_info['name']
+                    
+                    st.success(f"✅ Successfully connected as {user_info['name']}!")
+                    time.sleep(1)
+                    st.rerun()
+                    
+                except Exception as e:
+                    st.error(f"❌ Authentication failed: {str(e)}")
+            else:
+                st.error("Please enter your HuggingFace token")
+
+def show_api_key():
+    """Display API key and usage instructions"""
+    st.markdown("### 🔑 Your API Key")
+    st.markdown(f'<div class="api-key-box"><strong>API Key:</strong> {st.session_state.api_key}</div>', unsafe_allow_html=True)
+    
+    st.markdown("### 📋 Usage Instructions")
+    st.code(f"""
+# Install the client
+pip install requests
+
+# Python usage example
+import requests
+import json
+
+API_KEY = "{st.session_state.api_key}"
+BASE_URL = "https://your-space-url.hf.space"
+
+# Log metrics
+def log_metrics(experiment_name, step, metrics):
+    response = requests.post(
+        f"{BASE_URL}/api/log",
+        json={{
+            "api_key": API_KEY,
+            "experiment": experiment_name,
+            "step": step,
+            "metrics": metrics,
+            "timestamp": time.time()
+        }}
+    )
+    return response.json()
+
+# Example usage
+log_metrics("my_experiment", 1, {{
+    "loss": 0.5,
+    "accuracy": 0.85,
+    "learning_rate": 0.001
+}})
+""", language="python")
+
+def generate_sample_data():
+    """Generate sample experiment data for demonstration"""
+    experiments = {
+        "cnn_image_classification": {
+            "created_at": datetime.now() - timedelta(days=2),
+            "metrics": [],
+            "config": {
+                "model": "ResNet50",
+                "dataset": "CIFAR-10",
+                "epochs": 100,
+                "batch_size": 32,
+                "learning_rate": 0.001
+            }
+        },
+        "nlp_sentiment_analysis": {
+            "created_at": datetime.now() - timedelta(days=1),
+            "metrics": [],
+            "config": {
+                "model": "BERT",
+                "dataset": "IMDB",
+                "epochs": 50,
+                "batch_size": 16,
+                "learning_rate": 0.0001
+            }
+        }
+    }
+    
+    # Generate sample metrics
+    for exp_name, exp_data in experiments.items():
+        metrics = []
+        for step in range(1, 101):
+            if exp_name == "cnn_image_classification":
+                loss = 2.3 * np.exp(-step/20) + 0.1 + np.random.normal(0, 0.05)
+                accuracy = 1 - 0.9 * np.exp(-step/15) + np.random.normal(0, 0.02)
+                val_loss = loss + np.random.normal(0, 0.1)
+                val_accuracy = accuracy - np.random.normal(0.05, 0.02)
+                
+                metrics.append({
+                    "step": step,
+                    "loss": max(0, loss),
+                    "accuracy": max(0, min(1, accuracy)),
+                    "val_loss": max(0, val_loss),
+                    "val_accuracy": max(0, min(1, val_accuracy)),
+                    "timestamp": (datetime.now() - timedelta(days=2) + timedelta(minutes=step*2)).isoformat()
+                })
+            else:
+                loss = 1.8 * np.exp(-step/25) + 0.2 + np.random.normal(0, 0.03)
+                f1_score = 1 - 0.7 * np.exp(-step/20) + np.random.normal(0, 0.02)
+                precision = f1_score + np.random.normal(0, 0.02)
+                recall = f1_score + np.random.normal(0, 0.02)
+                
+                metrics.append({
+                    "step": step,
+                    "loss": max(0, loss),
+                    "f1_score": max(0, min(1, f1_score)),
+                    "precision": max(0, min(1, precision)),
+                    "recall": max(0, min(1, recall)),
+                    "timestamp": (datetime.now() - timedelta(days=1) + timedelta(minutes=step*3)).isoformat()
+                })
+        
+        exp_data["metrics"] = metrics
+    
+    return experiments
+
+def create_metric_charts(experiment_data):
+    """Create interactive charts for experiment metrics"""
+    if not experiment_data["metrics"]:
+        st.warning("No metrics data available for this experiment.")
+        return
+    
+    df = pd.DataFrame(experiment_data["metrics"])
+    
+    # Get all numeric columns (excluding step and timestamp)
+    numeric_cols = [col for col in df.columns if col not in ['step', 'timestamp'] and pd.api.types.is_numeric_dtype(df[col])]
+    
+    if not numeric_cols:
+        st.warning("No numeric metrics found.")
+        return
+    
+    # Create subplots
+    n_metrics = len(numeric_cols)
+    n_cols = 2
+    n_rows = (n_metrics + n_cols - 1) // n_cols
+    
+    fig = make_subplots(
+        rows=n_rows,
+        cols=n_cols,
+        subplot_titles=numeric_cols,
+        vertical_spacing=0.1,
+        horizontal_spacing=0.1
+    )
+    
+    colors = px.colors.qualitative.Set3
+    
+    for i, metric in enumerate(numeric_cols):
+        row = i // n_cols + 1
+        col = i % n_cols + 1
+        
+        fig.add_trace(
+            go.Scatter(
+                x=df['step'],
+                y=df[metric],
+                mode='lines+markers',
+                name=metric,
+                line=dict(color=colors[i % len(colors)], width=2),
+                marker=dict(size=4),
+                hovertemplate=f"<b>{metric}</b><br>Step: %{{x}}<br>Value: %{{y:.4f}}<extra></extra>"
+            ),
+            row=row,
+            col=col
+        )
+    
+    fig.update_layout(
+        height=400 * n_rows,
+        showlegend=False,
+        title_text="Experiment Metrics Over Time",
+        title_x=0.5,
+        font=dict(size=12)
+    )
+    
+    fig.update_xaxes(title_text="Step")
+    fig.update_yaxes(title_text="Value")
+    
+    st.plotly_chart(fig, use_container_width=True)
+
+def show_experiment_dashboard():
+    """Display the main experiment dashboard"""
+    st.markdown('<div class="main-header"><h1 style="color: white; margin: 0;">📊 ML Experiment Dashboard</h1></div>', unsafe_allow_html=True)
+    
+    # Load sample data if no experiments exist
+    if not st.session_state.experiments:
+        st.session_state.experiments = generate_sample_data()
+    
+    # Sidebar for experiment selection
+    with st.sidebar:
+        st.markdown("### 🔬 Experiments")
+        
+        exp_names = list(st.session_state.experiments.keys())
+        if exp_names:
+            selected_exp = st.selectbox(
+                "Select Experiment",
+                exp_names,
+                key="exp_selector"
+            )
+            st.session_state.current_experiment = selected_exp
+        else:
+            st.info("No experiments found. Start logging metrics to see them here!")
+            return
+        
+        st.markdown("### 📈 Quick Stats")
+        if st.session_state.current_experiment:
+            exp_data = st.session_state.experiments[st.session_state.current_experiment]
+            st.metric("Total Steps", len(exp_data["metrics"]))
+            st.metric("Created", exp_data["created_at"].strftime("%Y-%m-%d"))
+    
+    # Main dashboard content
+    if st.session_state.current_experiment:
+        exp_data = st.session_state.experiments[st.session_state.current_experiment]
+        
+        # Experiment header
+        col1, col2 = st.columns([3, 1])
+        with col1:
+            st.markdown(f"## {st.session_state.current_experiment}")
+        with col2:
+            if st.button("🔄 Refresh", use_container_width=True):
+                st.rerun()
+        
+        # Configuration section
+        with st.expander("⚙️ Configuration", expanded=False):
+            config_df = pd.DataFrame(list(exp_data["config"].items()), columns=["Parameter", "Value"])
+            st.dataframe(config_df, use_container_width=True)
+        
+        # Metrics overview
+        if exp_data["metrics"]:
+            latest_metrics = exp_data["metrics"][-1]
+            
+            st.markdown("### 📊 Latest Metrics")
+            cols = st.columns(len([k for k in latest_metrics.keys() if k not in ['step', 'timestamp']]))
+            
+            for i, (key, value) in enumerate(latest_metrics.items()):
+                if key not in ['step', 'timestamp']:
+                    with cols[i]:
+                        st.metric(key.replace('_', ' ').title(), f"{value:.4f}")
+        
+        # Charts section
+        st.markdown("### 📈 Metrics Over Time")
+        create_metric_charts(exp_data)
+        
+        # Raw data section
+        with st.expander("📋 Raw Data", expanded=False):
+            if exp_data["metrics"]:
+                df = pd.DataFrame(exp_data["metrics"])
+                st.dataframe(df, use_container_width=True)
+            else:
+                st.info("No metrics data available.")
+
+def main():
+    """Main application logic"""
+    if not st.session_state.authenticated:
+        authenticate_user()
+    else:
+        # Navigation menu
+        selected = option_menu(
+            menu_title=None,
+            options=["Dashboard", "API Key", "Logout"],
+            icons=["graph-up", "key", "box-arrow-right"],
+            menu_icon="cast",
+            default_index=0,
+            orientation="horizontal",
+            styles={
+                "container": {"padding": "0!important", "background-color": "#fafafa"},
+                "icon": {"color": "#667eea", "font-size": "18px"},
+                "nav-link": {"font-size": "16px", "text-align": "center", "margin": "0px", "--hover-color": "#eee"},
+                "nav-link-selected": {"background-color": "#667eea"},
+            }
+        )
+        
+        if selected == "Dashboard":
+            show_experiment_dashboard()
+        elif selected == "API Key":
+            show_api_key()
+        elif selected == "Logout":
+            st.session_state.authenticated = False
+            st.session_state.user_token = None
+            st.session_state.api_key = None
+            st.session_state.experiments = {}
+            st.rerun()
+
+if __name__ == "__main__":
+    main()

src/streamlit_app.py

@@ -1,40 +0,0 @@
-import altair as alt
-import numpy as np
-import pandas as pd
-import streamlit as st
-
-"""
-# Welcome to Streamlit!
-
-Edit `/streamlit_app.py` to customize this app to your heart's desire :heart:.
-If you have any questions, checkout our [documentation](https://docs.streamlit.io) and [community
-forums](https://discuss.streamlit.io).
-
-In the meantime, below is an example of what you can do with just a few lines of code:
-"""
-
-num_points = st.slider("Number of points in spiral", 1, 10000, 1100)
-num_turns = st.slider("Number of turns in spiral", 1, 300, 31)
-
-indices = np.linspace(0, 1, num_points)
-theta = 2 * np.pi * num_turns * indices
-radius = indices
-
-x = radius * np.cos(theta)
-y = radius * np.sin(theta)
-
-df = pd.DataFrame({
-    "x": x,
-    "y": y,
-    "idx": indices,
-    "rand": np.random.randn(num_points),
-})
-
-st.altair_chart(alt.Chart(df, height=700, width=700)
-    .mark_point(filled=True)
-    .encode(
-        x=alt.X("x", axis=None),
-        y=alt.Y("y", axis=None),
-        color=alt.Color("idx", legend=None, scale=alt.Scale()),
-        size=alt.Size("rand", legend=None, scale=alt.Scale(range=[1, 150])),
-    ))