Files
mintel.me/apps/web/scripts/repair-mermaid.ts

54 lines
2.0 KiB
TypeScript

import * as fs from 'fs';
import * as path from 'path';
const MDX_DIR = path.join(process.cwd(), 'content/blog');
function repairMermaidSyntax(content: string): string {
// 1. Convert <Mermaid graph={`...`} /> to <Mermaid graph={`...`}>...</Mermaid> style or just fix the graph prop
// Actually, let's keep the graph prop but make sure the content is VERY safe.
const mermaidRegex = /<Mermaid\s+([\s\S]*?)graph=\{(`[\s\S]*?`)\}([\s\S]*?)\/>/g;
return content.replace(mermaidRegex, (match, before, graphLiteral, after) => {
let graphContent = graphLiteral.slice(1, -1);
// Replace all {Label} with ["Label"]
graphContent = graphContent.replace(/\{([^{}]+)\}/g, '["$1"]');
// Sometimes people use double {{Label}}
graphContent = graphContent.replace(/\{\{([^{}]+)\}\}/g, '["$1"]');
// Remove any trailing backticks inside that might have been accidentally added
graphContent = graphContent.trim();
return `<Mermaid\n ${before.trim()}\n graph={\`${graphContent}\`}\n ${after.trim()}\n />`;
});
}
// Additional fix for other diagram components that might have similar issues with props
function repairOtherDiagrams(content: string): string {
// For DiagramSequence, DiagramTimeline etc., we often pass arrays of objects.
// MDX handles these better, but let's make sure there are no weird backticks.
return content;
}
function processFiles() {
const files = fs.readdirSync(MDX_DIR).filter(f => f.endsWith('.mdx'));
for (const file of files) {
const filePath = path.join(MDX_DIR, file);
const content = fs.readFileSync(filePath, 'utf8');
let repaired = repairMermaidSyntax(content);
repaired = repairOtherDiagrams(repaired);
if (content !== repaired) {
fs.writeFileSync(filePath, repaired);
console.log(`✅ Repaired Mermaid syntax in ${file}`);
} else {
console.log(`- Checked ${file}`);
}
}
}
processFiles();