\n \n \n \n \n \n \n\n",[],[140,159],"ecef1eca-316c-11f0-95c3-569c3dd06744","ecef1f9c-316c-11f0-95c3-569c3dd06744",16,["D",1747300434974],"# Frontend\n\nThis directory contains the client-side code for the AI-based resume screening system.\n\n## Files\n\n- `index.html` - Main HTML template\n- `index.tsx` - Frontend entry point\n- `components/` - React components\n - `App.tsx` - Main application component\n - `ResumeUpload.tsx` - Resume upload component\n - `JobForm.tsx` - Job requirements input form\n - `Results.tsx` - Results display component\n\n## Technologies\n\n- React 18.2.0\n- TailwindCSS (via CDN)\n- TypeScript\n\n## Features\n\n- Resume text upload and parsing\n- Job requirement definition\n- Candidate scoring and ranking\n- Detailed result analysis\n- AI-generated feedback",[],[140,86],"7c06d87e-316c-11f0-ad29-569c3dd06744","components","818903f2-7464-478c-a10a-fc88f8e342c2",10,["D",1747300245545],[179,180,181,182],[140,173],{"_38":207,"_13":208,"_41":209,"_43":174,"_45":46,"_47":175,"_49":50,"_51":210,"_17":53,"_54":55,"_56":211,"_58":59,"_60":-5,"_104":212,"_18":213},{"_38":199,"_13":200,"_41":201,"_43":174,"_45":46,"_47":202,"_49":50,"_51":203,"_17":53,"_54":55,"_56":204,"_58":59,"_60":-5,"_104":205,"_18":206},{"_38":191,"_13":192,"_41":193,"_43":174,"_45":46,"_47":194,"_49":50,"_51":195,"_17":53,"_54":55,"_56":196,"_58":59,"_60":-5,"_104":197,"_18":198},{"_38":183,"_13":184,"_41":185,"_43":174,"_45":46,"_47":186,"_49":50,"_51":187,"_17":53,"_54":55,"_56":188,"_58":59,"_60":-5,"_104":189,"_18":190},"98c2ff4c-316c-11f0-aa4d-569c3dd06744","ResumeUpload.tsx","98c2ffec-316c-11f0-aa4d-569c3dd06744",11,["D",1747300293755],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"react\";\nimport type { Resume } from \"../../shared/types\";\n\ninterface ResumeUploadProps {\n onUpload: (resumeText: string) => Promise;\n resumes: Resume[];\n}\n\nconst ResumeUpload: React.FC = ({ onUpload, resumes }) => {\n const [resumeText, setResumeText] = useState(\"\");\n const [showExisting, setShowExisting] = useState(false);\n const [selectedResume, setSelectedResume] = useState(null);\n\n const handleSubmit = (e: React.FormEvent) => {\n e.preventDefault();\n if (resumeText.trim()) {\n onUpload(resumeText);\n }\n };\n\n const handleViewResume = (resume: Resume) => {\n setSelectedResume(resume);\n };\n\n const handleCloseModal = () => {\n setSelectedResume(null);\n };\n\n return (\n

Upload Resume

