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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (146) hide show
  1. package/dist/lib/browser/ExplorerContainer-4RB2TY3G.mjs +48 -0
  2. package/dist/lib/browser/ExplorerContainer-4RB2TY3G.mjs.map +7 -0
  3. package/dist/lib/browser/chunk-4NFGHCGO.mjs +84 -0
  4. package/dist/lib/browser/chunk-4NFGHCGO.mjs.map +7 -0
  5. package/dist/lib/browser/{chunk-UCDNCIRV.mjs → chunk-6AZY4CDH.mjs} +343 -406
  6. package/dist/lib/{node-esm/chunk-WHKUQG5M.mjs.map → browser/chunk-6AZY4CDH.mjs.map} +4 -4
  7. package/dist/lib/browser/chunk-J5LGTIGS.mjs +10 -0
  8. package/dist/lib/browser/chunk-J5LGTIGS.mjs.map +7 -0
  9. package/dist/lib/browser/{chunk-2DGFNLRO.mjs → chunk-YNQF4CPY.mjs} +7 -2
  10. package/dist/lib/browser/chunk-YNQF4CPY.mjs.map +7 -0
  11. package/dist/lib/browser/index.mjs +51 -68
  12. package/dist/lib/browser/index.mjs.map +4 -4
  13. package/dist/lib/browser/meta.json +1 -1
  14. package/dist/lib/browser/meta.mjs +2 -1
  15. package/dist/lib/browser/react-surface-KAHVDMFX.mjs +38 -0
  16. package/dist/lib/browser/react-surface-KAHVDMFX.mjs.map +7 -0
  17. package/dist/lib/browser/types/index.mjs +6 -6
  18. package/dist/lib/node-esm/ExplorerContainer-LCG425I7.mjs +49 -0
  19. package/dist/lib/node-esm/ExplorerContainer-LCG425I7.mjs.map +7 -0
  20. package/dist/lib/node-esm/{chunk-PX6LHR2N.mjs → chunk-DK77RB6M.mjs} +7 -2
  21. package/dist/lib/node-esm/chunk-DK77RB6M.mjs.map +7 -0
  22. package/dist/lib/node-esm/{chunk-WHKUQG5M.mjs → chunk-DOXAIJEC.mjs} +343 -406
  23. package/dist/lib/{browser/chunk-UCDNCIRV.mjs.map → node-esm/chunk-DOXAIJEC.mjs.map} +4 -4
  24. package/dist/lib/node-esm/chunk-HSLMI22Q.mjs +11 -0
  25. package/dist/lib/node-esm/chunk-HSLMI22Q.mjs.map +7 -0
  26. package/dist/lib/node-esm/chunk-V42OFY7B.mjs +85 -0
  27. package/dist/lib/node-esm/chunk-V42OFY7B.mjs.map +7 -0
  28. package/dist/lib/node-esm/index.mjs +51 -68
  29. package/dist/lib/node-esm/index.mjs.map +4 -4
  30. package/dist/lib/node-esm/meta.json +1 -1
  31. package/dist/lib/node-esm/meta.mjs +2 -1
  32. package/dist/lib/node-esm/react-surface-7XILIUI4.mjs +39 -0
  33. package/dist/lib/node-esm/react-surface-7XILIUI4.mjs.map +7 -0
  34. package/dist/lib/node-esm/types/index.mjs +6 -6
  35. package/dist/types/src/ExplorerPlugin.d.ts +2 -1
  36. package/dist/types/src/ExplorerPlugin.d.ts.map +1 -1
  37. package/dist/types/src/capabilities/index.d.ts +1 -2
  38. package/dist/types/src/capabilities/index.d.ts.map +1 -1
  39. package/dist/types/src/capabilities/react-surface/index.d.ts +3 -0
  40. package/dist/types/src/capabilities/react-surface/index.d.ts.map +1 -0
  41. package/dist/types/src/capabilities/react-surface/react-surface.d.ts +5 -0
  42. package/dist/types/src/capabilities/react-surface/react-surface.d.ts.map +1 -0
  43. package/dist/types/src/components/Graph/D3ForceGraph.d.ts +3 -3
  44. package/dist/types/src/components/Graph/D3ForceGraph.d.ts.map +1 -1
  45. package/dist/types/src/components/Graph/D3ForceGraph.stories.d.ts +1 -1
  46. package/dist/types/src/components/Graph/D3ForceGraph.stories.d.ts.map +1 -1
  47. package/dist/types/src/components/Graph/ForceGraph.stories.d.ts.map +1 -1
  48. package/dist/types/src/components/Graph/adapter.d.ts +1 -1
  49. package/dist/types/src/components/Graph/adapter.d.ts.map +1 -1
  50. package/dist/types/src/components/Graph/testing.d.ts.map +1 -1
  51. package/dist/types/src/components/Tree/Tree.d.ts.map +1 -1
  52. package/dist/types/src/components/Tree/Tree.stories.d.ts.map +1 -1
  53. package/dist/types/src/components/Tree/testing/generator.d.ts.map +1 -1
  54. package/dist/types/src/components/Tree/types/tree.d.ts +18 -16
  55. package/dist/types/src/components/Tree/types/tree.d.ts.map +1 -1
  56. package/dist/types/src/components/Tree/types/types.d.ts +1 -1
  57. package/dist/types/src/components/Tree/types/types.d.ts.map +1 -1
  58. package/dist/types/src/components/index.d.ts +0 -4
  59. package/dist/types/src/components/index.d.ts.map +1 -1
  60. package/dist/types/src/containers/ExplorerContainer/ExplorerContainer.d.ts +6 -0
  61. package/dist/types/src/containers/ExplorerContainer/ExplorerContainer.d.ts.map +1 -0
  62. package/dist/types/src/containers/ExplorerContainer/index.d.ts +3 -0
  63. package/dist/types/src/containers/ExplorerContainer/index.d.ts.map +1 -0
  64. package/dist/types/src/containers/index.d.ts +3 -0
  65. package/dist/types/src/containers/index.d.ts.map +1 -0
  66. package/dist/types/src/hooks/useGraphModel.d.ts.map +1 -1
  67. package/dist/types/src/meta.d.ts +2 -2
  68. package/dist/types/src/meta.d.ts.map +1 -1
  69. package/dist/types/src/translations.d.ts +17 -10
  70. package/dist/types/src/translations.d.ts.map +1 -1
  71. package/dist/types/src/types/ExplorerAction.d.ts +6 -0
  72. package/dist/types/src/types/ExplorerAction.d.ts.map +1 -0
  73. package/dist/types/src/types/Graph.d.ts +30 -0
  74. package/dist/types/src/types/Graph.d.ts.map +1 -0
  75. package/dist/types/src/types/index.d.ts +2 -2
  76. package/dist/types/src/types/index.d.ts.map +1 -1
  77. package/dist/types/tsconfig.tsbuildinfo +1 -1
  78. package/package.json +51 -45
  79. package/src/ExplorerPlugin.tsx +29 -50
  80. package/src/capabilities/index.ts +1 -4
  81. package/src/capabilities/react-surface/index.ts +7 -0
  82. package/src/capabilities/react-surface/react-surface.tsx +31 -0
  83. package/src/components/Chart/Chart.stories.tsx +3 -3
  84. package/src/components/Globe/Globe.stories.tsx +3 -3
  85. package/src/components/Graph/D3ForceGraph.stories.tsx +30 -14
  86. package/src/components/Graph/D3ForceGraph.tsx +8 -7
  87. package/src/components/Graph/ForceGraph.stories.tsx +30 -14
  88. package/src/components/Graph/adapter.ts +14 -8
  89. package/src/components/Graph/testing.ts +11 -8
  90. package/src/components/Tree/Tree.stories.tsx +4 -3
  91. package/src/components/Tree/Tree.tsx +8 -3
  92. package/src/components/Tree/testing/generator.ts +4 -2
  93. package/src/components/Tree/types/tree.test.ts +5 -3
  94. package/src/components/Tree/types/tree.ts +40 -19
  95. package/src/components/Tree/types/types.ts +1 -1
  96. package/src/components/index.ts +0 -4
  97. package/src/containers/ExplorerContainer/ExplorerContainer.tsx +53 -0
  98. package/src/containers/ExplorerContainer/index.ts +7 -0
  99. package/src/containers/index.ts +7 -0
  100. package/src/hooks/useGraphModel.ts +6 -3
  101. package/src/meta.ts +8 -3
  102. package/src/translations.ts +4 -2
  103. package/src/types/ExplorerAction.ts +21 -0
  104. package/src/types/Graph.ts +63 -0
  105. package/src/types/index.ts +2 -2
  106. package/dist/lib/browser/ExplorerContainer-S66JDOAF.mjs +0 -49
  107. package/dist/lib/browser/ExplorerContainer-S66JDOAF.mjs.map +0 -7
  108. package/dist/lib/browser/chunk-2DGFNLRO.mjs.map +0 -7
  109. package/dist/lib/browser/chunk-2MKBRIUT.mjs +0 -31
  110. package/dist/lib/browser/chunk-2MKBRIUT.mjs.map +0 -7
  111. package/dist/lib/browser/chunk-4ETQJYX4.mjs +0 -38
  112. package/dist/lib/browser/chunk-4ETQJYX4.mjs.map +0 -7
  113. package/dist/lib/browser/chunk-NXGP6NTP.mjs +0 -203
  114. package/dist/lib/browser/chunk-NXGP6NTP.mjs.map +0 -7
  115. package/dist/lib/browser/intent-resolver-OXJJ3PII.mjs +0 -24
  116. package/dist/lib/browser/intent-resolver-OXJJ3PII.mjs.map +0 -7
  117. package/dist/lib/browser/react-surface-C4EC6ZDZ.mjs +0 -31
  118. package/dist/lib/browser/react-surface-C4EC6ZDZ.mjs.map +0 -7
  119. package/dist/lib/node-esm/ExplorerContainer-GIJN67DO.mjs +0 -50
  120. package/dist/lib/node-esm/ExplorerContainer-GIJN67DO.mjs.map +0 -7
  121. package/dist/lib/node-esm/chunk-3ODK27PU.mjs +0 -33
  122. package/dist/lib/node-esm/chunk-3ODK27PU.mjs.map +0 -7
  123. package/dist/lib/node-esm/chunk-6JACZE7E.mjs +0 -205
  124. package/dist/lib/node-esm/chunk-6JACZE7E.mjs.map +0 -7
  125. package/dist/lib/node-esm/chunk-AGHU3KVI.mjs +0 -39
  126. package/dist/lib/node-esm/chunk-AGHU3KVI.mjs.map +0 -7
  127. package/dist/lib/node-esm/chunk-PX6LHR2N.mjs.map +0 -7
  128. package/dist/lib/node-esm/intent-resolver-GVM36TJX.mjs +0 -25
  129. package/dist/lib/node-esm/intent-resolver-GVM36TJX.mjs.map +0 -7
  130. package/dist/lib/node-esm/react-surface-YGGLTBF3.mjs +0 -32
  131. package/dist/lib/node-esm/react-surface-YGGLTBF3.mjs.map +0 -7
  132. package/dist/types/src/capabilities/intent-resolver.d.ts +0 -4
  133. package/dist/types/src/capabilities/intent-resolver.d.ts.map +0 -1
  134. package/dist/types/src/capabilities/react-surface.d.ts +0 -4
  135. package/dist/types/src/capabilities/react-surface.d.ts.map +0 -1
  136. package/dist/types/src/components/ExplorerContainer.d.ts +0 -9
  137. package/dist/types/src/components/ExplorerContainer.d.ts.map +0 -1
  138. package/dist/types/src/types/schema.d.ts +0 -12
  139. package/dist/types/src/types/schema.d.ts.map +0 -1
  140. package/dist/types/src/types/types.d.ts +0 -18
  141. package/dist/types/src/types/types.d.ts.map +0 -1
  142. package/src/capabilities/intent-resolver.ts +0 -19
  143. package/src/capabilities/react-surface.tsx +0 -23
  144. package/src/components/ExplorerContainer.tsx +0 -50
  145. package/src/types/schema.ts +0 -16
  146. package/src/types/types.ts +0 -22
