@dxos/plugin-debug 0.8.4-main.7996785055 → 0.8.4-main.8baae0fced

package/src/capabilities/{app-graph-builder/app-graph-builder.ts → app-graph-builder.ts}

@@ -5,25 +5,23 @@
 import * as Effect from 'effect/Effect';
 
 import { Capability } from '@dxos/app-framework';
-import { AppCapabilities, getSpaceIdFromPath } from '@dxos/app-toolkit';
+import { AppCapabilities, AppNode, getSpaceIdFromPath } from '@dxos/app-toolkit';
 import { ClientCapabilities } from '@dxos/plugin-client';
-import { DECK_COMPANION_TYPE, PLANK_COMPANION_TYPE } from '@dxos/plugin-deck/types';
 import { GraphBuilder, Node, NodeMatcher } from '@dxos/plugin-graph';
-import { meta as spaceMeta } from '@dxos/plugin-space';
-
-import { meta } from '../../meta';
-import { Devtools } from '../../types';
+import { SPACE_TYPE } from '@dxos/plugin-space';
 import { getParentId } from '@dxos/react-ui-attention';
 
+import { meta } from '#meta';
+import { Devtools } from '#types';
+
 const DEVTOOLS_TYPE = `${meta.id}.devtools`;
 
 export default Capability.makeModule(
   Effect.fnUntraced(function* () {
     const extensions = yield* Effect.all([
-      // Devtools node.
       GraphBuilder.createExtension({
-        id: `${meta.id}.devtools`,
-        match: NodeMatcher.whenAny(NodeMatcher.whenRoot, NodeMatcher.whenNodeType(`${spaceMeta.id}.settings`)),
+        id: 'devtools',
+        match: NodeMatcher.whenAny(NodeMatcher.whenRoot, NodeMatcher.whenNodeType(SPACE_TYPE)),
         connector: (node, get) =>
           Effect.gen(function* () {
             const client = yield* Capability.get(ClientCapabilities.Client);
@@ -34,382 +32,370 @@ export default Capability.makeModule(
             const [graph] = get(yield* Capability.atom(AppCapabilities.AppGraph));
 
             return [
-              {
+              Node.make({
                 id: Devtools.id,
                 data: null,
                 type: DEVTOOLS_TYPE,
                 properties: {
-                  label: ['devtools label', { ns: meta.id }],
+                  label: ['devtools.label', { ns: meta.id }],
                   icon: 'ph--hammer--regular',
                   disposition: 'pin-end',
-                  position: 'fallback',
+                  position: 'last',
                 },
                 nodes: [
-                  ...(space && node.type === `${spaceMeta.id}.settings`
+                  Node.make({
+                    id: 'app-graph',
+                    type: `${meta.id}.app-graph`,
+                    data: { graph: graph?.graph, root: node.id === Node.RootId ? node.id : getParentId(node.id) },
+                    properties: {
+                      label: ['debug-app-graph.label', { ns: meta.id }],
+                      icon: 'ph--graph--regular',
+                    },
+                  }),
+                  Node.make({
+                    id: 'tools-explorer',
+                    data: Devtools.ToolsExplorer,
+                    type: DEVTOOLS_TYPE,
+                    properties: {
+                      label: ['debug-tools-explorer.label', { ns: meta.id }],
+                      icon: 'ph--toolbox--regular',
+                    },
+                  }),
+                  ...(space && node.type === SPACE_TYPE
                     ? [
-                        {
+                        Node.make({
                           id: 'debug',
                           type: `${meta.id}.space`,
                           data: { space, type: `${meta.id}.space` },
                           properties: {
-                            label: ['debug label', { ns: meta.id }],
-                            icon: 'ph--bug--regular',
+                            label: ['generate-objects.label', { ns: meta.id }],
+                            icon: 'ph--dice-five--regular',
                           },
-                        },
+                        }),
                       ]
                     : []),
-                  {
-                    id: 'app-graph',
-                    type: `${meta.id}.app-graph`,
-                    data: { graph: graph?.graph, root: node.id === Node.RootId ? node.id : getParentId(node.id) },
-                    properties: {
-                      label: ['debug app graph label', { ns: meta.id }],
-                      icon: 'ph--graph--regular',
-                    },
-                  },
-                  {
+                  Node.make({
                     id: Devtools.Client.id,
                     data: null,
                     type: DEVTOOLS_TYPE,
                     properties: {
-                      label: ['client label', { ns: meta.id }],
+                      label: ['client.label', { ns: meta.id }],
                       icon: 'ph--users--regular',
                     },
                     nodes: [
-                      {
+                      Node.make({
                         id: Devtools.Client.Config,
                         data: Devtools.Client.Config,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['config label', { ns: meta.id }],
+                          label: ['config.label', { ns: meta.id }],
                           icon: 'ph--gear--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Client.Storage,
                         data: Devtools.Client.Storage,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['storage label', { ns: meta.id }],
+                          label: ['storage.label', { ns: meta.id }],
                           icon: 'ph--hard-drives--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Client.Logs,
                         data: Devtools.Client.Logs,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['logs label', { ns: meta.id }],
+                          label: ['logs.label', { ns: meta.id }],
                           icon: 'ph--file-text--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Client.Diagnostics,
                         data: Devtools.Client.Diagnostics,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['diagnostics label', { ns: meta.id }],
+                          label: ['diagnostics.label', { ns: meta.id }],
                           icon: 'ph--chart-line--regular',
                         },
-                      },
-                      {
-                        id: Devtools.Client.Tracing,
-                        data: Devtools.Client.Tracing,
-                        type: DEVTOOLS_TYPE,
-                        properties: {
-                          label: ['tracing label', { ns: meta.id }],
-                          icon: 'ph--fire--regular',
-                        },
-                      },
+                      }),
                     ],
-                  },
-                  {
+                  }),
+                  Node.make({
                     id: Devtools.Halo.id,
                     data: null,
                     type: DEVTOOLS_TYPE,
                     properties: {
-                      label: ['halo label', { ns: meta.id }],
+                      label: ['halo.label', { ns: meta.id }],
                       icon: 'ph--identification-badge--regular',
                     },
                     nodes: [
-                      {
+                      Node.make({
                         id: Devtools.Halo.Identity,
                         data: Devtools.Halo.Identity,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['identity label', { ns: meta.id }],
+                          label: ['identity.label', { ns: meta.id }],
                           icon: 'ph--identification-badge--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Halo.Devices,
                         data: Devtools.Halo.Devices,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['devices label', { ns: meta.id }],
+                          label: ['devices.label', { ns: meta.id }],
                           icon: 'ph--devices--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Halo.Keyring,
                         data: Devtools.Halo.Keyring,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['keyring label', { ns: meta.id }],
+                          label: ['keyring.label', { ns: meta.id }],
                           icon: 'ph--key--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Halo.Credentials,
                         data: Devtools.Halo.Credentials,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['credentials label', { ns: meta.id }],
+                          label: ['credentials.label', { ns: meta.id }],
                           icon: 'ph--credit-card--regular',
                         },
-                      },
+                      }),
                     ],
-                  },
-                  {
+                  }),
+                  Node.make({
                     id: Devtools.Echo.id,
                     data: null,
                     type: DEVTOOLS_TYPE,
                     properties: {
-                      label: ['echo label', { ns: meta.id }],
+                      label: ['echo.label', { ns: meta.id }],
                       icon: 'ph--database--regular',
                     },
                     nodes: [
-                      {
+                      Node.make({
                         id: Devtools.Echo.Spaces,
                         data: Devtools.Echo.Spaces,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['spaces label', { ns: meta.id }],
+                          label: ['spaces.label', { ns: meta.id }],
                           icon: 'ph--graph--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Echo.Space,
                         data: Devtools.Echo.Space,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['space label', { ns: meta.id }],
+                          label: ['space.label', { ns: meta.id }],
                           icon: 'ph--planet--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Echo.Feeds,
                         data: Devtools.Echo.Feeds,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['feeds label', { ns: meta.id }],
+                          label: ['feeds.label', { ns: meta.id }],
                           icon: 'ph--list-bullets--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Echo.Objects,
                         data: Devtools.Echo.Objects,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['objects label', { ns: meta.id }],
+                          label: ['objects.label', { ns: meta.id }],
                           icon: 'ph--cube--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Echo.Schema,
                         data: Devtools.Echo.Schema,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['schema label', { ns: meta.id }],
+                          label: ['schema.label', { ns: meta.id }],
                           icon: 'ph--database--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Echo.Automerge,
                         data: Devtools.Echo.Automerge,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['automerge label', { ns: meta.id }],
+                          label: ['automerge.label', { ns: meta.id }],
                           icon: 'ph--gear-six--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Echo.Queues,
                         data: Devtools.Echo.Queues,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['queues label', { ns: meta.id }],
+                          label: ['queues.label', { ns: meta.id }],
                           icon: 'ph--queue--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Echo.Members,
                         data: Devtools.Echo.Members,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['members label', { ns: meta.id }],
+                          label: ['members.label', { ns: meta.id }],
                           icon: 'ph--users--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Echo.Metadata,
                         data: Devtools.Echo.Metadata,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['metadata label', { ns: meta.id }],
+                          label: ['metadata.label', { ns: meta.id }],
                           icon: 'ph--hard-drive--regular',
                         },
-                      },
+                      }),
                     ],
-                  },
-                  {
+                  }),
+                  Node.make({
                     id: Devtools.Mesh.id,
                     data: null,
                     type: DEVTOOLS_TYPE,
                     properties: {
-                      label: ['mesh label', { ns: meta.id }],
+                      label: ['mesh.label', { ns: meta.id }],
                       icon: 'ph--graph--regular',
                     },
                     nodes: [
-                      {
+                      Node.make({
                         id: Devtools.Mesh.Signal,
                         data: Devtools.Mesh.Signal,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['signal label', { ns: meta.id }],
+                          label: ['signal.label', { ns: meta.id }],
                           icon: 'ph--wifi-high--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Mesh.Swarm,
                         data: Devtools.Mesh.Swarm,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['swarm label', { ns: meta.id }],
+                          label: ['swarm.label', { ns: meta.id }],
                           icon: 'ph--users-three--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Mesh.Network,
                         data: Devtools.Mesh.Network,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['network label', { ns: meta.id }],
+                          label: ['network.label', { ns: meta.id }],
                           icon: 'ph--polygon--regular',
                         },
-                      },
+                      }),
                     ],
-                  },
-                  {
+                  }),
+                  Node.make({
                     id: Devtools.Edge.id,
                     data: null,
                     type: DEVTOOLS_TYPE,
                     properties: {
-                      label: ['edge label', { ns: meta.id }],
+                      label: ['edge.label', { ns: meta.id }],
                       icon: 'ph--cloud--regular',
                     },
                     nodes: [
-                      {
+                      Node.make({
                         id: Devtools.Edge.Dashboard,
                         data: Devtools.Edge.Dashboard,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['dashboard label', { ns: meta.id }],
+                          label: ['dashboard.label', { ns: meta.id }],
                           icon: 'ph--computer-tower--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Edge.Workflows,
                         data: Devtools.Edge.Workflows,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['workflows label', { ns: meta.id }],
+                          label: ['workflows.label', { ns: meta.id }],
                           icon: 'ph--function--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Edge.Traces,
                         data: Devtools.Edge.Traces,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['traces label', { ns: meta.id }],
+                          label: ['traces.label', { ns: meta.id }],
                           icon: 'ph--line-segments--regular',
                         },
-                      },
-                      {
+                      }),
+                      Node.make({
                         id: Devtools.Edge.Testing,
                         data: Devtools.Edge.Testing,
                         type: DEVTOOLS_TYPE,
                         properties: {
-                          label: ['testing label', { ns: meta.id }],
+                          label: ['testing.label', { ns: meta.id }],
                           icon: 'ph--flask--regular',
                         },
-                      },
+                      }),
                     ],
-                  },
+                  }),
                 ],
-              },
+              }),
             ];
           }),
       }),
 
       // Debug object companion.
       GraphBuilder.createExtension({
-        id: `${meta.id}.debug-object`,
+        id: 'debug-object',
         match: NodeMatcher.whenEchoObject,
         connector: () =>
           Effect.succeed([
-            {
+            AppNode.makeCompanion({
               id: 'debug',
-              type: PLANK_COMPANION_TYPE,
+              label: ['debug.label', { ns: meta.id }],
+              icon: 'ph--bug--regular',
               data: 'debug',
-              properties: {
-                label: ['debug label', { ns: meta.id }],
-                icon: 'ph--bug--regular',
-                disposition: 'hidden',
-                position: 'fallback',
-              },
-            },
+              position: 'last',
+            }),
           ]),
       }),
 
       // Devtools deck companion.
       GraphBuilder.createExtension({
-        id: `${meta.id}.devtools-overview`,
+        id: 'devtools-overview',
         match: NodeMatcher.whenRoot,
         connector: () =>
           Effect.succeed([
-            {
+            AppNode.makeDeckCompanion({
               id: 'devtools',
-              type: DECK_COMPANION_TYPE,
+              label: ['devtools-overview.label', { ns: meta.id }],
+              icon: 'ph--equalizer--regular',
               data: 'devtools' as const,
-              properties: {
-                label: ['devtools overview label', { ns: meta.id }],
-                icon: 'ph--equalizer--regular',
-                disposition: 'hidden',
-                position: 'fallback',
-              },
-            },
+              position: 'last',
+            }),
           ]),
       }),
 
       // Object explorer.
       GraphBuilder.createExtension({
-        id: `${meta.id}.space-objects`,
+        id: 'space-objects',
         match: NodeMatcher.whenRoot,
         connector: () =>
           Effect.succeed([
-            {
+            AppNode.makeDeckCompanion({
               id: 'space-objects',
-              type: DECK_COMPANION_TYPE,
+              label: ['space-objects.label', { ns: meta.id }],
+              icon: 'ph--cube--regular',
               data: 'space-objects' as const,
-              properties: {
-                label: ['space objects label', { ns: meta.id }],
-                icon: 'ph--cube--regular',
-                disposition: 'hidden',
-                position: 'fallback',
-              },
-            },
+              position: 'last',
+            }),
           ]),
       }),
     ]);

package/src/capabilities/index.ts

@@ -2,7 +2,9 @@
 // Copyright 2025 DXOS.org
 //
 
-export * from './app-graph-builder';
-export * from './react-context';
-export * from './react-surface';
-export * from './settings';
+import { Capability } from '@dxos/app-framework';
+
+export const AppGraphBuilder = Capability.lazy('AppGraphBuilder', () => import('./app-graph-builder'));
+export const ReactContext = Capability.lazy('ReactContext', () => import('./react-context'));
+export const ReactSurface = Capability.lazy('ReactSurface', () => import('./react-surface'));
+export const DebugSettings = Capability.lazy('DebugSettings', () => import('./settings'));

package/src/capabilities/{react-context/react-context.tsx → react-context.tsx}

@@ -9,7 +9,7 @@ import { Capabilities, Capability } from '@dxos/app-framework';
 import { Surface } from '@dxos/app-framework/ui';
 import { DevtoolsContextProvider } from '@dxos/devtools';
 
-import { meta } from '../../meta';
+import { meta } from '#meta';
 
 export default Capability.makeModule(() =>
   Effect.succeed(