added initial batch of questions

.prettierrc

@@ -1,9 +0,0 @@
-{
-    "printWidth": 110,
-    "singleQuote": true,
-    "quoteProps": "consistent",
-    "tabWidth": 4,
-    "useTabs": false,
-    "semi": false,
-    "arrowParens": "avoid"
-}

.prettierrc.mjs

@@ -0,0 +1,26 @@
+/** @type {import("prettier").Config} */
+export default {
+    printWidth: 120,
+    singleQuote: true,
+    quoteProps: 'consistent',
+    tabWidth: 4,
+    useTabs: false,
+    semi: false,
+    arrowParens: 'avoid',
+
+    plugins: ['prettier-plugin-astro'],
+    overrides: [
+        {
+            files: '*.astro',
+            options: {
+                parser: 'astro',
+            },
+        },
+        {
+            files: '*.{yml,yaml,json}',
+            options: {
+                tabWidth: 2,
+            },
+        },
+    ],
+}

.vscode/settings.json

@@ -1,3 +1,11 @@
 {
-    "npm.packageManager": "bun"
+  "npm.packageManager": "bun",
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "[astro]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[yaml]": {
+    "editor.tabSize": 2,
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  }
 }

package.json

@@ -29,6 +29,7 @@
         "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"
     },
@@ -39,6 +40,8 @@
         "jsdom": "^24.1.1",
         "linkedom": "^0.18.4",
         "npm-run-all": "^4.1.5",
+        "prettier": "^3.5.0",
+        "prettier-plugin-astro": "^0.14.1",
         "rehype-autolink-headings": "^7.1.0",
         "rehype-slug": "^6.0.0",
         "remark-math": "^6.0.0",

src/client/DomandeEsamiCourse.tsx

@@ -2,6 +2,19 @@ import { useEffect, useState } from 'preact/hooks'
 import { Funnel } from '@phosphor-icons/react'
 import { marked } from 'marked'
 
+// @ts-ignore
+import extendedLatex from 'marked-extended-latex'
+
+marked.use(
+    extendedLatex({
+        lazy: false,
+        render: (formula: string, display: boolean) => {
+            console.log('rendering', formula)
+            return display ? '$$' + formula + '$$' : '$' + formula + '$'
+        },
+    }),
+)
+
 import type { Database } from '@/data/domande-esami.yaml'
 
 const useRemoteValue = <T,>(url: string): T | null => {
@@ -33,9 +46,7 @@ export const DomandeEsamiCourse = ({ course }: Props) => {
 
     const courseTags = [
         ...new Set(
-            database.questions
-                .filter(question => question.course === course)
-                .flatMap(question => question.tags)
+            database.questions.filter(question => question.course === course).flatMap(question => question.tags),
         ),
     ]
 
@@ -43,9 +54,7 @@ export const DomandeEsamiCourse = ({ course }: Props) => {
 
     const filteredQuestions = database.questions
         .filter(question => question.course === course)
-        .filter(
-            question => selectedTags.length === 0 || selectedTags.every(tag => question.tags.includes(tag))
-        )
+        .filter(question => selectedTags.length === 0 || selectedTags.every(tag => question.tags.includes(tag)))
 
     return (
         <>
@@ -70,16 +79,12 @@ export const DomandeEsamiCourse = ({ course }: Props) => {
                           ))
                         : courseTags.map(tag => (
                               <div
-                                  class={
-                                      selectedTags.includes(tag)
-                                          ? 'chip clickable'
-                                          : 'chip clickable disabled'
-                                  }
+                                  class={selectedTags.includes(tag) ? 'chip clickable' : 'chip clickable disabled'}
                                   onClick={() =>
                                       setSelectedTags(
                                           selectedTags.includes(tag)
                                               ? selectedTags.filter(t => t !== tag)
-                                              : [...selectedTags, tag]
+                                              : [...selectedTags, tag],
                                       )
                                   }
                               >

src/pages/domande-esami/index.astro

@@ -10,7 +10,7 @@ const courseQuestionCounts = Object.fromEntries(
     database.questions.reduce((acc, question) => {
         acc.set(question.course, (acc.get(question.course) || 0) + 1)
         return acc
-    }, new Map())
+    }, new Map()),
 )
 ---
 
@@ -33,16 +33,18 @@ const courseQuestionCounts = Object.fromEntries(
                         </h2>
                     </summary>
                     <div class="wide-card-list">
-                        {group.items.map(course => (
-                            <a href={`/domande-esami/${course}`}>
-                                <div class="card">
-                                    <h2>{database.names[course]}</h2>
-                                    <div class="text">
-                                        <p>{courseQuestionCounts[course] || 0} domande</p>
+                        {group.items
+                            .filter(course => courseQuestionCounts[course] > 0)
+                            .map(course => (
+                                <a href={`/domande-esami/${course}`}>
+                                    <div class="card">
+                                        <h2>{database.names[course]}</h2>
+                                        <div class="text">
+                                            <p>{courseQuestionCounts[course] || 0} domande</p>
+                                        </div>
                                     </div>
-                                </div>
-                            </a>
-                        ))}
+                                </a>
+                            ))}
                     </div>
                 </details>
             ))

src/styles/components.scss

@@ -33,7 +33,11 @@
         place-content: center;
 
         font-size: 24px;
-        font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
+        font-variation-settings:
+            'FILL' 0,
+            'wght' 300,
+            'GRAD' 0,
+            'opsz' 24;
 
         max-width: 32px;
     }
@@ -900,11 +904,17 @@
         width: 100%;
 
         justify-content: center;
+        // align-items: start;
 
         .text > * {
             max-width: none;
         }
 
+        .card {
+            display: grid;
+            grid-template-rows: 1fr auto;
+        }
+
         @media screen and (max-width: $screen-desktop-min) {
             grid-template-columns: 1fr;