103 lines
3.6 KiB
JavaScript
103 lines
3.6 KiB
JavaScript
const fs = require('fs');
|
|
const path = require('path');
|
|
const jsdom = require('jsdom');
|
|
const { JSDOM } = jsdom;
|
|
|
|
const postsDir = path.join(process.cwd(), 'reference', 'klz-cables-clone', 'posts');
|
|
const mdxDir = path.join(process.cwd(), 'data', 'blog', 'en');
|
|
|
|
const files = fs.readdirSync(postsDir);
|
|
|
|
files.forEach(file => {
|
|
if (!file.endsWith('.html')) return;
|
|
|
|
const slug = file.replace('.html', '');
|
|
const mdxPath = path.join(mdxDir, `${slug}.mdx`);
|
|
|
|
if (!fs.existsSync(mdxPath)) {
|
|
console.log(`MDX file not found for ${slug}`);
|
|
return;
|
|
}
|
|
|
|
const htmlContent = fs.readFileSync(path.join(postsDir, file), 'utf8');
|
|
const dom = new JSDOM(htmlContent);
|
|
const document = dom.window.document;
|
|
|
|
const vlpContainers = document.querySelectorAll('.vlp-link-container');
|
|
|
|
if (vlpContainers.length === 0) return;
|
|
|
|
console.log(`Processing ${slug} with ${vlpContainers.length} visual links`);
|
|
|
|
let mdxContent = fs.readFileSync(mdxPath, 'utf8');
|
|
let modified = false;
|
|
|
|
vlpContainers.forEach(container => {
|
|
const link = container.querySelector('a.vlp-link');
|
|
const titleEl = container.querySelector('.vlp-link-title');
|
|
const summaryEl = container.querySelector('.vlp-link-summary');
|
|
const imgEl = container.querySelector('.vlp-link-image img');
|
|
|
|
if (!link) return;
|
|
|
|
const url = link.getAttribute('href');
|
|
const title = titleEl ? titleEl.textContent.trim() : '';
|
|
const summary = summaryEl ? summaryEl.textContent.trim() : '';
|
|
const image = imgEl ? imgEl.getAttribute('src') : '';
|
|
|
|
// Construct the component string
|
|
const component = `
|
|
<VisualLinkPreview
|
|
url="${url}"
|
|
title="${title.replace(/"/g, '"')}"
|
|
summary="${summary.replace(/"/g, '"')}"
|
|
image="${image}"
|
|
/>
|
|
`;
|
|
|
|
// Try to find the link in MDX
|
|
// It could be [Title](URL) or just URL or <a href="URL">...</a>
|
|
// We'll try to find the URL and replace the paragraph containing it if it looks like a standalone link
|
|
// Or just append it if we can't find it easily? No, that's risky.
|
|
|
|
// Strategy: Look for the URL.
|
|
// If found in `[...](url)`, replace the whole markdown link.
|
|
// If found in `href="url"`, replace the anchor tag.
|
|
|
|
const markdownLinkRegex = new RegExp(`\\[.*?\\]\\(${escapeRegExp(url)}\\)`, 'g');
|
|
const plainUrlRegex = new RegExp(`(?<!\\()${escapeRegExp(url)}(?!\\))`, 'g'); // URL not in parens
|
|
|
|
if (markdownLinkRegex.test(mdxContent)) {
|
|
mdxContent = mdxContent.replace(markdownLinkRegex, component);
|
|
modified = true;
|
|
} else if (plainUrlRegex.test(mdxContent)) {
|
|
// Be careful not to replace inside other attributes
|
|
// This is a bit loose, but might work for standalone URLs
|
|
// Better to check if it's a standalone line?
|
|
// Let's just replace it.
|
|
mdxContent = mdxContent.replace(plainUrlRegex, component);
|
|
modified = true;
|
|
} else {
|
|
console.log(`Could not find link for ${url} in ${slug}`);
|
|
// Maybe the URL in MDX is slightly different (e.g. trailing slash)?
|
|
// Or maybe it's not there at all.
|
|
// Let's try without trailing slash
|
|
const urlNoSlash = url.replace(/\/$/, '');
|
|
const markdownLinkRegex2 = new RegExp(`\\[.*?\\]\\(${escapeRegExp(urlNoSlash)}\\)`, 'g');
|
|
if (markdownLinkRegex2.test(mdxContent)) {
|
|
mdxContent = mdxContent.replace(markdownLinkRegex2, component);
|
|
modified = true;
|
|
}
|
|
}
|
|
});
|
|
|
|
if (modified) {
|
|
fs.writeFileSync(mdxPath, mdxContent);
|
|
console.log(`Updated ${slug}`);
|
|
}
|
|
});
|
|
|
|
function escapeRegExp(string) {
|
|
return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
|
|
}
|