@dxos/plugin-debug 0.8.4-main.9735255 → 0.8.4-main.abd8ff62ef

package/src/containers/SpaceGenerator/SpaceGenerator.tsx

@@ -0,0 +1,126 @@
+//
+// Copyright 2024 DXOS.org
+//
+
+import React, { useCallback, useMemo, useState } from 'react';
+
+import { useOperationInvoker } from '@dxos/app-framework/ui';
+import { ComputeGraph } from '@dxos/conductor';
+import { Filter, Obj, type Type } from '@dxos/echo';
+import { Markdown } from '@dxos/plugin-markdown/types';
+import { Sheet } from '@dxos/plugin-sheet/types';
+import { Sketch } from '@dxos/plugin-sketch/types';
+import { useClient } from '@dxos/react-client';
+import { type Space } from '@dxos/react-client/echo';
+import { IconButton, Input, Panel, ScrollArea, Toolbar, useAsyncEffect } from '@dxos/react-ui';
+import { Organization, Person, Task } from '@dxos/types';
+import { composable, composableProps } from '@dxos/ui-theme';
+import { sortKeys } from '@dxos/util';
+
+import { type ObjectGenerator, SchemaTable, createGenerator, generator, staticGenerators } from '#components';
+
+// TODO(burdon): Make extensible.
+const staticTypes = [Markdown.Document, Sketch.Sketch, Sheet.Sheet, ComputeGraph];
+const recordTypes: Type.AnyObj[] = [Organization.Organization, Person.Person, Task.Task];
+
+export type SpaceGeneratorProps = {
+  space: Space;
+  onCreateObjects?: (objects: Obj.Unknown[]) => void;
+};
+
+export const SpaceGenerator = composable<HTMLDivElement, SpaceGeneratorProps>(
+  ({ space, onCreateObjects, children, ...props }, forwardedRef) => {
+    const { invokePromise } = useOperationInvoker();
+    const client = useClient();
+    const [count, setCount] = useState(1);
+    const [info, setInfo] = useState<any>({});
+    const presets = useMemo(() => generator(), []);
+
+    // Register types.
+    useAsyncEffect(async () => {
+      await client.addTypes([...staticTypes, ...recordTypes, ...presets.schemas]);
+    }, [client, presets]);
+
+    // Create type generators.
+    const typeMap = useMemo(() => {
+      const recordGenerators = new Map<string, ObjectGenerator<any>>(
+        recordTypes.map((type) => [type.typename, createGenerator(client, invokePromise, type)]),
+      );
+
+      return new Map([...staticGenerators, ...presets.items, ...recordGenerators]);
+    }, [client, invokePromise, presets]);
+
+    // Query space to get info.
+    const updateInfo = useCallback(async () => {
+      const echoSchema = await space.db.schemaRegistry.query().run();
+      const staticSchema = await space.db.graph.schemaRegistry.query().run();
+
+      const objects = await space.db.query(Filter.everything()).run();
+      const objectMap = sortKeys(
+        objects.reduce<Record<string, number>>((map, obj) => {
+          const type = Obj.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,
+      });
+    }, [space]);
+
+    useAsyncEffect(updateInfo, [updateInfo]);
+
+    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, space, onCreateObjects, updateInfo],
+    );
+
+    return (
+      <Panel.Root {...composableProps(props)} ref={forwardedRef}>
+        <Panel.Toolbar asChild>
+          <Toolbar.Root>
+            <IconButton icon='ph--arrow-clockwise--regular' iconOnly label='Refresh' onClick={updateInfo} />
+            <Toolbar.Separator />
+            <Input.Root>
+              <Input.TextInput
+                type='number'
+                placeholder='Count'
+                classNames='w-[4rem] text-right'
+                min={1}
+                max={100}
+                size={8}
+                value={count}
+                onChange={(event) => setCount(parseInt(event.target.value))}
+              />
+            </Input.Root>
+          </Toolbar.Root>
+        </Panel.Toolbar>
+        <Panel.Content asChild>
+          <ScrollArea.Root thin orientation='vertical'>
+            <ScrollArea.Viewport classNames='dx-document gap-4 divide-y divide-subdued-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} />
+            </ScrollArea.Viewport>
+          </ScrollArea.Root>
+        </Panel.Content>
+      </Panel.Root>
+    );
+  },
+);

package/src/containers/SpaceGenerator/index.ts

