@dxos/plugin-debug 0.8.4-main.72ec0f3 → 0.8.4-main.7996785055

package/src/capabilities/react-surface.tsx

@@ -1,418 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import * as Function from 'effect/Function';
-import React, { useCallback } from 'react';
-
-import {
-  Capabilities,
-  LayoutAction,
-  type PluginContext,
-  chain,
-  contributes,
-  createIntent,
-  createSurface,
-} from '@dxos/app-framework';
-import { useCapability, useIntentDispatcher } from '@dxos/app-framework/react';
-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 { SettingsStore } from '@dxos/local-storage';
-import { log } from '@dxos/log';
-import { ClientCapabilities } from '@dxos/plugin-client';
-import { Graph } from '@dxos/plugin-graph';
-import { ScriptAction } from '@dxos/plugin-script/types';
-import { SpaceAction } from '@dxos/plugin-space/types';
-import { type Space, SpaceState, isSpace, parseId } from '@dxos/react-client/echo';
-import { StackItem } from '@dxos/react-ui-stack';
-import { Collection } from '@dxos/schema';
-
-import {
-  DebugGraph,
-  DebugObjectPanel,
-  DebugSettings,
-  DebugStatus,
-  DevtoolsOverviewContainer,
-  SpaceGenerator,
-  Wireframe,
-} from '../components';
-import { meta } from '../meta';
-import { type DebugSettingsProps, Devtools } from '../types';
-
-type SpaceDebug = {
-  type: string;
-  space: Space;
-};
-
-type GraphDebug = {
-  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 => data?.graph instanceof Graph && typeof data?.root === 'string';
-
-// TODO(wittjosiah): Factor out?
-const useCurrentSpace = () => {
-  const layout = useCapability(Capabilities.Layout);
-  const client = useCapability(ClientCapabilities.Client);
-  const { spaceId } = parseId(layout.workspace);
-  const space = spaceId ? client.spaces.get(spaceId) : undefined;
-  return space;
-};
-
-export default (context: PluginContext) =>
-  contributes(Capabilities.ReactSurface, [
-    createSurface({
-      id: `${meta.id}/plugin-settings`,
-      role: 'article',
-      filter: (data): data is { subject: SettingsStore<DebugSettingsProps> } =>
-        data.subject instanceof SettingsStore && data.subject.prefix === meta.id,
-      component: ({ data: { subject } }) => <DebugSettings settings={subject.value} />,
-    }),
-    createSurface({
-      id: `${meta.id}/space`,
-      role: 'article',
-      filter: (data): data is { subject: SpaceDebug } => isSpaceDebug(data.subject),
-      component: ({ data }) => {
-        const { dispatchPromise: dispatch } = useIntentDispatcher();
-
-        const handleCreateObject = useCallback(
-          (objects: Obj.Any[]) => {
-            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 dispatch(
-                createIntent(SpaceAction.AddObject, {
-                  target: collection,
-                  object,
-                }),
-              );
-            });
-          },
-          [data.subject.space],
-        );
-
-        return (
-          <StackItem.Content>
-            <SpaceGenerator space={data.subject.space} onCreateObjects={handleCreateObject} />
-          </StackItem.Content>
-        );
-      },
-    }),
-    createSurface({
-      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} />,
-    }),
-    createSurface({
-      id: `${meta.id}/wireframe`,
-      role: ['article', 'section'],
-      position: 'hoist',
-      filter: (data): data is { subject: Obj.Any } => {
-        const settings = context.getCapability(Capabilities.SettingsStore).getStore<DebugSettingsProps>(meta.id)!.value;
-        return Obj.isObject(data.subject) && !!settings.wireframe;
-      },
-      component: ({ data, role }) => (
-        <Wireframe label={`${role}:${name}`} object={data.subject} classNames='row-span-2 overflow-hidden' />
-      ),
-    }),
-    createSurface({
-      id: `${meta.id}/object-debug`,
-      role: 'article',
-      filter: (data): data is { companionTo: Obj.Any } => data.subject === 'debug' && Obj.isObject(data.companionTo),
-      component: ({ data }) => <DebugObjectPanel object={data.companionTo} />,
-    }),
-    createSurface({
-      id: `${meta.id}/devtools-overview`,
-      role: 'deck-companion--devtools',
-      component: () => <DevtoolsOverviewContainer />,
-    }),
-    createSurface({
-      id: `${meta.id}/status`,
-      role: 'status',
-      component: () => <DebugStatus />,
-    }),
-
-    //
-    // Devtools
-    //
-
-    createSurface({
-      id: `${meta.id}/client/config`,
-      role: 'article',
-      filter: (data): data is any => data.subject === Devtools.Client.Config,
-      component: () => <ConfigPanel vaultSelector={false} />,
-    }),
-    createSurface({
-      id: `${meta.id}/client/storage`,
-      role: 'article',
-      filter: (data): data is any => data.subject === Devtools.Client.Storage,
-      component: () => <StoragePanel />,
-    }),
-    createSurface({
-      id: `${meta.id}/client/logs`,
-      role: 'article',
-      filter: (data): data is any => data.subject === Devtools.Client.Logs,
-      component: () => <LoggingPanel />,
-    }),
-    createSurface({
-      id: `${meta.id}/client/diagnostics`,
-      role: 'article',
-      filter: (data): data is any => data.subject === Devtools.Client.Diagnostics,
-      component: () => <DiagnosticsPanel />,
-    }),
-    createSurface({
-      id: `${meta.id}/client/tracing`,
-      role: 'article',
-      filter: (data): data is any => data.subject === Devtools.Client.Tracing,
-      component: () => <TracingPanel />,
-    }),
-    createSurface({
-      id: `${meta.id}/halo/identity`,
-      role: 'article',
-      filter: (data): data is any => data.subject === Devtools.Halo.Identity,
-      component: () => <IdentityPanel />,
-    }),
-    createSurface({
-      id: `${meta.id}/halo/devices`,
-      role: 'article',
-      filter: (data): data is any => data.subject === Devtools.Halo.Devices,
-      component: () => <DeviceListPanel />,
-    }),
-    createSurface({
-      id: `${meta.id}/halo/keyring`,
-      role: 'article',
-      filter: (data): data is any => data.subject === Devtools.Halo.Keyring,
-      component: () => <KeyringPanel />,
-    }),
-    createSurface({
-      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} />;
-      },
-    }),
-    createSurface({
-      id: `${meta.id}/echo/spaces`,
-      role: 'article',
-      filter: (data): data is any => data.subject === Devtools.Echo.Spaces,
-      component: () => {
-        const { dispatchPromise: dispatch } = useIntentDispatcher();
-        const handleSelect = useCallback(
-          () =>
-            dispatch(
-              createIntent(LayoutAction.Open, {
-                part: 'main',
-                subject: [Devtools.Echo.Space],
-              }),
-            ),
-          [dispatch],
-        );
-        return <SpaceListPanel onSelect={handleSelect} />;
-      },
-    }),
-    createSurface({
-      id: `${meta.id}/echo/space`,
-      role: 'article',
-      filter: (data): data is any => data.subject === Devtools.Echo.Space,
-      component: () => {
-        const space = useCurrentSpace();
-        const { dispatchPromise: dispatch } = useIntentDispatcher();
-        const handleSelect = useCallback(
-          () =>
-            dispatch(
-              createIntent(LayoutAction.Open, {
-                part: 'main',
-                subject: [Devtools.Echo.Feeds],
-              }),
-            ),
-          [dispatch],
-        );
-        return <SpaceInfoPanel space={space} onSelectFeed={handleSelect} onSelectPipeline={handleSelect} />;
-      },
-    }),
-    createSurface({
-      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} />;
-      },
-    }),
-    createSurface({
-      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} />;
-      },
-    }),
-    createSurface({
-      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} />;
-      },
-    }),
-    createSurface({
-      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} />;
-      },
-    }),
-    createSurface({
-      id: `${meta.id}/echo/queues`,
-      role: 'article',
-      filter: (data): data is any => data.subject === Devtools.Echo.Queues,
-      component: () => <QueuesPanel />,
-    }),
-    createSurface({
-      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} />;
-      },
-    }),
-    createSurface({
-      id: `${meta.id}/echo/metadata`,
-      role: 'article',
-      filter: (data): data is any => data.subject === Devtools.Echo.Metadata,
-      component: () => <MetadataPanel />,
-    }),
-    createSurface({
-      id: `${meta.id}/mesh/signal`,
-      role: 'article',
-      filter: (data): data is any => data.subject === Devtools.Mesh.Signal,
-      component: () => <SignalPanel />,
-    }),
-    createSurface({
-      id: `${meta.id}/mesh/swarm`,
-      role: 'article',
-      filter: (data): data is any => data.subject === Devtools.Mesh.Swarm,
-      component: () => <SwarmPanel />,
-    }),
-    createSurface({
-      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 />,
-    // }),
-    createSurface({
-      id: `${meta.id}/edge/dashboard`,
-      role: 'article',
-      filter: (data): data is any => data.subject === Devtools.Edge.Dashboard,
-      component: () => <EdgeDashboardPanel />,
-    }),
-    createSurface({
-      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} />;
-      },
-    }),
-    createSurface({
-      id: `${meta.id}/edge/traces`,
-      role: 'article',
-      filter: (data): data is any => data.subject === Devtools.Edge.Traces,
-      component: () => {
-        const space = useCurrentSpace();
-        return <InvocationTraceContainer space={space} detailAxis='block' />;
-      },
-    }),
-    createSurface({
-      id: `${meta.id}/edge/testing`,
-      role: 'article',
-      filter: (data): data is any => data.subject === Devtools.Edge.Testing,
-      component: () => {
-        const { dispatchPromise: dispatch } = useIntentDispatcher();
-        const onSpaceCreate = useCallback(
-          async (space: Space) => {
-            await space.waitUntilReady();
-            await dispatch(createIntent(SpaceAction.Migrate, { space }));
-            await space.db.flush();
-          },
-          [dispatch],
-        );
-        const onScriptPluginOpen = useCallback(
-          async (space: Space) => {
-            await space.waitUntilReady();
-            const result = await dispatch(
-              Function.pipe(
-                createIntent(ScriptAction.CreateScript, { space }),
-                chain(SpaceAction.AddObject, { target: space }),
-              ),
-            );
-            log.info('script created', { result });
-            await dispatch(
-              createIntent(LayoutAction.Open, {
-                part: 'main',
-                subject: [`${space.id}:${result.data?.object.id}`],
-              }),
-            );
-          },
-          [dispatch],
-        );
-        return <TestingPanel onSpaceCreate={onSpaceCreate} onScriptPluginOpen={onScriptPluginOpen} />;
-      },
-    }),
-  ]);