@@ -2,7 +2,8 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- import React, { useEffect, useRef, useState } from 'react';
5
+ import { RegistryContext } from '@effect-atom/atom-react';
6
+ import React, { useContext, useEffect, useRef, useState } from 'react';
6
7
 
7
8
  import { type Space } from '@dxos/client/echo';
8
9
  import { useAsyncState } from '@dxos/react-ui';
@@ -62,7 +63,11 @@ export type TreeComponentProps<N = unknown> = {
62
63
 
63
64
  // TODO(burdon): Label accessor.
64
65
  export const Tree = <N,>({ space, selected, variant = 'tidy', onNodeClick }: TreeComponentProps<N>) => {
65
- const [model] = useAsyncState(async () => (space ? new SpaceGraphModel().open(space) : undefined), [space, selected]);
66
+ const registry = useContext(RegistryContext);
67
+ const [model] = useAsyncState(
68
+ async () => (space ? new SpaceGraphModel(registry).open(space.db) : undefined),
69
+ [space, selected, registry],
70
+ );
66
71
 
67
72
  const [tree, setTree] = useState<TreeNode>();
68
73
  useEffect(() => {
@@ -100,7 +105,7 @@ export const Tree = <N,>({ space, selected, variant = 'tidy', onNodeClick }: Tre
100
105
  }, [context.current, tree]);
101
106
 
102
107
  return (
103
- <div onClick={() => onNodeClick?.()}>
108
+ <div className='grow' onClick={() => onNodeClick?.()}>
104
109
  <SVG.Root ref={context} />
105
110
  </div>
106
111
  );
@@ -2,7 +2,7 @@
2
2
  // Copyright 2025 DXOS.org
3
3
  //
4
4
 
5
- import { Key } from '@dxos/echo';
5
+ import { Key, Obj } from '@dxos/echo';
6
6
  import { range } from '@dxos/util';
7
7
 
8
8
  import { Tree, type TreeNodeType } from '../types';
@@ -16,7 +16,9 @@ const random = (min: number, max: number) => Math.floor(Math.random() * (max - m
16
16
  */
17
17
  export const createTree = (spec: NumberOrNumberArray[] = [], createText?: () => string): Tree => {
18
18
  const tree = new Tree();
19
- tree.root.data = { text: 'root' };
19
+ Obj.change(tree.tree, () => {
20
+ tree.root.data = { text: 'root' };
21
+ });
20
22
 
21
23
  const createNodes = (parent: TreeNodeType, spec: NumberOrNumberArray = 0): TreeNodeType[] => {
22
24
  const count = Array.isArray(spec) ? random(spec[0], spec[1]) : spec;
@@ -6,7 +6,7 @@ import { describe, test } from 'vitest';
6
6
 
7
7
  import { Obj, Ref } from '@dxos/echo';
8
8
  import { faker } from '@dxos/random';
9
- import { DataType } from '@dxos/schema';
9
+ import { Task } from '@dxos/types';
10
10
 
11
11
  import { createTree } from '../testing';
12
12
 
@@ -124,11 +124,13 @@ describe('tree', () => {
124
124
  });
125
125
 
126
126
  test('task', ({ expect }) => {
127
- const task = Obj.make(DataType.Task, { title: 'Test task.' });
127
+ const task = Obj.make(Task.Task, { title: 'Test task.' });
128
128
  expect(task.title).to.eq('Test task.');
129
129
 
130
130
  const tree = createTree();
131
131
  const node = tree.addNode(tree.root);
132
- node.ref = Ref.make(task);
132
+ Obj.change(tree.tree, () => {
133
+ node.ref = Ref.make(task);
134
+ });
133
135
  });
134
136
  });
@@ -4,7 +4,8 @@
4
4
 
5
5
  import * as Schema from 'effect/Schema';
6
6
 
7
- import { Key, Obj, Type } from '@dxos/echo';
7
+ import { Key, Obj, Ref, Type } from '@dxos/echo';
8
+ import { TestSchema } from '@dxos/echo/testing';
8
9
  import { invariant } from '@dxos/invariant';
9
10
 
10
11
  // TODO(burdon): Reconcile with @dxos/graph (i.e., common types).
@@ -13,7 +14,7 @@ export const TreeNodeType = Schema.Struct({
13
14
  id: Key.ObjectId,
14
15
  children: Schema.mutable(Schema.Array(Key.ObjectId)),
15
16
  data: Schema.mutable(Schema.Record({ key: Schema.String, value: Schema.Any })),
16
- ref: Schema.optional(Type.Ref(Type.Expando)),
17
+ ref: Schema.optional(Ref.Ref(TestSchema.Expando)),
17
18
  }).pipe(Schema.mutable);
18
19
 
19
20
  export interface TreeNodeType extends Schema.Schema.Type<typeof TreeNodeType> {}
@@ -22,7 +23,7 @@ export const TreeType = Schema.Struct({
22
23
  root: Key.ObjectId,
23
24
  nodes: Schema.mutable(Schema.Record({ key: Key.ObjectId, value: TreeNodeType })),
24
25
  }).pipe(
25
- Type.Obj({
26
+ Type.object({
26
27
  typename: 'dxos.org/type/Tree',
27
28
  version: '0.1.0',
28
29
  }),
@@ -184,9 +185,11 @@ export class Tree {
184
185
  clear(): void {
185
186
  const root = this._tree.nodes[this._tree.root];
186
187
  root.children.length = 0;
187
- this._tree.nodes = {
188
- [root.id]: root,
189
- };
188
+ Obj.change(this._tree, (t) => {
189
+ t.nodes = {
190
+ [root.id]: root,
191
+ };
192
+ });
190
193
  }
191
194
 
192
195
  /**
@@ -198,8 +201,11 @@ export class Tree {
198
201
  node = { id, children: [], data: { text: '' } }; // TODO(burdon): Generic.
199
202
  }
200
203
 
201
- this._tree.nodes[node.id] = node;
202
- parent.children.splice(index ?? parent.children.length, 0, node.id);
204
+ const nodeToAdd = node;
205
+ Obj.change(this._tree, (t) => {
206
+ t.nodes[nodeToAdd.id] = nodeToAdd;
207
+ parent.children.splice(index ?? parent.children.length, 0, nodeToAdd.id);
208
+ });
203
209
  return node;
204
210
  }
205
211
 
@@ -212,10 +218,14 @@ export class Tree {
212
218
  return undefined;
213
219
  }
214
220
 
215
- delete this._tree.nodes[node.id];
221
+ Obj.change(this._tree, (t) => {
222
+ delete t.nodes[node.id];
223
+ });
216
224
  const idx = parent.children.findIndex((child) => child === id);
217
225
  if (idx !== -1) {
218
- parent.children.splice(idx, 1);
226
+ Obj.change(this._tree, () => {
227
+ parent.children.splice(idx, 1);
228
+ });
219
229
  }
220
230
 
221
231
  return node;
@@ -232,8 +242,10 @@ export class Tree {
232
242
  }
233
243
 
234
244
  const child = node.children[from];
235
- node.children.splice(from, 1);
236
- node.children.splice(to, 0, child);
245
+ Obj.change(this._tree, () => {
246
+ node.children.splice(from, 1);
247
+ node.children.splice(to, 0, child);
248
+ });
237
249
  return this.getNode(child);
238
250
  }
239
251
 
@@ -252,8 +264,10 @@ export class Tree {
252
264
  }
253
265
 
254
266
  const previous = this.getNode(parent.children[idx - 1]);
255
- parent.children.splice(idx, 1);
256
- previous.children.push(node.id);
267
+ Obj.change(this._tree, () => {
268
+ parent.children.splice(idx, 1);
269
+ previous.children.push(node.id);
270
+ });
257
271
  }
258
272
 
259
273
  /**
@@ -270,16 +284,23 @@ export class Tree {
270
284
  return;
271
285
  }
272
286
 
273
- // Remove node from parent.
287
+ // Remove node from parent and get following siblings.
274
288
  const nodeIdx = parent.children.findIndex((id) => id === node.id);
275
- const [_, ...rest] = parent.children.splice(nodeIdx, parent.children.length - nodeIdx);
276
- parent.children.splice(nodeIdx, parent.children.length - nodeIdx);
289
+ let rest: Key.ObjectId[] = [];
290
+ Obj.change(this._tree, () => {
291
+ const removed = parent.children.splice(nodeIdx, parent.children.length - nodeIdx);
292
+ rest = removed.slice(1); // Skip the node itself.
293
+ });
277
294
 
278
295
  // Add to ancestor.
279
296
  const parentIdx = this.getChildNodes(ancestor).findIndex((n) => n.id === parent.id);
280
- ancestor.children.splice(parentIdx + 1, 0, node.id);
297
+ Obj.change(this._tree, () => {
298
+ ancestor.children.splice(parentIdx + 1, 0, node.id);
299
+ });
281
300
 
282
301
  // Transplant following siblings to current node.
283
- node.children.push(...rest);
302
+ Obj.change(this._tree, () => {
303
+ node.children.push(...rest);
304
+ });
284
305
  }
285
306
  }
@@ -10,7 +10,7 @@ export type TreeNode = {
10
10
  children?: TreeNode[];
11
11
  };
12
12
 
13
- export const mapGraphToTreeData = (model: GraphModel, maxDepth = 8): TreeNode | undefined => {
13
+ export const mapGraphToTreeData = (model: GraphModel.GraphModel, maxDepth = 8): TreeNode | undefined => {
14
14
  // TODO(burdon): Convert to common/graph.
15
15
  // const mapNode = (node: N, depth = 0): TreeNode => {
16
16
  // const treeNode: TreeNode = {
@@ -2,10 +2,6 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- import { lazy } from 'react';
6
-
7
- export const ExplorerContainer = lazy(() => import('./ExplorerContainer'));
8
-
9
5
  export * from './Chart';
10
6
  export * from './Globe';
11
7
  export * from './Graph';
@@ -0,0 +1,53 @@
1
+ //
2
+ // Copyright 2023 DXOS.org
3
+ //
4
+
5
+ import React, { useCallback, useMemo, useState } from 'react';
6
+
7
+ import { type SurfaceComponentProps } from '@dxos/app-toolkit/ui';
8
+ import { type Filter } from '@dxos/echo';
9
+ import { type View } from '@dxos/echo';
10
+ import { QueryBuilder } from '@dxos/echo-query';
11
+ import { useGlobalSearch } from '@dxos/plugin-search';
12
+ import { getSpace, useObject } from '@dxos/react-client/echo';
13
+ import { Panel, Toolbar } from '@dxos/react-ui';
14
+ import { QueryEditor, type QueryEditorProps } from '@dxos/react-ui-components';
15
+
16
+ import { D3ForceGraph } from '../../components';
17
+ import { useGraphModel } from '../../hooks';
18
+
19
+ export type ExplorerContainerProps = SurfaceComponentProps<View.View>;
20
+
21
+ export const ExplorerContainer = ({ role, subject: view }: ExplorerContainerProps) => {
22
+ useObject(view);
23
+ const space = view && getSpace(view);
24
+ const [filter, setFilter] = useState<Filter.Any>();
25
+ const model = useGraphModel(space, filter);
26
+ const { match } = useGlobalSearch();
27
+
28
+ const builder = useMemo(() => new QueryBuilder(), []);
29
+ const handleChange = useCallback<NonNullable<QueryEditorProps['onChange']>>((value) => {
30
+ setFilter(builder.build(value).filter);
31
+ }, []);
32
+
33
+ const showToolbar = role === 'article';
34
+
35
+ if (!space || !model) {
36
+ return null;
37
+ }
38
+
39
+ return (
40
+ <Panel.Root role={role}>
41
+ {showToolbar && (
42
+ <Panel.Toolbar asChild>
43
+ <Toolbar.Root>
44
+ <QueryEditor db={space.db} onChange={handleChange} />
45
+ </Toolbar.Root>
46
+ </Panel.Toolbar>
47
+ )}
48
+ <Panel.Content asChild>
49
+ <D3ForceGraph model={model} match={match} />
50
+ </Panel.Content>
51
+ </Panel.Root>
52
+ );
53
+ };
@@ -0,0 +1,7 @@
1
+ //
2
+ // Copyright 2023 DXOS.org
3
+ //
4
+
5
+ import { ExplorerContainer } from './ExplorerContainer';
6
+
7
+ export default ExplorerContainer;
@@ -0,0 +1,7 @@
1
+ //
2
+ // Copyright 2023 DXOS.org
3
+ //
4
+
5
+ import { type ComponentType, lazy } from 'react';
6
+
7
+ export const ExplorerContainer: ComponentType<any> = lazy(() => import('./ExplorerContainer'));
@@ -4,6 +4,8 @@
4
4
 
5
5
  import { useEffect, useState } from 'react';
6
6
 
7
+ import { Capabilities } from '@dxos/app-framework';
8
+ import { useCapability } from '@dxos/app-framework/ui';
7
9
  import { type Filter, type Queue, type Space } from '@dxos/client/echo';
8
10
  import { SpaceGraphModel, type SpaceGraphModelOptions } from '@dxos/schema';
9
11
 
@@ -14,6 +16,7 @@ export const useGraphModel = (
14
16
  options?: SpaceGraphModelOptions,
15
17
  queue?: Queue,
16
18
  ): SpaceGraphModel | undefined => {
19
+ const registry = useCapability(Capabilities.AtomRegistry);
17
20
  const [model, setModel] = useState<SpaceGraphModel | undefined>(undefined);
18
21
  useEffect(() => {
19
22
  if (!space) {
@@ -24,13 +27,13 @@ export const useGraphModel = (
24
27
 
25
28
  // TODO(burdon): Does this need to be a dependency?
26
29
  if (!model || model.queue !== queue) {
27
- const model = new SpaceGraphModel().setFilter(filter).setOptions(options);
28
- void model.open(space, queue);
30
+ const model = new SpaceGraphModel(registry).setFilter(filter).setOptions(options);
31
+ void model.open(space.db, queue);
29
32
  setModel(model);
30
33
  } else {
31
34
  model.setFilter(filter).setOptions(options);
32
35
  }
33
- }, [space, filter, options, queue]);
36
+ }, [space, filter, options, queue, registry]);
34
37
 
35
38
  return model;
36
39
  };
package/src/meta.ts CHANGED
@@ -2,13 +2,18 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- import { type PluginMeta } from '@dxos/app-framework';
5
+ import { type Plugin } from '@dxos/app-framework';
6
+ import { trim } from '@dxos/util';
6
7
 
7
- export const meta: PluginMeta = {
8
+ export const meta: Plugin.Meta = {
8
9
  id: 'dxos.org/plugin/explorer',
9
10
  name: 'Explorer',
10
- description: 'Install this plugin to view a hypergraph of all objects inside of your Space.',
11
+ description: trim`
12
+ Interactive hypergraph visualization that reveals relationships between objects in your workspace.
13
+ Navigate complex data structures and discover connections through a dynamic network view.
14
+ `,
11
15
  icon: 'ph--graph--regular',
16
+ iconHue: 'green',
12
17
  source: 'https://github.com/dxos/dxos/tree/main/packages/plugins/plugin-explorer',
13
18
  tags: ['labs'],
14
19
  screenshots: ['https://dxos.network/plugin-details-explorer-dark.png'],
@@ -2,16 +2,17 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
+ import { Type } from '@dxos/echo';
5
6
  import { type Resource } from '@dxos/react-ui';
6
7
  import { translations as componentsTranslations } from '@dxos/react-ui-components';
7
8
 
8
9
  import { meta } from './meta';
9
- import { ViewType } from './types';
10
+ import { Graph } from './types';
10
11
 
11
12
  export const translations = [
12
13
  {
13
14
  'en-US': {
14
- [ViewType.typename]: {
15
+ [Type.getTypename(Graph.Graph)]: {
15
16
  'typename label': 'Explorer',
16
17
  'typename label_zero': 'Explorers',
17
18
  'typename label_one': 'Explorer',
@@ -19,6 +20,7 @@ export const translations = [
19
20
  'object name placeholder': 'New explorer',
20
21
  'rename object label': 'Rename explorer',
21
22
  'delete object label': 'Delete explorer',
23
+ 'object deleted label': 'Explorer deleted',
22
24
  },
23
25
  [meta.id]: {
24
26
  'plugin name': 'Explorer',
@@ -0,0 +1,21 @@
1
+ //
2
+ // Copyright 2023 DXOS.org
3
+ //
4
+
5
+ import * as Schema from 'effect/Schema';
6
+
7
+ import { TypeInputOptionsAnnotation } from '@dxos/plugin-space/types';
8
+
9
+ export const GraphProps = Schema.Struct({
10
+ name: Schema.optional(Schema.String),
11
+ // TODO(wittjosiah): This should be a query input instead.
12
+ typename: Schema.String.pipe(
13
+ Schema.annotations({ title: 'Select type' }),
14
+ TypeInputOptionsAnnotation.set({
15
+ location: ['database', 'runtime'],
16
+ kind: ['user'],
17
+ registered: ['registered'],
18
+ }),
19
+ Schema.optional,
20
+ ),
21
+ });
@@ -0,0 +1,63 @@
1
+ //
2
+ // Copyright 2024 DXOS.org
3
+ //
4
+
5
+ import * as Schema from 'effect/Schema';
6
+
7
+ import { Filter, Obj, Query, QueryAST, Ref, Type } from '@dxos/echo';
8
+ import { View } from '@dxos/echo';
9
+ import { FormInputAnnotation, LabelAnnotation } from '@dxos/echo/internal';
10
+ import { ViewAnnotation } from '@dxos/schema';
11
+
12
+ const GraphSchema = Schema.Struct({
13
+ name: Schema.optional(Schema.String),
14
+
15
+ view: Ref.Ref(View.View).pipe(FormInputAnnotation.set(false)),
16
+
17
+ query: Schema.Struct({
18
+ raw: Schema.optional(Schema.String),
19
+ ast: QueryAST.Query,
20
+ }).pipe(FormInputAnnotation.set(false)),
21
+ }).pipe(
22
+ Type.object({
23
+ typename: 'dxos.org/type/Graph',
24
+ version: '0.2.0',
25
+ }),
26
+ LabelAnnotation.set(['name']),
27
+ ViewAnnotation.set(true),
28
+ );
29
+ export interface Graph extends Schema.Schema.Type<typeof GraphSchema> {}
30
+ export const Graph: Type.Obj<Graph> = GraphSchema as any;
31
+
32
+ type MakeProps = Omit<Partial<Obj.MakeProps<typeof Graph>>, 'view'> & {
33
+ view: View.View;
34
+ };
35
+
36
+ /**
37
+ * Make a graph as a view of a data set.
38
+ */
39
+ export const make = ({
40
+ name,
41
+ query = { raw: '', ast: Query.select(Filter.nothing()).ast },
42
+ view,
43
+ }: MakeProps): Graph => {
44
+ return Obj.make(Graph, { name, view: Ref.make(view), query });
45
+ };
46
+
47
+ //
48
+ // V1
49
+ //
50
+
51
+ export const GraphV1 = Schema.Struct({
52
+ name: Schema.optional(Schema.String),
53
+ query: Schema.Struct({
54
+ raw: Schema.optional(Schema.String),
55
+ ast: QueryAST.Query,
56
+ }),
57
+ }).pipe(
58
+ Type.object({
59
+ typename: 'dxos.org/type/Graph',
60
+ version: '0.1.0',
61
+ }),
62
+ LabelAnnotation.set(['name']),
63
+ );
@@ -2,5 +2,5 @@
2
2
  // Copyright 2024 DXOS.org
3
3
  //
4
4
 
5
- export * from './schema';
6
- export * from './types';
5
+ export * as ExplorerAction from './ExplorerAction';
6
+ export * as Graph from './Graph';
@@ -1,49 +0,0 @@
1
- import {
2
- useGraphModel
3
- } from "./chunk-2MKBRIUT.mjs";
4
- import {
5
- D3ForceGraph
6
- } from "./chunk-NXGP6NTP.mjs";
7
-
8
- // src/components/ExplorerContainer.tsx
9
- import { useSignals as _useSignals } from "@preact-signals/safe-react/tracking";
10
- import React, { useCallback, useMemo, useState } from "react";
11
- import { QueryBuilder } from "@dxos/echo-query";
12
- import { useGlobalSearch } from "@dxos/plugin-search";
13
- import { getSpace } from "@dxos/react-client/echo";
14
- import { Toolbar } from "@dxos/react-ui";
15
- import { QueryEditor } from "@dxos/react-ui-components";
16
- import { StackItem } from "@dxos/react-ui-stack";
17
- var ExplorerContainer = ({ role, view }) => {
18
- var _effect = _useSignals();
19
- try {
20
- const space = getSpace(view);
21
- const [filter, setFilter] = useState();
22
- const model = useGraphModel(space, filter);
23
- const { match } = useGlobalSearch();
24
- const builder = useMemo(() => new QueryBuilder(), []);
25
- const handleChange = useCallback((value) => {
26
- setFilter(builder.build(value));
27
- }, []);
28
- if (!space || !model) {
29
- return null;
30
- }
31
- return /* @__PURE__ */ React.createElement(StackItem.Content, {
32
- toolbar: true,
33
- size: role === "section" ? "square" : "intrinsic"
34
- }, /* @__PURE__ */ React.createElement(Toolbar.Root, null, /* @__PURE__ */ React.createElement(QueryEditor, {
35
- space,
36
- onChange: handleChange
37
- })), /* @__PURE__ */ React.createElement(D3ForceGraph, {
38
- model,
39
- match
40
- }));
41
- } finally {
42
- _effect.f();
43
- }
44
- };
45
- var ExplorerContainer_default = ExplorerContainer;
46
- export {
47
- ExplorerContainer_default as default
48
- };
49
- //# sourceMappingURL=ExplorerContainer-S66JDOAF.mjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/components/ExplorerContainer.tsx"],
4
- "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport React, { useCallback, useMemo, useState } from 'react';\n\nimport { type Filter } from '@dxos/echo';\nimport { QueryBuilder } from '@dxos/echo-query';\nimport { useGlobalSearch } from '@dxos/plugin-search';\nimport { getSpace } from '@dxos/react-client/echo';\nimport { Toolbar } from '@dxos/react-ui';\nimport { QueryEditor, type QueryEditorProps } from '@dxos/react-ui-components';\nimport { StackItem } from '@dxos/react-ui-stack';\n\nimport { useGraphModel } from '../hooks';\nimport { type ViewType } from '../types';\n\nimport { D3ForceGraph } from './Graph';\n\ntype ExplorerContainerProps = {\n role: string;\n view: ViewType;\n};\n\nconst ExplorerContainer = ({ role, view }: ExplorerContainerProps) => {\n const space = getSpace(view);\n const [filter, setFilter] = useState<Filter.Any>();\n const model = useGraphModel(space, filter);\n const { match } = useGlobalSearch();\n\n const builder = useMemo(() => new QueryBuilder(), []);\n const handleChange = useCallback<NonNullable<QueryEditorProps['onChange']>>((value) => {\n setFilter(builder.build(value));\n }, []);\n\n if (!space || !model) {\n return null;\n }\n\n return (\n <StackItem.Content toolbar size={role === 'section' ? 'square' : 'intrinsic'}>\n <Toolbar.Root>\n <QueryEditor space={space} onChange={handleChange} />\n </Toolbar.Root>\n <D3ForceGraph model={model} match={match} />\n </StackItem.Content>\n );\n};\n\nexport default ExplorerContainer;\n"],
5
- "mappings": ";;;;;;;;;AAIA,OAAOA,SAASC,aAAaC,SAASC,gBAAgB;AAGtD,SAASC,oBAAoB;AAC7B,SAASC,uBAAuB;AAChC,SAASC,gBAAgB;AACzB,SAASC,eAAe;AACxB,SAASC,mBAA0C;AACnD,SAASC,iBAAiB;AAY1B,IAAMC,oBAAoB,CAAC,EAAEC,MAAMC,KAAI,MAA0B;;;AAC/D,UAAMC,QAAQC,SAASF,IAAAA;AACvB,UAAM,CAACG,QAAQC,SAAAA,IAAaC,SAAAA;AAC5B,UAAMC,QAAQC,cAAcN,OAAOE,MAAAA;AACnC,UAAM,EAAEK,MAAK,IAAKC,gBAAAA;AAElB,UAAMC,UAAUC,QAAQ,MAAM,IAAIC,aAAAA,GAAgB,CAAA,CAAE;AACpD,UAAMC,eAAeC,YAAuD,CAACC,UAAAA;AAC3EX,gBAAUM,QAAQM,MAAMD,KAAAA,CAAAA;IAC1B,GAAG,CAAA,CAAE;AAEL,QAAI,CAACd,SAAS,CAACK,OAAO;AACpB,aAAO;IACT;AAEA,WACE,sBAAA,cAACW,UAAUC,SAAO;MAACC,SAAAA;MAAQC,MAAMrB,SAAS,YAAY,WAAW;OAC/D,sBAAA,cAACsB,QAAQC,MAAI,MACX,sBAAA,cAACC,aAAAA;MAAYtB;MAAcuB,UAAUX;SAEvC,sBAAA,cAACY,cAAAA;MAAanB;MAAcE;;;;;AAGlC;AAEA,IAAA,4BAAeV;",
6
- "names": ["React", "useCallback", "useMemo", "useState", "QueryBuilder", "useGlobalSearch", "getSpace", "Toolbar", "QueryEditor", "StackItem", "ExplorerContainer", "role", "view", "space", "getSpace", "filter", "setFilter", "useState", "model", "useGraphModel", "match", "useGlobalSearch", "builder", "useMemo", "QueryBuilder", "handleChange", "useCallback", "value", "build", "StackItem", "Content", "toolbar", "size", "Toolbar", "Root", "QueryEditor", "onChange", "D3ForceGraph"]
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/meta.ts"],
4
- "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { type PluginMeta } from '@dxos/app-framework';\n\nexport const meta: PluginMeta = {\n id: 'dxos.org/plugin/explorer',\n name: 'Explorer',\n description: 'Install this plugin to view a hypergraph of all objects inside of your Space.',\n icon: 'ph--graph--regular',\n source: 'https://github.com/dxos/dxos/tree/main/packages/plugins/plugin-explorer',\n tags: ['labs'],\n screenshots: ['https://dxos.network/plugin-details-explorer-dark.png'],\n};\n"],
5
- "mappings": ";AAMO,IAAMA,OAAmB;EAC9BC,IAAI;EACJC,MAAM;EACNC,aAAa;EACbC,MAAM;EACNC,QAAQ;EACRC,MAAM;IAAC;;EACPC,aAAa;IAAC;;AAChB;",
6
- "names": ["meta", "id", "name", "description", "icon", "source", "tags", "screenshots"]
7
- }
@@ -1,31 +0,0 @@
1
- // src/hooks/useGraphModel.ts
2
- import { useEffect, useState } from "react";
3
- import { SpaceGraphModel } from "@dxos/schema";
4
- var useGraphModel = (space, filter, options, queue) => {
5
- const [model, setModel] = useState(void 0);
6
- useEffect(() => {
7
- if (!space) {
8
- void model?.close();
9
- setModel(void 0);
10
- return;
11
- }
12
- if (!model || model.queue !== queue) {
13
- const model2 = new SpaceGraphModel().setFilter(filter).setOptions(options);
14
- void model2.open(space, queue);
15
- setModel(model2);
16
- } else {
17
- model.setFilter(filter).setOptions(options);
18
- }
19
- }, [
20
- space,
21
- filter,
22
- options,
23
- queue
24
- ]);
25
- return model;
26
- };
27
-
28
- export {
29
- useGraphModel
30
- };
31
- //# sourceMappingURL=chunk-2MKBRIUT.mjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/hooks/useGraphModel.ts"],
4
- "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { useEffect, useState } from 'react';\n\nimport { type Filter, type Queue, type Space } from '@dxos/client/echo';\nimport { SpaceGraphModel, type SpaceGraphModelOptions } from '@dxos/schema';\n\n// TODO(burdon): Factor out.\nexport const useGraphModel = (\n space: Space | undefined,\n filter?: Filter.Any | undefined,\n options?: SpaceGraphModelOptions,\n queue?: Queue,\n): SpaceGraphModel | undefined => {\n const [model, setModel] = useState<SpaceGraphModel | undefined>(undefined);\n useEffect(() => {\n if (!space) {\n void model?.close();\n setModel(undefined);\n return;\n }\n\n // TODO(burdon): Does this need to be a dependency?\n if (!model || model.queue !== queue) {\n const model = new SpaceGraphModel().setFilter(filter).setOptions(options);\n void model.open(space, queue);\n setModel(model);\n } else {\n model.setFilter(filter).setOptions(options);\n }\n }, [space, filter, options, queue]);\n\n return model;\n};\n"],
5
- "mappings": ";AAIA,SAASA,WAAWC,gBAAgB;AAGpC,SAASC,uBAAoD;AAGtD,IAAMC,gBAAgB,CAC3BC,OACAC,QACAC,SACAC,UAAAA;AAEA,QAAM,CAACC,OAAOC,QAAAA,IAAYC,SAAsCC,MAAAA;AAChEC,YAAU,MAAA;AACR,QAAI,CAACR,OAAO;AACV,WAAKI,OAAOK,MAAAA;AACZJ,eAASE,MAAAA;AACT;IACF;AAGA,QAAI,CAACH,SAASA,MAAMD,UAAUA,OAAO;AACnC,YAAMC,SAAQ,IAAIM,gBAAAA,EAAkBC,UAAUV,MAAAA,EAAQW,WAAWV,OAAAA;AACjE,WAAKE,OAAMS,KAAKb,OAAOG,KAAAA;AACvBE,eAASD,MAAAA;IACX,OAAO;AACLA,YAAMO,UAAUV,MAAAA,EAAQW,WAAWV,OAAAA;IACrC;EACF,GAAG;IAACF;IAAOC;IAAQC;IAASC;GAAM;AAElC,SAAOC;AACT;",
6
- "names": ["useEffect", "useState", "SpaceGraphModel", "useGraphModel", "space", "filter", "options", "queue", "model", "setModel", "useState", "undefined", "useEffect", "close", "SpaceGraphModel", "setFilter", "setOptions", "open"]
7
- }
@@ -1,38 +0,0 @@
1
- import {
2
- meta
3
- } from "./chunk-2DGFNLRO.mjs";
4
-
5
- // src/types/schema.ts
6
- import * as Schema from "effect/Schema";
7
- import { TypedObject } from "@dxos/echo/internal";
8
- var ViewType = class extends TypedObject({
9
- typename: "dxos.org/type/ExplorerView",
10
- version: "0.1.0"
11
- })({
12
- name: Schema.optional(Schema.String),
13
- type: Schema.String
14
- }) {
15
- };
16
-
17
- // src/types/types.ts
18
- import * as Schema2 from "effect/Schema";
19
- (function(ExplorerAction2) {
20
- const EXPLORER_ACTION = `${meta.id}/action`;
21
- class Create extends Schema2.TaggedClass()(`${EXPLORER_ACTION}/create`, {
22
- input: Schema2.Struct({
23
- name: Schema2.optional(Schema2.String)
24
- }),
25
- output: Schema2.Struct({
26
- object: ViewType
27
- })
28
- }) {
29
- }
30
- ExplorerAction2.Create = Create;
31
- })(ExplorerAction || (ExplorerAction = {}));
32
- var ExplorerAction;
33
-
34
- export {
35
- ViewType,
36
- ExplorerAction
37
- };
38
- //# sourceMappingURL=chunk-4ETQJYX4.mjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/types/schema.ts", "../../../src/types/types.ts"],
4
- "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport * as Schema from 'effect/Schema';\n\nimport { TypedObject } from '@dxos/echo/internal';\n\n// TODO(burdon): Clashes with sdk/view.\nexport class ViewType extends TypedObject({\n typename: 'dxos.org/type/ExplorerView',\n version: '0.1.0',\n})({\n name: Schema.optional(Schema.String),\n type: Schema.String,\n}) {}\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport * as Schema from 'effect/Schema';\n\nimport { meta } from '../meta';\n\nimport { ViewType } from './schema';\n\nexport namespace ExplorerAction {\n const EXPLORER_ACTION = `${meta.id}/action`;\n\n export class Create extends Schema.TaggedClass<Create>()(`${EXPLORER_ACTION}/create`, {\n input: Schema.Struct({\n name: Schema.optional(Schema.String),\n }),\n output: Schema.Struct({\n object: ViewType,\n }),\n }) {}\n}\n"],
5
- "mappings": ";;;;;AAIA,YAAYA,YAAY;AAExB,SAASC,mBAAmB;AAGrB,IAAMC,WAAN,cAAuBC,YAAY;EACxCC,UAAU;EACVC,SAAS;AACX,CAAA,EAAG;EACDC,MAAaC,gBAAgBC,aAAM;EACnCC,MAAaD;AACf,CAAA,EAAA;AAAI;;;ACXJ,YAAYE,aAAY;UAMPC,iBAAAA;AACf,QAAMC,kBAAkB,GAAGC,KAAKC,EAAE;EAE3B,MAAMC,eAAsBC,oBAAW,EAAW,GAAGJ,eAAAA,WAA0B;IACpFK,OAAcC,eAAO;MACnBC,MAAaC,iBAAgBC,cAAM;IACrC,CAAA;IACAC,QAAeJ,eAAO;MACpBK,QAAQC;IACV,CAAA;EACF,CAAA,EAAA;EAAI;kBAPST,SAAAA;AAQf,GAXiBJ,mBAAAA,iBAAAA,CAAAA,EAAAA;;",
6
- "names": ["Schema", "TypedObject", "ViewType", "TypedObject", "typename", "version", "name", "optional", "String", "type", "Schema", "ExplorerAction", "EXPLORER_ACTION", "meta", "id", "Create", "TaggedClass", "input", "Struct", "name", "optional", "String", "output", "object", "ViewType"]
7
- }