/ INTEGRATION.md
INTEGRATION.md
  1  # Sprint 7 — Batch 1 Integration Guide
  2  
  3  ## Files Delivered
  4  
  5  ```
  6  lib/prompts/ats-scoring.ts      → NEW file
  7  lib/ats-format-check.ts         → NEW file
  8  lib/knowledge/company-ats.ts    → NEW file
  9  app/api/ats-score/route.ts      → NEW file
 10  components/results/ATSScorePanel.tsx → NEW file
 11  ```
 12  
 13  ## Integration Steps
 14  
 15  ### 1. Merge types into `lib/types.ts`
 16  
 17  Add all interfaces from `types-ats-additions.ts` to the end of your existing `lib/types.ts`.
 18  
 19  Then add the `atsScore` field to your existing `AnalysisResult` interface:
 20  
 21  ```typescript
 22  interface AnalysisResult {
 23    // ... existing fields ...
 24    jobMatch?: JobMatch;
 25    atsScore?: ATSScoreResult;  // ← ADD THIS
 26  }
 27  ```
 28  
 29  ### 2. Add ATS tab to ChapterNav
 30  
 31  In `components/results/ChapterNav.tsx`, add the new tab constant and entry. Based on the existing pattern (conditional tabs like jobMatch/cvSuggestions):
 32  
 33  ```typescript
 34  // Add to the tabs array (after 'cv-suggestions' or wherever appropriate)
 35  // This tab only shows when atsScore exists AND a job posting was provided
 36  
 37  // In your tab definitions:
 38  { id: 'ats-score', icon: Shield, labelKey: 'ats.tab' }
 39  
 40  // Import Shield from lucide-react
 41  ```
 42  
 43  **Conditional rendering** — same pattern as jobMatch:
 44  ```typescript
 45  // Only include the ats-score tab when data exists
 46  if (analysisResult.atsScore) {
 47    tabs.push({ id: 'ats-score', icon: Shield, labelKey: 'ats.tab' });
 48  }
 49  ```
 50  
 51  ### 3. Add ATS panel rendering in analyze/page.tsx
 52  
 53  In the section where you render panels based on the active tab:
 54  
 55  ```tsx
 56  import { ATSScorePanel } from '@/components/results/ATSScorePanel';
 57  
 58  // In the render switch/conditional:
 59  {activeTab === 'ats-score' && analysisResult.atsScore && (
 60    <ATSScorePanel atsScore={analysisResult.atsScore} />
 61  )}
 62  ```
 63  
 64  ### 4. Add SectionIntro message for ATS tab
 65  
 66  In `components/results/SectionIntro.tsx`, add the 'atsScore' section:
 67  
 68  ```typescript
 69  // In your section config/messages map:
 70  atsScore: {
 71    key: 'ats.sectionIntro'
 72  }
 73  ```
 74  
 75  ### 5. Trigger ATS scoring during analysis
 76  
 77  **Option A: Call ATS scoring as part of streaming analysis** (recommended)
 78  
 79  In `app/api/analyze-stream/route.ts`, after the existing Claude calls (skill extraction, gap analysis, career plan), add a 4th step if a job posting was provided:
 80  
 81  ```typescript
 82  // After existing analysis steps, if job posting exists:
 83  if (questionnaire.jobPosting) {
 84    // Send SSE progress update
 85    sendEvent({ step: 'ats', status: 'Scoring ATS compatibility...' });
 86  
 87    // Call the ATS scoring logic directly (don't HTTP call your own API)
 88    // Import and use the functions from lib/prompts/ats-scoring.ts
 89    const extractionPrompt = buildATSKeywordExtractionPrompt(questionnaire.jobPosting);
 90    const extractionResponse = await callClaude(extractionPrompt, { maxTokens: 4000, temperature: 0.1 });
 91    // ... match, compute, format check ...
 92  
 93    result.atsScore = atsResult;
 94  }
 95  ```
 96  
 97  **Option B: Separate API call from frontend** (if you prefer independence)
 98  
 99  After the main analysis completes, call `/api/ats-score` from the frontend with the CV text and job posting, then merge the result.
100  
101  ### 6. Merge translations
102  
103  For each of the 6 language files (`en.json`, `ro.json`, `de.json`, `fr.json`, `es.json`, `it.json`), add all the ATS keys from `ats-translations.ts`.
104  
105  The keys are organized by language in the translation file — just copy the key-value pairs into each respective JSON file.
106  
107  ### 7. Add streaming progress message
108  
109  In `components/analyze/StreamingProgress.tsx`, add a step for ATS scoring:
110  
111  ```typescript
112  // In your progress steps array:
113  { id: 'ats', label: 'Scoring ATS compatibility...', labelKey: 'progress.ats' }
114  ```
115  
116  Add translation key `progress.ats` to all 6 language files:
117  - EN: "Scoring ATS compatibility..."
118  - RO: "Se calculează compatibilitatea ATS..."
119  - DE: "ATS-Kompatibilität wird bewertet..."
120  - FR: "Évaluation de la compatibilité ATS..."
121  - ES: "Evaluando compatibilidad ATS..."
122  - IT: "Valutazione compatibilità ATS..."
123  
124  ---
125  
126  ## Testing Checklist
127  
128  - [ ] Upload a CV PDF + provide a job posting → ATS tab appears in results
129  - [ ] ATS score shows 0-100% with color coding
130  - [ ] Keyword analysis shows matched/semantic/missing with correct categorization
131  - [ ] Format issues display with severity colors and fix suggestions
132  - [ ] Company ATS info shows when company is recognized
133  - [ ] Recommendations expand on click to show examples
134  - [ ] All text is translated (switch to RO/DE/FR/ES/IT and verify)
135  - [ ] Works on mobile (responsive layout)
136  - [ ] Without job posting → ATS tab does NOT appear
137  - [ ] API handles errors gracefully (malformed input, Claude timeout)
138  
139  ---
140  
141  ## What's Next (Batch 2)
142  
143  Once this is tested and working, the next batch will integrate ATS scoring into the streaming analysis pipeline directly (so it runs as part of the main analysis flow rather than a separate call). Then we move to Sprint 8 (Real Salary Data).