package/src/capabilities/settings.ts

@@ -1,19 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import { Capabilities, contributes } from '@dxos/app-framework';
-import { live } from '@dxos/live-object';
-
-import { meta } from '../meta';
-import { type DebugSettingsProps, DebugSettingsSchema } from '../types';
-
-export default () => {
-  const settings = live<DebugSettingsProps>({});
-
-  return contributes(Capabilities.Settings, {
-    prefix: meta.id,
-    schema: DebugSettingsSchema,
-    value: settings,
-  });
-};

package/src/components/Container.tsx

@@ -1,15 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import React, { type PropsWithChildren, type ReactNode } from 'react';
-
-// TODO(burdon): Convert to grid.
-export const Container = ({ toolbar, children }: PropsWithChildren<{ toolbar: ReactNode }>) => {
-  return (
-    <div role='none' className='flex flex-col grow overflow-hidden divide-y divide-separator'>
-      {toolbar}
-      <div className='flex flex-col grow overflow-auto'>{children}</div>
-    </div>
-  );
-};

package/src/components/DebugGraph.tsx

@@ -1,14 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import React, { type FC } from 'react';
-
-import { Tree } from '@dxos/devtools';
-import { type Graph } from '@dxos/plugin-graph';
-
-export const DebugGraph: FC<{ graph: Graph; root: string }> = ({ graph, root }) => {
-  return <Tree data={graph.toJSON(root)} />;
-};
-
-export default DebugGraph;