\n \n \n \n {resumes.length > 0 && (\n

Existing Resumes

\n setShowExisting(!showExisting)}\n className=\"text-blue-600 hover:text-blue-800\"\n >\n {showExisting ? \"Hide\" : \"Show\"} ({resumes.length})\n \n

\n \n {showExisting && (\n

\n \n \n \n \n \n \n \n \n \n \n \n {resumes.map((resume) => (\n \n \n \n \n \n \n \n ))}\n \n

\n Name\n	\n Email\n	\n Score\n	\n Date\n	\n Actions\n
\n \n {resume.candidateName}\n \n	\n {resume.email} \n	\n {resume.score ? (\n = 70 \n ? \"bg-green-100 text-green-800\" \n : resume.score >= 50 \n ? \"bg-yellow-100 text-yellow-800\" \n : \"bg-red-100 text-red-800\"\n }`}>\n {resume.score.toFixed(1)}\n \n ) : (\n Not scored\n )}\n	\n \n {new Date(resume.createdAt).toLocaleDateString()}\n \n	\n handleViewResume(resume)}\n className=\"text-blue-600 hover:text-blue-900\"\n >\n View\n \n

\n )}\n

\n )}\n \n {/* Resume View Modal */}\n {selectedResume && (\n

\n {selectedResume.candidateName}\n

\n \n ✕\n \n

\n \n

\n Email: {selectedResume.email}\n

\n {selectedResume.phone && (\n

\n Phone: {selectedResume.phone}\n

\n )}\n

\n \n {selectedResume.parsedData && (\n

Skills

\n {selectedResume.parsedData.skills.map((skill, index) => (\n \n {skill}\n \n ))}\n

\n \n {selectedResume.parsedData.summary && (\n

Summary

{selectedResume.parsedData.summary}

\n )}\n \n {selectedResume.parsedData.experience.length > 0 && (\n

Experience

\n {selectedResume.parsedData.experience.map((exp, index) => (\n

{exp.title}

\n \n {exp.startDate} - {exp.endDate || \"Present\"}\n \n

{exp.company}

{exp.description}

\n ))}\n

\n )}\n \n {selectedResume.parsedData.education.length > 0 && (\n

Education

\n {selectedResume.parsedData.education.map((edu, index) => (\n

{edu.institution}

\n {edu.graduationDate && (\n \n {edu.graduationDate}\n \n )}\n

\n {edu.degree}{edu.field ? ` in ${edu.field}` : \"\"}\n

\n ))}\n

\n )}\n

\n )}\n \n

Raw Resume Text

\n                {selectedResume.resumeText}\n

\n \n

\n \n Close\n \n

\n )}\n \n {/* Sample Resume */}\n

Sample Resume

\n You can use this sample resume to test the system:\n

\n setResumeText(sampleResume)}\n className=\"text-blue-600 hover:text-blue-800 mb-2\"\n >\n Load Sample Resume\n \n

{sampleResume.substring(0, 300)}...

\n );\n};\n\n// Sample resume for testing\nconst sampleResume = `JOHN SMITH\nSoftware Engineer\njohn.smith@example.com | (555) 123-4567 | linkedin.com/in/johnsmith\n\nSUMMARY\nExperienced software engineer with 5+ years of experience in full-stack development, specializing in React, Node.js, and cloud technologies. Passionate about building scalable applications and implementing machine learning solutions.\n\nSKILLS\nProgramming Languages: JavaScript, TypeScript, Python, Java\nFrontend: React, Redux, HTML5, CSS3, Tailwind CSS\nBackend: Node.js, Express, Django, Spring Boot\nDatabases: MongoDB, PostgreSQL, MySQL\nCloud & DevOps: AWS, Docker, Kubernetes, CI/CD\nMachine Learning: TensorFlow, scikit-learn, NLP\nTools: Git, JIRA, Figma\n\nEXPERIENCE\nSenior Software Engineer\nTechCorp Inc. | Jan 2021 - Present\n- Led the development of a customer-facing dashboard using React and TypeScript, improving user engagement by 35%\n- Implemented CI/CD pipelines using GitHub Actions, reducing deployment time by 60%\n- Designed and built RESTful APIs using Node.js and Express, handling 1M+ daily requests\n- Mentored junior developers and conducted code reviews to ensure code quality\n\nSoftware Engineer\nDataSystems LLC | Mar 2018 - Dec 2020\n- Developed microservices architecture using Node.js and Docker, improving system scalability\n- Created data visualization components with D3.js for real-time analytics dashboard\n- Implemented authentication system using JWT and OAuth2.0\n- Optimized database queries, reducing response time by 40%\n\nJunior Developer\nWebSolutions Co. | Jun 2016 - Feb 2018\n- Built responsive web applications using React and Redux\n- Collaborated with UX designers to implement user interface components\n- Participated in agile development process with bi-weekly sprints\n- Fixed bugs and implemented new features for existing applications\n\nEDUCATION\nMaster of Science in Computer Science\nStanford University | 2016\n- Specialization in Artificial Intelligence\n- GPA: 3.8/4.0\n\nBachelor of Science in Computer Engineering\nUniversity of California, Berkeley | 2014\n- Minor in Mathematics\n- Dean's List: 2012-2014\n\nPROJECTS\nAI-Powered Task Manager\n- Developed a task management application with natural language processing capabilities\n- Used React for frontend, Node.js for backend, and MongoDB for database\n- Implemented ML algorithms to categorize and prioritize tasks automatically\n\nE-commerce Platform\n- Built a full-stack e-commerce platform with product recommendation system\n- Utilized React, Express, and PostgreSQL with Sequelize ORM\n- Implemented payment processing with Stripe API\n\nCERTIFICATIONS\n- AWS Certified Solutions Architect\n- MongoDB Certified Developer\n- Google Cloud Professional Data Engineer`;\n\nexport default ResumeUpload;",[],[140,173,184],"dda588aa-316c-11f0-93c3-569c3dd06744","Results.tsx","dda5894a-316c-11f0-93c3-569c3dd06744",13,["D",1747300409322],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"react\";\nimport type { Resume, JobRequirement, ScoringResult } from \"../../shared/types\";\n\ninterface ResultsProps {\n results: (ScoringResult & { feedback?: string })[];\n resumes: Resume[];\n selectedJob: JobRequirement | null;\n onGetFeedback: (resumeId: number, jobId: number) => Promise;\n}\n\nconst Results: React.FC = ({ \n results, \n resumes, \n selectedJob,\n onGetFeedback\n}) => {\n const [selectedResult, setSelectedResult] = useState<(ScoringResult & { feedback?: string }) | null>(null);\n const [isLoading, setIsLoading] = useState(false);\n\n const handleViewResult = (result: ScoringResult & { feedback?: string }) => {\n setSelectedResult(result);\n };\n\n const handleCloseModal = () => {\n setSelectedResult(null);\n };\n\n const handleGetFeedback = async (resumeId: number) => {\n if (!selectedJob?.id) return;\n \n setIsLoading(true);\n await onGetFeedback(resumeId, selectedJob.id);\n setIsLoading(false);\n \n // Update the selected result with the new feedback\n const updatedResult = results.find(r => r.resumeId === resumeId);\n if (updatedResult) {\n setSelectedResult(updatedResult);\n }\n };\n\n // Get the resume object for a given result\n const getResumeForResult = (result: ScoringResult): Resume | undefined => {\n return resumes.find(r => r.id === result.resumeId);\n };\n\n return (\n

