Add Job Discovery UI with filtering and analytics

app/api/auth/send-verification/route.ts

@@ -22,7 +22,7 @@ export async function POST(request: NextRequest) {
     }
 
     // Check if user already exists and is verified
-    const supabase = createClient()
+    const supabase = await createClient()
     const { data: user } = await supabase
       .from('auth.users')
       .select('email_confirmed_at')

app/api/jobs/route.ts

@@ -0,0 +1,124 @@
+import { NextResponse } from "next/server"
+import type { JobRecommendation, JobsResponse } from "@/types/dashboard"
+
+const mockJobs: JobRecommendation[] = [
+  {
+    id: "1",
+    company: "Google",
+    role: "Senior Software Engineer",
+    location: "San Francisco, CA",
+    remote: "hybrid",
+    seniority: "senior",
+    tags: ["React", "TypeScript", "System Design"],
+    description: "We're looking for an experienced engineer to join our infrastructure team.",
+    applyUrl: "https://careers.google.com/jobs/results/?q=senior-software-engineer",
+    postedDate: "2 days ago",
+    matchScore: 95,
+  },
+  {
+    id: "2",
+    company: "Microsoft",
+    role: "Full Stack Developer",
+    location: "Seattle, WA",
+    remote: "remote",
+    seniority: "mid",
+    tags: ["Next.js", "Node.js", "AWS"],
+    description: "Join our cloud platform team building scalable solutions.",
+    applyUrl: "https://careers.microsoft.com/jobs/results/?q=full-stack-developer",
+    postedDate: "1 day ago",
+    matchScore: 88,
+  },
+  {
+    id: "3",
+    company: "Meta",
+    role: "Junior Software Engineer",
+    location: "Menlo Park, CA",
+    remote: "on-site",
+    seniority: "entry",
+    tags: ["React", "GraphQL", "Python"],
+    description: "Start your career with us and work on products used by billions.",
+    applyUrl: "https://careers.meta.com/jobs/results/?q=junior-software-engineer",
+    postedDate: "3 days ago",
+    matchScore: 82,
+  },
+  {
+    id: "4",
+    company: "Amazon",
+    role: "Backend Engineer",
+    location: "Remote",
+    remote: "remote",
+    seniority: "mid",
+    tags: ["Java", "Microservices", "AWS"],
+    description: "Build high-performance systems that power Amazon's infrastructure.",
+    applyUrl: "https://careers.amazon.com/jobs/results/?q=backend-engineer",
+    postedDate: "5 days ago",
+    matchScore: 79,
+  },
+  {
+    id: "5",
+    company: "Apple",
+    role: "iOS Engineer",
+    location: "Cupertino, CA",
+    remote: "on-site",
+    seniority: "senior",
+    tags: ["Swift", "iOS", "Objective-C"],
+    description: "Craft beautiful experiences for billions of Apple users.",
+    applyUrl: "https://careers.apple.com/jobs/results/?q=ios-engineer",
+    postedDate: "1 week ago",
+    matchScore: 75,
+  },
+  {
+    id: "6",
+    company: "Netflix",
+    role: "DevOps Engineer",
+    location: "Los Gatos, CA",
+    remote: "hybrid",
+    seniority: "mid",
+    tags: ["Kubernetes", "Python", "AWS"],
+    description: "Help us deliver entertainment at scale with cutting-edge infrastructure.",
+    applyUrl: "https://careers.netflix.com/jobs/results/?q=devops-engineer",
+    postedDate: "4 days ago",
+    matchScore: 81,
+  },
+]
+
+export async function GET(request: Request) {
+  try {
+    const { searchParams } = new URL(request.url)
+    const location = searchParams.get("location")
+    const remote = searchParams.get("remote")
+    const seniority = searchParams.get("seniority")
+
+    let filteredJobs = [...mockJobs]
+
+    if (location) {
+      filteredJobs = filteredJobs.filter((job) =>
+        job.location.toLowerCase().includes(location.toLowerCase()),
+      )
+    }
+
+    if (remote && remote !== "all") {
+      filteredJobs = filteredJobs.filter((job) => job.remote === remote)
+    }
+
+    if (seniority && seniority !== "all") {
+      filteredJobs = filteredJobs.filter((job) => job.seniority === seniority)
+    }
+
+    // Sort by match score descending
+    filteredJobs.sort((a, b) => b.matchScore - a.matchScore)
+
+    const response: JobsResponse = {
+      jobs: filteredJobs,
+      total: filteredJobs.length,
+    }
+
+    return NextResponse.json(response, { status: 200 })
+  } catch (error) {
+    console.error("Error fetching jobs:", error)
+    return NextResponse.json(
+      { error: "Failed to fetch job recommendations" },
+      { status: 500 },
+    )
+  }
+}

