v2: global player, infinite scroll, image picker, threaded comments

src/components/Markdown.tsx

@@ -0,0 +1,29 @@
+import ReactMarkdown from "react-markdown";
+import remarkGfm from "remark-gfm";
+
+interface MarkdownProps {
+  children: string;
+  className?: string;
+  inline?: boolean;
+}
+
+const REMARK_PLUGINS = [remarkGfm];
+
+export function Markdown({ children, className, inline = false }: MarkdownProps) {
+  return (
+    <div className={`md${className ? ` ${className}` : ""}${inline ? " md--inline" : ""}`}>
+      <ReactMarkdown
+        remarkPlugins={REMARK_PLUGINS}
+        components={{
+          a: ({ href, children }) => (
+            <a href={href} target="_blank" rel="noopener noreferrer">
+              {children}
+            </a>
+          ),
+        }}
+      >
+        {children}
+      </ReactMarkdown>
+    </div>
+  );
+}