handle content updates (?)

package.json

@@ -18,38 +18,16 @@
     "serve": "vite preview"
   },
   "blocks": [
-    {
-      "type": "file",
-      "id": "file-block",
-      "title": "Example File Block",
-      "description": "A basic file block",
-      "entry": "/src/blocks/example-file-block/index.tsx",
-      "extensions": [
-        "*"
-      ],
-      "example_path": "https://github.com/facebook/react/blob/main/packages/react-dom/index.js"
-    },
     {
       "type": "file",
       "id": "mermaid-block",
       "title": "Mermaid Block",
       "description": "Render file with Mermaid",
       "entry": "/src/blocks/mermaid-block/index.tsx",
       "extensions": [
-        "*"
+        "*.mermaid"
       ],
       "example_path": "https://github.com/sourcegraph/sourcegraph/blob/main/doc/code_intelligence/explanations/diagrams/index-states.mermaid"
-    },
-    {
-      "type": "folder",
-      "id": "folder-block",
-      "title": "Example Folder Block",
-      "description": "A basic folder block",
-      "entry": "/src/blocks/example-folder-block/index.tsx",
-      "extensions": [
-        "*"
-      ],
-      "example_path": "https://github.com/githubocto/flat"
     }
   ],
   "dependencies": {

src/blocks/mermaid-block/index.tsx

@@ -1,21 +1,20 @@
-import {
-  FileBlockProps,
-} from "@githubnext/utils";
+import React from "react";
+
+import { FileBlockProps } from "@githubnext/utils";
 import "./index.css";
 
-import mermaid from 'mermaid';
+import mermaid from "mermaid";
 
 mermaid.mermaidAPI.initialize({ startOnLoad: false });
 
-const Mermaid: React.FC = (props) => {
-  const __html = mermaid.mermaidAPI.render(
-    'id',
-    String(props.children),
-  );
-  return <div dangerouslySetInnerHTML={{ __html }}/>;
-}
-
 export default function (props: FileBlockProps) {
-  const { context, content, metadata, onUpdateMetadata } = props;
-  return <Mermaid>{content}</Mermaid>;
+  const { content } = props;
+  const [rendered, setRendered] = React.useState("");
+
+  React.useEffect(() => {
+    const rendered = mermaid.mermaidAPI.render("id", content);
+    setRendered(rendered);
+  }, [content]);
+
+  return <div dangerouslySetInnerHTML={{ __html: rendered }} />;
 }