app/api/tts/route.ts

@@ -1,10 +1,12 @@
 import { NextRequest, NextResponse } from 'next/server'
-import { ElevenLabsClient, play } from 'elevenlabs'
+
+// Note: Using elevenlabs-node package
+const ElevenLabs = require('elevenlabs-node')
 
 // Initialize ElevenLabs client with API key from environment variables
-const elevenlabs = new ElevenLabsClient({
+const elevenlabs = new ElevenLabs({
   apiKey: process.env.ELEVENLABS_API_KEY, 
-});
+})
 
 export async function POST(request: NextRequest) {
   try {
@@ -15,16 +17,17 @@ export async function POST(request: NextRequest) {
     }
 
     // Default voice if not provided
-    const selectedVoiceId = voiceId || 'pNInz6obpgDQGXPRmrWg' // You can set your preferred default voice ID here
+    const selectedVoiceId = voiceId || 'pNInz6obpgDQGcFmaJgB' // Default voice 'Adam'
 
-    const audioStream = await elevenlabs.generate({
-      voice_id: selectedVoiceId,
-      text,
-      model_id: "eleven_multilingual_v2", // Or another appropriate model
-      output_format: "mp3_22050_32",
+    const audioStream = await elevenlabs.textToSpeechStream({
+      voiceId: selectedVoiceId,
+      textInput: text,
+      modelId: "eleven_multilingual_v2",
+      stability: 0.5,
+      similarityBoost: 0.75,
     });
 
-    const response = new NextResponse(audioStream as any, {
+    const response = new NextResponse(audioStream, {
       headers: {
         'Content-Type': 'audio/mpeg',
         'Cache-Control': 'no-cache, no-store, must-revalidate',

components/dashboard-overview.tsx

@@ -1,4 +1,5 @@
 import StatsCard from "./stats-card"
+import JobRecommendations from "./job-recommendations"
 import { Button } from "@/components/ui/button"
 import { PlayCircle, BarChart3, Clock, TrendingUp, Calendar, Star } from "lucide-react"
 import type { UserStats, RecentSession } from "@/types/dashboard"
@@ -14,7 +15,7 @@ export default function DashboardOverview({ stats, recentSessions }: DashboardOv
       {/* Welcome section */}
       <div className="bg-gradient-to-r from-purple-600 to-blue-600 rounded-lg p-6 text-white">
         <h1 className="text-2xl font-bold mb-2">Welcome back, John!</h1>
-        <p className="text-purple-100 mb-4">Ready to ace your next interview? Let's continue your preparation.</p>
+        <p className="text-purple-100 mb-4">Ready to ace your next interview? Let&apos;s continue your preparation.</p>
         <Button className="bg-white text-purple-600 hover:bg-gray-100">
           <PlayCircle className="w-4 h-4 mr-2" />
           Start New Interview
@@ -93,6 +94,9 @@ export default function DashboardOverview({ stats, recentSessions }: DashboardOv
           </div>
         </div>
       </div>
+
+      {/* Job Recommendations */}
+      <JobRecommendations />
     </div>
   )
 }