Screening Results

\n \n {selectedJob && (\n

Selected Job: {selectedJob.title}

\n Required Skills:\n {selectedJob.requiredSkills.map((skill, index) => (\n \n {skill}\n \n ))}\n

\n {selectedJob.preferredSkills.length > 0 && (\n

\n Preferred Skills:\n {selectedJob.preferredSkills.map((skill, index) => (\n \n {skill}\n \n ))}\n

\n )}\n

\n )}\n \n {results.length > 0 ? (\n

\n \n \n \n \n \n \n \n \n \n \n \n {results.map((result, index) => (\n \n \n \n \n \n \n \n ))}\n \n

\n Rank\n	\n Candidate\n	\n Score\n	\n Skill Match\n	\n Actions\n
\n \n #{index + 1}\n \n	\n \n {result.candidateName}\n \n	\n = 70 \n ? \"bg-green-100 text-green-800\" \n : result.score >= 50 \n ? \"bg-yellow-100 text-yellow-800\" \n : \"bg-red-100 text-red-800\"\n }`}>\n {result.score.toFixed(1)}\n \n	\n \n {result.skillMatches.matched.length} matched / {\n result.skillMatches.matched.length + result.skillMatches.missing.length\n } required\n \n	\n handleViewResult(result)}\n className=\"text-blue-600 hover:text-blue-900\"\n >\n View Details\n \n

\n ) : (\n

\n {selectedJob \n ? \"No results yet. Score resumes against the selected job to see results here.\"\n : \"No job selected. Please select or create a job first.\"}\n

\n )}\n \n {/* Result Details Modal */}\n {selectedResult && (\n

\n {selectedResult.candidateName}\n

\n \n ✕\n \n

\n \n

\n {selectedResult.score.toFixed(1)}\n

= 70 \n ? \"bg-green-500\" \n : selectedResult.score >= 50 \n ? \"bg-yellow-500\" \n : \"bg-red-500\"\n }`}\n style={{ width: `${selectedResult.score}%` }}\n >

\n \n

Skills Match

\n {Math.round(selectedResult.skillMatches.matched.length / \n (selectedResult.skillMatches.matched.length + \n selectedResult.skillMatches.missing.length) * 100)}%\n

Experience Relevance

\n {Math.round(selectedResult.experienceRelevance * 100)}%\n

Education Relevance

\n {Math.round(selectedResult.educationRelevance * 100)}%\n

\n \n

Skills Analysis

\n \n

Matched Skills

\n {selectedResult.skillMatches.matched.length > 0 ? (\n selectedResult.skillMatches.matched.map((skill, index) => (\n \n {skill}\n \n ))\n ) : (\n No matched skills\n )}\n

\n \n

Missing Required Skills

\n {selectedResult.skillMatches.missing.length > 0 ? (\n selectedResult.skillMatches.missing.map((skill, index) => (\n \n {skill}\n \n ))\n ) : (\n No missing skills\n )}\n

\n \n {selectedResult.highlights && selectedResult.highlights.length > 0 && (\n

Key Highlights

{highlight}

\n )}\n \n {/* AI Feedback Section */}\n

AI Feedback

\n {!selectedResult.feedback && selectedJob && (\n handleGetFeedback(selectedResult.resumeId)}\n className=\"text-blue-600 hover:text-blue-800 text-sm flex items-center\"\n disabled={isLoading}\n >\n {isLoading ? (\n <>\n \n Generating...\n \n ) : (\n \"Generate Feedback\"\n )}\n \n )}\n

\n \n {selectedResult.feedback ? (\n

{selectedResult.feedback}

\n ) : (\n

\n {isLoading \n ? \"Generating personalized feedback...\" \n : \"Click 'Generate Feedback' to get AI-powered insights for this candidate.\"}\n

\n )}\n

\n \n {/* Resume Details */}\n {getResumeForResult(selectedResult)?.parsedData && (\n

Resume Details

\n \n

\n {getResumeForResult(selectedResult)?.parsedData?.summary && (\n

Summary

\n {getResumeForResult(selectedResult)?.parsedData?.summary}\n

\n )}\n \n

Skills

\n {getResumeForResult(selectedResult)?.parsedData?.skills.map((skill, index) => (\n s.toLowerCase() === skill.toLowerCase() ||\n skill.toLowerCase().includes(s.toLowerCase()) ||\n s.toLowerCase().includes(skill.toLowerCase())\n )\n ? \"skill-matched\"\n : \"bg-gray-100 text-gray-800\"\n }`}\n >\n {skill}\n \n ))}\n

\n \n {getResumeForResult(selectedResult)?.parsedData?.experience.length > 0 && (\n

Experience

\n {getResumeForResult(selectedResult)?.parsedData?.experience.slice(0, 2).map((exp, index) => (\n

\n {exp.title}\n \n {exp.startDate} - {exp.endDate || \"Present\"}\n \n

{exp.company}

\n ))}\n {(getResumeForResult(selectedResult)?.parsedData?.experience.length || 0) > 2 && (\n

\n +{(getResumeForResult(selectedResult)?.parsedData?.experience.length || 0) - 2} more experiences\n

\n )}\n

\n )}\n \n {getResumeForResult(selectedResult)?.parsedData?.education.length > 0 && (\n

Education

\n {getResumeForResult(selectedResult)?.parsedData?.education.map((edu, index) => (\n

\n {edu.degree}\n {edu.field && in {edu.field}}\n from {edu.institution}\n

\n ))}\n

\n )}\n

\n )}\n \n

\n \n Close\n \n

\n )}\n

\n );\n};\n\nexport default Results;",[],[140,173,192],"b91ada80-316c-11f0-a16f-569c3dd06744","JobForm.tsx","b91adb20-316c-11f0-a16f-569c3dd06744",12,["D",1747300348014],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"react\";\nimport type { JobRequirement } from \"../../shared/types\";\n\ninterface JobFormProps {\n onSubmit: (job: Omit) => Promise;\n jobs: JobRequirement[];\n onScoreResumes: (jobId: number) => Promise;\n}\n\nconst JobForm: React.FC = ({ onSubmit, jobs, onScoreResumes }) => {\n const [title, setTitle] = useState(\"\");\n const [description, setDescription] = useState(\"\");\n const [requiredSkills, setRequiredSkills] = useState(\"\");\n const [preferredSkills, setPreferredSkills] = useState(\"\");\n const [minimumExperience, setMinimumExperience] = useState(\"\");\n const [showExisting, setShowExisting] = useState(false);\n const [selectedJob, setSelectedJob] = useState(null);\n\n const handleSubmit = (e: React.FormEvent) => {\n e.preventDefault();\n \n // Convert skills strings to arrays\n const requiredSkillsArray = requiredSkills\n .split(\",\")\n .map(skill => skill.trim())\n .filter(skill => skill.length > 0);\n \n const preferredSkillsArray = preferredSkills\n .split(\",\")\n .map(skill => skill.trim())\n .filter(skill => skill.length > 0);\n \n // Convert minimum experience to number\n const minExp = minimumExperience ? parseInt(minimumExperience, 10) : undefined;\n \n onSubmit({\n title,\n description,\n requiredSkills: requiredSkillsArray,\n preferredSkills: preferredSkillsArray,\n minimumExperience: minExp\n });\n };\n\n const handleViewJob = (job: JobRequirement) => {\n setSelectedJob(job);\n };\n\n const handleCloseModal = () => {\n setSelectedJob(null);\n };\n\n const handleUseJob = (job: JobRequirement) => {\n setTitle(job.title);\n setDescription(job.description);\n setRequiredSkills(job.requiredSkills.join(\", \"));\n setPreferredSkills(job.preferredSkills.join(\", \"));\n setMinimumExperience(job.minimumExperience?.toString() || \"\");\n setSelectedJob(null);\n setShowExisting(false);\n };\n\n const handleScoreWithJob = (jobId: number) => {\n onScoreResumes(jobId);\n };\n\n return (\n

Job Requirements

\n \n

\n \n Job Title\n \n setTitle(e.target.value)}\n placeholder=\"e.g., Senior Software Engineer\"\n required\n />\n

\n \n

\n \n Job Description\n \n setDescription(e.target.value)}\n placeholder=\"Describe the job responsibilities and requirements...\"\n required\n />\n

\n \n

\n \n Required Skills (comma-separated)\n \n setRequiredSkills(e.target.value)}\n placeholder=\"e.g., JavaScript, React, Node.js\"\n required\n />\n

\n \n

\n \n Preferred Skills (comma-separated)\n \n setPreferredSkills(e.target.value)}\n placeholder=\"e.g., TypeScript, AWS, Docker\"\n />\n

