this is the first commit for the Claude Iteration project.

frontend/Dockerfile

@@ -0,0 +1,20 @@
+FROM node:18-alpine
+
+WORKDIR /app
+
+# Copy package files
+COPY package*.json ./
+RUN npm install
+
+# Copy source code
+COPY . .
+
+# Build the application
+RUN npm run build
+
+# Serve with a simple server
+RUN npm install -g serve
+
+EXPOSE 3000
+
+CMD ["serve", "-s", "dist", "-l", "3000"]

frontend/Dockerfile.prod

@@ -0,0 +1,19 @@
+# Build stage
+FROM node:18-alpine as build
+
+WORKDIR /app
+COPY package*.json ./
+RUN npm ci --only=production
+
+COPY . .
+RUN npm run build
+
+# Production stage
+FROM nginx:alpine
+
+COPY --from=build /app/dist /usr/share/nginx/html
+COPY nginx.conf /etc/nginx/nginx.conf
+
+EXPOSE 80 443
+
+CMD ["nginx", "-g", "daemon off;"]

frontend/src/App.jsx

@@ -1,5 +1,5 @@
-import React, { Suspense } from "react";
-import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
+import React, { Suspense, useState, useEffect } from "react";
+import { BrowserRouter as Router, Routes, Route, Navigate } from "react-router-dom";
 import { CssBaseline } from "@mui/material";
 import { createTheme, ThemeProvider } from "@mui/material/styles";
 
@@ -12,6 +12,9 @@ import CSVProcessing from "./pages/CSVProcessing";
 import SettingsConfig from "./pages/SettingsConfig";
 import VirusTotal from "./pages/VirusTotal";
 import SecurityTools from "./pages/SecurityTools";
