@dxos/plugin-devtools 0.11.1 → 0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/plugin-devtools",
-  "version": "0.11.1",
+  "version": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
   "description": "DXOS developer inspector plugin.",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -14,8 +14,14 @@
   "type": "module",
   "imports": {
     "#capabilities": {
-      "source": "./src/capabilities/index.ts",
+      "source": {
+        "workerd": "./src/capabilities/gen/workerd.ts",
+        "node": "./src/capabilities/gen/node.ts",
+        "default": "./src/capabilities/index.ts"
+      },
       "types": "./dist/types/src/capabilities/index.d.ts",
+      "workerd": "./dist/lib/capabilities.workerd.mjs",
+      "node": "./dist/lib/capabilities.node.mjs",
       "default": "./dist/lib/capabilities.mjs"
     },
     "#containers": {
@@ -29,15 +35,9 @@
       "default": "./dist/lib/meta.mjs"
     },
     "#plugin": {
-      "source": {
-        "workerd": "./src/DevtoolsPlugin.workerd.ts",
-        "node": "./src/DevtoolsPlugin.node.ts",
-        "default": "./src/DevtoolsPlugin.tsx"
-      },
-      "types": "./dist/types/src/DevtoolsPlugin.d.ts",
-      "workerd": "./dist/lib/DevtoolsPlugin.workerd.mjs",
-      "node": "./dist/lib/DevtoolsPlugin.node.mjs",
-      "default": "./dist/lib/DevtoolsPlugin.mjs"
+      "source": "./src/plugin.tsx",
+      "types": "./dist/types/src/plugin.d.ts",
+      "default": "./dist/lib/plugin.mjs"
     },
     "#translations": {
       "source": "./src/translations.ts",
@@ -57,18 +57,39 @@
       "import": "./dist/lib/index.mjs"
     },
     "./assets/PLUGIN.mdl": "./PLUGIN.mdl",
-    "./plugin": {
-      "source": "./src/plugin.ts",
-      "types": "./dist/types/src/plugin.d.ts",
-      "import": "./dist/lib/plugin.mjs"
-    },
     "./translations": {
       "source": "./src/translations.ts",
       "types": "./dist/types/src/translations.d.ts",
       "import": "./dist/lib/translations.mjs"
+    },
+    "./package.json": "./package.json",
+    "./Devtools": {
+      "source": "./src/types/Devtools.ts",
+      "types": "./dist/types/src/types/Devtools.d.ts",
+      "import": "./dist/lib/Devtools.mjs"
+    },
+    "./DevtoolsEvents": {
+      "source": "./src/types/DevtoolsEvents.ts",
+      "types": "./dist/types/src/types/DevtoolsEvents.d.ts",
+      "import": "./dist/lib/DevtoolsEvents.mjs"
+    },
+    "./DevtoolsPlugin": {
+      "source": "./src/DevtoolsPlugin.ts",
+      "types": "./dist/types/src/DevtoolsPlugin.d.ts",
+      "import": "./dist/lib/DevtoolsPlugin.mjs"
     }
   },
   "types": "dist/types/src/index.d.ts",
