feat: upgrade graph source panel

app/src/lib/sidebar/panels/GraphSource.svelte

@@ -1,20 +1,23 @@
 <script lang="ts">
   import type { Graph } from '$lib/types';
+  import JsonNode from './JsonNode.svelte';
 
   const { graph }: { graph?: Graph } = $props();
 
-  function convert(g: Graph): string {
-    return JSON.stringify(
-      {
-        ...g,
-        nodes: g.nodes.map((n: object) => ({ ...n, tmp: undefined, state: undefined }))
-      },
-      null,
-      2
-    );
-  }
+  const data = $derived(
+    graph
+      ? {
+          ...graph,
+          nodes: graph.nodes.map((n: object) => ({ ...n, tmp: undefined, state: undefined }))
+        }
+      : null
+  );
 </script>
 
-<pre>
-  {graph ? convert(graph) : "No graph loaded"}
-</pre>
+<div class="overflow-auto p-2">
+  {#if data}
+    <JsonNode value={data} path="graph" />
+  {:else}
+    <span class="font-mono text-xs text-neutral-500">No graph loaded</span>
+  {/if}
+</div>