diff --git a/website/.gitignore b/website/.gitignore index b2d6de3..4244041 100644 --- a/website/.gitignore +++ b/website/.gitignore @@ -8,6 +8,16 @@ .docusaurus .cache-loader +# Build artifacts - TypeScript compiled JS files from TS sources +docusaurus.config.js +sidebars.js +/src/components/**/*.js +/src/pages/**/*.js +/src/theme/**/*.js +# Keep these JS files that are source files, not build artifacts: +!/src/components/Quiz/quizPrebuild.js +!/src/remark/*.js + # Misc .DS_Store .env.local diff --git a/website/src/components/Glossary/GlossaryTable.tsx b/website/src/components/Glossary/GlossaryTable.tsx index 2b1e63d..24a1d8c 100644 --- a/website/src/components/Glossary/GlossaryTable.tsx +++ b/website/src/components/Glossary/GlossaryTable.tsx @@ -17,6 +17,7 @@ export type DisplayEntry = { term: string; abbreviation: string; definition: string; + definitionHtml: string; canonicalTerm: string; isAlias: boolean; slug: string; @@ -30,9 +31,9 @@ const slugify = (text: string): string => .replace(/[^a-z0-9]+/g, '-') .replace(/(^-+|-+$)/g, ''); -const sanitizeMarkdown = (markdown: string, purify: typeof DOMPurify | null): string => { +const sanitizeMarkdown = (markdown: string): string => { const html = marked.parse(markdown || '', { async: false }) as string; - return purify ? purify.sanitize(html) : html; + return typeof window !== 'undefined' ? DOMPurify.sanitize(html) : html; }; const GlossaryTable: React.FC = () => { @@ -40,8 +41,6 @@ const GlossaryTable: React.FC = () => { const [textQuery, setTextQuery] = useState(''); const [activeSlug, setActiveSlug] = useState(''); - const purify = useMemo(() => (typeof window === 'undefined' ? null : DOMPurify), []); - const { entries, aliasToCanonicalSlug } = useMemo(() => { const glossaryItems = glossaryData as GlossaryItem[]; const termSet = new Set(glossaryItems.map((item) => item.term)); @@ -52,6 +51,7 @@ const GlossaryTable: React.FC = () => { term: item.term, abbreviation: item.abbreviation, definition: item.definition, + definitionHtml: sanitizeMarkdown(item.definition), canonicalTerm: item.term, isAlias: false, slug, @@ -68,6 +68,7 @@ const GlossaryTable: React.FC = () => { term: alias, abbreviation: '', definition: `See ${item.term}`, + definitionHtml: '', // Alias entries don't need HTML since they use a link canonicalTerm: item.term, isAlias: true, slug: slugify(alias), @@ -202,7 +203,6 @@ const GlossaryTable: React.FC = () => {
{filteredEntries.map((entry) => { - const definitionHtml = sanitizeMarkdown(entry.definition, purify); const handleClick = () => focusEntry(entry.targetSlug, entry.canonicalTerm); return ( @@ -245,7 +245,7 @@ const GlossaryTable: React.FC = () => { <>