+import LoginPage from "./pages/LoginPage";
+import Dashboard from "./pages/Dashboard";
+import HuntPage from "./pages/HuntPage";
 
 const theme = createTheme({
   palette: {
@@ -20,6 +23,27 @@ const theme = createTheme({
 });
 
 function App() {
+  const [user, setUser] = useState(null);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    const token = localStorage.getItem("token");
+    if (token) {
+      // Verify token and get user info
+      // For now, just set a dummy user
+      setUser({ username: "User" });
+    }
+    setLoading(false);
+  }, []);
+
+  if (loading) {
+    return (
+      <div className="min-h-screen bg-zinc-900 flex items-center justify-center">
+        <div className="text-white">Loading...</div>
+      </div>
+    );
+  }
+
   return (
     <ThemeProvider theme={theme}>
       <CssBaseline />
@@ -29,7 +53,10 @@ function App() {
           <main className="flex-1 p-6 overflow-auto">
             <Suspense fallback={<div className="text-white">Loading...</div>}>
               <Routes>
-                <Route path="/" element={<HomePage />} />
+                <Route path="/login" element={!user ? <LoginPage onLogin={setUser} /> : <Navigate to="/dashboard" />} />
+                <Route path="/dashboard" element={user ? <Dashboard user={user} /> : <Navigate to="/login" />} />
+                <Route path="/hunt/:huntId" element={user ? <HuntPage user={user} /> : <Navigate to="/login" />} />
+                <Route path="/" element={<Navigate to={user ? "/dashboard" : "/login"} />} />
                 <Route path="/baseline" element={<Baseline />} />
                 <Route path="/networking" element={<Networking />} />
                 <Route path="/applications" element={<Applications />} />

frontend/src/pages/Dashboard.jsx

@@ -0,0 +1,149 @@
+import { useState, useEffect } from 'react'
+import { useNavigate } from 'react-router-dom'
+import { Plus, FolderOpen, Calendar, User } from 'lucide-react'
+
+const Dashboard = ({ user }) => {
+  const [hunts, setHunts] = useState([])
+  const [loading, setLoading] = useState(true)
+  const [showNewHunt, setShowNewHunt] = useState(false)
+  const [newHunt, setNewHunt] = useState({ name: '', description: '' })
+  const navigate = useNavigate()
+
+  useEffect(() => {
+    fetchHunts()
+  }, [])
+
+  const fetchHunts = async () => {
+    try {
+      const token = localStorage.getItem('token')
+      const response = await fetch('/api/hunts', {
+        headers: { 'Authorization': `Bearer ${token}` }
+      })
+      
+      if (response.ok) {
+        const data = await response.json()
+        setHunts(data.hunts)
+      }
+    } catch (err) {
+      console.error('Failed to fetch hunts:', err)
+    }
+    setLoading(false)
+  }
+
+  const createHunt = async (e) => {
+    e.preventDefault()
+    try {
+      const token = localStorage.getItem('token')
+      const response = await fetch('/api/hunts', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+          'Authorization': `Bearer ${token}`
+        },
+        body: JSON.stringify(newHunt)
+      })
+
+      if (response.ok) {
+        const data = await response.json()
+        navigate(`/hunt/${data.hunt.id}`)
+      }
+    } catch (err) {
+      console.error('Failed to create hunt:', err)
+    }
+  }
+
+  if (loading) {
+    return <div className="flex items-center justify-center h-64">Loading...</div>
+  }
+
+  return (
+    <div className="space-y-6">
+      <div className="flex justify-between items-center">
+        <div>
+          <h1 className="text-3xl font-bold">Welcome back, {user.username}</h1>
+          <p className="text-zinc-400">Choose a hunt to continue or start a new investigation</p>
+        </div>
+        <button
+          onClick={() => setShowNewHunt(true)}
+          className="bg-cyan-600 hover:bg-cyan-700 text-white px-4 py-2 rounded-lg flex items-center"
+        >
+          <Plus className="w-4 h-4 mr-2" />
+          New Hunt
+        </button>
+      </div>
+
+      {showNewHunt && (
+        <div className="bg-zinc-800 p-6 rounded-lg">
+          <h2 className="text-xl font-bold mb-4">Create New Hunt</h2>
+          <form onSubmit={createHunt} className="space-y-4">
+            <input
+              type="text"
+              placeholder="Hunt Name"
+              value={newHunt.name}
+              onChange={(e) => setNewHunt({...newHunt, name: e.target.value})}
+              className="w-full p-3 bg-zinc-700 rounded-lg border border-zinc-600 focus:border-cyan-400 outline-none"
+              required
+            />
+            <textarea
+              placeholder="Description"
+              value={newHunt.description}
+              onChange={(e) => setNewHunt({...newHunt, description: e.target.value})}
+              className="w-full p-3 bg-zinc-700 rounded-lg border border-zinc-600 focus:border-cyan-400 outline-none h-24"
+            />
+            <div className="flex space-x-2">
+              <button type="submit" className="bg-cyan-600 hover:bg-cyan-700 text-white px-4 py-2 rounded-lg">
+                Create Hunt
+              </button>
+              <button
+                type="button"
+                onClick={() => setShowNewHunt(false)}
+                className="bg-zinc-600 hover:bg-zinc-700 text-white px-4 py-2 rounded-lg"
+              >
+                Cancel
+              </button>
+            </div>
+          </form>
+        </div>
+      )}
+
+      <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+        {hunts.map(hunt => (
+          <div
+            key={hunt.id}
+            onClick={() => navigate(`/hunt/${hunt.id}`)}
+            className="bg-zinc-800 p-6 rounded-lg cursor-pointer hover:bg-zinc-750 transition-colors"
+          >
+            <div className="flex items-center mb-4">
+              <FolderOpen className="w-8 h-8 text-cyan-400 mr-3" />
+              <div>
+                <h3 className="font-semibold">{hunt.name}</h3>
+                <p className="text-sm text-zinc-400">{hunt.status}</p>
+              </div>
+            </div>
+            <p className="text-zinc-400 text-sm mb-3">{hunt.description}</p>
+            <div className="flex items-center text-xs text-zinc-500">
+              <Calendar className="w-3 h-3 mr-1" />
+              {new Date(hunt.created_at).toLocaleDateString()}
+            </div>
+          </div>
+        ))}
+      </div>
+
+      {hunts.length === 0 && (
+        <div className="text-center py-12">
+          <FolderOpen className="w-16 h-16 text-zinc-600 mx-auto mb-4" />
+          <h3 className="text-xl font-semibold mb-2">No hunts yet</h3>
+          <p className="text-zinc-400 mb-4">Start your first threat hunting investigation</p>
+          <button
+            onClick={() => setShowNewHunt(true)}
+            className="bg-cyan-600 hover:bg-cyan-700 text-white px-6 py-3 rounded-lg"
+          >
+            Create Your First Hunt
+          </button>
+        </div>
+      )}
+    </div>
+  )
+}
+
+export default Dashboard

frontend/src/pages/LoginPage.jsx

@@ -0,0 +1,104 @@
+import { useState } from 'react'
+import { useNavigate } from 'react-router-dom'
+import { Shield, User, Lock } from 'lucide-react'
+
+const LoginPage = ({ onLogin }) => {
+  const [credentials, setCredentials] = useState({ username: '', password: '' })
+  const [isLogin, setIsLogin] = useState(true)
+  const [loading, setLoading] = useState(false)
+  const [error, setError] = useState('')
+  const navigate = useNavigate()
+
+  const handleSubmit = async (e) => {
+    e.preventDefault()
+    setLoading(true)
+    setError('')
+
+    try {
+      const endpoint = isLogin ? '/api/auth/login' : '/api/auth/register'
+      const response = await fetch(endpoint, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify(credentials)
+      })
+
+      const data = await response.json()
+
+      if (response.ok) {
+        localStorage.setItem('token', data.access_token)
+        onLogin(data.user)
+        navigate('/dashboard')
+      } else {
+        setError(data.error)
+      }
+    } catch (err) {
+      setError('Connection failed')
+    }
+    setLoading(false)
+  }
+
+  return (
+    <div className="min-h-screen bg-zinc-900 flex items-center justify-center">
+      <div className="bg-zinc-800 p-8 rounded-lg shadow-lg w-96">
+        <div className="text-center mb-6">
+          <Shield className="w-16 h-16 text-cyan-400 mx-auto mb-4" />
+          <h1 className="text-2xl font-bold">Cyber Threat Hunter</h1>
+          <p className="text-zinc-400">Advanced threat hunting platform</p>
+        </div>
+
+        <form onSubmit={handleSubmit} className="space-y-4">
+          <div>
+            <label className="block text-sm font-medium mb-2">Username</label>
+            <div className="relative">
+              <User className="w-5 h-5 absolute left-3 top-3 text-zinc-400" />
+              <input
+                type="text"
+                value={credentials.username}
+                onChange={(e) => setCredentials({...credentials, username: e.target.value})}
+                className="w-full pl-10 p-3 bg-zinc-700 rounded-lg border border-zinc-600 focus:border-cyan-400 outline-none"
+                required
+              />
+            </div>
+          </div>
+
+          <div>
+            <label className="block text-sm font-medium mb-2">Password</label>
+            <div className="relative">
+              <Lock className="w-5 h-5 absolute left-3 top-3 text-zinc-400" />
+              <input
+                type="password"
+                value={credentials.password}
+                onChange={(e) => setCredentials({...credentials, password: e.target.value})}
+                className="w-full pl-10 p-3 bg-zinc-700 rounded-lg border border-zinc-600 focus:border-cyan-400 outline-none"
+                required
+              />
+            </div>
+          </div>
+
+          {error && (
+            <div className="text-red-400 text-sm">{error}</div>
+          )}
+
+          <button
+            type="submit"
+            disabled={loading}
+            className="w-full bg-cyan-600 hover:bg-cyan-700 text-white p-3 rounded-lg disabled:opacity-50"
+          >
+            {loading ? 'Please wait...' : (isLogin ? 'Login' : 'Register')}
+          </button>
+        </form>
+
+        <div className="text-center mt-4">
+          <button
+            onClick={() => setIsLogin(!isLogin)}
+            className="text-cyan-400 hover:text-cyan-300"
+          >
+            {isLogin ? 'Need an account? Register' : 'Already have an account? Login'}
+          </button>
+        </div>
+      </div>
+    </div>
+  )
+}
+
+export default LoginPage