ui redesign, markdown fix + metadata and auth header

frontend/src/lib/markdown.ts

@@ -0,0 +1,35 @@
+import { Marked } from 'marked';
+import markedKatex from 'marked-katex-extension';
+import { markedHighlight } from 'marked-highlight';
+import { gfmHeadingId } from 'marked-gfm-heading-id';
+import hljs from 'highlight.js';
+import DOMPurify from 'isomorphic-dompurify';
+
+const renderer = new Marked()
+  .setOptions({ gfm: true, breaks: false })
+  .use(gfmHeadingId())
+  .use(
+    markedHighlight({
+      langPrefix: 'hljs language-',
+      highlight(code, lang) {
+        const language = lang && hljs.getLanguage(lang) ? lang : 'plaintext';
+        return hljs.highlight(code, { language }).value;
+      },
+    }),
+  )
+  .use(markedKatex({ throwOnError: false, nonStandard: true }));
+
+const KATEX_TAGS = [
+  'math', 'annotation', 'semantics', 'mrow', 'mi', 'mo', 'mn', 'mtext',
+  'msup', 'msub', 'msubsup', 'mfrac', 'msqrt', 'mroot', 'mover', 'munder',
+  'munderover', 'mtable', 'mtr', 'mtd', 'mspace', 'mstyle', 'mphantom',
+  'mpadded', 'menclose',
+];
+
+export function renderMarkdown(src: string): string {
+  const html = renderer.parse(src, { async: false }) as string;
+  return DOMPurify.sanitize(html, {
+    ADD_TAGS: KATEX_TAGS,
+    ADD_ATTR: ['aria-hidden', 'style', 'id', 'class', 'encoding', 'mathvariant', 'displaystyle', 'scriptlevel'],
+  });
+}