@dxos/plugin-debug 0.8.4-main.c4373fc → 0.8.4-main.c85a9c8dae

package/src/capabilities/react-surface/react-surface.tsx

@@ -0,0 +1,428 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import * as Effect from 'effect/Effect';
+import React, { useCallback } from 'react';
+
+import { Capabilities, Capability } from '@dxos/app-framework';
+import { Surface, useCapability, useOperationInvoker, useSettingsState } from '@dxos/app-framework/ui';
+import { AppCapabilities, LayoutOperation } from '@dxos/app-toolkit';
+import { useLayout } from '@dxos/app-toolkit/ui';
+import {
+  AutomergePanel,
+  ConfigPanel,
+  CredentialsPanel,
+  DeviceListPanel,
+  DiagnosticsPanel,
+  EdgeDashboardPanel,
+  FeedsPanel,
+  IdentityPanel,
+  InvocationTraceContainer,
+  KeyringPanel,
+  LoggingPanel,
+  MembersPanel,
+  MetadataPanel,
+  NetworkPanel,
+  ObjectsPanel,
+  QueuesPanel,
+  SchemaPanel,
+  SignalPanel,
+  SpaceInfoPanel,
+  SpaceListPanel,
+  StoragePanel,
+  SwarmPanel,
+  TestingPanel,
+  TracingPanel,
+  WorkflowPanel,
+} from '@dxos/devtools';
+import { Obj } from '@dxos/echo';
+import { Collection } from '@dxos/echo';
+import { type LogBuffer } from '@dxos/log';
+import { log } from '@dxos/log';
+import { ClientCapabilities } from '@dxos/plugin-client';
+import { type Graph } from '@dxos/plugin-graph';
+import { ScriptOperation } from '@dxos/plugin-script/types';
+import { SpaceOperation } from '@dxos/plugin-space/types';
+import { type Space, SpaceState, isSpace, parseId } from '@dxos/react-client/echo';
+import { Panel } from '@dxos/react-ui';
+
+import {
+  DebugGraph,
+  DebugObjectPanel,
+  DebugSettings,
+  DebugSpaceObjectsPanel,
+  DebugStatus,
+  DevtoolsOverviewContainer,
+  SpaceGenerator,
+  Wireframe,
+} from '../../containers';
+import { meta } from '../../meta';
+import { DebugCapabilities, type DebugSettingsProps, Devtools } from '../../types';
+
+type SpaceDebug = {
+  type: string;
+  space: Space;
+};
+
+type GraphDebug = {
+  graph: Graph.Graph;
+  root: string;
+};
+
+const isSpaceDebug = (data: any): data is SpaceDebug => data?.type === `${meta.id}/space` && isSpace(data.space);
+const isGraphDebug = (data: any): data is GraphDebug => {
+  const graph = data?.graph;
+  return (
+    graph != null && typeof graph === 'object' && typeof graph.json === 'function' && typeof data?.root === 'string'
+  );
+};
+
+// TODO(wittjosiah): Factor out?
+const useCurrentSpace = () => {
+  const layout = useLayout();
+  const client = useCapability(ClientCapabilities.Client);
+  const { spaceId } = parseId(layout.workspace);
+  const space = spaceId ? client.spaces.get(spaceId) : undefined;
+  return space;
+};
+
+type ReactSurfaceOptions = {
+  logBuffer: LogBuffer;
+};
+
+export default Capability.makeModule(
+  Effect.fnUntraced(function* ({ logBuffer }: ReactSurfaceOptions) {
+    const capabilities = yield* Capability.Service;
+    const registry = capabilities.get(Capabilities.AtomRegistry);
+    const settingsAtom = capabilities.get(DebugCapabilities.Settings);
+
+    return Capability.contributes(Capabilities.ReactSurface, [
+      Surface.create({
+        id: `${meta.id}/plugin-settings`,
+        role: 'article',
+        filter: (data): data is { subject: AppCapabilities.Settings } =>
+          AppCapabilities.isSettings(data.subject) && data.subject.prefix === meta.id,
+        component: ({ data: { subject } }) => {
+          const { settings, updateSettings } = useSettingsState<DebugSettingsProps>(subject.atom);
+          return <DebugSettings settings={settings} onSettingsChange={updateSettings} logBuffer={logBuffer} />;
+        },
+      }),
+      Surface.create({
+        id: `${meta.id}/space`,
+        role: 'article',
+        filter: (data): data is { subject: SpaceDebug } => isSpaceDebug(data.subject),
+        component: ({ role, data }) => {
+          const { invokePromise } = useOperationInvoker();
+
+          const handleCreateObject = useCallback(
+            (objects: Obj.Unknown[]) => {
+              if (!isSpace(data.subject.space)) {
+                return;
+              }
+
+              const collection =
+                data.subject.space.state.get() === SpaceState.SPACE_READY &&
+                data.subject.space.properties[Collection.Collection.typename]?.target;
+              if (!Obj.instanceOf(Collection.Collection, collection)) {
+                return;
+              }
+
+              objects.forEach((object) => {
+                void invokePromise(SpaceOperation.AddObject, {
+                  target: collection,
+                  object,
+                });
+              });
+            },
+            [data.subject.space, invokePromise],
+          );
+
+          return (
+            <Panel.Root role={role} className='dx-article'>
+              <Panel.Content asChild>
+                <Panel.Content asChild>
+                  <SpaceGenerator space={data.subject.space} onCreateObjects={handleCreateObject} />
+                </Panel.Content>
+              </Panel.Content>
+            </Panel.Root>
+          );
+        },
+      }),
+      Surface.create({
+        id: `${meta.id}/app-graph`,
+        role: 'article',
+        filter: (data): data is { subject: GraphDebug } => isGraphDebug(data.subject),
+        component: ({ data }) => <DebugGraph graph={data.subject.graph} root={data.subject.root} />,
+      }),
+      Surface.create({
+        id: `${meta.id}/wireframe`,
+        role: ['article', 'section'],
+        position: 'hoist',
+        filter: (data): data is { subject: Obj.Unknown } => {
+          const settings = registry.get(settingsAtom);
+          return Obj.isObject(data.subject) && !!settings.wireframe;
+        },
+        component: ({ data, role, name }) => (
+          <Wireframe label={`${role}:${name}`} object={data.subject} classNames='row-span-2 overflow-hidden' />
+        ),
+      }),
+      Surface.create({
+        id: `${meta.id}/object-debug`,
+        role: 'article',
+        filter: (data): data is { companionTo: Obj.Unknown } =>
+          data.subject === 'debug' && Obj.isObject(data.companionTo),
+        component: ({ data }) => <DebugObjectPanel object={data.companionTo} />,
+      }),
+      Surface.create({
+        id: `${meta.id}/devtools-overview`,
+        role: 'deck-companion--devtools',
+        filter: (data): data is { subject: 'devtools' } => data.subject === 'devtools',
+        component: () => <DevtoolsOverviewContainer />,
+      }),
+      Surface.create({
+        id: `${meta.id}/space-objects`,
+        role: 'deck-companion--space-objects',
+        filter: (data): data is { subject: 'space-objects' } => data.subject === 'space-objects',
+        component: () => <DebugSpaceObjectsPanel />,
+      }),
+
+      Surface.create({
+        id: `${meta.id}/status`,
+        role: 'status',
+        component: () => <DebugStatus />,
+      }),
+      //
+      // Devtools
+      //
+
+      Surface.create({
+        id: `${meta.id}/client/config`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Client.Config,
+        component: () => <ConfigPanel vaultSelector={false} />,
+      }),
+      Surface.create({
+        id: `${meta.id}/client/storage`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Client.Storage,
+        component: () => <StoragePanel />,
+      }),
+      Surface.create({
+        id: `${meta.id}/client/logs`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Client.Logs,
+        component: () => <LoggingPanel />,
+      }),
+      Surface.create({
+        id: `${meta.id}/client/diagnostics`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Client.Diagnostics,
+        component: () => <DiagnosticsPanel />,
+      }),
+      Surface.create({
+        id: `${meta.id}/client/tracing`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Client.Tracing,
+        component: () => <TracingPanel />,
+      }),
+      Surface.create({
+        id: `${meta.id}/halo/identity`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Halo.Identity,
+        component: () => <IdentityPanel />,
+      }),
+      Surface.create({
+        id: `${meta.id}/halo/devices`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Halo.Devices,
+        component: () => <DeviceListPanel />,
+      }),
+      Surface.create({
+        id: `${meta.id}/halo/keyring`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Halo.Keyring,
+        component: () => <KeyringPanel />,
+      }),
+      Surface.create({
+        id: `${meta.id}/halo/credentials`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Halo.Credentials,
+        component: () => {
+          const space = useCurrentSpace();
+          return <CredentialsPanel space={space} />;
+        },
+      }),
+      Surface.create({
+        id: `${meta.id}/echo/spaces`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Echo.Spaces,
+        component: () => {
+          const { invokePromise } = useOperationInvoker();
+          const handleSelect = useCallback(
+            () => invokePromise(LayoutOperation.Open, { subject: [Devtools.Echo.Space] }),
+            [invokePromise],
+          );
+          return <SpaceListPanel onSelect={handleSelect} />;
+        },
+      }),
+      Surface.create({
+        id: `${meta.id}/echo/space`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Echo.Space,
+        component: () => {
+          const space = useCurrentSpace();
+          const { invokePromise } = useOperationInvoker();
+          const handleSelect = useCallback(
+            () => invokePromise(LayoutOperation.Open, { subject: [Devtools.Echo.Feeds] }),
+            [invokePromise],
+          );
+          return <SpaceInfoPanel space={space} onSelectFeed={handleSelect} onSelectPipeline={handleSelect} />;
+        },
+      }),
+      Surface.create({
+        id: `${meta.id}/echo/feeds`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Echo.Feeds,
+        component: () => {
+          const space = useCurrentSpace();
+          return <FeedsPanel space={space} />;
+        },
+      }),
+      Surface.create({
+        id: `${meta.id}/echo/objects`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Echo.Objects,
+        component: () => {
+          const space = useCurrentSpace();
+          return <ObjectsPanel space={space} />;
+        },
+      }),
+      Surface.create({
+        id: `${meta.id}/echo/schema`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Echo.Schema,
+        component: () => {
+          const space = useCurrentSpace();
+          return <SchemaPanel space={space} />;
+        },
+      }),
+      Surface.create({
+        id: `${meta.id}/echo/automerge`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Echo.Automerge,
+        component: () => {
+          const space = useCurrentSpace();
+          return <AutomergePanel space={space} />;
+        },
+      }),
+      Surface.create({
+        id: `${meta.id}/echo/queues`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Echo.Queues,
+        component: () => <QueuesPanel />,
+      }),
+      Surface.create({
+        id: `${meta.id}/echo/members`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Echo.Members,
+        component: () => {
+          const space = useCurrentSpace();
+          return <MembersPanel space={space} />;
+        },
+      }),
+      Surface.create({
+        id: `${meta.id}/echo/metadata`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Echo.Metadata,
+        component: () => <MetadataPanel />,
+      }),
+      Surface.create({
+        id: `${meta.id}/mesh/signal`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Mesh.Signal,
+        component: () => <SignalPanel />,
+      }),
+      Surface.create({
+        id: `${meta.id}/mesh/swarm`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Mesh.Swarm,
+        component: () => <SwarmPanel />,
+      }),
+      Surface.create({
+        id: `${meta.id}/mesh/network`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Mesh.Network,
+        component: () => {
+          const space = useCurrentSpace();
+          return <NetworkPanel space={space} />;
+        },
+      }),
+      // TODO(wittjosiah): Remove?
+      // createSurface({
+      //   id: `${meta.id}/agent/dashboard`,
+      //   role: 'article',
+      //   filter: (data): data is any => data.subject === Devtools.Agent.Dashboard,
+      //   component: () => <DashboardPanel />,
+      // }),
+      Surface.create({
+        id: `${meta.id}/edge/dashboard`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Edge.Dashboard,
+        component: () => <EdgeDashboardPanel />,
+      }),
+      Surface.create({
+        id: `${meta.id}/edge/workflows`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Edge.Workflows,
+        component: () => {
+          const space = useCurrentSpace();
+          return <WorkflowPanel space={space} />;
+        },
+      }),
+      Surface.create({
+        id: `${meta.id}/edge/traces`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Edge.Traces,
+        component: () => {
+          const space = useCurrentSpace();
+          const queueDxn = space?.properties.invocationTraceQueue?.dxn;
+          return <InvocationTraceContainer db={space?.db} queueDxn={queueDxn} detailAxis='block' />;
+        },
+      }),
+      Surface.create({
+        id: `${meta.id}/edge/testing`,
+        role: 'article',
+        filter: (data): data is any => data.subject === Devtools.Edge.Testing,
+        component: () => {
+          const { invokePromise } = useOperationInvoker();
+          const onSpaceCreate = useCallback(
+            async (space: Space) => {
+              await space.waitUntilReady();
+              await invokePromise(SpaceOperation.Migrate, { space });
+              await space.db.flush();
+            },
+            [invokePromise],
+          );
+          const onScriptPluginOpen = useCallback(
+            async (space: Space) => {
+              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 });
+              }
+              log.info('script created', { result: createResult });
+              if (createResult.data?.object?.id) {
+                await invokePromise(LayoutOperation.Open, {
+                  subject: [`${space.id}:${createResult.data.object.id}`],
+                });
+              }
+            },
+            [invokePromise],
+          );
+          return <TestingPanel onSpaceCreate={onSpaceCreate} onScriptPluginOpen={onScriptPluginOpen} />;
+        },
+      }),
+    ]);
+  }),
+);

