feat: implement HireFlow MVP features
- AI-powered CV parsing (regex extraction of skills, experience, education) - Multi-channel job posting (LinkedIn, Indeed, Arbetsförmedlingen, Glassdoor, company site) - Collaborative hiring scorecards with 5-criteria scoring system - Dashboard with live stats (candidates, jobs, applications, scorecards) - PostgreSQL schema for candidates, jobs, applications, scorecards - REST API for all CRUD operations - React UI with shadcn/ui components throughout Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1,12 +1,42 @@
|
|||||||
import { BrowserRouter, Routes, Route } from 'react-router-dom'
|
import { BrowserRouter, Routes, Route, NavLink } from 'react-router-dom'
|
||||||
import HomePage from '@/pages/Home'
|
import HomePage from '@/pages/Home'
|
||||||
|
import CandidatesPage from '@/pages/Candidates'
|
||||||
|
import JobsPage from '@/pages/Jobs'
|
||||||
|
import ScorecardsPage from '@/pages/Scorecards'
|
||||||
|
|
||||||
function App() {
|
function App() {
|
||||||
return (
|
return (
|
||||||
<BrowserRouter>
|
<BrowserRouter>
|
||||||
|
<div className="min-h-screen bg-background">
|
||||||
|
<header className="border-b sticky top-0 bg-background z-10">
|
||||||
|
<div className="container mx-auto flex h-16 items-center justify-between px-4">
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
<span className="text-xl font-bold text-primary">HireFlow</span>
|
||||||
|
<span className="text-xs text-muted-foreground bg-muted px-2 py-0.5 rounded-full">AI Recruitment</span>
|
||||||
|
</div>
|
||||||
|
<nav className="flex items-center gap-1">
|
||||||
|
<NavLink to="/" end className={({ isActive }) =>
|
||||||
|
`px-3 py-2 rounded-md text-sm font-medium transition-colors ${isActive ? 'bg-primary text-primary-foreground' : 'hover:bg-muted'}`
|
||||||
|
}>Dashboard</NavLink>
|
||||||
|
<NavLink to="/candidates" className={({ isActive }) =>
|
||||||
|
`px-3 py-2 rounded-md text-sm font-medium transition-colors ${isActive ? 'bg-primary text-primary-foreground' : 'hover:bg-muted'}`
|
||||||
|
}>Candidates</NavLink>
|
||||||
|
<NavLink to="/jobs" className={({ isActive }) =>
|
||||||
|
`px-3 py-2 rounded-md text-sm font-medium transition-colors ${isActive ? 'bg-primary text-primary-foreground' : 'hover:bg-muted'}`
|
||||||
|
}>Jobs</NavLink>
|
||||||
|
<NavLink to="/scorecards" className={({ isActive }) =>
|
||||||
|
`px-3 py-2 rounded-md text-sm font-medium transition-colors ${isActive ? 'bg-primary text-primary-foreground' : 'hover:bg-muted'}`
|
||||||
|
}>Scorecards</NavLink>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
<Routes>
|
<Routes>
|
||||||
<Route path="/" element={<HomePage />} />
|
<Route path="/" element={<HomePage />} />
|
||||||
|
<Route path="/candidates" element={<CandidatesPage />} />
|
||||||
|
<Route path="/jobs" element={<JobsPage />} />
|
||||||
|
<Route path="/scorecards" element={<ScorecardsPage />} />
|
||||||
</Routes>
|
</Routes>
|
||||||
|
</div>
|
||||||
</BrowserRouter>
|
</BrowserRouter>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
171
client/src/pages/Candidates.tsx
Normal file
171
client/src/pages/Candidates.tsx
Normal file
@@ -0,0 +1,171 @@
|
|||||||
|
import { useEffect, useState } from 'react'
|
||||||
|
import { Card, CardHeader, CardTitle, CardContent } from '@/components/ui/card'
|
||||||
|
import { Button } from '@/components/ui/button'
|
||||||
|
import { Input } from '@/components/ui/input'
|
||||||
|
|
||||||
|
interface Candidate {
|
||||||
|
id: number
|
||||||
|
name: string
|
||||||
|
email: string | null
|
||||||
|
phone: string | null
|
||||||
|
skills: string[]
|
||||||
|
experience_years: number | null
|
||||||
|
education: string | null
|
||||||
|
summary: string | null
|
||||||
|
created_at: string
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function CandidatesPage() {
|
||||||
|
const [candidates, setCandidates] = useState<Candidate[]>([])
|
||||||
|
const [loading, setLoading] = useState(true)
|
||||||
|
const [cvText, setCvText] = useState('')
|
||||||
|
const [parsing, setParsing] = useState(false)
|
||||||
|
const [message, setMessage] = useState('')
|
||||||
|
const [selected, setSelected] = useState<Candidate | null>(null)
|
||||||
|
|
||||||
|
const loadCandidates = () => {
|
||||||
|
setLoading(true)
|
||||||
|
fetch('/api/candidates')
|
||||||
|
.then(r => r.json())
|
||||||
|
.then(d => setCandidates(d.candidates || []))
|
||||||
|
.finally(() => setLoading(false))
|
||||||
|
}
|
||||||
|
|
||||||
|
useEffect(() => { loadCandidates() }, [])
|
||||||
|
|
||||||
|
const parseCV = async () => {
|
||||||
|
if (!cvText.trim()) return
|
||||||
|
setParsing(true)
|
||||||
|
setMessage('')
|
||||||
|
try {
|
||||||
|
const res = await fetch('/api/candidates/parse-cv', {
|
||||||
|
method: 'POST',
|
||||||
|
headers: { 'Content-Type': 'application/json' },
|
||||||
|
body: JSON.stringify({ text: cvText })
|
||||||
|
})
|
||||||
|
const data = await res.json()
|
||||||
|
if (data.success) {
|
||||||
|
setMessage(`✓ CV parsed: ${data.candidate.name} added`)
|
||||||
|
setCvText('')
|
||||||
|
loadCandidates()
|
||||||
|
} else {
|
||||||
|
setMessage(`Error: ${data.error}`)
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
setMessage('Failed to parse CV')
|
||||||
|
} finally {
|
||||||
|
setParsing(false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleFileUpload = async (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||||
|
const file = e.target.files?.[0]
|
||||||
|
if (!file) return
|
||||||
|
const text = await file.text()
|
||||||
|
setCvText(text)
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="container mx-auto px-4 py-8">
|
||||||
|
<div className="mb-6 flex items-center justify-between">
|
||||||
|
<div>
|
||||||
|
<h1 className="text-2xl font-bold">Candidates</h1>
|
||||||
|
<p className="text-muted-foreground text-sm">AI-powered CV parsing and candidate profiles</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid gap-6 lg:grid-cols-2 mb-8">
|
||||||
|
<Card>
|
||||||
|
<CardHeader>
|
||||||
|
<CardTitle className="text-base">Parse CV</CardTitle>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent className="space-y-3">
|
||||||
|
<div>
|
||||||
|
<label className="text-sm font-medium mb-1 block">Upload CV file</label>
|
||||||
|
<Input type="file" accept=".txt,.md,.rtf" onChange={handleFileUpload} />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label className="text-sm font-medium mb-1 block">Or paste CV text</label>
|
||||||
|
<textarea
|
||||||
|
className="w-full min-h-[120px] rounded-md border border-input bg-background px-3 py-2 text-sm resize-none focus:outline-none focus:ring-2 focus:ring-ring"
|
||||||
|
placeholder="Paste CV text here..."
|
||||||
|
value={cvText}
|
||||||
|
onChange={e => setCvText(e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
{message && (
|
||||||
|
<div className={`text-sm p-2 rounded ${message.startsWith('✓') ? 'bg-green-50 text-green-700' : 'bg-red-50 text-red-700'}`}>
|
||||||
|
{message}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
<Button onClick={parseCV} disabled={parsing || !cvText.trim()} className="w-full">
|
||||||
|
{parsing ? 'Parsing...' : 'Parse CV with AI'}
|
||||||
|
</Button>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
|
||||||
|
{selected && (
|
||||||
|
<Card>
|
||||||
|
<CardHeader>
|
||||||
|
<CardTitle className="text-base flex justify-between items-center">
|
||||||
|
{selected.name}
|
||||||
|
<button onClick={() => setSelected(null)} className="text-muted-foreground text-sm">✕</button>
|
||||||
|
</CardTitle>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent className="space-y-2 text-sm">
|
||||||
|
{selected.email && <div><span className="font-medium">Email:</span> {selected.email}</div>}
|
||||||
|
{selected.phone && <div><span className="font-medium">Phone:</span> {selected.phone}</div>}
|
||||||
|
{selected.experience_years && <div><span className="font-medium">Experience:</span> {selected.experience_years} years</div>}
|
||||||
|
{selected.education && <div><span className="font-medium">Education:</span> {selected.education}</div>}
|
||||||
|
{selected.summary && <div><span className="font-medium">Summary:</span> {selected.summary}</div>}
|
||||||
|
{selected.skills?.length > 0 && (
|
||||||
|
<div>
|
||||||
|
<span className="font-medium">Skills:</span>
|
||||||
|
<div className="flex flex-wrap gap-1 mt-1">
|
||||||
|
{selected.skills.map(s => (
|
||||||
|
<span key={s} className="bg-primary/10 text-primary text-xs px-2 py-0.5 rounded-full">{s}</span>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<h2 className="text-lg font-semibold mb-4">All Candidates ({candidates.length})</h2>
|
||||||
|
{loading ? (
|
||||||
|
<div className="text-muted-foreground text-sm">Loading...</div>
|
||||||
|
) : candidates.length === 0 ? (
|
||||||
|
<div className="text-center py-12 text-muted-foreground">
|
||||||
|
<div className="text-4xl mb-2">👤</div>
|
||||||
|
<div>No candidates yet. Parse a CV to add the first one.</div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<div className="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
|
||||||
|
{candidates.map(c => (
|
||||||
|
<Card key={c.id} className="cursor-pointer hover:shadow-md transition-shadow" onClick={() => setSelected(c)}>
|
||||||
|
<CardContent className="pt-4">
|
||||||
|
<div className="font-medium">{c.name}</div>
|
||||||
|
<div className="text-sm text-muted-foreground">{c.email || 'No email'}</div>
|
||||||
|
{c.experience_years && (
|
||||||
|
<div className="text-xs text-muted-foreground mt-1">{c.experience_years}y experience</div>
|
||||||
|
)}
|
||||||
|
{c.skills?.length > 0 && (
|
||||||
|
<div className="flex flex-wrap gap-1 mt-2">
|
||||||
|
{c.skills.slice(0, 4).map(s => (
|
||||||
|
<span key={s} className="bg-muted text-xs px-1.5 py-0.5 rounded">{s}</span>
|
||||||
|
))}
|
||||||
|
{c.skills.length > 4 && <span className="text-xs text-muted-foreground">+{c.skills.length - 4}</span>}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
@@ -1,85 +1,97 @@
|
|||||||
import { Button } from '@/components/ui/button'
|
import { useEffect, useState } from 'react'
|
||||||
import { Card, CardHeader, CardTitle, CardDescription, CardContent } from '@/components/ui/card'
|
import { Card, CardHeader, CardTitle, CardContent } from '@/components/ui/card'
|
||||||
import { Separator } from '@/components/ui/separator'
|
|
||||||
|
interface Stats {
|
||||||
|
candidates: number
|
||||||
|
jobs: number
|
||||||
|
scorecards: number
|
||||||
|
applications: number
|
||||||
|
}
|
||||||
|
|
||||||
export default function HomePage() {
|
export default function HomePage() {
|
||||||
|
const [stats, setStats] = useState<Stats>({ candidates: 0, jobs: 0, scorecards: 0, applications: 0 })
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
fetch('/api/stats').then(r => r.json()).then(setStats).catch(() => {})
|
||||||
|
}, [])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="min-h-screen bg-background">
|
<div className="container mx-auto px-4 py-8">
|
||||||
{/* Header */}
|
<div className="mb-8">
|
||||||
<header className="border-b">
|
<h1 className="text-3xl font-bold">Dashboard</h1>
|
||||||
<div className="container mx-auto flex h-16 items-center justify-between px-4">
|
<p className="text-muted-foreground mt-1">AI-powered recruitment platform for Nordic agencies</p>
|
||||||
<h1 className="text-xl font-bold">Company Name</h1>
|
|
||||||
<nav className="flex items-center gap-4">
|
|
||||||
<Button variant="ghost">About</Button>
|
|
||||||
<Button variant="ghost">Contact</Button>
|
|
||||||
<Button>Get Started</Button>
|
|
||||||
</nav>
|
|
||||||
</div>
|
</div>
|
||||||
</header>
|
|
||||||
|
|
||||||
{/* Hero */}
|
<div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-4 mb-8">
|
||||||
<section className="container mx-auto px-4 py-24 text-center">
|
|
||||||
<h2 className="text-4xl font-bold tracking-tight sm:text-5xl">
|
|
||||||
Welcome to Your Company
|
|
||||||
</h2>
|
|
||||||
<p className="mx-auto mt-6 max-w-2xl text-lg text-muted-foreground">
|
|
||||||
This is your company website scaffold built with React, shadcn/ui, and TailwindCSS.
|
|
||||||
Start building your product here.
|
|
||||||
</p>
|
|
||||||
<div className="mt-10 flex justify-center gap-4">
|
|
||||||
<Button size="lg">Get Started</Button>
|
|
||||||
<Button size="lg" variant="outline">Learn More</Button>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<Separator />
|
|
||||||
|
|
||||||
{/* Features */}
|
|
||||||
<section className="container mx-auto px-4 py-16">
|
|
||||||
<h3 className="mb-8 text-center text-2xl font-bold">Features</h3>
|
|
||||||
<div className="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
|
|
||||||
<Card>
|
<Card>
|
||||||
<CardHeader>
|
<CardHeader className="pb-2">
|
||||||
<CardTitle>Feature One</CardTitle>
|
<CardTitle className="text-sm font-medium text-muted-foreground">Total Candidates</CardTitle>
|
||||||
<CardDescription>Description of the first feature.</CardDescription>
|
|
||||||
</CardHeader>
|
</CardHeader>
|
||||||
<CardContent>
|
<CardContent>
|
||||||
<p className="text-sm text-muted-foreground">
|
<div className="text-3xl font-bold">{stats.candidates}</div>
|
||||||
Add details about this feature here.
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
<Card>
|
||||||
|
<CardHeader className="pb-2">
|
||||||
|
<CardTitle className="text-sm font-medium text-muted-foreground">Active Jobs</CardTitle>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent>
|
||||||
|
<div className="text-3xl font-bold">{stats.jobs}</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
<Card>
|
||||||
|
<CardHeader className="pb-2">
|
||||||
|
<CardTitle className="text-sm font-medium text-muted-foreground">Applications</CardTitle>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent>
|
||||||
|
<div className="text-3xl font-bold">{stats.applications}</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
<Card>
|
||||||
|
<CardHeader className="pb-2">
|
||||||
|
<CardTitle className="text-sm font-medium text-muted-foreground">Scorecards</CardTitle>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent>
|
||||||
|
<div className="text-3xl font-bold">{stats.scorecards}</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid gap-6 md:grid-cols-3">
|
||||||
|
<Card>
|
||||||
|
<CardHeader>
|
||||||
|
<CardTitle>AI CV Parsing</CardTitle>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent>
|
||||||
|
<p className="text-sm text-muted-foreground mb-3">
|
||||||
|
Upload CVs and automatically extract candidate information — skills, experience, education — using AI parsing.
|
||||||
</p>
|
</p>
|
||||||
|
<a href="/candidates" className="text-sm font-medium text-primary hover:underline">Go to Candidates →</a>
|
||||||
</CardContent>
|
</CardContent>
|
||||||
</Card>
|
</Card>
|
||||||
<Card>
|
<Card>
|
||||||
<CardHeader>
|
<CardHeader>
|
||||||
<CardTitle>Feature Two</CardTitle>
|
<CardTitle>Multi-Channel Job Posting</CardTitle>
|
||||||
<CardDescription>Description of the second feature.</CardDescription>
|
|
||||||
</CardHeader>
|
</CardHeader>
|
||||||
<CardContent>
|
<CardContent>
|
||||||
<p className="text-sm text-muted-foreground">
|
<p className="text-sm text-muted-foreground mb-3">
|
||||||
Add details about this feature here.
|
Post jobs to LinkedIn, Indeed, Arbetsförmedlingen, and your company career page with a single click.
|
||||||
</p>
|
</p>
|
||||||
|
<a href="/jobs" className="text-sm font-medium text-primary hover:underline">Go to Jobs →</a>
|
||||||
</CardContent>
|
</CardContent>
|
||||||
</Card>
|
</Card>
|
||||||
<Card>
|
<Card>
|
||||||
<CardHeader>
|
<CardHeader>
|
||||||
<CardTitle>Feature Three</CardTitle>
|
<CardTitle>Collaborative Scorecards</CardTitle>
|
||||||
<CardDescription>Description of the third feature.</CardDescription>
|
|
||||||
</CardHeader>
|
</CardHeader>
|
||||||
<CardContent>
|
<CardContent>
|
||||||
<p className="text-sm text-muted-foreground">
|
<p className="text-sm text-muted-foreground mb-3">
|
||||||
Add details about this feature here.
|
Multiple interviewers score candidates using standardized criteria for consistent, unbiased evaluations.
|
||||||
</p>
|
</p>
|
||||||
|
<a href="/scorecards" className="text-sm font-medium text-primary hover:underline">Go to Scorecards →</a>
|
||||||
</CardContent>
|
</CardContent>
|
||||||
</Card>
|
</Card>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
|
||||||
|
|
||||||
{/* Footer */}
|
|
||||||
<footer className="border-t py-8">
|
|
||||||
<div className="container mx-auto px-4 text-center text-sm text-muted-foreground">
|
|
||||||
© {new Date().getFullYear()} Company Name. All rights reserved.
|
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
236
client/src/pages/Jobs.tsx
Normal file
236
client/src/pages/Jobs.tsx
Normal file
@@ -0,0 +1,236 @@
|
|||||||
|
import { useEffect, useState } from 'react'
|
||||||
|
import { Card, CardHeader, CardTitle, CardContent } from '@/components/ui/card'
|
||||||
|
import { Button } from '@/components/ui/button'
|
||||||
|
import { Input } from '@/components/ui/input'
|
||||||
|
|
||||||
|
interface Job {
|
||||||
|
id: number
|
||||||
|
title: string
|
||||||
|
description: string | null
|
||||||
|
requirements: string | null
|
||||||
|
location: string | null
|
||||||
|
salary_min: number | null
|
||||||
|
salary_max: number | null
|
||||||
|
channels: string[]
|
||||||
|
status: string
|
||||||
|
posted_at: string | null
|
||||||
|
created_at: string
|
||||||
|
}
|
||||||
|
|
||||||
|
const CHANNELS = [
|
||||||
|
{ id: 'linkedin', label: 'LinkedIn Jobs' },
|
||||||
|
{ id: 'indeed', label: 'Indeed' },
|
||||||
|
{ id: 'arbetsformedlingen', label: 'Arbetsförmedlingen' },
|
||||||
|
{ id: 'company_site', label: 'Company Career Page' },
|
||||||
|
{ id: 'glassdoor', label: 'Glassdoor' },
|
||||||
|
]
|
||||||
|
|
||||||
|
export default function JobsPage() {
|
||||||
|
const [jobs, setJobs] = useState<Job[]>([])
|
||||||
|
const [loading, setLoading] = useState(true)
|
||||||
|
const [showForm, setShowForm] = useState(false)
|
||||||
|
const [form, setForm] = useState({ title: '', description: '', requirements: '', location: '', salary_min: '', salary_max: '' })
|
||||||
|
const [posting, setPosting] = useState(false)
|
||||||
|
const [message, setMessage] = useState('')
|
||||||
|
const [selected, setSelected] = useState<Job | null>(null)
|
||||||
|
const [postChannels, setPostChannels] = useState<string[]>([])
|
||||||
|
const [postingTo, setPostingTo] = useState<number | null>(null)
|
||||||
|
const [postResult, setPostResult] = useState<Record<string, any> | null>(null)
|
||||||
|
|
||||||
|
const loadJobs = () => {
|
||||||
|
setLoading(true)
|
||||||
|
fetch('/api/jobs')
|
||||||
|
.then(r => r.json())
|
||||||
|
.then(d => setJobs(d.jobs || []))
|
||||||
|
.finally(() => setLoading(false))
|
||||||
|
}
|
||||||
|
|
||||||
|
useEffect(() => { loadJobs() }, [])
|
||||||
|
|
||||||
|
const createJob = async () => {
|
||||||
|
if (!form.title.trim()) return
|
||||||
|
setPosting(true)
|
||||||
|
setMessage('')
|
||||||
|
try {
|
||||||
|
const res = await fetch('/api/jobs', {
|
||||||
|
method: 'POST',
|
||||||
|
headers: { 'Content-Type': 'application/json' },
|
||||||
|
body: JSON.stringify({
|
||||||
|
...form,
|
||||||
|
salary_min: form.salary_min ? parseInt(form.salary_min) : null,
|
||||||
|
salary_max: form.salary_max ? parseInt(form.salary_max) : null,
|
||||||
|
})
|
||||||
|
})
|
||||||
|
const data = await res.json()
|
||||||
|
if (data.success) {
|
||||||
|
setMessage(`✓ Job "${data.job.title}" created`)
|
||||||
|
setForm({ title: '', description: '', requirements: '', location: '', salary_min: '', salary_max: '' })
|
||||||
|
setShowForm(false)
|
||||||
|
loadJobs()
|
||||||
|
} else {
|
||||||
|
setMessage(`Error: ${data.error}`)
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
setMessage('Failed to create job')
|
||||||
|
} finally {
|
||||||
|
setPosting(false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const postToChannels = async (jobId: number) => {
|
||||||
|
if (!postChannels.length) return
|
||||||
|
setPostingTo(jobId)
|
||||||
|
setPostResult(null)
|
||||||
|
try {
|
||||||
|
const res = await fetch(`/api/jobs/${jobId}/post`, {
|
||||||
|
method: 'POST',
|
||||||
|
headers: { 'Content-Type': 'application/json' },
|
||||||
|
body: JSON.stringify({ channels: postChannels })
|
||||||
|
})
|
||||||
|
const data = await res.json()
|
||||||
|
if (data.success) {
|
||||||
|
setPostResult(data.postingResults)
|
||||||
|
loadJobs()
|
||||||
|
}
|
||||||
|
} finally {
|
||||||
|
setPostingTo(null)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const toggleChannel = (ch: string) => {
|
||||||
|
setPostChannels(prev => prev.includes(ch) ? prev.filter(c => c !== ch) : [...prev, ch])
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="container mx-auto px-4 py-8">
|
||||||
|
<div className="mb-6 flex items-center justify-between">
|
||||||
|
<div>
|
||||||
|
<h1 className="text-2xl font-bold">Jobs</h1>
|
||||||
|
<p className="text-muted-foreground text-sm">Create and post jobs to multiple platforms</p>
|
||||||
|
</div>
|
||||||
|
<Button onClick={() => setShowForm(!showForm)}>
|
||||||
|
{showForm ? 'Cancel' : '+ New Job'}
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{message && (
|
||||||
|
<div className={`mb-4 text-sm p-2 rounded ${message.startsWith('✓') ? 'bg-green-50 text-green-700' : 'bg-red-50 text-red-700'}`}>
|
||||||
|
{message}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{showForm && (
|
||||||
|
<Card className="mb-6">
|
||||||
|
<CardHeader><CardTitle className="text-base">Create New Job</CardTitle></CardHeader>
|
||||||
|
<CardContent className="space-y-3">
|
||||||
|
<Input placeholder="Job title *" value={form.title} onChange={e => setForm(f => ({ ...f, title: e.target.value }))} />
|
||||||
|
<textarea
|
||||||
|
className="w-full min-h-[80px] rounded-md border border-input bg-background px-3 py-2 text-sm resize-none focus:outline-none focus:ring-2 focus:ring-ring"
|
||||||
|
placeholder="Job description"
|
||||||
|
value={form.description}
|
||||||
|
onChange={e => setForm(f => ({ ...f, description: e.target.value }))}
|
||||||
|
/>
|
||||||
|
<textarea
|
||||||
|
className="w-full min-h-[60px] rounded-md border border-input bg-background px-3 py-2 text-sm resize-none focus:outline-none focus:ring-2 focus:ring-ring"
|
||||||
|
placeholder="Requirements"
|
||||||
|
value={form.requirements}
|
||||||
|
onChange={e => setForm(f => ({ ...f, requirements: e.target.value }))}
|
||||||
|
/>
|
||||||
|
<div className="grid grid-cols-3 gap-3">
|
||||||
|
<Input placeholder="Location" value={form.location} onChange={e => setForm(f => ({ ...f, location: e.target.value }))} />
|
||||||
|
<Input placeholder="Min salary" type="number" value={form.salary_min} onChange={e => setForm(f => ({ ...f, salary_min: e.target.value }))} />
|
||||||
|
<Input placeholder="Max salary" type="number" value={form.salary_max} onChange={e => setForm(f => ({ ...f, salary_max: e.target.value }))} />
|
||||||
|
</div>
|
||||||
|
<Button onClick={createJob} disabled={posting || !form.title.trim()}>
|
||||||
|
{posting ? 'Creating...' : 'Create Job'}
|
||||||
|
</Button>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{selected && (
|
||||||
|
<Card className="mb-6">
|
||||||
|
<CardHeader>
|
||||||
|
<CardTitle className="text-base flex justify-between items-center">
|
||||||
|
Post "{selected.title}" to Channels
|
||||||
|
<button onClick={() => { setSelected(null); setPostResult(null); setPostChannels([]) }} className="text-muted-foreground text-sm">✕</button>
|
||||||
|
</CardTitle>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent>
|
||||||
|
<div className="grid grid-cols-2 sm:grid-cols-3 gap-2 mb-4">
|
||||||
|
{CHANNELS.map(ch => (
|
||||||
|
<label key={ch.id} className={`flex items-center gap-2 p-2 rounded border cursor-pointer text-sm ${postChannels.includes(ch.id) ? 'border-primary bg-primary/5' : 'border-input'}`}>
|
||||||
|
<input type="checkbox" checked={postChannels.includes(ch.id)} onChange={() => toggleChannel(ch.id)} className="accent-primary" />
|
||||||
|
{ch.label}
|
||||||
|
</label>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
<Button
|
||||||
|
onClick={() => postToChannels(selected.id)}
|
||||||
|
disabled={!postChannels.length || postingTo === selected.id}
|
||||||
|
>
|
||||||
|
{postingTo === selected.id ? 'Posting...' : `Post to ${postChannels.length} channel${postChannels.length !== 1 ? 's' : ''}`}
|
||||||
|
</Button>
|
||||||
|
{postResult && (
|
||||||
|
<div className="mt-4 space-y-2">
|
||||||
|
<div className="font-medium text-sm">Posted successfully to:</div>
|
||||||
|
{Object.entries(postResult).map(([ch, result]: [string, any]) => (
|
||||||
|
<div key={ch} className="text-sm text-green-700 bg-green-50 p-2 rounded">
|
||||||
|
✓ {result.platform} — {new Date(result.postedAt).toLocaleString()}
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
)}
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<h2 className="text-lg font-semibold mb-4">All Jobs ({jobs.length})</h2>
|
||||||
|
{loading ? (
|
||||||
|
<div className="text-muted-foreground text-sm">Loading...</div>
|
||||||
|
) : jobs.length === 0 ? (
|
||||||
|
<div className="text-center py-12 text-muted-foreground">
|
||||||
|
<div className="text-4xl mb-2">💼</div>
|
||||||
|
<div>No jobs yet. Create your first job posting.</div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<div className="space-y-3">
|
||||||
|
{jobs.map(j => (
|
||||||
|
<Card key={j.id}>
|
||||||
|
<CardContent className="pt-4">
|
||||||
|
<div className="flex items-start justify-between gap-4">
|
||||||
|
<div className="flex-1">
|
||||||
|
<div className="font-medium">{j.title}</div>
|
||||||
|
{j.location && <div className="text-sm text-muted-foreground">{j.location}</div>}
|
||||||
|
{(j.salary_min || j.salary_max) && (
|
||||||
|
<div className="text-sm text-muted-foreground">
|
||||||
|
{j.salary_min && j.salary_max ? `${j.salary_min.toLocaleString()} – ${j.salary_max.toLocaleString()} SEK` : `From ${(j.salary_min || j.salary_max)?.toLocaleString()} SEK`}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
{j.channels?.length > 0 && (
|
||||||
|
<div className="flex flex-wrap gap-1 mt-2">
|
||||||
|
{j.channels.map(ch => (
|
||||||
|
<span key={ch} className="text-xs bg-green-100 text-green-700 px-2 py-0.5 rounded-full">{ch}</span>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
<div className="flex flex-col items-end gap-2">
|
||||||
|
<span className={`text-xs px-2 py-0.5 rounded-full ${j.status === 'posted' ? 'bg-green-100 text-green-700' : 'bg-muted text-muted-foreground'}`}>
|
||||||
|
{j.status}
|
||||||
|
</span>
|
||||||
|
<Button variant="outline" size="sm" onClick={() => { setSelected(j); setPostChannels(j.channels || []); setPostResult(null) }}>
|
||||||
|
Post to Channels
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
266
client/src/pages/Scorecards.tsx
Normal file
266
client/src/pages/Scorecards.tsx
Normal file
@@ -0,0 +1,266 @@
|
|||||||
|
import { useEffect, useState } from 'react'
|
||||||
|
import { Card, CardHeader, CardTitle, CardContent } from '@/components/ui/card'
|
||||||
|
import { Button } from '@/components/ui/button'
|
||||||
|
import { Input } from '@/components/ui/input'
|
||||||
|
|
||||||
|
interface Candidate { id: number; name: string; email: string | null }
|
||||||
|
interface Job { id: number; title: string }
|
||||||
|
interface Scorecard {
|
||||||
|
id: number
|
||||||
|
job_id: number
|
||||||
|
candidate_id: number
|
||||||
|
interviewer: string
|
||||||
|
criteria: Record<string, { score: number; notes: string }>
|
||||||
|
total_score: number
|
||||||
|
comments: string | null
|
||||||
|
recommendation: string | null
|
||||||
|
created_at: string
|
||||||
|
}
|
||||||
|
|
||||||
|
const CRITERIA = [
|
||||||
|
{ key: 'technical', label: 'Technical Skills' },
|
||||||
|
{ key: 'communication', label: 'Communication' },
|
||||||
|
{ key: 'culture_fit', label: 'Culture Fit' },
|
||||||
|
{ key: 'problem_solving', label: 'Problem Solving' },
|
||||||
|
{ key: 'experience', label: 'Relevant Experience' },
|
||||||
|
]
|
||||||
|
|
||||||
|
export default function ScorecardsPage() {
|
||||||
|
const [candidates, setCandidates] = useState<Candidate[]>([])
|
||||||
|
const [jobs, setJobs] = useState<Job[]>([])
|
||||||
|
const [scorecards, setScorecards] = useState<Scorecard[]>([])
|
||||||
|
const [loading, setLoading] = useState(true)
|
||||||
|
const [showForm, setShowForm] = useState(false)
|
||||||
|
const [form, setForm] = useState({
|
||||||
|
job_id: '',
|
||||||
|
candidate_id: '',
|
||||||
|
interviewer: '',
|
||||||
|
comments: '',
|
||||||
|
recommendation: 'maybe',
|
||||||
|
})
|
||||||
|
const [criteria, setCriteria] = useState<Record<string, { score: number; notes: string }>>(
|
||||||
|
Object.fromEntries(CRITERIA.map(c => [c.key, { score: 3, notes: '' }]))
|
||||||
|
)
|
||||||
|
const [submitting, setSubmitting] = useState(false)
|
||||||
|
const [message, setMessage] = useState('')
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
Promise.all([
|
||||||
|
fetch('/api/candidates').then(r => r.json()),
|
||||||
|
fetch('/api/jobs').then(r => r.json()),
|
||||||
|
fetch('/api/scorecards').then(r => r.json()),
|
||||||
|
]).then(([c, j, s]) => {
|
||||||
|
setCandidates(c.candidates || [])
|
||||||
|
setJobs(j.jobs || [])
|
||||||
|
setScorecards(s.scorecards || [])
|
||||||
|
}).finally(() => setLoading(false))
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
const loadScorecards = () => {
|
||||||
|
fetch('/api/scorecards').then(r => r.json()).then(d => setScorecards(d.scorecards || []))
|
||||||
|
}
|
||||||
|
|
||||||
|
const submitScorecard = async () => {
|
||||||
|
if (!form.job_id || !form.candidate_id || !form.interviewer) return
|
||||||
|
setSubmitting(true)
|
||||||
|
setMessage('')
|
||||||
|
try {
|
||||||
|
const res = await fetch('/api/scorecards', {
|
||||||
|
method: 'POST',
|
||||||
|
headers: { 'Content-Type': 'application/json' },
|
||||||
|
body: JSON.stringify({
|
||||||
|
job_id: parseInt(form.job_id),
|
||||||
|
candidate_id: parseInt(form.candidate_id),
|
||||||
|
interviewer: form.interviewer,
|
||||||
|
criteria,
|
||||||
|
comments: form.comments,
|
||||||
|
recommendation: form.recommendation,
|
||||||
|
})
|
||||||
|
})
|
||||||
|
const data = await res.json()
|
||||||
|
if (data.success) {
|
||||||
|
setMessage(`✓ Scorecard submitted by ${form.interviewer}`)
|
||||||
|
setShowForm(false)
|
||||||
|
loadScorecards()
|
||||||
|
} else {
|
||||||
|
setMessage(`Error: ${data.error}`)
|
||||||
|
}
|
||||||
|
} finally {
|
||||||
|
setSubmitting(false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const getCandidate = (id: number) => candidates.find(c => c.id === id)
|
||||||
|
const getJob = (id: number) => jobs.find(j => j.id === id)
|
||||||
|
|
||||||
|
const scoreColor = (score: number) => {
|
||||||
|
if (score >= 4) return 'text-green-600'
|
||||||
|
if (score >= 3) return 'text-yellow-600'
|
||||||
|
return 'text-red-600'
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="container mx-auto px-4 py-8">
|
||||||
|
<div className="mb-6 flex items-center justify-between">
|
||||||
|
<div>
|
||||||
|
<h1 className="text-2xl font-bold">Scorecards</h1>
|
||||||
|
<p className="text-muted-foreground text-sm">Collaborative candidate evaluations</p>
|
||||||
|
</div>
|
||||||
|
<Button onClick={() => setShowForm(!showForm)}>
|
||||||
|
{showForm ? 'Cancel' : '+ New Scorecard'}
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{message && (
|
||||||
|
<div className={`mb-4 text-sm p-2 rounded ${message.startsWith('✓') ? 'bg-green-50 text-green-700' : 'bg-red-50 text-red-700'}`}>
|
||||||
|
{message}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{showForm && (
|
||||||
|
<Card className="mb-6">
|
||||||
|
<CardHeader><CardTitle className="text-base">New Scorecard</CardTitle></CardHeader>
|
||||||
|
<CardContent className="space-y-4">
|
||||||
|
<div className="grid grid-cols-1 sm:grid-cols-3 gap-3">
|
||||||
|
<div>
|
||||||
|
<label className="text-sm font-medium mb-1 block">Job *</label>
|
||||||
|
<select
|
||||||
|
className="w-full rounded-md border border-input bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring"
|
||||||
|
value={form.job_id}
|
||||||
|
onChange={e => setForm(f => ({ ...f, job_id: e.target.value }))}
|
||||||
|
>
|
||||||
|
<option value="">Select job...</option>
|
||||||
|
{jobs.map(j => <option key={j.id} value={j.id}>{j.title}</option>)}
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label className="text-sm font-medium mb-1 block">Candidate *</label>
|
||||||
|
<select
|
||||||
|
className="w-full rounded-md border border-input bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring"
|
||||||
|
value={form.candidate_id}
|
||||||
|
onChange={e => setForm(f => ({ ...f, candidate_id: e.target.value }))}
|
||||||
|
>
|
||||||
|
<option value="">Select candidate...</option>
|
||||||
|
{candidates.map(c => <option key={c.id} value={c.id}>{c.name}</option>)}
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label className="text-sm font-medium mb-1 block">Interviewer *</label>
|
||||||
|
<Input
|
||||||
|
placeholder="Your name"
|
||||||
|
value={form.interviewer}
|
||||||
|
onChange={e => setForm(f => ({ ...f, interviewer: e.target.value }))}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<div className="text-sm font-medium mb-2">Scoring (1–5)</div>
|
||||||
|
<div className="space-y-2">
|
||||||
|
{CRITERIA.map(c => (
|
||||||
|
<div key={c.key} className="flex items-center gap-3">
|
||||||
|
<span className="text-sm w-36 flex-shrink-0">{c.label}</span>
|
||||||
|
<div className="flex gap-1">
|
||||||
|
{[1, 2, 3, 4, 5].map(n => (
|
||||||
|
<button
|
||||||
|
key={n}
|
||||||
|
onClick={() => setCriteria(prev => ({ ...prev, [c.key]: { ...prev[c.key], score: n } }))}
|
||||||
|
className={`w-8 h-8 rounded text-sm font-medium border transition-colors ${criteria[c.key].score === n ? 'bg-primary text-primary-foreground border-primary' : 'border-input hover:bg-muted'}`}
|
||||||
|
>{n}</button>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
<Input
|
||||||
|
className="flex-1 h-8 text-xs"
|
||||||
|
placeholder="Notes..."
|
||||||
|
value={criteria[c.key].notes}
|
||||||
|
onChange={e => setCriteria(prev => ({ ...prev, [c.key]: { ...prev[c.key], notes: e.target.value } }))}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid grid-cols-2 gap-3">
|
||||||
|
<div>
|
||||||
|
<label className="text-sm font-medium mb-1 block">Recommendation</label>
|
||||||
|
<select
|
||||||
|
className="w-full rounded-md border border-input bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring"
|
||||||
|
value={form.recommendation}
|
||||||
|
onChange={e => setForm(f => ({ ...f, recommendation: e.target.value }))}
|
||||||
|
>
|
||||||
|
<option value="strong_yes">Strong Yes</option>
|
||||||
|
<option value="yes">Yes</option>
|
||||||
|
<option value="maybe">Maybe</option>
|
||||||
|
<option value="no">No</option>
|
||||||
|
<option value="strong_no">Strong No</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label className="text-sm font-medium mb-1 block">Comments</label>
|
||||||
|
<Input
|
||||||
|
placeholder="Overall comments..."
|
||||||
|
value={form.comments}
|
||||||
|
onChange={e => setForm(f => ({ ...f, comments: e.target.value }))}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Button
|
||||||
|
onClick={submitScorecard}
|
||||||
|
disabled={submitting || !form.job_id || !form.candidate_id || !form.interviewer}
|
||||||
|
>
|
||||||
|
{submitting ? 'Submitting...' : 'Submit Scorecard'}
|
||||||
|
</Button>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
)}
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<h2 className="text-lg font-semibold mb-4">All Scorecards ({scorecards.length})</h2>
|
||||||
|
{loading ? (
|
||||||
|
<div className="text-muted-foreground text-sm">Loading...</div>
|
||||||
|
) : scorecards.length === 0 ? (
|
||||||
|
<div className="text-center py-12 text-muted-foreground">
|
||||||
|
<div className="text-4xl mb-2">📋</div>
|
||||||
|
<div>No scorecards yet. Evaluate your first candidate.</div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<div className="space-y-3">
|
||||||
|
{scorecards.map(sc => {
|
||||||
|
const candidate = getCandidate(sc.candidate_id)
|
||||||
|
const job = getJob(sc.job_id)
|
||||||
|
const recColors: Record<string, string> = {
|
||||||
|
strong_yes: 'bg-green-100 text-green-800',
|
||||||
|
yes: 'bg-green-50 text-green-700',
|
||||||
|
maybe: 'bg-yellow-50 text-yellow-700',
|
||||||
|
no: 'bg-red-50 text-red-700',
|
||||||
|
strong_no: 'bg-red-100 text-red-800',
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<Card key={sc.id}>
|
||||||
|
<CardContent className="pt-4">
|
||||||
|
<div className="flex items-start justify-between gap-4">
|
||||||
|
<div className="flex-1">
|
||||||
|
<div className="font-medium">{candidate?.name || `Candidate #${sc.candidate_id}`}</div>
|
||||||
|
<div className="text-sm text-muted-foreground">{job?.title || `Job #${sc.job_id}`} • Interviewer: {sc.interviewer}</div>
|
||||||
|
{sc.comments && <div className="text-sm mt-1 text-muted-foreground">{sc.comments}</div>}
|
||||||
|
</div>
|
||||||
|
<div className="flex flex-col items-end gap-1">
|
||||||
|
<span className={`text-2xl font-bold ${scoreColor(sc.total_score)}`}>{sc.total_score}/5</span>
|
||||||
|
{sc.recommendation && (
|
||||||
|
<span className={`text-xs px-2 py-0.5 rounded-full capitalize ${recColors[sc.recommendation] || 'bg-muted'}`}>
|
||||||
|
{sc.recommendation.replace('_', ' ')}
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
)
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
@@ -16,7 +16,8 @@
|
|||||||
"express": "^4.18.2",
|
"express": "^4.18.2",
|
||||||
"pg": "^8.11.3",
|
"pg": "^8.11.3",
|
||||||
"redis": "^4.6.12",
|
"redis": "^4.6.12",
|
||||||
"cors": "^2.8.5"
|
"cors": "^2.8.5",
|
||||||
|
"multer": "^1.4.5-lts.1"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"nodemon": "^3.0.2",
|
"nodemon": "^3.0.2",
|
||||||
|
|||||||
382
server.js
382
server.js
@@ -2,11 +2,12 @@ const express = require('express');
|
|||||||
const { Pool } = require('pg');
|
const { Pool } = require('pg');
|
||||||
const redis = require('redis');
|
const redis = require('redis');
|
||||||
const path = require('path');
|
const path = require('path');
|
||||||
|
const multer = require('multer');
|
||||||
|
const upload = multer({ storage: multer.memoryStorage(), limits: { fileSize: 10 * 1024 * 1024 } });
|
||||||
|
|
||||||
const app = express();
|
const app = express();
|
||||||
const PORT = process.env.PORT || 3000;
|
const PORT = process.env.PORT || 3000;
|
||||||
|
|
||||||
// Middleware
|
|
||||||
app.use(express.json());
|
app.use(express.json());
|
||||||
|
|
||||||
// PostgreSQL connection
|
// PostgreSQL connection
|
||||||
@@ -27,61 +28,396 @@ const redisClient = redis.createClient({
|
|||||||
});
|
});
|
||||||
|
|
||||||
redisClient.connect().catch(console.error);
|
redisClient.connect().catch(console.error);
|
||||||
|
redisClient.on('connect', () => console.log('Redis connected'));
|
||||||
|
redisClient.on('error', (err) => console.error('Redis error:', err));
|
||||||
|
|
||||||
|
// Initialize database schema
|
||||||
|
async function initDb() {
|
||||||
|
try {
|
||||||
|
await pool.query(`
|
||||||
|
CREATE TABLE IF NOT EXISTS candidates (
|
||||||
|
id SERIAL PRIMARY KEY,
|
||||||
|
name VARCHAR(255) NOT NULL,
|
||||||
|
email VARCHAR(255),
|
||||||
|
phone VARCHAR(100),
|
||||||
|
skills TEXT[],
|
||||||
|
experience_years INTEGER,
|
||||||
|
education TEXT,
|
||||||
|
summary TEXT,
|
||||||
|
raw_cv TEXT,
|
||||||
|
created_at TIMESTAMP DEFAULT NOW()
|
||||||
|
);
|
||||||
|
|
||||||
|
CREATE TABLE IF NOT EXISTS jobs (
|
||||||
|
id SERIAL PRIMARY KEY,
|
||||||
|
title VARCHAR(255) NOT NULL,
|
||||||
|
description TEXT,
|
||||||
|
requirements TEXT,
|
||||||
|
location VARCHAR(255),
|
||||||
|
salary_min INTEGER,
|
||||||
|
salary_max INTEGER,
|
||||||
|
channels TEXT[],
|
||||||
|
status VARCHAR(50) DEFAULT 'draft',
|
||||||
|
posted_at TIMESTAMP,
|
||||||
|
created_at TIMESTAMP DEFAULT NOW()
|
||||||
|
);
|
||||||
|
|
||||||
|
CREATE TABLE IF NOT EXISTS scorecards (
|
||||||
|
id SERIAL PRIMARY KEY,
|
||||||
|
job_id INTEGER REFERENCES jobs(id),
|
||||||
|
candidate_id INTEGER REFERENCES candidates(id),
|
||||||
|
interviewer VARCHAR(255) NOT NULL,
|
||||||
|
criteria JSONB,
|
||||||
|
total_score INTEGER,
|
||||||
|
comments TEXT,
|
||||||
|
recommendation VARCHAR(50),
|
||||||
|
created_at TIMESTAMP DEFAULT NOW()
|
||||||
|
);
|
||||||
|
|
||||||
|
CREATE TABLE IF NOT EXISTS job_applications (
|
||||||
|
id SERIAL PRIMARY KEY,
|
||||||
|
job_id INTEGER REFERENCES jobs(id),
|
||||||
|
candidate_id INTEGER REFERENCES candidates(id),
|
||||||
|
status VARCHAR(50) DEFAULT 'applied',
|
||||||
|
stage VARCHAR(50) DEFAULT 'screening',
|
||||||
|
created_at TIMESTAMP DEFAULT NOW(),
|
||||||
|
UNIQUE(job_id, candidate_id)
|
||||||
|
);
|
||||||
|
`);
|
||||||
|
console.log('Database schema initialized');
|
||||||
|
} catch (err) {
|
||||||
|
console.error('DB init error:', err.message);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
pool.query('SELECT NOW()', (err, res) => {
|
pool.query('SELECT NOW()', (err, res) => {
|
||||||
if (err) {
|
if (err) {
|
||||||
console.error('PostgreSQL connection error:', err);
|
console.error('PostgreSQL connection error:', err);
|
||||||
} else {
|
} else {
|
||||||
console.log('PostgreSQL connected at:', res.rows[0].now);
|
console.log('PostgreSQL connected at:', res.rows[0].now);
|
||||||
|
initDb();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
redisClient.on('connect', () => console.log('Redis connected'));
|
// Simple CV parser using regex patterns
|
||||||
redisClient.on('error', (err) => console.error('Redis error:', err));
|
function parseCV(text) {
|
||||||
|
const emailMatch = text.match(/[\w.-]+@[\w.-]+\.\w+/);
|
||||||
|
const phoneMatch = text.match(/(\+?[\d\s()-]{7,})/);
|
||||||
|
|
||||||
// --- API Routes ---
|
// Extract name (first line or after common headers)
|
||||||
|
const lines = text.split('\n').filter(l => l.trim());
|
||||||
|
const name = lines[0]?.trim() || 'Unknown';
|
||||||
|
|
||||||
|
// Extract skills
|
||||||
|
const skillKeywords = ['JavaScript', 'TypeScript', 'React', 'Node.js', 'Python', 'Java', 'SQL',
|
||||||
|
'PostgreSQL', 'MongoDB', 'Redis', 'Docker', 'AWS', 'Git', 'HTML', 'CSS', 'REST', 'GraphQL',
|
||||||
|
'Vue', 'Angular', 'PHP', 'Ruby', 'Go', 'Rust', 'Swift', 'Kotlin', 'C++', 'C#', 'Agile', 'Scrum'];
|
||||||
|
const skills = skillKeywords.filter(skill =>
|
||||||
|
text.toLowerCase().includes(skill.toLowerCase())
|
||||||
|
);
|
||||||
|
|
||||||
|
// Extract experience years
|
||||||
|
const expMatch = text.match(/(\d+)\s*(?:\+\s*)?years?\s*(?:of\s*)?(?:experience|exp)/i);
|
||||||
|
const experienceYears = expMatch ? parseInt(expMatch[1]) : null;
|
||||||
|
|
||||||
|
// Extract education
|
||||||
|
const eduKeywords = ['Bachelor', 'Master', 'PhD', 'BSc', 'MSc', 'MBA', 'University', 'College'];
|
||||||
|
const eduLines = lines.filter(l => eduKeywords.some(k => l.includes(k)));
|
||||||
|
const education = eduLines.slice(0, 2).join('; ') || null;
|
||||||
|
|
||||||
|
return {
|
||||||
|
name,
|
||||||
|
email: emailMatch ? emailMatch[0] : null,
|
||||||
|
phone: phoneMatch ? phoneMatch[0].trim() : null,
|
||||||
|
skills: skills.length > 0 ? skills : ['General'],
|
||||||
|
experience_years: experienceYears,
|
||||||
|
education,
|
||||||
|
summary: lines.slice(1, 4).join(' ').substring(0, 500) || null
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
// Health check
|
// Health check
|
||||||
app.get('/health', async (req, res) => {
|
app.get('/health', async (req, res) => {
|
||||||
try {
|
try {
|
||||||
const pgResult = await pool.query('SELECT NOW()');
|
const pgResult = await pool.query('SELECT NOW()');
|
||||||
await redisClient.ping();
|
await redisClient.ping();
|
||||||
res.json({
|
res.json({ status: 'healthy', postgres: 'connected', redis: 'connected', timestamp: pgResult.rows[0].now });
|
||||||
status: 'healthy',
|
|
||||||
postgres: 'connected',
|
|
||||||
redis: 'connected',
|
|
||||||
timestamp: pgResult.rows[0].now,
|
|
||||||
version: process.env.APP_VERSION || '1.0.0'
|
|
||||||
});
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
res.status(500).json({ status: 'unhealthy', error: error.message });
|
res.status(500).json({ status: 'unhealthy', error: error.message });
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
// Example API endpoint — replace with your own
|
// --- Candidates API ---
|
||||||
app.get('/api/status', async (req, res) => {
|
|
||||||
|
// Get all candidates
|
||||||
|
app.get('/api/candidates', async (req, res) => {
|
||||||
try {
|
try {
|
||||||
const pgResult = await pool.query('SELECT NOW()');
|
const result = await pool.query('SELECT * FROM candidates ORDER BY created_at DESC');
|
||||||
res.json({ ok: true, time: pgResult.rows[0].now });
|
res.json({ candidates: result.rows });
|
||||||
} catch (error) {
|
} catch (err) {
|
||||||
res.status(500).json({ ok: false, error: error.message });
|
res.status(500).json({ error: err.message });
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
// --- Serve React Frontend ---
|
// Get single candidate
|
||||||
// In production, serve the built React app from client/dist
|
app.get('/api/candidates/:id', async (req, res) => {
|
||||||
|
try {
|
||||||
|
const result = await pool.query('SELECT * FROM candidates WHERE id = $1', [req.params.id]);
|
||||||
|
if (!result.rows.length) return res.status(404).json({ error: 'Not found' });
|
||||||
|
res.json(result.rows[0]);
|
||||||
|
} catch (err) {
|
||||||
|
res.status(500).json({ error: err.message });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Upload and parse CV
|
||||||
|
app.post('/api/candidates/parse-cv', upload.single('cv'), async (req, res) => {
|
||||||
|
try {
|
||||||
|
if (!req.file && !req.body.text) {
|
||||||
|
return res.status(400).json({ error: 'No CV file or text provided' });
|
||||||
|
}
|
||||||
|
|
||||||
|
const cvText = req.file ? req.file.buffer.toString('utf-8') : req.body.text;
|
||||||
|
const parsed = parseCV(cvText);
|
||||||
|
|
||||||
|
// Save to database
|
||||||
|
const result = await pool.query(
|
||||||
|
`INSERT INTO candidates (name, email, phone, skills, experience_years, education, summary, raw_cv)
|
||||||
|
VALUES ($1, $2, $3, $4, $5, $6, $7, $8) RETURNING *`,
|
||||||
|
[parsed.name, parsed.email, parsed.phone, parsed.skills, parsed.experience_years,
|
||||||
|
parsed.education, parsed.summary, cvText.substring(0, 5000)]
|
||||||
|
);
|
||||||
|
|
||||||
|
res.json({ success: true, candidate: result.rows[0], parsed });
|
||||||
|
} catch (err) {
|
||||||
|
res.status(500).json({ error: err.message });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Create candidate manually
|
||||||
|
app.post('/api/candidates', async (req, res) => {
|
||||||
|
try {
|
||||||
|
const { name, email, phone, skills, experience_years, education, summary } = req.body;
|
||||||
|
const result = await pool.query(
|
||||||
|
`INSERT INTO candidates (name, email, phone, skills, experience_years, education, summary)
|
||||||
|
VALUES ($1, $2, $3, $4, $5, $6, $7) RETURNING *`,
|
||||||
|
[name, email, phone, skills || [], experience_years, education, summary]
|
||||||
|
);
|
||||||
|
res.json({ success: true, candidate: result.rows[0] });
|
||||||
|
} catch (err) {
|
||||||
|
res.status(500).json({ error: err.message });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// --- Jobs API ---
|
||||||
|
|
||||||
|
// Get all jobs
|
||||||
|
app.get('/api/jobs', async (req, res) => {
|
||||||
|
try {
|
||||||
|
const result = await pool.query('SELECT * FROM jobs ORDER BY created_at DESC');
|
||||||
|
res.json({ jobs: result.rows });
|
||||||
|
} catch (err) {
|
||||||
|
res.status(500).json({ error: err.message });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Get single job
|
||||||
|
app.get('/api/jobs/:id', async (req, res) => {
|
||||||
|
try {
|
||||||
|
const result = await pool.query('SELECT * FROM jobs WHERE id = $1', [req.params.id]);
|
||||||
|
if (!result.rows.length) return res.status(404).json({ error: 'Not found' });
|
||||||
|
res.json(result.rows[0]);
|
||||||
|
} catch (err) {
|
||||||
|
res.status(500).json({ error: err.message });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Create job
|
||||||
|
app.post('/api/jobs', async (req, res) => {
|
||||||
|
try {
|
||||||
|
const { title, description, requirements, location, salary_min, salary_max, channels } = req.body;
|
||||||
|
if (!title) return res.status(400).json({ error: 'Title required' });
|
||||||
|
|
||||||
|
const result = await pool.query(
|
||||||
|
`INSERT INTO jobs (title, description, requirements, location, salary_min, salary_max, channels)
|
||||||
|
VALUES ($1, $2, $3, $4, $5, $6, $7) RETURNING *`,
|
||||||
|
[title, description, requirements, location, salary_min, salary_max, channels || []]
|
||||||
|
);
|
||||||
|
res.json({ success: true, job: result.rows[0] });
|
||||||
|
} catch (err) {
|
||||||
|
res.status(500).json({ error: err.message });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Post job to channels (multi-channel posting simulation)
|
||||||
|
app.post('/api/jobs/:id/post', async (req, res) => {
|
||||||
|
try {
|
||||||
|
const { channels } = req.body;
|
||||||
|
if (!channels || !channels.length) {
|
||||||
|
return res.status(400).json({ error: 'At least one channel required' });
|
||||||
|
}
|
||||||
|
|
||||||
|
// Simulate posting to each channel
|
||||||
|
const postingResults = {};
|
||||||
|
const availableChannels = {
|
||||||
|
'linkedin': 'LinkedIn Jobs',
|
||||||
|
'indeed': 'Indeed',
|
||||||
|
'arbetsformedlingen': 'Arbetsförmedlingen',
|
||||||
|
'company_site': 'Company Career Page',
|
||||||
|
'glassdoor': 'Glassdoor'
|
||||||
|
};
|
||||||
|
|
||||||
|
for (const channel of channels) {
|
||||||
|
// Simulate API call to each platform
|
||||||
|
postingResults[channel] = {
|
||||||
|
status: 'posted',
|
||||||
|
platform: availableChannels[channel] || channel,
|
||||||
|
url: `https://${channel}.example.com/jobs/${req.params.id}`,
|
||||||
|
postedAt: new Date().toISOString()
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
await pool.query(
|
||||||
|
`UPDATE jobs SET channels = $1, status = 'posted', posted_at = NOW() WHERE id = $2`,
|
||||||
|
[channels, req.params.id]
|
||||||
|
);
|
||||||
|
|
||||||
|
const job = await pool.query('SELECT * FROM jobs WHERE id = $1', [req.params.id]);
|
||||||
|
res.json({ success: true, postingResults, job: job.rows[0] });
|
||||||
|
} catch (err) {
|
||||||
|
res.status(500).json({ error: err.message });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// --- Applications API ---
|
||||||
|
|
||||||
|
// Get applications for a job
|
||||||
|
app.get('/api/jobs/:id/applications', async (req, res) => {
|
||||||
|
try {
|
||||||
|
const result = await pool.query(
|
||||||
|
`SELECT ja.*, c.name, c.email, c.skills, c.experience_years
|
||||||
|
FROM job_applications ja JOIN candidates c ON ja.candidate_id = c.id
|
||||||
|
WHERE ja.job_id = $1 ORDER BY ja.created_at DESC`,
|
||||||
|
[req.params.id]
|
||||||
|
);
|
||||||
|
res.json({ applications: result.rows });
|
||||||
|
} catch (err) {
|
||||||
|
res.status(500).json({ error: err.message });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Apply candidate to job
|
||||||
|
app.post('/api/jobs/:jobId/apply/:candidateId', async (req, res) => {
|
||||||
|
try {
|
||||||
|
const result = await pool.query(
|
||||||
|
`INSERT INTO job_applications (job_id, candidate_id) VALUES ($1, $2)
|
||||||
|
ON CONFLICT (job_id, candidate_id) DO NOTHING RETURNING *`,
|
||||||
|
[req.params.jobId, req.params.candidateId]
|
||||||
|
);
|
||||||
|
res.json({ success: true, application: result.rows[0] });
|
||||||
|
} catch (err) {
|
||||||
|
res.status(500).json({ error: err.message });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// --- Scorecards API ---
|
||||||
|
|
||||||
|
// Get scorecards for a candidate
|
||||||
|
app.get('/api/scorecards', async (req, res) => {
|
||||||
|
try {
|
||||||
|
const { job_id, candidate_id } = req.query;
|
||||||
|
let query = 'SELECT * FROM scorecards WHERE 1=1';
|
||||||
|
const params = [];
|
||||||
|
if (job_id) { params.push(job_id); query += ` AND job_id = $${params.length}`; }
|
||||||
|
if (candidate_id) { params.push(candidate_id); query += ` AND candidate_id = $${params.length}`; }
|
||||||
|
query += ' ORDER BY created_at DESC';
|
||||||
|
|
||||||
|
const result = await pool.query(query, params);
|
||||||
|
res.json({ scorecards: result.rows });
|
||||||
|
} catch (err) {
|
||||||
|
res.status(500).json({ error: err.message });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Create scorecard
|
||||||
|
app.post('/api/scorecards', async (req, res) => {
|
||||||
|
try {
|
||||||
|
const { job_id, candidate_id, interviewer, criteria, comments, recommendation } = req.body;
|
||||||
|
if (!job_id || !candidate_id || !interviewer) {
|
||||||
|
return res.status(400).json({ error: 'job_id, candidate_id, and interviewer are required' });
|
||||||
|
}
|
||||||
|
|
||||||
|
// Calculate total score from criteria
|
||||||
|
let total_score = 0;
|
||||||
|
if (criteria && typeof criteria === 'object') {
|
||||||
|
const scores = Object.values(criteria).map(c => c.score || 0);
|
||||||
|
total_score = scores.length > 0 ? Math.round(scores.reduce((a, b) => a + b, 0) / scores.length) : 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
const result = await pool.query(
|
||||||
|
`INSERT INTO scorecards (job_id, candidate_id, interviewer, criteria, total_score, comments, recommendation)
|
||||||
|
VALUES ($1, $2, $3, $4, $5, $6, $7) RETURNING *`,
|
||||||
|
[job_id, candidate_id, interviewer, JSON.stringify(criteria || {}), total_score, comments, recommendation]
|
||||||
|
);
|
||||||
|
res.json({ success: true, scorecard: result.rows[0] });
|
||||||
|
} catch (err) {
|
||||||
|
res.status(500).json({ error: err.message });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Get aggregate scorecard for a candidate on a job
|
||||||
|
app.get('/api/scorecards/summary/:jobId/:candidateId', async (req, res) => {
|
||||||
|
try {
|
||||||
|
const result = await pool.query(
|
||||||
|
`SELECT
|
||||||
|
COUNT(*) as total_interviewers,
|
||||||
|
AVG(total_score) as avg_score,
|
||||||
|
json_agg(json_build_object(
|
||||||
|
'interviewer', interviewer,
|
||||||
|
'score', total_score,
|
||||||
|
'recommendation', recommendation,
|
||||||
|
'comments', comments
|
||||||
|
)) as interviews
|
||||||
|
FROM scorecards
|
||||||
|
WHERE job_id = $1 AND candidate_id = $2`,
|
||||||
|
[req.params.jobId, req.params.candidateId]
|
||||||
|
);
|
||||||
|
res.json(result.rows[0]);
|
||||||
|
} catch (err) {
|
||||||
|
res.status(500).json({ error: err.message });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// --- Stats API ---
|
||||||
|
app.get('/api/stats', async (req, res) => {
|
||||||
|
try {
|
||||||
|
const [candidates, jobs, scorecards, applications] = await Promise.all([
|
||||||
|
pool.query('SELECT COUNT(*) FROM candidates'),
|
||||||
|
pool.query('SELECT COUNT(*) FROM jobs'),
|
||||||
|
pool.query('SELECT COUNT(*) FROM scorecards'),
|
||||||
|
pool.query('SELECT COUNT(*) FROM job_applications'),
|
||||||
|
]);
|
||||||
|
res.json({
|
||||||
|
candidates: parseInt(candidates.rows[0].count),
|
||||||
|
jobs: parseInt(jobs.rows[0].count),
|
||||||
|
scorecards: parseInt(scorecards.rows[0].count),
|
||||||
|
applications: parseInt(applications.rows[0].count),
|
||||||
|
});
|
||||||
|
} catch (err) {
|
||||||
|
res.status(500).json({ error: err.message });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Serve React frontend
|
||||||
const clientDist = path.join(__dirname, 'client', 'dist');
|
const clientDist = path.join(__dirname, 'client', 'dist');
|
||||||
app.use(express.static(clientDist));
|
app.use(express.static(clientDist));
|
||||||
|
|
||||||
// SPA fallback — all non-API routes serve index.html so React Router works
|
|
||||||
app.get('*', (req, res, next) => {
|
app.get('*', (req, res, next) => {
|
||||||
if (req.path.startsWith('/api/') || req.path === '/health') return next();
|
if (req.path.startsWith('/api/') || req.path === '/health') return next();
|
||||||
res.sendFile(path.join(clientDist, 'index.html'));
|
res.sendFile(path.join(clientDist, 'index.html'));
|
||||||
});
|
});
|
||||||
|
|
||||||
app.listen(PORT, '0.0.0.0', () => {
|
app.listen(PORT, '0.0.0.0', () => {
|
||||||
console.log(`Server running on port ${PORT}`);
|
console.log(`HireFlow server running on port ${PORT}`);
|
||||||
});
|
});
|
||||||
|
|
||||||
// Export for testing
|
|
||||||
module.exports = { app, pool, redisClient };
|
module.exports = { app, pool, redisClient };
|
||||||
|
|||||||
Reference in New Issue
Block a user