@dxos/plugin-debug 0.8.4-main.2e9d522 → 0.8.4-main.3c1ae3b

package/src/components/SpaceGenerator/presets.ts

@@ -2,12 +2,17 @@
 // Copyright 2025 DXOS.org
 //
 
-import { Schema } from 'effect';
+import * as Schema from 'effect/Schema';
 
+import { Agent, EntityExtraction, ResearchBlueprint } from '@dxos/assistant-toolkit';
+import { Prompt } from '@dxos/blueprints';
 import { type ComputeGraphModel, NODE_INPUT } from '@dxos/conductor';
-import { DXN, Key, Obj, Ref, Type } from '@dxos/echo';
-import { FunctionTrigger, TriggerKind, type TriggerType } from '@dxos/functions';
+import { DXN, Filter, Key, Obj, Query, Ref, Tag, Type } from '@dxos/echo';
+import { Trigger, serializeFunction } from '@dxos/functions';
 import { invariant } from '@dxos/invariant';
+import { gmail } from '@dxos/plugin-inbox';
+import { Mailbox } from '@dxos/plugin-inbox/types';
+import { Markdown } from '@dxos/plugin-markdown/types';
 import { type Space } from '@dxos/react-client/echo';
 import {
   type ComputeShape,
@@ -18,8 +23,8 @@ import {
   createFunction,
   createGpt,
   createQueue,
-  createSurface,
   createRandom,
+  createSurface,
   createTemplate,
   createText,
   createTrigger,
@@ -31,38 +36,209 @@ import {
   pointsToRect,
   rectToPoints,
 } from '@dxos/react-ui-canvas-editor';
-import { range } from '@dxos/util';
+import { View } from '@dxos/schema';
+import { Message, Organization, Person, Project } from '@dxos/types';
+import { range, trim } from '@dxos/util';
 
 import { type ObjectGenerator } from './ObjectGenerator';
 
 export enum PresetName {
+  DXOS_TEAM = 'dxos-team',
+  ORG_RESEARCH_PROJECT = 'org-research-project',
   // EMAIL_TABLE = 'email-table',
   GPT_QUEUE = 'webhook-gpt-queue',
   CHAT_GPT = 'chat-gpt-text',
   // EMAIL_WITH_SUMMARY = 'email-gptSummary-table',
   OBJECT_CHANGE_QUEUE = 'objectChange-queue',
-  FOREX_FUNCTION_CALL = 'forex-function-call',
   TIMER_TICK_QUEUE = 'timerTick-queue',
+  FOREX_FUNCTION_CALL = 'forex-function-call',
   DISCORD_MESSAGES = 'discord-messages',
   // KANBAN_QUEUE = 'kanban-queue',
 }
 
 export const generator = () => ({
-  schemas: [CanvasBoardType, FunctionTrigger],
+  schemas: [CanvasBoardType, Trigger.Trigger],
   types: Object.values(PresetName).map((name) => ({ typename: name })),
   items: [
+    [
+      PresetName.DXOS_TEAM,
+      async (space, n, cb) => {
+        const objects = range(n, () => {
+          const org = space.db.add(Obj.make(Organization.Organization, { name: 'DXOS', website: 'https://dxos.org' }));
+          const doc = space.db.add(
+            Markdown.make({
+              name: 'DXOS Research',
+              content: 'DXOS builds Composer, an open-source AI-powered malleable application.',
+            }),
+          );
+
+          const tag = space.db.add(Tag.make({ label: 'Investor' }));
+          const tagDxn = Obj.getDXN(tag).toString();
+          Obj.getMeta(doc).tags = [tagDxn];
+
+          // space.db.add(
+          //   Relation.make(HasSubject, {
+          //     [Relation.Source]: doc,
+          //     [Relation.Target]: org,
+          //     completedAt: new Date().toISOString(),
+          //   }),
+          // );
+
+          space.db.add(Obj.make(Person.Person, { fullName: 'Rich', organization: Ref.make(org) }, { tags: [tagDxn] }));
+          space.db.add(Obj.make(Person.Person, { fullName: 'Josiah', organization: Ref.make(org) }));
+          space.db.add(Obj.make(Person.Person, { fullName: 'Dima', organization: Ref.make(org) }));
+          space.db.add(Obj.make(Person.Person, { fullName: 'Mykola', organization: Ref.make(org) }));
+
+          return doc;
+        });
+        cb?.(objects);
+        return objects;
+      },
+    ],
+    [
+      PresetName.ORG_RESEARCH_PROJECT,
+      async (space, n, cb) => {
+        const mailbox = await space.db.query(Filter.type(Mailbox.Mailbox)).first();
+        const tag = await space.db.query(Filter.type(Tag.Tag, { label: 'Investor' })).first();
+        const tagDxn = Obj.getDXN(tag).toString();
+
+        const objects = range(n, () => {
+          const contactsQuery = Query.select(Filter.type(Person.Person)).select(Filter.tag(tagDxn));
+          const organizationsQuery = Query.select(Filter.type(Organization.Organization)).select(Filter.tag(tagDxn));
+          const notesQuery = Query.select(Filter.type(Markdown.Document)).select(Filter.tag(tagDxn));
+
+          space.db.add(
+            Trigger.make({
+              enabled: true,
+              spec: {
+                kind: 'timer',
+                cron: '* * * * *', // Every minute.
+              },
+              function: Ref.make(serializeFunction(gmail.sync)),
+              input: {
+                mailboxId: Obj.getDXN(mailbox).toString(),
+              },
+            }),
+          );
+
+          space.db.add(
+            Trigger.make({
+              enabled: true,
+              // TODO(wittjosiah): Queue trigger doesn't support matching query of the column.
+              spec: {
+                kind: 'queue',
+                queue: mailbox.queue.dxn.toString(),
+              },
+              function: Ref.make(serializeFunction(EntityExtraction.extract)),
+              input: {
+                source: '{{event.item}}',
+              },
+            }),
+          );
+
+          const researchPrompt = space.db.add(
+            Prompt.make({
+              name: 'Research',
+              description: 'Research organization',
+              input: Schema.Struct({
+                org: Schema.Any,
+              }),
+              output: Schema.Any,
+
+              // TODO(dmaretskyi): This mocks research (returns pre-baked result), the actual research might take compute minutes.
+              // Remove the mock prompt to do the actual research.
+              instructions: trim`
+                Research the organization provided as input.
+                Create a research note for it at the end.
+                NOTE: Do mocked reseach (set mockSearch to true).
+              `,
+              blueprints: [Ref.make(ResearchBlueprint)],
+            }),
+          );
+
+          space.db.add(
+            Trigger.make({
+              enabled: true,
+              spec: {
+                kind: 'subscription',
+                query: {
+                  ast: organizationsQuery.ast,
+                },
+              },
+              function: Ref.make(serializeFunction(Agent.prompt)),
+              input: {
+                prompt: Ref.make(researchPrompt),
+                input: '{{event.subject}}',
+              },
+            }),
+          );
+
+          const mailboxView = View.make({
+            query: Query.select(
+              Filter.type(Message.Message, { properties: { labels: Filter.contains('investor') } }),
+            ).options({
+              queues: [mailbox.queue.dxn.toString()],
+            }),
+            jsonSchema: Type.toJsonSchema(Message.Message),
+          });
+          const contactsView = View.make({
+            query: contactsQuery,
+            jsonSchema: Type.toJsonSchema(Person.Person),
+          });
+          const organizationsView = View.make({
+            query: organizationsQuery,
+            jsonSchema: Type.toJsonSchema(Organization.Organization),
+          });
+          const notesView = View.make({
+            query: notesQuery,
+            jsonSchema: Type.toJsonSchema(Markdown.Document),
+          });
+
+          return space.db.add(
+            Project.make({
+              name: 'Investor Research',
+              columns: [
+                {
+                  name: 'Mailbox',
+                  view: Ref.make(mailboxView),
+                  order: [],
+                },
+                {
+                  name: 'Contacts',
+                  view: Ref.make(contactsView),
+                  order: [],
+                },
+                {
+                  name: 'Organizations',
+                  view: Ref.make(organizationsView),
+                  order: [],
+                },
+                {
+                  name: 'Notes',
+                  view: Ref.make(notesView),
+                  order: [],
+                },
+              ],
+            }),
+          );
+        });
+
+        cb?.(objects.flat());
+        return objects.flat();
+      },
+    ],
     [
       PresetName.GPT_QUEUE,
       async (space, n, cb) => {
         const objects = range(n, () => {
           const canvasModel = CanvasGraphModel.create<ComputeShape>();
 
-          let functionTrigger: FunctionTrigger | undefined;
+          let functionTrigger: Trigger.Trigger | undefined;
           canvasModel.builder.call((builder) => {
             const gpt = canvasModel.createNode(createGpt(position({ x: 0, y: -14 })));
             const triggerShape = createTrigger({
               spaceId: space.id,
-              triggerKind: TriggerKind.Webhook,
+              triggerKind: 'webhook',
               ...position({ x: -18, y: -2 }),
             });
             const trigger = canvasModel.createNode(triggerShape);
@@ -96,8 +272,11 @@ export const generator = () => ({
         const objects = range(n, () => {
           const { canvasModel, computeModel } = createQueueSinkPreset(
             space,
-            TriggerKind.Subscription,
-            (triggerSpec) => (triggerSpec.filter = { type: 'dxn:type:dxos.org/type/Chess' }),
+            'subscription',
+            (triggerSpec) =>
+              (triggerSpec.query = {
+                ast: Query.select(Filter.typename('dxos.org/type/Chess')).ast,
+              }),
             'type',
           );
           return addToSpace(PresetName.OBJECT_CHANGE_QUEUE, space, canvasModel, computeModel);
@@ -113,7 +292,7 @@ export const generator = () => ({
         const objects = range(n, () => {
           const { canvasModel, computeModel } = createQueueSinkPreset(
             space,
-            TriggerKind.Timer,
+            'timer',
             (triggerSpec) => (triggerSpec.cron = '*/5 * * * * *'),
             'result',
           );
@@ -147,7 +326,7 @@ export const generator = () => ({
     //       canvasModel.builder.call((builder) => {
     //         const triggerShape = createTrigger({
     //           spaceId: space.id,
-    //           triggerKind: TriggerKind.Email,
+    //           triggerKind: 'email',
     //           ...position({ x: -18, y: -2 }),
     //         });
     //         const trigger = canvasModel.createNode(triggerShape);
@@ -254,7 +433,7 @@ export const generator = () => ({
     //         );
     //         const triggerShape = createTrigger({
     //           spaceId: space.id,
-    //           triggerKind: TriggerKind.Email,
+    //           triggerKind: 'email',
     //           ...rawPosition({ centerX: -736, centerY: -384, width: 182, height: 192 }),
     //         });
     //         const trigger = canvasModel.createNode(triggerShape);
@@ -354,11 +533,11 @@ export const generator = () => ({
         const objects = range(n, () => {
           const canvasModel = CanvasGraphModel.create<ComputeShape>();
 
-          let functionTrigger: FunctionTrigger | undefined;
+          let functionTrigger: Trigger.Trigger | undefined;
           canvasModel.builder.call((builder) => {
             const triggerShape = createTrigger({
               spaceId: space.id,
-              triggerKind: TriggerKind.Timer,
+              triggerKind: 'timer',
               ...position({ x: -10, y: -5 }),
             });
             const trigger = canvasModel.createNode(triggerShape);
@@ -416,7 +595,7 @@ export const generator = () => ({
     //       canvasModel.builder.call((builder) => {
     //         const triggerShape = createTrigger({
     //           spaceId: space.id,
-    //           triggerKind: TriggerKind.Queue,
+    //           triggerKind: 'queue',
     //           ...position({ x: -10, y: -5 }),
     //         });
     //         const trigger = canvasModel.createNode(triggerShape);
@@ -448,10 +627,10 @@ export const generator = () => ({
   ] as [PresetName, ObjectGenerator<any>][],
 });
 
-const createQueueSinkPreset = <SpecType extends TriggerKind>(
+const createQueueSinkPreset = <SpecType extends Trigger.Kind>(
   space: Space,
   triggerKind: SpecType,
-  initSpec: (spec: Extract<TriggerType, { kind: SpecType }>) => void,
+  initSpec: (spec: Extract<Trigger.Spec, { kind: SpecType }>) => void,
   triggerOutputName: string,
 ) => {
   const canvasModel = CanvasGraphModel.create<ComputeShape>();
@@ -463,7 +642,7 @@ const createQueueSinkPreset = <SpecType extends TriggerKind>(
     }),
   );
 
-  let functionTrigger: FunctionTrigger | undefined;
+  let functionTrigger: Trigger.Trigger | undefined;
   canvasModel.builder.call((builder) => {
     const triggerShape = createTrigger({
       spaceId: space.id,
@@ -538,7 +717,7 @@ const setupQueue = (
   return { queue, queueId };
 };
 
-const attachTrigger = (functionTrigger: FunctionTrigger | undefined, computeModel: ComputeGraphModel) => {
+const attachTrigger = (functionTrigger: Trigger.Trigger | undefined, computeModel: ComputeGraphModel) => {
   invariant(functionTrigger);
   functionTrigger.function = Ref.make(computeModel.root);
   const inputNode = computeModel.nodes.find((node) => node.type === NODE_INPUT)!;

package/src/components/Wireframe.tsx

@@ -5,8 +5,7 @@
 import React from 'react';
 import { useResizeDetector } from 'react-resize-detector';
 
-import { type Obj } from '@dxos/echo';
-import { fullyQualifiedId } from '@dxos/react-client/echo';
+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';
@@ -14,14 +13,15 @@ import { mx } from '@dxos/react-ui-theme';
 
 // TODO(burdon): Create generic container with wireframe mode.
 export type WireframeProps = ThemedClassName<{
-  label?: string;
   object: Obj.Any;
+  label?: string;
 }>;
 
 // TODO(burdon): Make focusable and attendable with input.
 export const Wireframe = ({ classNames, label, object }: WireframeProps) => {
-  const attentionAttrs = useAttentionAttributes(fullyQualifiedId(object));
+  const attentionAttrs = useAttentionAttributes(Obj.getDXN(object).toString());
   const { width, height, ref } = useResizeDetector();
+
   return (
     <div ref={ref} className={mx('relative grow min-bs-96', classNames)} {...attentionAttrs}>
       <div className='absolute inset-2 flex flex-col gap-2 overflow-hidden font-mono'>
@@ -30,7 +30,7 @@ export const Wireframe = ({ classNames, label, object }: WireframeProps) => {
           <div>{`[${width}x${height}]`}</div>
         </div>
         {object && (
-          <SyntaxHighlighter language='json' classNames='flex w-full text-xs opacity-75 rounded'>
+          <SyntaxHighlighter language='json' classNames='text-xs opacity-75 rounded'>
             {JSON.stringify(object, undefined, 2)}
           </SyntaxHighlighter>
         )}

package/src/components/index.ts

@@ -4,7 +4,7 @@
 
 import { lazy } from 'react';
 
-export const DebugApp = lazy(() => import('./DebugApp'));
+export const DebugGraph = lazy(() => import('./DebugGraph'));
 export const DevtoolsOverviewContainer = lazy(() => import('./DevtoolsOverviewContainer'));
 export const SpaceGenerator = lazy(() => import('./SpaceGenerator'));
 

package/src/meta.ts

@@ -3,14 +3,15 @@
 //
 
 import { type PluginMeta } from '@dxos/app-framework';
-
-export const DEBUG_PLUGIN = 'dxos.org/plugin/debug';
+import { trim } from '@dxos/util';
 
 export const meta: PluginMeta = {
-  id: DEBUG_PLUGIN,
+  id: 'dxos.org/plugin/debug',
   name: 'Debug',
-  description:
-    'The debug plugin is useful for troubleshooting inside of Composer. You can also use the Debug plugin to create test data inside of sheets or tables or explore pre-built automations. Non-technical users will likely not spend much time here, but this plugin is invaluable for developers and technical users.',
+  description: trim`
+    Comprehensive developer toolkit for troubleshooting applications, generating test data, and exploring automation capabilities.
+    Inspect objects, monitor events, and debug plugin behavior in real-time.
+  `,
   icon: 'ph--bug--regular',
   source: 'https://github.com/dxos/dxos/tree/main/packages/plugins/plugin-debug',
   screenshots: ['https://dxos.network/plugin-details-debug-dark.png'],

package/src/translations.ts

@@ -11,12 +11,14 @@ export const translations = [
     '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': 'DevTools Stats',
+        '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.',

package/src/types.ts

@@ -2,7 +2,7 @@
 // Copyright 2023 DXOS.org
 //
 
-import { Schema } from 'effect';
+import * as Schema from 'effect/Schema';
 import { type Context, createContext } from 'react';
 
 import type { TimerCallback, TimerOptions } from '@dxos/async';

package/dist/lib/browser/DebugApp-ZDL4CPY5.mjs

@@ -1,228 +0,0 @@
-// src/components/DebugApp/DebugApp.tsx
-import { useSignals as _useSignals3 } from "@preact-signals/safe-react/tracking";
-import React3, { useEffect, useState as useState2 } from "react";
-import { useClient, useConfig } from "@dxos/react-client";
-import { ToggleGroup, ToggleGroupItem, Toolbar, Icon, IconButton } from "@dxos/react-ui";
-
-// src/components/DebugApp/Tree.tsx
-import { useSignals as _useSignals } from "@preact-signals/safe-react/tracking";
-import React, { useState } from "react";
-import { SyntaxHighlighter } from "@dxos/react-ui-syntax-highlighter";
-import { mx } from "@dxos/react-ui-theme";
-import { arrayToBuffer } from "@dxos/util";
-var replacer = (key, value) => {
-  if (typeof value === "object") {
-    if (value instanceof Uint8Array) {
-      return arrayToBuffer(value).toString("hex");
-    }
-    if (value?.type === "Buffer") {
-      return Buffer.from(value.data).toString("hex");
-    }
-    if (key === "downloaded") {
-      return void 0;
-    }
-  }
-  return value;
-};
-var Json = ({ data }) => {
-  var _effect = _useSignals();
-  try {
-    return /* @__PURE__ */ React.createElement(SyntaxHighlighter, {
-      language: "json"
-    }, JSON.stringify(data, replacer, 2));
-  } finally {
-    _effect.f();
-  }
-};
-var Tree = ({ data }) => {
-  var _effect = _useSignals();
-  try {
-    return /* @__PURE__ */ React.createElement("div", {
-      className: "p-2"
-    }, /* @__PURE__ */ React.createElement(Node, {
-      data,
-      root: true
-    }));
-  } finally {
-    _effect.f();
-  }
-};
-var Node = ({ data, root }) => {
-  var _effect = _useSignals();
-  try {
-    if (typeof data !== "object" || data === void 0 || data === null) {
-      return /* @__PURE__ */ React.createElement(Scalar, {
-        value: data
-      });
-    }
-    if (Array.isArray(data)) {
-      return /* @__PURE__ */ React.createElement("div", {
-        className: "flex flex-col space-y-2"
-      }, data.map((value, index) => /* @__PURE__ */ React.createElement(KeyValue, {
-        key: index,
-        label: String(index),
-        data: value,
-        className: "bg-teal-50"
-      })));
-    }
-    return /* @__PURE__ */ React.createElement("div", {
-      className: "flex flex-col space-y-2"
-    }, Object.entries(data).map(([key, value]) => /* @__PURE__ */ React.createElement(KeyValue, {
-      key,
-      label: key,
-      data: value,
-      className: "bg-blue-50"
-    })));
-  } finally {
-    _effect.f();
-  }
-};
-var KeyValue = ({ label, data, className }) => {
-  var _effect = _useSignals();
-  try {
-    const [open, setOpen] = useState(true);
-    if (data === void 0) {
-      return null;
-    }
-    return /* @__PURE__ */ React.createElement("div", {
-      className: "flex"
-    }, /* @__PURE__ */ React.createElement(Box, {
-      className: mx("border-blue-200 text-sm select-none cursor-pointer", className),
-      onClick: () => setOpen((open2) => !open2)
-    }, label), open && /* @__PURE__ */ React.createElement(Node, {
-      data
-    }));
-  } finally {
-    _effect.f();
-  }
-};
-var Scalar = ({ value }) => {
-  var _effect = _useSignals();
-  try {
-    return /* @__PURE__ */ React.createElement(Box, {
-      className: "bg-green-50 border-green-200 rounded-r text-sm font-thin"
-    }, value === void 0 && "undefined" || value === null && "null" || typeof value === "string" && value || JSON.stringify(value));
-  } finally {
-    _effect.f();
-  }
-};
-var Box = ({ children, className, ...props }) => {
-  var _effect = _useSignals();
-  try {
-    return /* @__PURE__ */ React.createElement("div", {
-      className: mx("flex px-2 border border-l-0 font-mono truncate", className),
-      ...props
-    }, children);
-  } finally {
-    _effect.f();
-  }
-};
-
-// src/components/Container.tsx
-import { useSignals as _useSignals2 } from "@preact-signals/safe-react/tracking";
-import React2 from "react";
-var Container = ({ toolbar, children }) => {
-  var _effect = _useSignals2();
-  try {
-    return /* @__PURE__ */ React2.createElement("div", {
-      role: "none",
-      className: "flex flex-col grow overflow-hidden divide-y divide-separator"
-    }, toolbar, /* @__PURE__ */ React2.createElement("div", {
-      className: "flex flex-col grow overflow-auto"
-    }, children));
-  } finally {
-    _effect.f();
-  }
-};
-
-// src/components/DebugApp/DebugApp.tsx
-var DebugApp = ({ graph }) => {
-  var _effect = _useSignals3();
-  try {
-    const [view, setView] = useState2("graph");
-    const [data, setData] = useState2({});
-    const client = useClient();
-    const config = useConfig();
-    const handleRefresh = async () => {
-      const data2 = await client.diagnostics({
-        truncate: true
-      });
-      setData(data2);
-    };
-    useEffect(() => {
-      void handleRefresh();
-    }, []);
-    const handleResetClient = async (force = false) => {
-      if (!force && !window.confirm("Reset storage?")) {
-        return;
-      }
-      await client.reset();
-      window.location.href = window.location.origin;
-    };
-    const handleOpenDevtools = () => {
-      const vaultUrl = config.values?.runtime?.client?.remoteSource;
-      if (vaultUrl) {
-        window.open(`https://devtools.dev.dxos.org/?target=${vaultUrl}`);
-      }
-    };
-    return /* @__PURE__ */ React3.createElement(Container, {
-      toolbar: /* @__PURE__ */ React3.createElement(Toolbar.Root, {
-        classNames: "p-1"
-      }, /* @__PURE__ */ React3.createElement(ToggleGroup, {
-        type: "single",
-        value: view
-      }, /* @__PURE__ */ React3.createElement(ToggleGroupItem, {
-        value: "graph",
-        onClick: () => setView("graph"),
-        title: "Plugin graph"
-      }, /* @__PURE__ */ React3.createElement(Icon, {
-        icon: "ph--graph--regular",
-        size: 5
-      })), /* @__PURE__ */ React3.createElement(ToggleGroupItem, {
-        value: "diagnostics",
-        onClick: () => setView("diagnostics"),
-        title: "Diagnostics"
-      }, /* @__PURE__ */ React3.createElement(Icon, {
-        icon: "ph--gauge--regular",
-        size: 5
-      })), /* @__PURE__ */ React3.createElement(ToggleGroupItem, {
-        value: "config",
-        onClick: () => setView("config"),
-        title: "Config"
-      }, /* @__PURE__ */ React3.createElement(Icon, {
-        icon: "ph--gear--regular",
-        size: 5
-      }))), /* @__PURE__ */ React3.createElement(Toolbar.Separator, {
-        variant: "gap"
-      }), /* @__PURE__ */ React3.createElement(IconButton, {
-        icon: "ph--warning--regular",
-        iconOnly: true,
-        size: 5,
-        classNames: "text-red-700",
-        onClick: (event) => handleResetClient(event.shiftKey),
-        label: "Reset client"
-      }), /* @__PURE__ */ React3.createElement(IconButton, {
-        icon: "ph--toolbox--duotone",
-        iconOnly: true,
-        size: 5,
-        onClick: handleOpenDevtools,
-        label: "Open Devtools"
-      }))
-    }, view === "graph" && /* @__PURE__ */ React3.createElement(Tree, {
-      data: graph.toJSON()
-    }), view === "config" && /* @__PURE__ */ React3.createElement(Json, {
-      data: data.diagnostics?.config
-    }), view === "diagnostics" && /* @__PURE__ */ React3.createElement(Json, {
-      data
-    }));
-  } finally {
-    _effect.f();
-  }
-};
-
-// src/components/DebugApp/index.ts
-var DebugApp_default = DebugApp;
-export {
-  DebugApp_default as default
-};
-//# sourceMappingURL=DebugApp-ZDL4CPY5.mjs.map