package/src/capabilities/settings/index.ts

@@ -0,0 +1,7 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import { Capability } from '@dxos/app-framework';
+
+export const DebugSettings = Capability.lazy('DebugSettings', () => import('./settings'));

package/src/capabilities/settings/settings.ts

@@ -0,0 +1,31 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import * as Effect from 'effect/Effect';
+
+import { Capability } from '@dxos/app-framework';
+import { AppCapabilities } from '@dxos/app-toolkit';
+import { createKvsStore } from '@dxos/effect';
+
+import { meta } from '../../meta';
+import { DebugCapabilities, DebugSettingsSchema } from '../../types';
+
+export default Capability.makeModule(() =>
+  Effect.sync(() => {
+    const settingsAtom = createKvsStore({
+      key: meta.id,
+      schema: DebugSettingsSchema,
+      defaultValue: () => ({}),
+    });
+
+    return [
+      Capability.contributes(DebugCapabilities.Settings, settingsAtom),
+      Capability.contributes(AppCapabilities.Settings, {
+        prefix: meta.id,
+        schema: DebugSettingsSchema,
+        atom: settingsAtom,
+      }),
+    ];
+  }),
+);

package/src/components/SchemaTable/index.ts

@@ -0,0 +1,5 @@
+//
+// Copyright 2023 DXOS.org
+//
+
+export * from './SchemaTable';