\n \n

\n \n Minimum Experience (years)\n \n setMinimumExperience(e.target.value)}\n placeholder=\"e.g., 3\"\n min=\"0\"\n />\n

\n \n

\n \n Save Job Requirements\n \n

\n \n {jobs.length > 0 && (\n

Existing Job Requirements

\n setShowExisting(!showExisting)}\n className=\"text-blue-600 hover:text-blue-800\"\n >\n {showExisting ? \"Hide\" : \"Show\"} ({jobs.length})\n \n

\n \n {showExisting && (\n

\n \n \n \n \n \n \n \n \n \n \n \n {jobs.map((job) => (\n \n \n \n \n \n \n \n ))}\n \n

\n Title\n	\n Required Skills\n	\n Min. Experience\n	\n Date\n	\n Actions\n
\n \n {job.title}\n \n	\n \n {job.requiredSkills.slice(0, 3).map((skill, index) => (\n \n {skill}\n \n ))}\n {job.requiredSkills.length > 3 && (\n \n +{job.requiredSkills.length - 3} more\n \n )}\n \n	\n \n {job.minimumExperience ? `${job.minimumExperience} years` : \"Not specified\"}\n \n	\n \n {new Date(job.createdAt).toLocaleDateString()}\n \n	\n handleViewJob(job)}\n className=\"text-blue-600 hover:text-blue-900 mr-3\"\n >\n View\n \n handleScoreWithJob(job.id!)}\n className=\"text-green-600 hover:text-green-900\"\n >\n Score Resumes\n \n

\n )}\n

\n )}\n \n {/* Job View Modal */}\n {selectedJob && (\n

\n {selectedJob.title}\n

\n \n ✕\n \n

\n \n

Description

{selectedJob.description}

\n \n

Required Skills

\n {selectedJob.requiredSkills.map((skill, index) => (\n \n {skill}\n \n ))}\n

\n \n {selectedJob.preferredSkills.length > 0 && (\n

Preferred Skills

\n {selectedJob.preferredSkills.map((skill, index) => (\n \n {skill}\n \n ))}\n

\n )}\n \n

Minimum Experience

\n {selectedJob.minimumExperience \n ? `${selectedJob.minimumExperience} years` \n : \"Not specified\"}\n

\n \n

\n handleUseJob(selectedJob)}\n className=\"bg-blue-600 text-white px-4 py-2 rounded-md hover:bg-blue-700\"\n >\n Use This Job\n \n handleScoreWithJob(selectedJob.id!)}\n className=\"bg-green-600 text-white px-4 py-2 rounded-md hover:bg-green-700\"\n >\n Score Resumes\n \n \n Close\n \n

\n )}\n \n {/* Sample Job */}\n

