Add URL-based routing with sidebar navigation

Replace client-side state switching with proper Next.js routes:
- /new - New scrape form
- /jobs - Jobs list with table view
- /jobs/[id] - Individual job details and logs
- /analytics - Analytics overview (completed jobs)
- /analytics/[id] - Analytics for specific job

Add JobsContext for shared state across routes. Update Sidebar
to use next/link with pathname matching. Root page redirects to /new.

Also adds partial job status styling to JobsView.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Alejandro Gutiérrez
2026-01-24 10:58:48 +00:00
parent 3eda9bdbfa
commit b1296059a9
10 changed files with 931 additions and 288 deletions

30
web/app/new/page.tsx Normal file
View File

@@ -0,0 +1,30 @@
'use client';
import { useRouter } from 'next/navigation';
import ScraperTest from '@/components/ScraperTest';
import { useJobs } from '@/contexts/JobsContext';
import { JobStatus } from '@/components/ScraperTest';
export default function NewScrapePage() {
const router = useRouter();
const { addJob, refreshJobs } = useJobs();
const handleJobsChange = (jobs: JobStatus[]) => {
// Add new jobs to context
jobs.forEach(job => addJob(job));
};
const handleSelectReviews = (reviews: unknown[], businessName: string, jobId: string) => {
// Navigate to analytics page for this job
router.push(`/analytics/${jobId}`);
};
return (
<div className="h-full overflow-y-auto p-6">
<ScraperTest
onJobsChange={handleJobsChange}
onSelectReviews={handleSelectReviews}
/>
</div>
);
}