@dxos/plugin-debug 0.8.4-main.bc674ce → 0.8.4-main.c351d160a8

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

@@ -5,8 +5,10 @@
 import * as Effect from 'effect/Effect';
 import React, { useCallback } from 'react';
 
-import { Capability, Common } from '@dxos/app-framework';
-import { useCapability, useLayout, useOperationInvoker, useSettingsState } from '@dxos/app-framework/react';
+import { Capabilities, Capability } from '@dxos/app-framework';
+import { Surface, useCapability, useOperationInvoker, useSettingsState } from '@dxos/app-framework/ui';
+import { AppCapabilities, LayoutOperation, getObjectPathFromObject } from '@dxos/app-toolkit';
+
 import {
   AutomergePanel,
   ConfigPanel,
@@ -35,24 +37,27 @@ import {
   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 { Layout } from '@dxos/react-ui-mosaic';
-import { Collection } from '@dxos/schema';
+import { useActiveSpace } from '@dxos/plugin-space';
+import { type Space, SpaceState, isSpace } from '@dxos/react-client/echo';
+import { Panel } from '@dxos/react-ui';
 
 import {
   DebugGraph,
   DebugObjectPanel,
   DebugSettings,
+  DebugSpaceObjectsPanel,
   DebugStatus,
   DevtoolsOverviewContainer,
   SpaceGenerator,
   Wireframe,
-} from '../../components';
+} from '../../containers';
 import { meta } from '../../meta';
 import { DebugCapabilities, type DebugSettingsProps, Devtools } from '../../types';
 
@@ -66,7 +71,7 @@ type GraphDebug = {
   root: string;
 };
 
-const isSpaceDebug = (data: any): data is SpaceDebug => data?.type === `${meta.id}/space` && isSpace(data.space);
+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 (
@@ -74,34 +79,31 @@ const isGraphDebug = (data: any): data is GraphDebug => {
   );
 };
 
-// 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;
+const useCurrentSpace = useActiveSpace;
+
+type ReactSurfaceOptions = {
+  logBuffer: LogBuffer;
 };
 
 export default Capability.makeModule(
-  Effect.fnUntraced(function* () {
+  Effect.fnUntraced(function* ({ logBuffer }: ReactSurfaceOptions) {
     const capabilities = yield* Capability.Service;
-    const registry = capabilities.get(Common.Capability.AtomRegistry);
+    const registry = capabilities.get(Capabilities.AtomRegistry);
     const settingsAtom = capabilities.get(DebugCapabilities.Settings);
 
-    return Capability.contributes(Common.Capability.ReactSurface, [
-      Common.createSurface({
-        id: `${meta.id}/plugin-settings`,
+    return Capability.contributes(Capabilities.ReactSurface, [
+      Surface.create({
+        id: `${meta.id}.plugin-settings`,
         role: 'article',
-        filter: (data): data is { subject: Common.Capability.Settings } =>
-          Common.Capability.isSettings(data.subject) && data.subject.prefix === meta.id,
+        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} />;
+          return <DebugSettings settings={settings} onSettingsChange={updateSettings} logBuffer={logBuffer} />;
         },
       }),
-      Common.createSurface({
-        id: `${meta.id}/space`,
+      Surface.create({
+        id: `${meta.id}.space`,
         role: 'article',
         filter: (data): data is { subject: SpaceDebug } => isSpaceDebug(data.subject),
         component: ({ role, data }) => {
@@ -131,102 +133,111 @@ export default Capability.makeModule(
           );
 
           return (
-            <Layout.Main role={role}>
-              <SpaceGenerator space={data.subject.space} onCreateObjects={handleCreateObject} />
-            </Layout.Main>
+            <Panel.Root role={role} className='dx-document'>
+              <Panel.Content asChild>
+                <SpaceGenerator space={data.subject.space} onCreateObjects={handleCreateObject} />
+              </Panel.Content>
+            </Panel.Root>
           );
         },
       }),
-      Common.createSurface({
-        id: `${meta.id}/app-graph`,
+      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} />,
       }),
-      Common.createSurface({
-        id: `${meta.id}/wireframe`,
+      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 }) => (
+        component: ({ data, role, name }) => (
           <Wireframe label={`${role}:${name}`} object={data.subject} classNames='row-span-2 overflow-hidden' />
         ),
       }),
-      Common.createSurface({
-        id: `${meta.id}/object-debug`,
+      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} />,
       }),
-      Common.createSurface({
-        id: `${meta.id}/devtools-overview`,
+      Surface.create({
+        id: `${meta.id}.devtools-overview`,
         role: 'deck-companion--devtools',
+        filter: (data): data is { subject: 'devtools' } => data.subject === 'devtools',
         component: () => <DevtoolsOverviewContainer />,
       }),
-      Common.createSurface({
-        id: `${meta.id}/status`,
+      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
       //
 
-      Common.createSurface({
-        id: `${meta.id}/client/config`,
+      Surface.create({
+        id: `${meta.id}.client.config`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Client.Config,
         component: () => <ConfigPanel vaultSelector={false} />,
       }),
-      Common.createSurface({
-        id: `${meta.id}/client/storage`,
+      Surface.create({
+        id: `${meta.id}.client.storage`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Client.Storage,
         component: () => <StoragePanel />,
       }),
-      Common.createSurface({
-        id: `${meta.id}/client/logs`,
+      Surface.create({
+        id: `${meta.id}.client.logs`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Client.Logs,
         component: () => <LoggingPanel />,
       }),
-      Common.createSurface({
-        id: `${meta.id}/client/diagnostics`,
+      Surface.create({
+        id: `${meta.id}.client.diagnostics`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Client.Diagnostics,
         component: () => <DiagnosticsPanel />,
       }),
-      Common.createSurface({
-        id: `${meta.id}/client/tracing`,
+      Surface.create({
+        id: `${meta.id}.client.tracing`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Client.Tracing,
         component: () => <TracingPanel />,
       }),
-      Common.createSurface({
-        id: `${meta.id}/halo/identity`,
+      Surface.create({
+        id: `${meta.id}.halo.identity`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Halo.Identity,
         component: () => <IdentityPanel />,
       }),
-      Common.createSurface({
-        id: `${meta.id}/halo/devices`,
+      Surface.create({
+        id: `${meta.id}.halo.devices`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Halo.Devices,
         component: () => <DeviceListPanel />,
       }),
-      Common.createSurface({
-        id: `${meta.id}/halo/keyring`,
+      Surface.create({
+        id: `${meta.id}.halo.keyring`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Halo.Keyring,
         component: () => <KeyringPanel />,
       }),
-      Common.createSurface({
-        id: `${meta.id}/halo/credentials`,
+      Surface.create({
+        id: `${meta.id}.halo.credentials`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Halo.Credentials,
         component: () => {
@@ -234,35 +245,35 @@ export default Capability.makeModule(
           return <CredentialsPanel space={space} />;
         },
       }),
-      Common.createSurface({
-        id: `${meta.id}/echo/spaces`,
+      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(Common.LayoutOperation.Open, { subject: [Devtools.Echo.Space] }),
+            () => invokePromise(LayoutOperation.Open, { subject: [Devtools.Echo.Space] }),
             [invokePromise],
           );
           return <SpaceListPanel onSelect={handleSelect} />;
         },
       }),
-      Common.createSurface({
-        id: `${meta.id}/echo/space`,
+      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(Common.LayoutOperation.Open, { subject: [Devtools.Echo.Feeds] }),
+            () => invokePromise(LayoutOperation.Open, { subject: [Devtools.Echo.Feeds] }),
             [invokePromise],
           );
           return <SpaceInfoPanel space={space} onSelectFeed={handleSelect} onSelectPipeline={handleSelect} />;
         },
       }),
-      Common.createSurface({
-        id: `${meta.id}/echo/feeds`,
+      Surface.create({
+        id: `${meta.id}.echo.feeds`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Echo.Feeds,
         component: () => {
@@ -270,8 +281,8 @@ export default Capability.makeModule(
           return <FeedsPanel space={space} />;
         },
       }),
-      Common.createSurface({
-        id: `${meta.id}/echo/objects`,
+      Surface.create({
+        id: `${meta.id}.echo.objects`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Echo.Objects,
         component: () => {
@@ -279,8 +290,8 @@ export default Capability.makeModule(
           return <ObjectsPanel space={space} />;
         },
       }),
-      Common.createSurface({
-        id: `${meta.id}/echo/schema`,
+      Surface.create({
+        id: `${meta.id}.echo.schema`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Echo.Schema,
         component: () => {
@@ -288,8 +299,8 @@ export default Capability.makeModule(
           return <SchemaPanel space={space} />;
         },
       }),
-      Common.createSurface({
-        id: `${meta.id}/echo/automerge`,
+      Surface.create({
+        id: `${meta.id}.echo.automerge`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Echo.Automerge,
         component: () => {
@@ -297,14 +308,14 @@ export default Capability.makeModule(
           return <AutomergePanel space={space} />;
         },
       }),
-      Common.createSurface({
-        id: `${meta.id}/echo/queues`,
+      Surface.create({
+        id: `${meta.id}.echo.queues`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Echo.Queues,
         component: () => <QueuesPanel />,
       }),
-      Common.createSurface({
-        id: `${meta.id}/echo/members`,
+      Surface.create({
+        id: `${meta.id}.echo.members`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Echo.Members,
         component: () => {
@@ -312,26 +323,26 @@ export default Capability.makeModule(
           return <MembersPanel space={space} />;
         },
       }),
-      Common.createSurface({
-        id: `${meta.id}/echo/metadata`,
+      Surface.create({
+        id: `${meta.id}.echo.metadata`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Echo.Metadata,
         component: () => <MetadataPanel />,
       }),
-      Common.createSurface({
-        id: `${meta.id}/mesh/signal`,
+      Surface.create({
+        id: `${meta.id}.mesh.signal`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Mesh.Signal,
         component: () => <SignalPanel />,
       }),
-      Common.createSurface({
-        id: `${meta.id}/mesh/swarm`,
+      Surface.create({
+        id: `${meta.id}.mesh.swarm`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Mesh.Swarm,
         component: () => <SwarmPanel />,
       }),
-      Common.createSurface({
-        id: `${meta.id}/mesh/network`,
+      Surface.create({
+        id: `${meta.id}.mesh.network`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Mesh.Network,
         component: () => {
@@ -339,21 +350,14 @@ export default Capability.makeModule(
           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 />,
-      // }),
-      Common.createSurface({
-        id: `${meta.id}/edge/dashboard`,
+      Surface.create({
+        id: `${meta.id}.edge.dashboard`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Edge.Dashboard,
         component: () => <EdgeDashboardPanel />,
       }),
-      Common.createSurface({
-        id: `${meta.id}/edge/workflows`,
+      Surface.create({
+        id: `${meta.id}.edge.workflows`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Edge.Workflows,
         component: () => {
@@ -361,8 +365,8 @@ export default Capability.makeModule(
           return <WorkflowPanel space={space} />;
         },
       }),
-      Common.createSurface({
-        id: `${meta.id}/edge/traces`,
+      Surface.create({
+        id: `${meta.id}.edge.traces`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Edge.Traces,
         component: () => {
@@ -371,8 +375,8 @@ export default Capability.makeModule(
           return <InvocationTraceContainer db={space?.db} queueDxn={queueDxn} detailAxis='block' />;
         },
       }),
-      Common.createSurface({
-        id: `${meta.id}/edge/testing`,
+      Surface.create({
+        id: `${meta.id}.edge.testing`,
         role: 'article',
         filter: (data): data is any => data.subject === Devtools.Edge.Testing,
         component: () => {
@@ -393,9 +397,9 @@ export default Capability.makeModule(
                 await invokePromise(SpaceOperation.AddObject, { target: space.db, object: createResult.data.object });
               }
               log.info('script created', { result: createResult });
-              if (createResult.data?.object?.id) {
-                await invokePromise(Common.LayoutOperation.Open, {
-                  subject: [`${space.id}:${createResult.data.object.id}`],
+              if (createResult.data?.object) {
+                await invokePromise(LayoutOperation.Open, {
+                  subject: [getObjectPathFromObject(createResult.data.object)],
                 });
               }
             },

package/src/capabilities/settings/settings.ts

@@ -4,7 +4,8 @@
 
 import * as Effect from 'effect/Effect';
 
-import { Capability, Common } from '@dxos/app-framework';
+import { Capability } from '@dxos/app-framework';
+import { AppCapabilities } from '@dxos/app-toolkit';
 import { createKvsStore } from '@dxos/effect';
 
 import { meta } from '../../meta';
@@ -20,7 +21,7 @@ export default Capability.makeModule(() =>
 
     return [
       Capability.contributes(DebugCapabilities.Settings, settingsAtom),
-      Capability.contributes(Common.Capability.Settings, {
+      Capability.contributes(AppCapabilities.Settings, {
         prefix: meta.id,
         schema: DebugSettingsSchema,
         atom: settingsAtom,

package/src/components/{SpaceGenerator → SchemaTable}/SchemaTable.tsx

@@ -19,8 +19,8 @@ export const SchemaTable = ({ types, objects = {}, label, onClick }: SchemaTable
       <h2 className='p-2'>{label}</h2>
       {types.map((type) => (
         <div key={type.typename} className='grid grid-cols-subgrid col-span-3 items-center'>
-          <div className='pli-2 text-sm font-mono text-subdued'>{type.typename}</div>
-          <div className='pli-2 text-right font-mono'>{objects[type.typename] ?? 0}</div>
+          <div className='px-2 text-sm font-mono text-subdued'>{type.typename}</div>
+          <div className='px-2 text-right font-mono'>{objects[type.typename] ?? 0}</div>
           <IconButton
             variant='ghost'
             icon='ph--plus--regular'

package/src/components/SchemaTable/index.ts

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

package/src/components/SpaceGenerator/ObjectGenerator.tsx

@@ -7,15 +7,16 @@ 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, type Type } from '@dxos/echo';
+import { View } from '@dxos/echo';
 import { type OperationInvoker } from '@dxos/operation';
 import { Markdown } from '@dxos/plugin-markdown/types';
 import { Sheet } from '@dxos/plugin-sheet/types';
-import { Diagram } from '@dxos/plugin-sketch/types';
+import { Sketch } 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 { View, getTypenameFromQuery } from '@dxos/schema';
+import { getTypenameFromQuery } from '@dxos/schema';
 import { type ValueGenerator, createAsyncGenerator } from '@dxos/schema/testing';
 import { range } from '@dxos/util';
 
@@ -27,7 +28,7 @@ const findViewByTypename = async (views: View.View[], typename: string) => {
 
 export type ObjectGenerator<T> = (space: Space, n: number, cb?: (objects: T[]) => void) => Promise<T[]>;
 
-export const createGenerator = <S extends Type.Obj.Any>(
+export const createGenerator = <S extends Type.AnyObj>(
   client: Client,
   invokePromise: OperationInvoker.OperationInvoker['invokePromise'],
   schema: S,
@@ -41,8 +42,6 @@ export const createGenerator = <S extends Type.Obj.Any>(
     const staticSchema = client?.graph.schemaRegistry.query({ typename }).runSync()[0];
     if (!view && !staticSchema) {
       await invokePromise(SpaceOperation.AddSchema, { db: space.db, schema, show: false });
-    } else if (!view && staticSchema) {
-      await invokePromise(SpaceOperation.UseStaticSchema, { db: space.db, typename, show: false });
     }
 
     // Create objects.
@@ -69,10 +68,10 @@ export const staticGenerators = new Map<string, ObjectGenerator<any>>([
     },
   ],
   [
-    Diagram.Diagram.typename,
+    Sketch.Sketch.typename,
     async (space, n, cb) => {
       const objects = range(n).map(() => {
-        const obj = space.db.add(Diagram.make({ name: faker.commerce.productName() }));
+        const obj = space.db.add(Sketch.make({ name: faker.commerce.productName() }));
         return obj;
       });
 

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';