package/src/components/DebugObjectPanel.tsx

@@ -1,33 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import React from 'react';
-
-import { type Obj } from '@dxos/echo';
-import { Clipboard, Input, Toolbar } from '@dxos/react-ui';
-import { StackItem } from '@dxos/react-ui-stack';
-import { Json } from '@dxos/react-ui-syntax-highlighter';
-
-export type DebugObjectPanelProps = {
-  object: Obj.Any;
-};
-
-// TODO(burdon): Get schema and traverse references.
-export const DebugObjectPanel = ({ object }: DebugObjectPanelProps) => {
-  const dxn = `dxn:echo:@:${object.id}`;
-
-  return (
-    <Clipboard.Provider>
-      <StackItem.Content toolbar>
-        <Toolbar.Root>
-          <Input.Root>
-            <Input.TextInput disabled value={dxn} />
-            <Clipboard.IconButton value={dxn} />
-          </Input.Root>
-        </Toolbar.Root>
-        <Json data={object} />
-      </StackItem.Content>
-    </Clipboard.Provider>
-  );
-};

package/src/components/DevtoolsOverviewContainer.tsx

@@ -1,20 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import React from 'react';
-
-import { Surface } from '@dxos/app-framework/react';
-import { StatsPanel, useStats } from '@dxos/devtools';
-
-export const DevtoolsOverviewContainer = () => {
-  const [stats, refreshStats] = useStats();
-
-  return (
-    <StatsPanel stats={stats} onRefresh={refreshStats}>
-      <Surface role='devtools-overview' />
-    </StatsPanel>
-  );
-};
-
-export default DevtoolsOverviewContainer;

