some fixes

package.json

@@ -29,7 +29,6 @@
         "katex": "^0.16.9",
         "lucide-static": "^0.468.0",
         "marked": "^15.0.6",
-        "marked-extended-latex": "^1.1.0",
         "preact": "^10.19.6",
         "typescript": "^5.3.3"
     },

src/client/DomandeEsamiCourse.tsx

@@ -2,8 +2,7 @@ import { useEffect, useState } from 'preact/hooks'
 import { Funnel } from '@phosphor-icons/react'
 import { marked } from 'marked'
 
-// @ts-ignore
-import extendedLatex from 'marked-extended-latex'
+import extendedLatex from '@/client/lib/marked-latex'
 
 marked.use(
     extendedLatex({

src/client/lib/marked-latex.js

@@ -0,0 +1,83 @@
+// took from: https://github.com/sxyazi/marked-extended-latex
+// this has a peer dependency bug
+
+const CLASS_NAME = 'latex-b172fea480b'
+
+const extBlock = options => ({
+    name: 'latex-block',
+    level: 'block',
+    start(src) {
+        return src.match(/\$\$[^\$]/)?.index ?? -1
+    },
+    tokenizer(src, tokens) {
+        const match = /^\$\$([^\$]+)\$\$/.exec(src)
+        return match ? { type: 'latex-block', raw: match[0], formula: match[1] } : undefined
+    },
+    renderer(token) {
+        if (!options.lazy) return options.render(token.formula, true)
+        return `<span class="${CLASS_NAME}" block>${token.formula}</span>`
+    },
+})
+
+const extInline = options => ({
+    name: 'latex',
+    level: 'inline',
+    start(src) {
+        return src.match(/\$[^\$]/)?.index ?? -1
+    },
+    tokenizer(src, tokens) {
+        const match = /^\$([^\$]+)\$/.exec(src)
+        return match ? { type: 'latex', raw: match[0], formula: match[1] } : undefined
+    },
+    renderer(token) {
+        if (!options.lazy) return options.render(token.formula, false)
+        return `<span class="${CLASS_NAME}">${token.formula}</span>`
+    },
+})
+
+let observer
+/* istanbul ignore next */
+export default (options = {}) => {
+    /* istanbul ignore next */
+    if (options.lazy && options.env !== 'test') {
+        observer = new IntersectionObserver(
+            (entries, self) => {
+                for (const entry of entries) {
+                    if (!entry.isIntersecting) {
+                        continue
+                    }
+
+                    const span = entry.target
+                    self.unobserve(span)
+
+                    Promise.resolve(options.render(span.innerText, span.hasAttribute('block'))).then(html => {
+                        span.innerHTML = html
+                    })
+                    span.classList.add('latex-rendered')
+                }
+            },
+            { threshold: 1.0 },
+        )
+    }
+
+    return {
+        extensions: [extBlock(options), extInline(options)],
+    }
+}
+
+/* istanbul ignore next */
+export const observe = () => {
+    if (!observer) {
+        return
+    }
+
+    observer.disconnect()
+    document.querySelectorAll(`span.${CLASS_NAME}:not(.latex-rendered)`).forEach(span => {
+        observer.observe(span)
+    })
+}
+
+/* istanbul ignore next */
+export const disconnect = () => {
+    observer?.disconnect()
+}

src/pages/domande-esami/[course].astro

@@ -4,10 +4,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro'
 import Footer from '@/components/Footer.astro'
 import Header from '@/components/Header.astro'
 
-import { marked } from 'marked'
-
 import database from '@/data/domande-esami.yaml'
-import PhosphorIcon from '@/components/PhosphorIcon.astro'
 import { DomandeEsamiCourse } from '@/client/DomandeEsamiCourse'
 
 export const getStaticPaths = (() => {