+  "typesVersions": {
+    "*": {
+      "Devtools": [
+        "dist/types/src/types/Devtools.d.ts"
+      ],
+      "DevtoolsEvents": [
+        "dist/types/src/types/DevtoolsEvents.d.ts"
+      ]
+    }
+  },
   "files": [
     "dist",
     "dx.config.ts",
@@ -76,74 +97,52 @@
     "PLUGIN.mdl"
   ],
   "dependencies": {
-    "@antv/graphlib": "^2.0.4",
-    "@antv/layout": "^1.2.13",
-    "@tldraw/tldraw": "^3.0.0",
-    "react-resize-detector": "^11.0.1",
-    "@dxos/app-framework": "0.11.1",
-    "@dxos/app-toolkit": "0.11.1",
-    "@dxos/assistant-toolkit": "0.11.1",
-    "@dxos/client-services": "0.11.1",
-    "@dxos/compute": "0.11.1",
-    "@dxos/async": "0.11.1",
-    "@dxos/compute-hyperformula": "0.11.1",
-    "@dxos/conductor": "0.11.1",
-    "@dxos/config": "0.11.1",
-    "@dxos/devtools": "0.11.1",
-    "@dxos/echo": "0.11.1",
-    "@dxos/echo-host": "0.11.1",
-    "@dxos/effect": "0.11.1",
-    "@dxos/invariant": "0.11.1",
-    "@dxos/keys": "0.11.1",
-    "@dxos/log": "0.11.1",
-    "@dxos/log-store-idb": "0.11.1",
-    "@dxos/operation": "0.11.1",
-    "@dxos/plugin-client": "0.11.1",
-    "@dxos/plugin-graph": "0.11.1",
-    "@dxos/plugin-inbox": "0.11.1",
-    "@dxos/plugin-markdown": "0.11.1",
-    "@dxos/plugin-script": "0.11.1",
-    "@dxos/plugin-sheet": "0.11.1",
-    "@dxos/plugin-space": "0.11.1",
-    "@dxos/plugin-status-bar": "0.11.1",
-    "@dxos/protocols": "0.11.1",
-    "@dxos/random": "0.11.1",
-    "@dxos/react-client": "0.11.1",
-    "@dxos/react-ui-attention": "0.11.1",
-    "@dxos/react-ui-canvas-compute": "0.11.1",
-    "@dxos/react-ui-canvas-editor": "0.11.1",
-    "@dxos/react-ui-form": "0.11.1",
-    "@dxos/react-ui-introspect": "0.11.1",
-    "@dxos/react-ui-syntax-highlighter": "0.11.1",
-    "@dxos/react-ui-table": "0.11.1",
-    "@dxos/schema": "0.11.1",
-    "@dxos/tracing": "0.11.1",
-    "@dxos/types": "0.11.1",
-    "@dxos/util": "0.11.1"
+    "@bufbuild/protobuf": "2.11.0",
+    "@dxos/app-framework": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/app-graph": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/app-toolkit": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/async": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/cli-util": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/client-services": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/compute": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/config": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/devtools": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/echo": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/effect": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/graph": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/keys": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/log": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/plugin-script": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/plugin-space": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/protocols": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/react-client": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/react-ui-introspect": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/react-ui-table": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/react-ui-terminal": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/util": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/client": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e"
   },
   "devDependencies": {
-    "@effect-atom/atom-react": "^0.5.0",
-    "@effect/platform": "0.96.2",
+    "@effect/atom-react": "4.0.0-rc.108",
+    "@storybook/react-vite": "^10.5.8",
     "@types/react": "~19.2.17",
     "@types/react-dom": "~19.2.3",
-    "effect": "3.21.4",
+    "effect": "4.0.0-rc.108",
     "react": "~19.2.7",
     "react-dom": "~19.2.7",
-    "vite": "^8.1.4",
-    "@dxos/plugin-testing": "0.11.1",
-    "@dxos/react-ui": "0.11.1",
-    "@dxos/storybook-utils": "0.11.1",
-    "@dxos/ui-theme": "0.11.1"
+    "vite": "^8.2.1",
+    "@dxos/plugin-client": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/plugin-testing": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/react-ui": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/ui-theme": "0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e"
   },
   "peerDependencies": {
-    "@effect-atom/atom-react": "^0.5.0",
-    "@effect/platform": "0.96.2",
-    "effect": "3.21.4",
+    "@effect/atom-react": "4.0.0-rc.108",
+    "effect": "4.0.0-rc.108",
     "react": "~19.2.7",
     "react-dom": "~19.2.7",
-    "@dxos/random": "0.11.1",
-    "@dxos/react-ui": "0.11.1",
-    "@dxos/ui-theme": "0.11.1"
+    "@dxos/react-ui": "^0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e",
+    "@dxos/ui-theme": "^0.12.0-next-2800d0376abcc62d5544afdd744b16b2b960434e"
   },
   "publishConfig": {
     "access": "public"

package/src/DevtoolsPlugin.ts

@@ -0,0 +1,15 @@
+//
+// Copyright 2023 DXOS.org
+//
+
+// @import-as-namespace
+
+import * as Plugin from '@dxos/app-framework/Plugin';
+
+import { meta as pluginMeta } from '#meta';
+
+/** Plugin metadata, available without loading the plugin body. */
+export const meta = pluginMeta;
+
+/** Constructs the plugin; the body loads on first enable. */
+export const make = Plugin.lazy(meta, () => import('#plugin'));

package/src/capabilities/DevtoolsSurfaces.tsx

@@ -7,13 +7,14 @@
 import React, { type ComponentType, useCallback } from 'react';
 
 import { useOperationInvoker } from '@dxos/app-framework/ui';
-import { GraphPath, LayoutOperation } from '@dxos/app-toolkit';
+import * as GraphPath from '@dxos/app-toolkit/GraphPath';
+import * as LayoutOperation from '@dxos/app-toolkit/LayoutOperation';
 import { useActiveSpace } from '@dxos/app-toolkit/ui';
 import { InvocationTraceContainer, SpaceInfoPanel, SpaceListPanel, TestingPanel } from '@dxos/devtools';
 import { Feed } from '@dxos/echo';
 import { log } from '@dxos/log';
-import { ScriptOperation } from '@dxos/plugin-script';
-import { SpaceOperation } from '@dxos/plugin-space';
+import * as ScriptOperation from '@dxos/plugin-script/ScriptOperation';
+import * as SpaceOperation from '@dxos/plugin-space/SpaceOperation';
 import { type Space } from '@dxos/react-client/echo';
 
 import { Devtools } from '#types';
@@ -84,7 +85,11 @@ export const EdgeTestingSurface = () => {
       await space.waitUntilReady();
       const createResult = await invokePromise(ScriptOperation.CreateScript, { db: space.db });
       if (createResult.data?.object) {
-        await invokePromise(SpaceOperation.AddObject, { target: space.db, object: createResult.data.object });
+        await invokePromise(
+          SpaceOperation.AddObject,
+          { object: createResult.data.object },
+          { spaceId: space.db.spaceId },
+        );
       }
       log.info('script created', { result: createResult });
       if (createResult.data?.object) {

package/src/capabilities/app-graph-builder.ts

@@ -4,9 +4,15 @@
 
 import * as Effect from 'effect/Effect';
 
-import { Capability } from '@dxos/app-framework';
-import { AppCapabilities, AppNode, AppNodeMatcher, GraphPath } from '@dxos/app-toolkit';
-import { GraphBuilder, Node, NodeMatcher } from '@dxos/plugin-graph';
+import * as Capability from '@dxos/app-framework/Capability';
+import * as AppGraphBuilder from '@dxos/app-graph/AppGraphBuilder';
+import * as AppGraphNode from '@dxos/app-graph/AppGraphNode';
+import * as AppCapabilities from '@dxos/app-toolkit/AppCapabilities';
+import * as AppNode from '@dxos/app-toolkit/AppNode';
+import * as AppNodeMatcher from '@dxos/app-toolkit/AppNodeMatcher';
+import * as GraphPath from '@dxos/app-toolkit/GraphPath';
+import * as GraphNode from '@dxos/graph/GraphNode';
+import * as GraphNodeMatcher from '@dxos/graph/GraphNodeMatcher';
 import { type Space } from '@dxos/react-client/echo';
 import { Position } from '@dxos/util';
 
@@ -15,17 +21,22 @@ import { Devtools } from '#types';
 
 export default Capability.makeModule(
   Effect.fnUntraced(function* () {
+    // Read the app graph through its atom so the extension establishes a reactive dependency
+    // and re-evaluates once the capability lands (dependency modules contribute individually,
+    // not batched per wave).
+    const appGraphAtom = yield* Capability.atom(AppCapabilities.AppGraph);
+
     const extensions = yield* Effect.all([
-      GraphBuilder.createExtension({
+      AppGraphBuilder.createExtension({
         id: 'root',
-        match: NodeMatcher.whenRoot,
+        match: GraphNodeMatcher.whenRoot,
         actions: () =>
           Effect.succeed([
-            Node.makeAction({
+            AppGraphNode.makeAction({
               id: 'resetData',
               data: () =>
                 Effect.sync(() => {
-                  window.location.href = '/reset.html#continue';
+                  window.location.href = '/reset.html';
                 }),
               properties: {
                 label: ['reset-data.label', { ns: meta.profile.key }],
@@ -35,15 +46,18 @@ export default Capability.makeModule(
           ]),
       }),
 
-      GraphBuilder.createExtension({
+      AppGraphBuilder.createExtension({
         id: 'devtools',
-        match: NodeMatcher.whenAny(NodeMatcher.whenRoot, AppNodeMatcher.whenNavTreeGroup(GraphPath.GroupTypes.system)),
-        connector: (_nodeOrSpace: Node.Node | Space, get) =>
+        match: GraphNodeMatcher.whenAny(
+          GraphNodeMatcher.whenRoot,
+          AppNodeMatcher.whenNavTreeGroup(GraphPath.GroupTypes.system),
+        ),
+        connector: (_nodeOrSpace: AppGraphNode.Node | Space, get) =>
           Effect.gen(function* () {
-            const [graph] = get(yield* Capability.atom(AppCapabilities.AppGraph));
+            const [graph] = get(appGraphAtom);
 
             return [
-              Node.make({
+              AppGraphNode.make({
                 id: Devtools.nodeId(Devtools.id),
                 data: null,
                 type: Devtools.id,
@@ -53,16 +67,16 @@ export default Capability.makeModule(
                   position: Position.last,
                 },
                 nodes: [
-                  Node.make({
+                  AppGraphNode.make({
                     id: Devtools.nodeId(Devtools.AppGraph),
                     type: `${meta.profile.key}.app-graph`,
-                    data: { graph: graph?.graph, root: Node.RootId },
+                    data: { graph: graph?.graph, root: GraphNode.RootId },
                     properties: {
                       label: ['debug-app-graph.label', { ns: meta.profile.key }],
                       icon: 'ph--graph--regular',
                     },
                   }),
-                  Node.make({
+                  AppGraphNode.make({
                     id: Devtools.nodeId(Devtools.ToolsExplorer),
                     data: Devtools.ToolsExplorer,
                     type: Devtools.id,
@@ -71,7 +85,16 @@ export default Capability.makeModule(
                       icon: 'ph--toolbox--regular',
                     },
                   }),
-                  Node.make({
+                  AppGraphNode.make({
+                    id: Devtools.nodeId(Devtools.Cli),
+                    data: Devtools.Cli,
+                    type: Devtools.id,
+                    properties: {
+                      label: ['cli.label', { ns: meta.profile.key }],
+                      icon: 'ph--terminal-window--regular',
+                    },
+                  }),
+                  AppGraphNode.make({
                     id: Devtools.nodeId(Devtools.Client.id),
                     data: null,
                     type: Devtools.id,
@@ -80,7 +103,7 @@ export default Capability.makeModule(
                       icon: 'ph--users--regular',
                     },
                     nodes: [
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Client.Config),
                         data: Devtools.Client.Config,
                         type: Devtools.id,
@@ -89,7 +112,7 @@ export default Capability.makeModule(
                           icon: 'ph--gear--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Client.Storage),
                         data: Devtools.Client.Storage,
                         type: Devtools.id,
@@ -98,7 +121,7 @@ export default Capability.makeModule(
                           icon: 'ph--hard-drives--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Client.Sqlite),
                         data: Devtools.Client.Sqlite,
                         type: Devtools.id,
@@ -107,7 +130,7 @@ export default Capability.makeModule(
                           icon: 'ph--database--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Client.Logs),
                         data: Devtools.Client.Logs,
                         type: Devtools.id,
@@ -116,7 +139,7 @@ export default Capability.makeModule(
                           icon: 'ph--file-text--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Client.Diagnostics),
                         data: Devtools.Client.Diagnostics,
                         type: Devtools.id,
@@ -127,7 +150,7 @@ export default Capability.makeModule(
                       }),
                     ],
                   }),
-                  Node.make({
+                  AppGraphNode.make({
                     id: Devtools.nodeId(Devtools.Halo.id),
                     data: null,
                     type: Devtools.id,
@@ -136,7 +159,7 @@ export default Capability.makeModule(
                       icon: 'ph--identification-badge--regular',
                     },
                     nodes: [
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Halo.Identity),
                         data: Devtools.Halo.Identity,
                         type: Devtools.id,
@@ -145,7 +168,7 @@ export default Capability.makeModule(
                           icon: 'ph--identification-badge--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Halo.Devices),
                         data: Devtools.Halo.Devices,
                         type: Devtools.id,
@@ -154,7 +177,7 @@ export default Capability.makeModule(
                           icon: 'ph--devices--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Halo.Keyring),
                         data: Devtools.Halo.Keyring,
                         type: Devtools.id,
@@ -163,7 +186,7 @@ export default Capability.makeModule(
                           icon: 'ph--key--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Halo.Credentials),
                         data: Devtools.Halo.Credentials,
                         type: Devtools.id,
@@ -174,7 +197,7 @@ export default Capability.makeModule(
                       }),
                     ],
                   }),
-                  Node.make({
+                  AppGraphNode.make({
                     id: Devtools.nodeId(Devtools.Echo.id),
                     data: null,
                     type: Devtools.id,
@@ -183,7 +206,7 @@ export default Capability.makeModule(
                       icon: 'ph--database--regular',
                     },
                     nodes: [
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Echo.Spaces),
                         data: Devtools.Echo.Spaces,
                         type: Devtools.id,
@@ -192,7 +215,7 @@ export default Capability.makeModule(
                           icon: 'ph--graph--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Echo.Space),
                         data: Devtools.Echo.Space,
                         type: Devtools.id,
@@ -201,7 +224,7 @@ export default Capability.makeModule(
                           icon: 'ph--planet--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Echo.Feeds),
                         data: Devtools.Echo.Feeds,
                         type: Devtools.id,
@@ -210,7 +233,7 @@ export default Capability.makeModule(
                           icon: 'ph--list-bullets--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Echo.Objects),
                         data: Devtools.Echo.Objects,
                         type: Devtools.id,
@@ -219,7 +242,7 @@ export default Capability.makeModule(
                           icon: 'ph--cube--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Echo.Schema),
                         data: Devtools.Echo.Schema,
                         type: Devtools.id,
@@ -228,7 +251,7 @@ export default Capability.makeModule(
                           icon: 'ph--database--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Echo.Registry),
                         data: Devtools.Echo.Registry,
                         type: Devtools.id,
@@ -237,7 +260,7 @@ export default Capability.makeModule(
                           icon: 'ph--books--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Echo.Automerge),
                         data: Devtools.Echo.Automerge,
                         type: Devtools.id,
@@ -246,7 +269,7 @@ export default Capability.makeModule(
                           icon: 'ph--gear-six--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Echo.Queues),
                         data: Devtools.Echo.Queues,
                         type: Devtools.id,
@@ -255,7 +278,7 @@ export default Capability.makeModule(
                           icon: 'ph--queue--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Echo.Members),
                         data: Devtools.Echo.Members,
                         type: Devtools.id,
@@ -264,7 +287,7 @@ export default Capability.makeModule(
                           icon: 'ph--users--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Echo.Metadata),
                         data: Devtools.Echo.Metadata,
                         type: Devtools.id,
@@ -275,7 +298,7 @@ export default Capability.makeModule(
                       }),
                     ],
                   }),
-                  Node.make({
+                  AppGraphNode.make({
                     id: Devtools.nodeId(Devtools.Mesh.id),
                     data: null,
                     type: Devtools.id,
@@ -284,7 +307,7 @@ export default Capability.makeModule(
                       icon: 'ph--graph--regular',
                     },
                     nodes: [
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Mesh.Signal),
                         data: Devtools.Mesh.Signal,
                         type: Devtools.id,
@@ -293,7 +316,7 @@ export default Capability.makeModule(
                           icon: 'ph--wifi-high--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Mesh.Swarm),
                         data: Devtools.Mesh.Swarm,
                         type: Devtools.id,
@@ -302,7 +325,7 @@ export default Capability.makeModule(
                           icon: 'ph--users-three--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Mesh.Network),
                         data: Devtools.Mesh.Network,
                         type: Devtools.id,
@@ -313,7 +336,7 @@ export default Capability.makeModule(
                       }),
                     ],
                   }),
-                  Node.make({
+                  AppGraphNode.make({
                     id: Devtools.nodeId(Devtools.Edge.id),
                     data: null,
                     type: Devtools.id,
@@ -322,7 +345,7 @@ export default Capability.makeModule(
                       icon: 'ph--cloud--regular',
                     },
                     nodes: [
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Edge.Dashboard),
                         data: Devtools.Edge.Dashboard,
                         type: Devtools.id,
@@ -331,7 +354,7 @@ export default Capability.makeModule(
                           icon: 'ph--computer-tower--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Edge.Workflows),
                         data: Devtools.Edge.Workflows,
                         type: Devtools.id,
@@ -340,7 +363,7 @@ export default Capability.makeModule(
                           icon: 'ph--function--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Edge.Traces),
                         data: Devtools.Edge.Traces,
                         type: Devtools.id,
@@ -349,7 +372,7 @@ export default Capability.makeModule(
                           icon: 'ph--line-segments--regular',
                         },
                       }),
-                      Node.make({
+                      AppGraphNode.make({
                         id: Devtools.nodeId(Devtools.Edge.Testing),
                         data: Devtools.Edge.Testing,
                         type: Devtools.id,
@@ -367,9 +390,9 @@ export default Capability.makeModule(
       }),
 
       // Devtools deck companion.
-      GraphBuilder.createExtension({
+      AppGraphBuilder.createExtension({
         id: 'devtoolsOverview',
-        match: NodeMatcher.whenRoot,
+        match: GraphNodeMatcher.whenRoot,
         connector: () =>
           Effect.succeed([
             AppNode.makeDeckCompanion({
@@ -383,6 +406,6 @@ export default Capability.makeModule(
       }),
     ]);
 
-    return Capability.contributes(AppCapabilities.AppGraphBuilder, extensions);
+    return Capability.contribute(AppCapabilities.AppGraphBuilder, extensions);
   }),
 );