package/src/components/SpaceGenerator/SpaceGenerator.stories.tsx

@@ -1,52 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import { type Meta, type StoryObj } from '@storybook/react-vite';
-import React from 'react';
-
-import { IntentPlugin } from '@dxos/app-framework';
-import { withPluginManager } from '@dxos/app-framework/testing';
-import { ClientPlugin } from '@dxos/plugin-client';
-import { useSpaces } from '@dxos/react-client/echo';
-import { withTheme } from '@dxos/react-ui/testing';
-import { render } from '@dxos/storybook-utils';
-
-import { SpaceGenerator } from './SpaceGenerator';
-
-const DefaultStory = () => {
-  const [space] = useSpaces();
-  if (!space) {
-    return null;
-  }
-
-  return <SpaceGenerator space={space} />;
-};
-
-const meta = {
-  title: 'plugins/plugin-debug/SpaceGenerator',
-  component: SpaceGenerator as any,
-  render: render(DefaultStory),
-  decorators: [
-    withTheme,
-    withPluginManager({
-      plugins: [
-        ClientPlugin({
-          onClientInitialized: async ({ client }) => {
-            await client.halo.createIdentity();
-          },
-        }),
-        IntentPlugin(),
-      ],
-    }),
-  ],
-  parameters: {
-    layout: 'fullscreen',
-  },
-} satisfies Meta<typeof DefaultStory>;
-
-export default meta;
-
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {};

package/src/components/SpaceGenerator/SpaceGenerator.tsx