package/src/components/SpaceGenerator/ObjectGenerator.tsx

@@ -2,47 +2,48 @@
 // Copyright 2024 DXOS.org
 //
 
-import { type PromiseIntentDispatcher, createIntent } from '@dxos/app-framework';
+import type * as Schema from 'effect/Schema';
+
 import { addressToA1Notation } from '@dxos/compute';
 import { ComputeGraph, ComputeGraphModel, DEFAULT_OUTPUT, NODE_INPUT, NODE_OUTPUT } from '@dxos/conductor';
-import { DXN, Filter, Key, Obj, Ref, Type } from '@dxos/echo';
-import { type TypedObject } from '@dxos/echo/internal';
+import { DXN, Filter, Key, type Type } from '@dxos/echo';
+import { View } from '@dxos/echo';
+import { type OperationInvoker } from '@dxos/operation';
 import { Markdown } from '@dxos/plugin-markdown/types';
-import { createSheet } from '@dxos/plugin-sheet/types';
-import { type CellValue, SheetType } from '@dxos/plugin-sheet/types';
-import { CanvasType, DiagramType } from '@dxos/plugin-sketch/types';
-import { SpaceAction } from '@dxos/plugin-space/types';
+import { Sheet } from '@dxos/plugin-sheet/types';
+import { Diagram } from '@dxos/plugin-sketch/types';
+import { SpaceOperation } from '@dxos/plugin-space/types';
 import { faker } from '@dxos/random';
 import { type Client } from '@dxos/react-client';
 import { type Space } from '@dxos/react-client/echo';
