Upload components/Sidebar.jsx with huggingface_hub

components/Sidebar.jsx

@@ -0,0 +1,32 @@
+import { useState } from 'react';
+import { LayoutDashboard, FileText, Database, Shield, Zap, Settings, Play } from 'lucide-react';
+
+const navItems = [
+  { id: 'dashboard', label: 'Dashboard', icon: LayoutDashboard },
+  { id: 'parser', label: 'Notebook Parser', icon: FileText },
+  { id: 'knowledge', label: 'Knowledge Base', icon: Database },
+  { id: 'board', label: 'Board Validator', icon: Shield },
+  { id: 'training', label: 'Training & Submit', icon: Play },
+  { id: 'settings', label: 'Settings', icon: Settings },
+];
+
+export default function Sidebar({ activePage, onNavigate }) {
+  return (
+    <aside className="w-64 bg-white shadow-lg rounded-lg p-4 mr-6">
+      <nav className="sidebar-nav">
+        {navItems.map(({ id, label, icon: Icon }) => (
+          <div
+            key={id}
+            onClick={() => onNavigate(id)}
+            className={`nav-item ${activePage === id ? 'active' : ''}`}
+          >
+            <div className="flex items-center">
+              <Icon className="w-5 h-5 mr-3" />
+              <span>{label}</span>
+            </div>
+          </div>
+        ))}
+      </nav>
+    </aside>
+  );
+}