Sample Job Requirements

\n You can use these sample job requirements to test the system:\n

\n {\n setTitle(sampleJobs[0].title);\n setDescription(sampleJobs[0].description);\n setRequiredSkills(sampleJobs[0].requiredSkills.join(\", \"));\n setPreferredSkills(sampleJobs[0].preferredSkills.join(\", \"));\n setMinimumExperience(sampleJobs[0].minimumExperience?.toString() || \"\");\n }}\n className=\"text-blue-600 hover:text-blue-800 mb-2\"\n >\n Load Software Engineer Job\n \n {\n setTitle(sampleJobs[1].title);\n setDescription(sampleJobs[1].description);\n setRequiredSkills(sampleJobs[1].requiredSkills.join(\", \"));\n setPreferredSkills(sampleJobs[1].preferredSkills.join(\", \"));\n setMinimumExperience(sampleJobs[1].minimumExperience?.toString() || \"\");\n }}\n className=\"text-blue-600 hover:text-blue-800 mb-2\"\n >\n Load Data Scientist Job\n \n

\n );\n};\n\n// Sample job requirements for testing\nconst sampleJobs = [\n {\n title: \"Senior Software Engineer\",\n description: `We are looking for a Senior Software Engineer to join our team and help build scalable web applications. The ideal candidate has strong experience with modern JavaScript frameworks and cloud technologies.\n\nResponsibilities:\n- Design and implement new features for our web applications\n- Write clean, maintainable, and efficient code\n- Collaborate with cross-functional teams to define and implement new features\n- Troubleshoot and fix bugs in existing applications\n- Mentor junior developers and conduct code reviews`,\n requiredSkills: [\"JavaScript\", \"React\", \"Node.js\", \"REST API\"],\n preferredSkills: [\"TypeScript\", \"AWS\", \"Docker\", \"GraphQL\", \"CI/CD\"],\n minimumExperience: 3\n },\n {\n title: \"Data Scientist\",\n description: `We are seeking a talented Data Scientist to help us extract insights from our data and build machine learning models. The ideal candidate has strong statistical knowledge and programming skills.\n\nResponsibilities:\n- Analyze large datasets to extract actionable insights\n- Develop and implement machine learning models\n- Create data visualizations to communicate findings\n- Collaborate with engineering teams to implement models in production\n- Stay up-to-date with the latest research and technologies in the field`,\n requiredSkills: [\"Python\", \"Machine Learning\", \"SQL\", \"Data Analysis\"],\n preferredSkills: [\"TensorFlow\", \"PyTorch\", \"NLP\", \"Big Data\", \"Cloud Computing\"],\n minimumExperience: 2\n }\n];\n\nexport default JobForm;",[],[140,173,200],"7c06adcc-316c-11f0-ad29-569c3dd06744","App.tsx","7c06aea8-316c-11f0-ad29-569c3dd06744",["D",1747300245545],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"react\";\nimport ResumeUpload from \"./ResumeUpload\";\nimport JobForm from \"./JobForm\";\nimport Results from \"./Results\";\nimport { type Resume, type JobRequirement, type ScoringResult } from \"../../shared/types\";\n\n// Get project info if available\ndeclare global {\n interface Window {\n __PROJECT_INFO__?: {\n username: string;\n name: string;\n url: string;\n };\n }\n}\n\nconst App: React.FC = () => {\n const [activeTab, setActiveTab] = useState<\"upload\" | \"jobs\" | \"results\">(\"upload\");\n const [resumes, setResumes] = useState([]);\n const [jobs, setJobs] = useState([]);\n const [selectedJob, setSelectedJob] = useState(null);\n const [scoringResults, setScoringResults] = useState<(ScoringResult & { feedback?: string })[]>([]);\n const [isLoading, setIsLoading] = useState(false);\n const [error, setError] = useState(null);\n\n // Fetch resumes and jobs on initial load\n React.useEffect(() => {\n fetchResumes();\n fetchJobs();\n }, []);\n\n // Fetch all resumes\n const fetchResumes = async () => {\n try {\n const response = await fetch(\"/api/resumes\");\n const data = await response.json();\n \n if (data.success) {\n setResumes(data.data);\n } else {\n setError(data.error || \"Failed to fetch resumes\");\n }\n } catch (error) {\n console.error(\"Error fetching resumes:\", error);\n setError(\"Failed to fetch resumes\");\n }\n };\n\n // Fetch all jobs\n const fetchJobs = async () => {\n try {\n const response = await fetch(\"/api/jobs\");\n const data = await response.json();\n \n if (data.success) {\n setJobs(data.data);\n } else {\n setError(data.error || \"Failed to fetch jobs\");\n }\n } catch (error) {\n console.error(\"Error fetching jobs:\", error);\n setError(\"Failed to fetch jobs\");\n }\n };\n\n // Handle resume upload\n const handleResumeUpload = async (resumeText: string) => {\n setIsLoading(true);\n setError(null);\n \n try {\n const response = await fetch(\"/api/resumes\", {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify({ resumeText }),\n });\n \n const data = await response.json();\n \n if (data.success) {\n // Refresh resumes list\n await fetchResumes();\n setActiveTab(\"results\");\n } else {\n setError(data.error || \"Failed to upload resume\");\n }\n } catch (error) {\n console.error(\"Error uploading resume:\", error);\n setError(\"Failed to upload resume\");\n } finally {\n setIsLoading(false);\n }\n };\n\n // Handle job creation\n const handleJobCreate = async (job: Omit) => {\n setIsLoading(true);\n setError(null);\n \n try {\n const response = await fetch(\"/api/jobs\", {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify(job),\n });\n \n const data = await response.json();\n \n if (data.success) {\n // Refresh jobs list\n await fetchJobs();\n setSelectedJob(data.data);\n setActiveTab(\"results\");\n } else {\n setError(data.error || \"Failed to create job\");\n }\n } catch (error) {\n console.error(\"Error creating job:\", error);\n setError(\"Failed to create job\");\n } finally {\n setIsLoading(false);\n }\n };\n\n // Handle resume scoring\n const handleScoreResumes = async (jobId: number) => {\n if (resumes.length === 0) {\n setError(\"No resumes available to score\");\n return;\n }\n \n setIsLoading(true);\n setError(null);\n \n try {\n // Get the selected job\n const job = jobs.find(j => j.id === jobId);\n if (!job) {\n setError(\"Selected job not found\");\n setIsLoading(false);\n return;\n }\n \n setSelectedJob(job);\n \n // Get resume IDs\n const resumeIds = resumes.map(r => r.id!);\n \n // Score resumes\n const response = await fetch(\"/api/score/batch\", {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify({ resumeIds, jobId }),\n });\n \n const data = await response.json();\n \n if (data.success) {\n setScoringResults(data.data);\n setActiveTab(\"results\");\n } else {\n setError(data.error || \"Failed to score resumes\");\n }\n } catch (error) {\n console.error(\"Error scoring resumes:\", error);\n setError(\"Failed to score resumes\");\n } finally {\n setIsLoading(false);\n }\n };\n\n // Handle individual resume scoring and feedback\n const handleGetFeedback = async (resumeId: number, jobId: number) => {\n setIsLoading(true);\n setError(null);\n \n try {\n const response = await fetch(\"/api/score\", {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify({ resumeId, jobId }),\n });\n \n const data = await response.json();\n \n if (data.success) {\n // Update the scoring results with feedback\n setScoringResults(prevResults => {\n const updatedResults = [...prevResults];\n const index = updatedResults.findIndex(r => r.resumeId === resumeId);\n \n if (index !== -1) {\n updatedResults[index] = {\n ...updatedResults[index],\n feedback: data.data.feedback\n };\n } else {\n updatedResults.push(data.data);\n }\n \n return updatedResults;\n });\n } else {\n setError(data.error || \"Failed to get feedback\");\n }\n } catch (error) {\n console.error(\"Error getting feedback:\", error);\n setError(\"Failed to get feedback\");\n } finally {\n setIsLoading(false);\n }\n };\n\n return (\n

\n {/* Header */}\n

AI Resume Screening System

\n Upload resumes, define job requirements, and let AI match the best candidates\n

\n \n {/* View Source Link */}\n {window.__PROJECT_INFO__ && (\n \n View Source on Val Town\n \n )}\n

\n \n {/* Navigation Tabs */}\n

\n setActiveTab(\"upload\")}\n >\n Upload Resume\n \n setActiveTab(\"jobs\")}\n >\n Job Requirements\n \n setActiveTab(\"results\")}\n >\n Results\n \n

\n \n {/* Error Message */}\n {error && (\n

{error}

\n )}\n \n {/* Loading Indicator */}\n {isLoading && (\n

\n \n

Processing...

\n )}\n \n {/* Content */}\n

\n {activeTab === \"upload\" && (\n \n )}\n \n {activeTab === \"jobs\" && (\n \n )}\n \n {activeTab === \"results\" && (\n \n )}\n

\n );\n};\n\nexport default App;",[],[140,173,208],["D",1747300109087],[217,218,219,220,221],[19],{"_38":85,"_13":86,"_41":87,"_43":44,"_45":46,"_47":88,"_49":50,"_51":234,"_17":53,"_54":24,"_56":90,"_58":59,"_60":-5,"_104":235,"_18":236},{"_38":78,"_13":79,"_41":80,"_43":44,"_45":46,"_47":81,"_49":50,"_51":231,"_17":53,"_54":55,"_56":83,"_58":59,"_60":-5,"_104":232,"_18":233},{"_38":69,"_13":70,"_41":71,"_43":44,"_45":46,"_47":72,"_49":50,"_51":228,"_17":74,"_54":75,"_56":76,"_58":59,"_60":-5,"_104":229,"_18":230},{"_38":62,"_13":63,"_41":64,"_43":44,"_45":46,"_47":65,"_49":50,"_51":225,"_17":53,"_54":55,"_56":67,"_58":59,"_60":-5,"_104":226,"_18":227},{"_38":39,"_13":40,"_41":42,"_43":44,"_45":46,"_47":48,"_49":50,"_51":222,"_17":53,"_54":55,"_56":57,"_58":59,"_60":-5,"_104":223,"_18":224},["D",1747300154122],[],[19,40],["D",1747300125822],[],[19,63],["D",1747300414487],[],[19,70],["D",1747300109087],[],[19,79],["D",1747300428146],[],[19,86],"feeb4794-316b-11f0-bbde-569c3dd06744",["D",1747300035655],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","imageUrl","userId","7cf973e0-f526-11ef-a409-85fb41e7ab54","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","orgId","d88a0c8d-5a02-479a-8fe1-02a12d784bd7","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_289":285},"org",{"_11":12,"_283":-5,"_284":285,"_246":247,"_286":287,"_288":59},"branch",{"_17":134,"_13":16,"_38":46,"_275":237,"_276":-5,"_277":-5,"_278":-5,"_279":-5,"_280":-5,"_281":14,"_282":12},"isOwned","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoiZGVmYXVsdCIsImlpZCI6Imluc18yTm10cGhQUklwU0tqZHNiOHNnNGd2ZjJURFUiLCJyaWQiOiJ1c2VyXzJ0ZERXOGZzV0tuS0RBWklTTHg4eFBSNG4ydCJ9","tier","free","canRestrictVals","profileImageUrl","adoptOrgId",{"_38":237,"_13":14,"_51":389,"_239":-5,"_240":59,"_241":242,"_243":242,"_244":-5,"_245":-5,"_246":247,"_248":71,"_249":50,"_250":50,"_251":-5,"_252":53,"_253":254,"_255":-5,"_256":-5,"_257":-5,"_258":-5,"_259":260,"_261":260,"_262":263,"_264":263,"_265":263,"_266":260,"_267":260,"_268":390,"_270":391,"_272":392,"_274":59},[329,335,344,348],"files",[329,330,331,332,333,334,335,336,337,338,339,340,341,342,343,344,345,346,347,348],"counts",{"_320":53,"_321":74,"_322":53,"_32":323,"_324":325},[310,311,312,313,314],{"_38":92,"_13":19,"_41":44,"_43":-5,"_45":46,"_47":81,"_49":50,"_51":93,"_17":53,"_54":94,"_56":-5,"_58":59,"_60":-5,"_18":309},"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},[19],{"_38":85,"_13":86,"_41":87,"_43":44,"_45":46,"_47":88,"_49":50,"_51":89,"_17":53,"_54":24,"_56":90,"_58":59,"_60":-5,"_18":319},{"_38":78,"_13":79,"_41":80,"_43":44,"_45":46,"_47":81,"_49":50,"_51":82,"_17":53,"_54":55,"_56":83,"_58":59,"_60":-5,"_18":318},{"_38":69,"_13":70,"_41":71,"_43":44,"_45":46,"_47":72,"_49":50,"_51":73,"_17":74,"_54":75,"_56":76,"_58":59,"_60":-5,"_18":317},{"_38":62,"_13":63,"_41":64,"_43":44,"_45":46,"_47":65,"_49":50,"_51":66,"_17":53,"_54":55,"_56":67,"_58":59,"_60":-5,"_18":316},{"_38":39,"_13":40,"_41":42,"_43":44,"_45":46,"_47":48,"_49":50,"_51":52,"_17":53,"_54":55,"_56":57,"_58":59,"_60":-5,"_18":315},[19,40],[19,63],[19,70],[19,79],[19,86],"pulls","branches","forks",{"_326":53,"_328":53},"connections",{"_326":53,"_327":53},"count","unfilledCount","emptyCount",{"_38":92,"_13":19,"_41":44,"_43":-5,"_45":46,"_47":81,"_49":50,"_51":214,"_17":53,"_54":94,"_56":-5,"_58":59,"_60":-5,"_104":387,"_18":388},{"_38":85,"_13":86,"_41":87,"_43":44,"_45":46,"_47":88,"_49":50,"_51":234,"_17":53,"_54":24,"_56":90,"_58":59,"_60":-5,"_104":385,"_18":386},{"_38":78,"_13":79,"_41":80,"_43":44,"_45":46,"_47":81,"_49":50,"_51":231,"_17":53,"_54":55,"_56":83,"_58":59,"_60":-5,"_104":383,"_18":384},{"_38":69,"_13":70,"_41":71,"_43":44,"_45":46,"_47":72,"_49":50,"_51":228,"_17":74,"_54":75,"_56":76,"_58":59,"_60":-5,"_104":381,"_18":382},{"_38":62,"_13":63,"_41":64,"_43":44,"_45":46,"_47":65,"_49":50,"_51":225,"_17":53,"_54":55,"_56":67,"_58":59,"_60":-5,"_104":379,"_18":380},{"_38":39,"_13":40,"_41":42,"_43":44,"_45":46,"_47":48,"_49":50,"_51":222,"_17":53,"_54":55,"_56":57,"_58":59,"_60":-5,"_104":377,"_18":378},{"_38":139,"_13":140,"_41":141,"_43":-5,"_45":46,"_47":142,"_49":50,"_51":143,"_17":53,"_54":94,"_56":-5,"_58":59,"_60":-5,"_104":375,"_18":376},{"_38":172,"_13":173,"_41":174,"_43":141,"_45":46,"_47":175,"_49":50,"_51":176,"_17":53,"_54":94,"_56":-5,"_58":59,"_60":-5,"_104":373,"_18":374},{"_38":207,"_13":208,"_41":209,"_43":174,"_45":46,"_47":175,"_49":50,"_51":210,"_17":53,"_54":55,"_56":211,"_58":59,"_60":-5,"_104":371,"_18":372},{"_38":199,"_13":200,"_41":201,"_43":174,"_45":46,"_47":202,"_49":50,"_51":203,"_17":53,"_54":55,"_56":204,"_58":59,"_60":-5,"_104":369,"_18":370},{"_38":191,"_13":192,"_41":193,"_43":174,"_45":46,"_47":194,"_49":50,"_51":195,"_17":53,"_54":55,"_56":196,"_58":59,"_60":-5,"_104":367,"_18":368},{"_38":183,"_13":184,"_41":185,"_43":174,"_45":46,"_47":186,"_49":50,"_51":187,"_17":53,"_54":55,"_56":188,"_58":59,"_60":-5,"_104":365,"_18":366},{"_38":165,"_13":86,"_41":166,"_43":141,"_45":46,"_47":167,"_49":50,"_51":168,"_17":53,"_54":24,"_56":169,"_58":59,"_60":-5,"_104":363,"_18":364},{"_38":158,"_13":159,"_41":160,"_43":141,"_45":46,"_47":142,"_49":50,"_51":161,"_17":53,"_54":24,"_56":162,"_58":59,"_60":-5,"_104":361,"_18":362},{"_38":150,"_13":151,"_41":152,"_43":141,"_45":46,"_47":153,"_49":50,"_51":154,"_17":53,"_54":55,"_56":155,"_58":59,"_60":-5,"_104":359,"_18":360},{"_38":107,"_13":108,"_41":109,"_43":-5,"_45":46,"_47":110,"_49":50,"_51":111,"_17":53,"_54":94,"_56":-5,"_58":59,"_60":-5,"_104":357,"_18":358},{"_38":132,"_13":86,"_41":133,"_43":109,"_45":46,"_47":134,"_49":50,"_51":135,"_17":53,"_54":24,"_56":136,"_58":59,"_60":-5,"_104":355,"_18":356},{"_38":125,"_13":126,"_41":127,"_43":109,"_45":46,"_47":110,"_49":50,"_51":128,"_17":53,"_54":55,"_56":129,"_58":59,"_60":-5,"_104":353,"_18":354},{"_38":117,"_13":118,"_41":119,"_43":109,"_45":46,"_47":120,"_49":50,"_51":121,"_17":53,"_54":55,"_56":122,"_58":59,"_60":-5,"_104":351,"_18":352},{"_38":100,"_13":86,"_41":101,"_43":-5,"_45":46,"_47":74,"_49":50,"_51":102,"_17":53,"_54":24,"_56":103,"_58":59,"_60":-5,"_104":349,"_18":350},[],[86],[],[108,118],[],[108,126],[],[108,86],[345,346,347],[108],[],[140,151],[],[140,159],[],[140,86],[],[140,173,184],[],[140,173,192],[],[140,173,200],[],[140,173,208],[337,338,339,340],[140,173],[336,341,342,343],[140],[],[19,40],[],[19,63],[],[19,70],[],[19,79],[],[19,86],[330,331,332,333,334],[19],["D",1747300035655],{"_11":12,"_289":285},{"_11":12,"_283":-5,"_284":285,"_246":247,"_286":287,"_288":59},{"_17":134,"_13":16,"_38":46,"_275":237,"_276":-5,"_277":-5,"_278":-5,"_279":-5,"_280":-5,"_281":14,"_282":12},"ctx",{"_268":-5,"_306":426,"_427":428,"_429":430,"_431":59,"_432":59,"_433":59,"_434":50,"_435":-5,"_436":-7,"_437":-7,"_438":53,"_439":59,"_440":59,"_441":-5,"_442":59,"_443":59,"_444":59,"_445":-5},"ENV",{"_397":398,"_399":400,"_401":16,"_402":403,"_404":405,"_406":407,"_408":409,"_410":411,"_412":413,"_414":415,"_416":417,"_418":419,"_420":421,"_422":423,"_424":425},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","a3e067d4463eea85f6334f8e583e8516ae58c4f6","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]