-import { DataType, getTypenameFromQuery } from '@dxos/schema';
+import { getTypenameFromQuery } from '@dxos/schema';
 import { type ValueGenerator, createAsyncGenerator } from '@dxos/schema/testing';
 import { range } from '@dxos/util';
 
 const generator: ValueGenerator = faker as any;
 
-const findViewByTypename = async (views: DataType.View[], typename: string) => {
+const findViewByTypename = async (views: View.View[], typename: string) => {
   return views.find((view) => getTypenameFromQuery(view.query.ast) === typename);
 };
 
-export type ObjectGenerator<T extends Obj.Any> = (space: Space, n: number, cb?: (objects: T[]) => void) => Promise<T[]>;
+export type ObjectGenerator<T> = (space: Space, n: number, cb?: (objects: T[]) => void) => Promise<T[]>;
 
-export const createGenerator = <T extends Obj.Any>(
+export const createGenerator = <S extends Type.AnyObj>(
   client: Client,
-  dispatch: PromiseIntentDispatcher,
-  schema: TypedObject<T>,
-): ObjectGenerator<T> => {
-  return async (space: Space, n: number): Promise<T[]> => {
+  invokePromise: OperationInvoker.OperationInvoker['invokePromise'],
+  schema: S,
+): ObjectGenerator<Schema.Schema.Type<S>> => {
+  return async (space: Space, n: number): Promise<Schema.Schema.Type<S>[]> => {
     const typename = schema.typename;
 
     // Find or create table and view.
-    const { objects: views } = await space.db.query(Filter.type(DataType.View)).run();
+    const views = await space.db.query(Filter.type(View.View)).run();
     const view = await findViewByTypename(views, typename);
-    const staticSchema = client?.graph.schemaRegistry.schemas.find((schema) => Type.getTypename(schema) === typename);
+    const staticSchema = client?.graph.schemaRegistry.query({ typename }).runSync()[0];
     if (!view && !staticSchema) {
-      await dispatch(createIntent(SpaceAction.AddSchema, { space, schema }));
+      await invokePromise(SpaceOperation.AddSchema, { db: space.db, schema, show: false });
     } else if (!view && staticSchema) {
-      await dispatch(createIntent(SpaceAction.UseStaticSchema, { space, typename }));
+      await invokePromise(SpaceOperation.UseStaticSchema, { db: space.db, typename, show: false });
     }
 
     // Create objects.
@@ -57,7 +58,7 @@ export const staticGenerators = new Map<string, ObjectGenerator<any>>([
     async (space, n, cb) => {
       const objects = range(n).map(() => {
         return space.db.add(
-          Markdown.makeDocument({
+          Markdown.make({
             name: faker.commerce.productName(),
             content: faker.lorem.sentences(5),
           }),
@@ -69,17 +70,10 @@ export const staticGenerators = new Map<string, ObjectGenerator<any>>([
     },
   ],
   [
-    DiagramType.typename,
+    Diagram.Diagram.typename,
     async (space, n, cb) => {
       const objects = range(n).map(() => {
-        // TODO(burdon): Generate diagram.
-        const obj = space.db.add(
-          Obj.make(DiagramType, {
-            name: faker.commerce.productName(),
-            canvas: Ref.make(Obj.make(CanvasType, { content: {} })),
-          }),
-        );
-
+        const obj = space.db.add(Diagram.make({ name: faker.commerce.productName() }));
         return obj;
       });
 
@@ -89,10 +83,10 @@ export const staticGenerators = new Map<string, ObjectGenerator<any>>([
   ],
   // TODO(burdon): Create unit tests.
   [
-    SheetType.typename,
+    Sheet.Sheet.typename,
     async (space, n, cb) => {
       const objects = range(n).map(() => {
-        const cells: Record<string, CellValue> = {};
+        const cells: Record<string, Sheet.CellValue> = {};
         const year = new Date().getFullYear();
         const cols = 4;
         const rows = 16;
@@ -114,7 +108,7 @@ export const staticGenerators = new Map<string, ObjectGenerator<any>>([
         // TODO(burdon): Set width.
         // TODO(burdon): Set formatting for columns.
         return space.db.add(
-          createSheet({
+          Sheet.make({
             name: faker.commerce.productName(),
             cells,
           }),

package/src/components/SpaceGenerator/index.ts

@@ -2,6 +2,5 @@
 // Copyright 2023 DXOS.org
 //
 
-import { SpaceGenerator } from './SpaceGenerator';
-
-export default SpaceGenerator;
+export * from './presets';
+export * from './ObjectGenerator';