geulah d35700bc10 feat(templates): add multiple CV templates with photo support and template selection
- Add 4 new CV templates (ATS-Friendly, Classic, Modern, Minimal) with thumbnails
- Implement template registry and gallery component for template selection
- Add photoUrl field to personal info with URL validation
- Update buildPrintableHtml to support template-specific styling
- Modify ExportControls to use template registry
- Add template preview thumbnails in SVG format
2025-10-06 08:29:33 +01:00

286 lines
10 KiB
JavaScript

import express from 'express';
import cors from 'cors';
import puppeteer from 'puppeteer';
import sanitizeHtml from 'sanitize-html';
import { buildPrintableHtml as sharedBuild } from '../shared-printable/buildPrintableHtml.js';
// Minimal escape function to avoid breaking HTML; summary is sanitized client-side.
function escapeText(str) {
if (str == null) return '';
return String(str)
.replace(/&/g, '&')
.replace(/</g, '&lt;')
.replace(/>/g, '&gt;')
.replace(/\"/g, '&quot;')
.replace(/'/g, '&#39;');
}
function buildPrintableHtml(cv) {
const { personal = {}, summary = '', work = [], education = [], skills = [], languages = [], certifications = [] } = cv || {};
const styles = `
<style>
@page { size: A4; margin: 20mm; }
body { font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, Noto Sans; color: #1f2937; }
.page { width: 210mm; min-height: 297mm; margin: 0 auto; background: white; }
h1 { font-size: 24px; margin: 0 0 6px 0; }
h2 { font-size: 16px; margin: 16px 0 8px 0; padding-bottom: 4px; border-bottom: 1px solid #e5e7eb; color: #374151; }
h3 { font-size: 14px; margin: 0; }
.header { border-bottom: 1px solid #e5e7eb; padding-bottom: 12px; margin-bottom: 16px; }
.meta { display: flex; flex-wrap: wrap; gap: 8px; font-size: 12px; color: #6b7280; }
.section { margin-bottom: 16px; }
.job, .edu { margin-bottom: 12px; }
.row { display: flex; justify-content: space-between; align-items: flex-start; }
.small { font-size: 12px; color: #6b7280; }
ul { padding-left: 20px; }
li { margin: 4px 0; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip { background: #f3f4f6; color: #1f2937; padding: 2px 8px; border-radius: 12px; font-size: 12px; }
</style>
`;
const headerLinks = (personal.links || [])
.map(l => `<a href="${escapeText(l.url)}" target="_blank" rel="noopener noreferrer">${escapeText(l.label || l.url)}</a>`)
.join(' · ');
const headerHtml = `
<div class="header">
<h1>${escapeText(personal.firstName || '')} ${escapeText(personal.lastName || '')}</h1>
<div class="meta">
${personal.email ? `<span>${escapeText(personal.email)}</span>` : ''}
${personal.phone ? `<span>${escapeText(personal.phone)}</span>` : ''}
${(personal.city || personal.country) ? `<span>${personal.city ? escapeText(personal.city) : ''}${personal.city && personal.country ? ', ' : ''}${personal.country ? escapeText(personal.country) : ''}</span>` : ''}
${headerLinks ? `<span>${headerLinks}</span>` : ''}
</div>
</div>
`;
const cleanSummary = typeof summary === 'string' ? sanitizeHtml(summary, {
allowedTags: ['p', 'strong', 'em', 'ul', 'ol', 'li', 'br', 'a'],
allowedAttributes: { a: ['href', 'rel', 'target'] }
}) : '';
const summarySection = cleanSummary ? `
<div class="section">
<h2>Professional Summary</h2>
<div>${cleanSummary}</div>
</div>
` : '';
const workSection = (work && work.length) ? `
<div class="section">
<h2>Work Experience</h2>
${work.map(job => `
<div class="job">
<div class="row">
<div>
<h3>${escapeText(job.title)}</h3>
<div class="small">${escapeText(job.company)}</div>
</div>
<div class="small">
${escapeText(job.startDate || '')} - ${escapeText(job.endDate || 'Present')}
${job.location ? `<div>${escapeText(job.location)}</div>` : ''}
</div>
</div>
${(job.bullets && job.bullets.length) ? `
<ul>
${job.bullets.map(b => `<li>${escapeText(b)}</li>`).join('')}
</ul>
` : ''}
</div>
`).join('')}
</div>
` : '';
const eduSection = (education && education.length) ? `
<div class="section">
<h2>Education</h2>
${education.map(ed => `
<div class="edu">
<div class="row">
<div>
<h3>${escapeText(ed.degree)}</h3>
<div class="small">${escapeText(ed.school)}</div>
</div>
<div class="small">
${escapeText(ed.startDate || '')} - ${escapeText(ed.endDate || '')}
</div>
</div>
${ed.gpa ? `<div class="small">GPA: ${escapeText(ed.gpa)}</div>` : ''}
</div>
`).join('')}
</div>
` : '';
const skillsSection = (skills && skills.length) ? `
<div class="section">
<h2>Skills</h2>
<div class="chips">
${skills.map(s => `<span class="chip">${escapeText(s.name)}${s.level ? `${escapeText(s.level)}` : ''}</span>`).join('')}
</div>
</div>
` : '';
const languagesSection = (languages && languages.length) ? `
<div class="section">
<h2>Languages</h2>
<div class="chips">
${languages.map(l => `<span class="chip">${escapeText(l.name)}${l.level ? `${escapeText(l.level)}` : ''}</span>`).join('')}
</div>
</div>
` : '';
const certsSection = (certifications && certifications.length) ? `
<div class="section">
<h2>Certifications</h2>
<ul>
${certifications.map(c => `<li>${escapeText(c.name)}${c.issuer ? ` - ${escapeText(c.issuer)}` : ''}${c.date ? ` (${escapeText(c.date)})` : ''}</li>`).join('')}
</ul>
</div>
` : '';
return `<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Printable CV</title>
${styles}
</head>
<body>
<div class="page">
${headerHtml}
${summarySection}
${workSection}
${eduSection}
${skillsSection}
${languagesSection}
${certsSection}
</div>
</body>
</html>`;
}
const app = express();
app.use(cors());
app.use(express.json({ limit: '1mb' }));
// Pluggable job store with in-memory default
class InMemoryJobStore {
constructor() {
this.map = new Map();
}
create(job) {
const id = `job_${Date.now()}_${Math.random().toString(36).slice(2, 8)}`;
this.map.set(id, { ...job, id });
return id;
}
get(id) { return this.map.get(id); }
set(id, data) { this.map.set(id, { ...(this.map.get(id) || {}), ...data }); }
cancel(id) {
const job = this.map.get(id);
if (!job) return false;
this.map.set(id, { ...job, status: 'canceled', error: null, buffer: null });
return true;
}
}
const jobs = new InMemoryJobStore();
app.post('/export/pdf', async (req, res) => {
try {
// Treat presence of the query param as async, and allow common truthy values
const asyncFlag = (
typeof req.query.async !== 'undefined'
? ['1', 'true', 'on', ''].includes(String(req.query.async).toLowerCase())
: req.body?.async === true
);
const templateId = req.query.templateId || req.body?.templateId || null;
const cv = req.body || {};
const sanitizedCv = {
...cv,
summary: typeof cv.summary === 'string' ? sanitizeHtml(cv.summary, {
allowedTags: ['p', 'strong', 'em', 'ul', 'ol', 'li', 'br', 'a'],
allowedAttributes: { a: ['href', 'rel', 'target'] }
}) : ''
};
const today = new Date();
const y = today.getFullYear();
const m = String(today.getMonth() + 1).padStart(2, '0');
const d = String(today.getDate()).padStart(2, '0');
const dateStr = `${y}${m}${d}`;
const rawLast = (sanitizedCv.personal && sanitizedCv.personal.lastName) ? sanitizedCv.personal.lastName : '';
const safeLast = rawLast.trim() ? rawLast.trim() : 'cv';
const filename = `cv-${safeLast}-${dateStr}.pdf`.replace(/\s+/g, '_');
if (asyncFlag) {
const jobId = jobs.create({ status: 'queued', filename, error: null, buffer: null, templateId });
setImmediate(async () => {
try {
const current = jobs.get(jobId);
if (current?.status === 'canceled') return; // honor cancel
const html = sharedBuild(sanitizedCv, templateId);
const browser = await puppeteer.launch({ args: ['--no-sandbox', '--disable-setuid-sandbox'] });
const page = await browser.newPage();
await page.setContent(html, { waitUntil: 'networkidle0' });
const pdfBuffer = await page.pdf({ format: 'A4', printBackground: true });
await browser.close();
jobs.set(jobId, { status: 'done', filename, error: null, buffer: pdfBuffer, templateId });
} catch (e) {
console.error('Async export error:', e);
jobs.set(jobId, { status: 'error', filename, error: 'Failed to create PDF', buffer: null, templateId });
}
});
return res.json({ jobId });
}
// Synchronous path
const html = sharedBuild(sanitizedCv, templateId);
const browser = await puppeteer.launch({ args: ['--no-sandbox', '--disable-setuid-sandbox'] });
const page = await browser.newPage();
await page.setContent(html, { waitUntil: 'networkidle0' });
const pdfBuffer = await page.pdf({ format: 'A4', printBackground: true });
await browser.close();
res.set({
'Content-Type': 'application/pdf',
'Content-Disposition': `attachment; filename="${filename}"`
});
res.send(pdfBuffer);
} catch (err) {
console.error('Export error:', err);
res.status(500).json({ error: 'Failed to create PDF' });
}
});
// Job status endpoint
app.get('/export/status/:id', (req, res) => {
const job = jobs.get(req.params.id);
if (!job) return res.status(404).json({ error: 'Job not found' });
res.json({ status: job.status, filename: job.filename, error: job.error });
});
// Job download endpoint
app.get('/export/download/:id', (req, res) => {
const job = jobs.get(req.params.id);
if (!job) return res.status(404).json({ error: 'Job not found' });
if (job.status !== 'done' || !job.buffer) return res.status(409).json({ error: 'Job not ready' });
res.set({
'Content-Type': 'application/pdf',
'Content-Disposition': `attachment; filename="${job.filename}"`
});
res.send(job.buffer);
});
// Cancel job endpoint
app.post('/export/cancel/:id', (req, res) => {
const id = req.params.id;
const ok = jobs.cancel(id);
if (!ok) return res.status(404).json({ error: 'Job not found' });
return res.json({ status: 'canceled' });
});
const PORT = process.env.PORT || 4000;
app.listen(PORT, () => {
console.log(`Export server listening on http://localhost:${PORT}`);
});