@@ -0,0 +1,5 @@
+//
+// Copyright 2024 DXOS.org
+//
+
+export { SpaceGenerator as default } from './SpaceGenerator';

package/src/{components → containers/Wireframe}/Wireframe.tsx

@@ -8,7 +8,7 @@ import { useResizeDetector } from 'react-resize-detector';
 import { Obj } from '@dxos/echo';
 import { type ThemedClassName } from '@dxos/react-ui';
 import { useAttentionAttributes } from '@dxos/react-ui-attention';
-import { SyntaxHighlighter } from '@dxos/react-ui-syntax-highlighter';
+import { JsonHighlighter } from '@dxos/react-ui-syntax-highlighter';
 import { mx } from '@dxos/ui-theme';
 
 // TODO(burdon): Create generic container with wireframe mode.
@@ -23,17 +23,13 @@ export const Wireframe = ({ classNames, label, object }: WireframeProps) => {
   const { width, height, ref } = useResizeDetector();
 
   return (
-    <div ref={ref} className={mx('relative grow min-bs-96', classNames)} {...attentionAttrs}>
+    <div ref={ref} className={mx('relative grow min-h-96', classNames)} {...attentionAttrs}>
       <div className='absolute inset-2 flex flex-col gap-2 overflow-hidden font-mono'>
         <div className='flex justify-between'>
           <div>{label}</div>
           <div>{`[${width}x${height}]`}</div>
         </div>
-        {object && (
-          <SyntaxHighlighter language='json' classNames='text-xs opacity-75 rounded'>
-            {JSON.stringify(object, undefined, 2)}
-          </SyntaxHighlighter>
-        )}
+        {object && <JsonHighlighter data={object} classNames='text-xs opacity-75 rounded-sm' />}
       </div>
       <svg width={width} height={height} className='bg-transparent *:text-subdued'>
         <rect x={0} y={0} width={width} height={height} strokeWidth={1} fill='none' />

package/src/containers/Wireframe/index.ts

@@ -0,0 +1,5 @@
+//
+// Copyright 2024 DXOS.org
+//
+
+export { Wireframe as default } from './Wireframe';

package/src/containers/index.ts

@@ -0,0 +1,13 @@
+//
+// Copyright 2023 DXOS.org
+//
+
+import { type ComponentType, lazy } from 'react';
+
+export const DebugGraph: ComponentType<any> = lazy(() => import('./DebugGraph'));
+export const DebugObjectPanel: ComponentType<any> = lazy(() => import('./DebugObjectPanel'));
+export const DebugStatus: ComponentType<any> = lazy(() => import('./DebugStatus'));
+export const DevtoolsOverviewContainer: ComponentType<any> = lazy(() => import('./DevtoolsOverviewContainer'));
+export const SpaceGenerator: ComponentType<any> = lazy(() => import('./SpaceGenerator'));
+export const Wireframe: ComponentType<any> = lazy(() => import('./Wireframe'));
+export const DebugSpaceObjectsPanel: ComponentType<any> = lazy(() => import('./DebugSpaceObjectsPanel'));

package/src/index.ts

@@ -2,5 +2,11 @@
 // Copyright 2023 DXOS.org
 //
 
-export * from './DebugPlugin';
+import { Plugin } from '@dxos/app-framework';
+
+import { meta } from './meta';
+
+export const DebugPlugin = Plugin.lazy(meta, () => import('#plugin'));
+export type { DebugPluginOptions } from '#types';
+
 export * from './meta';

package/src/meta.ts

@@ -6,7 +6,7 @@ import { type Plugin } from '@dxos/app-framework';
 import { trim } from '@dxos/util';
 
 export const meta: Plugin.Meta = {
-  id: 'dxos.org/plugin/debug',
+  id: 'org.dxos.plugin.debug',
   name: 'Debug',
   description: trim`
     Comprehensive developer toolkit for troubleshooting applications, generating test data, and exploring automation capabilities.

package/src/translations.ts

@@ -3,71 +3,88 @@
 //
 
 import { type Resource } from '@dxos/react-ui';
+import { translations as introspectTranslations } from '@dxos/react-ui-introspect/translations';
 
-import { meta } from './meta';
+import { meta } from '#meta';
 
 export const translations = [
+  ...introspectTranslations,
   {
     'en-US': {
       [meta.id]: {
-        'plugin name': 'Debug',
-        'settings title': 'Debug settings',
-        'mutation count': 'Number of mutations',
-        'mutation period': 'Mutation period',
-        'open devtools label': 'Open DevTools',
-        'devtools label': 'DevTools',
-        'devtools overview label': 'Stats',
-        'debug label': 'Debug',
-        'debug app graph label': 'App Graph',
-        'settings show debug panel': 'Show Debug panel.',
-        'settings show devtools panel': 'Show DevTools panel.',
-        'settings wireframe': 'Show wireframes.',
-        'settings repair': 'Run repair tool.',
-        'settings download diagnostics': 'Download diagnostics.',
-        'settings uploaded': 'Uploaded to IPFS',
-        'settings uploaded to clipboard': 'URL copied to clipboard.',
-        'settings repair success': 'Repair succeeded',
-        'settings repair failed': 'Repair failed',
-        'settings choose storage adaptor': 'Storage adaptor (worker reload required).',
-        'settings storage adaptor idb label': 'IndexedDB',
-        'settings storage adaptor opfs label': 'OPFS',
-        'settings data store label': 'Data Store',
-        'settings storage adapter changed alert':
+        'plugin.name': 'Debug',
+        'settings.title': 'Debug settings',
+        'open-devtools.label': 'Open DevTools',
+        'devtools.label': 'DevTools',
+        'devtools-overview.label': 'Stats',
+        'space-objects.label': 'Database',
+        'debug.label': 'Debug',
+        'generate-objects.label': 'Generate Objects',
+        'debug-app-graph.label': 'App Graph',
+        'debug-tools-explorer.label': 'Tools Explorer',
+
+        'settings.wireframe.label': 'Show wireframes.',
+        'settings.wireframe.description': 'Overlay wireframe outlines on UI components for debugging layout.',
+        'settings.trace-all.label': 'Trace all requests (100% sampling).',
+        'settings.trace-all.description':
+          'Override the default 30% sampling rate to capture all traces. Requires page reload to take effect.',
+        'settings.tracing-panel.label': 'Open tracing panel.',
+        'settings.tracing-panel.description': 'Open the tracing dashboard to inspect captured spans.',
+        'settings.repair.label': 'Run repair tool.',
+        'settings.repair.description': 'Attempt to detect and fix inconsistencies in local data storage.',
+        'settings.download-diagnostics.label': 'Download diagnostics.',
+        'settings.download-diagnostics.description':
+          'Export a JSON file containing client diagnostics for troubleshooting.',
+        'settings.download-logs.label': 'Download log buffer.',
+        'settings.download-logs.description': 'Export the in-memory log buffer as an NDJSON file.',
+        'settings.uploaded.message': 'Settings uploaded.',
+        'settings.uploaded.description': 'URL copied to clipboard.',
+        'settings.choose-storage-adaptor.label': 'Storage adaptor (worker reload required).',
+        'settings.choose-storage-adaptor.description':
+          'Select the browser storage backend. Changing this requires a worker reload and may make existing data unavailable.',
+        'settings.repair-success.message': 'Repair succeeded',
+        'settings.repair-failed.message': 'Repair failed',
+
+        'settings.storage-adaptor.idb.label': 'IndexedDB',
+        'settings.storage-adaptor.opfs.label': 'OPFS',
+        'settings.storage-adapter.changed-alert.message':
           'Warning: Swapping the storage adapter will make your data unavailable.',
-        'settings space fragmentation': 'Enable AM space fragmentation',
-        'open debug panel label': 'Show Debug',
-        'client label': 'Client',
-        'config label': 'Config',
-        'storage label': 'Storage',
-        'logs label': 'Logs',
-        'diagnostics label': 'Diagnostics',
-        'tracing label': 'Tracing',
-        'halo label': 'HALO',
-        'identity label': 'Identity',
-        'devices label': 'Devices',
-        'keyring label': 'Keyring',
-        'credentials label': 'Credentials',
-        'echo label': 'ECHO',
-        'spaces label': 'Spaces',
-        'space label': 'Space',
-        'feeds label': 'Feeds',
-        'objects label': 'Objects',
-        'schema label': 'Schema',
-        'automerge label': 'Automerge',
-        'queues label': 'Queues',
-        'members label': 'Members',
-        'metadata label': 'Metadata',
-        'mesh label': 'MESH',
-        'signal label': 'Signal',
-        'swarm label': 'Swarm',
-        'network label': 'Network',
-        'agent label': 'Agent',
-        'dashboard label': 'Dashboard',
-        'search label': 'Search',
-        'edge label': 'EDGE',
-        'workflows label': 'Workflows',
-        'traces label': 'Traces',
-        'testing label': 'Testing',
+
+        'settings.data-store.label': 'Data Store',
+
+        'open-debug-panel.label': 'Show Debug',
+        'client.label': 'Client',
+        'config.label': 'Config',
+        'storage.label': 'Storage',
+        'logs.label': 'Logs',
+        'diagnostics.label': 'Diagnostics',
+        'tracing.label': 'Tracing',
+        'halo.label': 'HALO',
+        'identity.label': 'Identity',
+        'devices.label': 'Devices',
+        'keyring.label': 'Keyring',
+        'credentials.label': 'Credentials',
+        'echo.label': 'ECHO',
+        'spaces.label': 'Spaces',
+        'space.label': 'Space',
+        'feeds.label': 'Feeds',
+        'objects.label': 'Objects',
+        'schema.label': 'Schema',
+        'automerge.label': 'Automerge',
+        'queues.label': 'Queues',
+        'members.label': 'Members',
+        'metadata.label': 'Metadata',
+        'mesh.label': 'MESH',
+        'signal.label': 'Signal',
+        'swarm.label': 'Swarm',
+        'network.label': 'Network',
+        'agent.label': 'Agent',
+        'dashboard.label': 'Dashboard',
+        'search.label': 'Search',
+        'edge.label': 'EDGE',
+        'workflows.label': 'Workflows',
+        'traces.label': 'Traces',
+        'testing.label': 'Testing',
       },
     },
   },

package/src/types/Settings.ts

@@ -0,0 +1,16 @@
+//
+// Copyright 2023 DXOS.org
+//
+
+// @import-as-namespace
+
+import * as Schema from 'effect/Schema';
+
+export const Settings = Schema.mutable(
+  Schema.Struct({
+    wireframe: Schema.optional(Schema.Boolean),
+    traceAll: Schema.optional(Schema.Boolean),
+  }),
+);
+
+export interface Settings extends Schema.Schema.Type<typeof Settings> {}

package/src/{types.ts → types/index.ts}

@@ -3,13 +3,22 @@
 //
 
 import { type Atom } from '@effect-atom/atom-react';
-import * as Schema from 'effect/Schema';
 import { type Context, createContext } from 'react';
 
 import { Capability } from '@dxos/app-framework';
 import type { TimerCallback, TimerOptions } from '@dxos/async';
+import { type IdbLogStore } from '@dxos/log-store-idb';
 
-import { meta } from './meta';
+import { meta } from '#meta';
+
+import * as Settings from './Settings';
+
+export * as Settings from './Settings';
+
+export type DebugPluginOptions = {
+  /** Shared persistent log store for capturing and downloading logs. */
+  logStore?: IdbLogStore;
+};
 
 export type DebugContextType = {
   running: boolean;
@@ -23,21 +32,14 @@ export const DebugContext: Context<DebugContextType> = createContext<DebugContex
   stop: () => {},
 });
 
-export const DebugSettingsSchema = Schema.mutable(
-  Schema.Struct({
-    wireframe: Schema.optional(Schema.Boolean),
-  }),
-);
-
-export interface DebugSettingsProps extends Schema.Schema.Type<typeof DebugSettingsSchema> {}
-
 export namespace DebugCapabilities {
-  export const Settings = Capability.make<Atom.Writable<DebugSettingsProps>>(`${meta.id}/capability/settings`);
+  export const Settings = Capability.make<Atom.Writable<Settings.Settings>>(`${meta.id}.capability.settings`);
 }
 
 export namespace Devtools {
-  // TODO(wittjosiah): Cannot use slashes in ids until we have a router which decouples ids from url paths.
-  export const id = 'dxos.org.plugin.debug.devtools';
+  export const id = `${meta.id}.devtools`;
+
+  export const ToolsExplorer = `${Devtools.id}.tools-explorer`;
 
   export namespace Client {
     export const id = `${Devtools.id}.client`;
@@ -45,7 +47,6 @@ export namespace Devtools {
     export const Storage = `${Devtools.Client.id}.storage`;
     export const Logs = `${Devtools.Client.id}.logs`;
     export const Diagnostics = `${Devtools.Client.id}.diagnostics`;
-    export const Tracing = `${Devtools.Client.id}.tracing`;
   }
 
   export namespace Halo {

package/dist/lib/browser/DebugGraph-6VMEOKEV.mjs

@@ -1,15 +0,0 @@
-// src/components/DebugGraph.tsx
-import React from "react";
-import { Tree } from "@dxos/devtools";
-import { Graph } from "@dxos/plugin-graph";
-var DebugGraph = ({ graph, root }) => {
-  return /* @__PURE__ */ React.createElement(Tree, {
-    data: Graph.toJSON(graph, root)
-  });
-};
-var DebugGraph_default = DebugGraph;
-export {
-  DebugGraph,
-  DebugGraph_default as default
-};
-//# sourceMappingURL=DebugGraph-6VMEOKEV.mjs.map

package/dist/lib/browser/DebugGraph-6VMEOKEV.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/components/DebugGraph.tsx"],
-  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport React, { type FC } from 'react';\n\nimport { Tree } from '@dxos/devtools';\nimport { Graph } from '@dxos/plugin-graph';\n\nexport type DebugGraphProps = { graph: Graph.Graph; root: string };\nexport const DebugGraph: FC<DebugGraphProps> = ({ graph, root }) => {\n  return <Tree data={Graph.toJSON(graph, root)} />;\n};\n\nexport default DebugGraph;\n"],
-  "mappings": ";AAIA,OAAOA,WAAwB;AAE/B,SAASC,YAAY;AACrB,SAASC,aAAa;AAGf,IAAMC,aAAkC,CAAC,EAAEC,OAAOC,KAAI,MAAE;AAC7D,SAAO,sBAAA,cAACC,MAAAA;IAAKC,MAAMC,MAAMC,OAAOL,OAAOC,IAAAA;;AACzC;AAEA,IAAA,qBAAeF;",
-  "names": ["React", "Tree", "Graph", "DebugGraph", "graph", "root", "Tree", "data", "Graph", "toJSON"]
-}

package/dist/lib/browser/DevtoolsOverviewContainer-77PKFLYV.mjs

@@ -1,19 +0,0 @@
-// src/components/DevtoolsOverviewContainer.tsx
-import React from "react";
-import { Surface } from "@dxos/app-framework/react";
-import { StatsPanel, useStats } from "@dxos/devtools";
-var DevtoolsOverviewContainer = () => {
-  const [stats, refreshStats] = useStats();
-  return /* @__PURE__ */ React.createElement(StatsPanel, {
-    stats,
-    onRefresh: refreshStats
-  }, /* @__PURE__ */ React.createElement(Surface, {
-    role: "devtools-overview"
-  }));
-};
-var DevtoolsOverviewContainer_default = DevtoolsOverviewContainer;
-export {
-  DevtoolsOverviewContainer,
-  DevtoolsOverviewContainer_default as default
-};
-//# sourceMappingURL=DevtoolsOverviewContainer-77PKFLYV.mjs.map

package/dist/lib/browser/DevtoolsOverviewContainer-77PKFLYV.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/components/DevtoolsOverviewContainer.tsx"],
-  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport React from 'react';\n\nimport { Surface } from '@dxos/app-framework/react';\nimport { StatsPanel, useStats } from '@dxos/devtools';\n\nexport const DevtoolsOverviewContainer = () => {\n  const [stats, refreshStats] = useStats();\n\n  return (\n    <StatsPanel stats={stats} onRefresh={refreshStats}>\n      <Surface role='devtools-overview' />\n    </StatsPanel>\n  );\n};\n\nexport default DevtoolsOverviewContainer;\n"],
-  "mappings": ";AAIA,OAAOA,WAAW;AAElB,SAASC,eAAe;AACxB,SAASC,YAAYC,gBAAgB;AAE9B,IAAMC,4BAA4B,MAAA;AACvC,QAAM,CAACC,OAAOC,YAAAA,IAAgBC,SAAAA;AAE9B,SACE,sBAAA,cAACC,YAAAA;IAAWH;IAAcI,WAAWH;KACnC,sBAAA,cAACI,SAAAA;IAAQC,MAAK;;AAGpB;AAEA,IAAA,oCAAeP;",
-  "names": ["React", "Surface", "StatsPanel", "useStats", "DevtoolsOverviewContainer", "stats", "refreshStats", "useStats", "StatsPanel", "onRefresh", "Surface", "role"]
-}