@@ -1,122 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import React, { useCallback, useMemo, useState } from 'react';
-
-import { useIntentDispatcher } from '@dxos/app-framework/react';
-import { ComputeGraph } from '@dxos/conductor';
-import { Filter, type Obj } from '@dxos/echo';
-import { Markdown } from '@dxos/plugin-markdown/types';
-import { Sheet } from '@dxos/plugin-sheet/types';
-import { Diagram } from '@dxos/plugin-sketch/types';
-import { useClient } from '@dxos/react-client';
-import { type Space, getTypename } from '@dxos/react-client/echo';
-import { IconButton, Input, Toolbar, useAsyncEffect } from '@dxos/react-ui';
-import { SyntaxHighlighter } from '@dxos/react-ui-syntax-highlighter';
-import { Organization, Person, Task } from '@dxos/types';
-import { jsonKeyReplacer, sortKeys } from '@dxos/util';
-
-import { type ObjectGenerator, createGenerator, staticGenerators } from './ObjectGenerator';
-import { generator } from './presets';
-import { SchemaTable } from './SchemaTable';
-
-export type SpaceGeneratorProps = {
-  space: Space;
-  onCreateObjects?: (objects: Obj.Any[]) => void;
-};
-
-export const SpaceGenerator = ({ space, onCreateObjects }: SpaceGeneratorProps) => {
-  const { dispatchPromise: dispatch } = useIntentDispatcher();
-  const client = useClient();
-  const staticTypes = [Markdown.Document, Diagram.Diagram, Sheet.Sheet, ComputeGraph]; // TODO(burdon): Make extensible.
-  const recordTypes = [Organization.Organization, Person.Person, Task.Task];
-  const [count, setCount] = useState(1);
-  const [info, setInfo] = useState<any>({});
-  const presets = useMemo(() => generator(), []);
-
-  // Create type generators.
-  const typeMap = useMemo(() => {
-    client.addTypes([...staticTypes, ...recordTypes, ...presets.schemas]);
-    const recordGenerators = new Map<string, ObjectGenerator<any>>(
-      recordTypes.map((type) => [type.typename, createGenerator(client, dispatch, type as any)]),
-    );
-
-    return new Map([...staticGenerators, ...presets.items, ...recordGenerators]);
-  }, [client, recordTypes]);
-
-  // Query space to get info.
-  const updateInfo = async () => {
-    // Create schema map.
-    const echoSchema = await space.db.schemaRegistry.query().run();
-    const staticSchema = space.db.graph.schemaRegistry.schemas;
-
-    // Create object map.
-    const { objects } = await space.db.query(Filter.everything()).run();
-    const objectMap = sortKeys(
-      objects.reduce<Record<string, number>>((map, obj) => {
-        const type = getTypename(obj);
-        if (type) {
-          const count = map[type] ?? 0;
-          map[type] = count + 1;
-        }
-        return map;
-      }, {}),
-    );
-
-    setInfo({
-      schema: {
-        static: staticSchema.length,
-        mutable: echoSchema.length,
-      },
-      objects: objectMap,
-    });
-  };
-
-  useAsyncEffect(updateInfo, [space]);
-
-  const handleCreateData = useCallback(
-    async (typename: string) => {
-      const constructor = typeMap.get(typename);
-      if (constructor) {
-        // TODO(burdon): Input to specify number of objects.
-        await constructor(space, count, onCreateObjects);
-        await updateInfo();
-      }
-    },
-    [typeMap, count],
-  );
-
-  return (
-    <div role='none' className='flex flex-col grow overflow-hidden'>
-      <Toolbar.Root classNames='border-be border-subduedSeparator'>
-        <IconButton icon='ph--arrow-clockwise--regular' iconOnly label='Refresh' onClick={updateInfo} />
-        <Toolbar.Separator variant='gap' />
-        <Input.Root>
-          <Input.TextInput
-            type='number'
-            min={1}
-            max={100}
-            placeholder={'Count'}
-            classNames='!w-[4rem] !text-right'
-            size={8}
-            value={count}
-            onChange={(ev) => setCount(parseInt(ev.target.value))}
-          />
-        </Input.Root>
-      </Toolbar.Root>
-
-      <div className='flex flex-col overflow-y-auto divide-y divide-separator'>
-        <SchemaTable types={staticTypes} objects={info.objects} label='Static Types' onClick={handleCreateData} />
-        <SchemaTable types={recordTypes} objects={info.objects} label='Record Types' onClick={handleCreateData} />
-        <SchemaTable types={presets.types} objects={info.objects} label='Presets' onClick={handleCreateData} />
-
-        <div>
-          <SyntaxHighlighter language='json' classNames='text-xs'>
-            {JSON.stringify({ space, ...info }, jsonKeyReplacer({ truncate: true }), 2)}
-          </SyntaxHighlighter>
-        </div>
-      </div>
-    </div>
-  );
-};