@xyo-network/react-node-renderer 2.56.2 → 2.56.4
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.
- package/dist/cjs/Cytoscape/CytoscapeElements.js +11 -8
- package/dist/cjs/Cytoscape/CytoscapeElements.js.map +1 -1
- package/dist/cjs/components/ProvidedNodeRenderer.js +1 -1
- package/dist/cjs/components/RelationalGraph.js +1 -1
- package/dist/cjs/components/RelationalGraph.js.map +1 -1
- package/dist/cjs/contexts/CytoscapeInstance/Provider.js +1 -1
- package/dist/cjs/contexts/CytoscapeInstance/Provider.js.map +1 -1
- package/dist/cjs/hooks/cytoscape/useCytoscapeElements.js.map +1 -1
- package/dist/docs.json +3287 -1916
- package/dist/esm/Cytoscape/CytoscapeElements.js +11 -8
- package/dist/esm/Cytoscape/CytoscapeElements.js.map +1 -1
- package/dist/esm/components/ProvidedNodeRenderer.js +2 -2
- package/dist/esm/hooks/cytoscape/useCytoscapeElements.js.map +1 -1
- package/dist/types/Cytoscape/CytoscapeElements.d.ts +4 -4
- package/dist/types/Cytoscape/CytoscapeElements.d.ts.map +1 -1
- package/dist/types/components/ProvidedNodeRenderer.d.ts +2 -2
- package/dist/types/components/ProvidedNodeRenderer.d.ts.map +1 -1
- package/dist/types/hooks/cytoscape/useCytoscapeElements.d.ts +2 -2
- package/dist/types/hooks/cytoscape/useCytoscapeElements.d.ts.map +1 -1
- package/package.json +21 -21
- package/src/Cytoscape/CytoscapeElements.ts +11 -9
- package/src/components/ProvidedNodeRenderer.tsx +4 -4
- package/src/components/RelationalGraph.stories.tsx +15 -17
- package/src/components/RelationalGraphEvents.stories.tsx +2 -2
- package/src/hooks/cytoscape/useCytoscapeElements.ts +2 -2
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import { ModuleWrapper } from '@xyo-network/module';
|
|
2
|
+
import { NodeWrapper } from '@xyo-network/node';
|
|
2
3
|
import { parseModuleType } from './lib';
|
|
3
4
|
export class CytoscapeElements {
|
|
4
5
|
static MaxNameLength = 20;
|
|
5
|
-
static async buildChild(
|
|
6
|
-
const [result] = await
|
|
7
|
-
const
|
|
6
|
+
static async buildChild(node, address) {
|
|
7
|
+
const [result] = await node.downResolver.resolve({ address: [address] });
|
|
8
|
+
const wrapper = ModuleWrapper.wrap(result);
|
|
9
|
+
const description = await wrapper.describe();
|
|
8
10
|
return CytoscapeElements.buildNode(description);
|
|
9
11
|
}
|
|
10
12
|
static buildEdge(rootNode, newNode) {
|
|
@@ -16,14 +18,14 @@ export class CytoscapeElements {
|
|
|
16
18
|
},
|
|
17
19
|
};
|
|
18
20
|
}
|
|
19
|
-
static async buildElements(
|
|
21
|
+
static async buildElements(node) {
|
|
20
22
|
try {
|
|
21
|
-
const [description, newRootNode] = await CytoscapeElements.buildRootNode(
|
|
23
|
+
const [description, newRootNode] = await CytoscapeElements.buildRootNode(node);
|
|
22
24
|
const newElements = [newRootNode];
|
|
23
25
|
const children = description.children;
|
|
24
26
|
await Promise.allSettled((children ?? [])?.map(async (address) => {
|
|
25
27
|
try {
|
|
26
|
-
const newNode = await CytoscapeElements.buildChild(
|
|
28
|
+
const newNode = await CytoscapeElements.buildChild(node, address);
|
|
27
29
|
newElements.push(newNode);
|
|
28
30
|
const newEdge = CytoscapeElements.buildEdge(newRootNode, newNode);
|
|
29
31
|
newElements.push(newEdge);
|
|
@@ -48,8 +50,9 @@ export class CytoscapeElements {
|
|
|
48
50
|
},
|
|
49
51
|
};
|
|
50
52
|
}
|
|
51
|
-
static buildRootNode = async (
|
|
52
|
-
const
|
|
53
|
+
static buildRootNode = async (node) => {
|
|
54
|
+
const nodeWrapper = NodeWrapper.wrap(node);
|
|
55
|
+
const description = await nodeWrapper?.describe();
|
|
53
56
|
return [description, CytoscapeElements.buildNode(description)];
|
|
54
57
|
};
|
|
55
58
|
static normalizeName(name) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CytoscapeElements.js","sourceRoot":"","sources":["../../../src/Cytoscape/CytoscapeElements.ts"],"names":[],"mappings":"AAAA,OAAO,EAAqB,aAAa,EAAE,MAAM,qBAAqB,CAAA;
|
|
1
|
+
{"version":3,"file":"CytoscapeElements.js","sourceRoot":"","sources":["../../../src/Cytoscape/CytoscapeElements.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
2
|
+
import { useWrappedProvidedNode } from '@xyo-network/react-node';
|
|
3
3
|
import { useCytoscapeElements, useCytoscapeOptions } from '../hooks';
|
|
4
4
|
import { NodeRelationalGraph } from './RelationalGraph';
|
|
5
5
|
export const ProvidedNodeRenderer = ({ node, ...props }) => {
|
|
6
|
-
const [providedNode] =
|
|
6
|
+
const [providedNode] = useWrappedProvidedNode();
|
|
7
7
|
const elements = useCytoscapeElements(node ?? providedNode);
|
|
8
8
|
const options = useCytoscapeOptions(elements);
|
|
9
9
|
return _jsx(NodeRelationalGraph, { alignItems: "stretch", flexGrow: 1, height: "100%", options: options, ...props });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useCytoscapeElements.js","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useCytoscapeElements.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAA;AAI3D,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAE3C,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA;AAEnD;;;GAGG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,
|
|
1
|
+
{"version":3,"file":"useCytoscapeElements.js","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useCytoscapeElements.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAA;AAI3D,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAE3C,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA;AAEnD;;;GAGG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,UAA8B,EAAE,EAAE;IACrE,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAsB,EAAE,CAAC,CAAA;IAEjE,cAAc;IACZ,uDAAuD;IACvD,KAAK,IAAI,EAAE;QACT,IAAI,UAAU,EAAE;YACd,MAAM,WAAW,GAAG,CAAC,MAAM,iBAAiB,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC,IAAI,EAAE,CAAA;YAC7E,WAAW,CAAC,WAAW,CAAC,CAAA;SACzB;IACH,CAAC,EACD,CAAC,UAAU,CAAC,CACb,CAAA;IAED,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,gBAAgB,GAAyC,SAAS,CAAA;QACtE,IAAI,gBAAgB,GAAyC,SAAS,CAAA;QAEtE,IAAI,UAAU,EAAE;YACd,gBAAgB,GAAG,UAAU,CAAC,EAAE,CAAC,gBAAgB,EAAE,KAAK,IAAI,EAAE;gBAC5D,MAAM,WAAW,GAAG,CAAC,MAAM,iBAAiB,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC,IAAI,EAAE,CAAA;gBAC7E,WAAW,CAAC,WAAW,CAAC,CAAA;YAC1B,CAAC,CAAC,CAAA;YACF,gBAAgB,GAAG,UAAU,CAAC,EAAE,CAAC,gBAAgB,EAAE,KAAK,IAAI,EAAE;gBAC5D,MAAM,WAAW,GAAG,CAAC,MAAM,iBAAiB,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC,IAAI,EAAE,CAAA;gBAC7E,WAAW,CAAC,WAAW,CAAC,CAAA;YAC1B,CAAC,CAAC,CAAA;SACH;QAED,OAAO,GAAG,EAAE;YACV,gBAAgB,EAAE,EAAE,CAAA;YACpB,gBAAgB,EAAE,EAAE,CAAA;QACtB,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAA;IAEhB,OAAO,QAAQ,CAAA;AACjB,CAAC,CAAA"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { ModuleDescription } from '@xyo-network/module';
|
|
2
|
-
import {
|
|
2
|
+
import { NodeModule } from '@xyo-network/node';
|
|
3
3
|
import { ElementDefinition } from 'cytoscape';
|
|
4
4
|
export declare class CytoscapeElements {
|
|
5
5
|
static MaxNameLength: number;
|
|
6
|
-
static buildChild(
|
|
6
|
+
static buildChild(node: NodeModule, address: string): Promise<ElementDefinition>;
|
|
7
7
|
static buildEdge(rootNode: ElementDefinition, newNode: ElementDefinition): {
|
|
8
8
|
data: {
|
|
9
9
|
id: string;
|
|
@@ -11,9 +11,9 @@ export declare class CytoscapeElements {
|
|
|
11
11
|
target: string | undefined;
|
|
12
12
|
};
|
|
13
13
|
};
|
|
14
|
-
static buildElements(
|
|
14
|
+
static buildElements(node: NodeModule): Promise<ElementDefinition[] | undefined>;
|
|
15
15
|
static buildNode(description: ModuleDescription): ElementDefinition;
|
|
16
|
-
static buildRootNode: (
|
|
16
|
+
static buildRootNode: (node: NodeModule) => Promise<[ModuleDescription, ElementDefinition]>;
|
|
17
17
|
static normalizeName(name?: string): string | undefined;
|
|
18
18
|
}
|
|
19
19
|
//# sourceMappingURL=CytoscapeElements.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CytoscapeElements.d.ts","sourceRoot":"","sources":["../../../src/Cytoscape/CytoscapeElements.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAiB,MAAM,qBAAqB,CAAA;AACtE,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"CytoscapeElements.d.ts","sourceRoot":"","sources":["../../../src/Cytoscape/CytoscapeElements.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAiB,MAAM,qBAAqB,CAAA;AACtE,OAAO,EAAE,UAAU,EAAe,MAAM,mBAAmB,CAAA;AAC3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAA;AAI7C,qBAAa,iBAAiB;IAC5B,MAAM,CAAC,aAAa,SAAK;WAEZ,UAAU,CAAC,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM;IAOzD,MAAM,CAAC,SAAS,CAAC,QAAQ,EAAE,iBAAiB,EAAE,OAAO,EAAE,iBAAiB;;;;;;;WAU3D,aAAa,CAAC,IAAI,EAAE,UAAU;IAyB3C,MAAM,CAAC,SAAS,CAAC,WAAW,EAAE,iBAAiB,GAAG,iBAAiB;IAWnE,MAAM,CAAC,aAAa,SAAgB,UAAU,KAAG,QAAQ,CAAC,iBAAiB,EAAE,iBAAiB,CAAC,CAAC,CAI/F;IAED,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,EAAE,MAAM;CAKnC"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import {
|
|
2
|
+
import { NodeModule } from '@xyo-network/node';
|
|
3
3
|
import { NodeRelationalGraphProps } from './lib';
|
|
4
4
|
export interface ProvidedNodeRendererProps extends NodeRelationalGraphProps {
|
|
5
|
-
node?:
|
|
5
|
+
node?: NodeModule;
|
|
6
6
|
}
|
|
7
7
|
export declare const ProvidedNodeRenderer: React.FC<ProvidedNodeRendererProps>;
|
|
8
8
|
//# sourceMappingURL=ProvidedNodeRenderer.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProvidedNodeRenderer.d.ts","sourceRoot":"","sources":["../../../src/components/ProvidedNodeRenderer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"ProvidedNodeRenderer.d.ts","sourceRoot":"","sources":["../../../src/components/ProvidedNodeRenderer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAI9C,OAAO,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAA;AAGhD,MAAM,WAAW,yBAA0B,SAAQ,wBAAwB;IACzE,IAAI,CAAC,EAAE,UAAU,CAAA;CAClB;AAED,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CAMpE,CAAA"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { NodeModule } from '@xyo-network/node';
|
|
2
2
|
import { ElementDefinition } from 'cytoscape';
|
|
3
3
|
/**
|
|
4
4
|
* Note: Relies on describe but could eventually be converted to a discover call
|
|
5
5
|
* Logic would be similar to what the bridge does
|
|
6
6
|
*/
|
|
7
|
-
export declare const useCytoscapeElements: (targetNode?:
|
|
7
|
+
export declare const useCytoscapeElements: (targetNode?: NodeModule | null) => ElementDefinition[];
|
|
8
8
|
//# sourceMappingURL=useCytoscapeElements.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useCytoscapeElements.d.ts","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useCytoscapeElements.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"useCytoscapeElements.d.ts","sourceRoot":"","sources":["../../../../src/hooks/cytoscape/useCytoscapeElements.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAC9C,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAA;AAK7C;;;GAGG;AACH,eAAO,MAAM,oBAAoB,gBAAiB,UAAU,GAAG,IAAI,wBAoClE,CAAA"}
|
package/package.json
CHANGED
|
@@ -13,14 +13,14 @@
|
|
|
13
13
|
"@xylabs/react-async-effect": "^2.17.6",
|
|
14
14
|
"@xylabs/react-flexbox": "^2.17.6",
|
|
15
15
|
"@xylabs/react-shared": "^2.17.6",
|
|
16
|
-
"@xyo-network/archivist-model": "^2.64.
|
|
17
|
-
"@xyo-network/diviner-model": "^2.64.
|
|
18
|
-
"@xyo-network/module": "^2.64.
|
|
19
|
-
"@xyo-network/node": "^2.64.
|
|
20
|
-
"@xyo-network/react-archivist": "^2.56.
|
|
21
|
-
"@xyo-network/react-module": "^2.56.
|
|
22
|
-
"@xyo-network/react-node": "^2.56.
|
|
23
|
-
"@xyo-network/react-shared": "^2.56.
|
|
16
|
+
"@xyo-network/archivist-model": "^2.64.3",
|
|
17
|
+
"@xyo-network/diviner-model": "^2.64.3",
|
|
18
|
+
"@xyo-network/module": "^2.64.3",
|
|
19
|
+
"@xyo-network/node": "^2.64.3",
|
|
20
|
+
"@xyo-network/react-archivist": "^2.56.4",
|
|
21
|
+
"@xyo-network/react-module": "^2.56.4",
|
|
22
|
+
"@xyo-network/react-node": "^2.56.4",
|
|
23
|
+
"@xyo-network/react-shared": "^2.56.4",
|
|
24
24
|
"cytoscape": "^3.25.0"
|
|
25
25
|
},
|
|
26
26
|
"peerDependencies": {
|
|
@@ -33,20 +33,20 @@
|
|
|
33
33
|
"react-router-dom": "^6"
|
|
34
34
|
},
|
|
35
35
|
"devDependencies": {
|
|
36
|
-
"@storybook/react": "^7.0.
|
|
36
|
+
"@storybook/react": "^7.0.25",
|
|
37
37
|
"@types/cytoscape": "^3.19.10",
|
|
38
38
|
"@types/react-dom": "^18.2.6",
|
|
39
|
-
"@xylabs/ts-scripts-yarn3": "^2.18.
|
|
40
|
-
"@xylabs/tsconfig-react": "^2.18.
|
|
41
|
-
"@xyo-network/archivist": "^2.64.
|
|
42
|
-
"@xyo-network/bridge": "^2.64.
|
|
43
|
-
"@xyo-network/id-plugin": "^2.64.
|
|
44
|
-
"@xyo-network/module": "^2.64.
|
|
45
|
-
"@xyo-network/node": "^2.64.
|
|
46
|
-
"@xyo-network/react-node": "^2.56.
|
|
47
|
-
"@xyo-network/react-storybook": "^2.56.
|
|
48
|
-
"@xyo-network/react-wallet": "^2.56.
|
|
49
|
-
"@xyo-network/sentinel": "^2.64.
|
|
39
|
+
"@xylabs/ts-scripts-yarn3": "^2.18.7",
|
|
40
|
+
"@xylabs/tsconfig-react": "^2.18.7",
|
|
41
|
+
"@xyo-network/archivist": "^2.64.3",
|
|
42
|
+
"@xyo-network/bridge": "^2.64.3",
|
|
43
|
+
"@xyo-network/id-plugin": "^2.64.3",
|
|
44
|
+
"@xyo-network/module": "^2.64.3",
|
|
45
|
+
"@xyo-network/node": "^2.64.3",
|
|
46
|
+
"@xyo-network/react-node": "^2.56.4",
|
|
47
|
+
"@xyo-network/react-storybook": "^2.56.4",
|
|
48
|
+
"@xyo-network/react-wallet": "^2.56.4",
|
|
49
|
+
"@xyo-network/sentinel": "^2.64.3",
|
|
50
50
|
"typescript": "^5.1.6"
|
|
51
51
|
},
|
|
52
52
|
"description": "Common React library for all XYO projects that use React",
|
|
@@ -92,5 +92,5 @@
|
|
|
92
92
|
},
|
|
93
93
|
"sideEffects": false,
|
|
94
94
|
"types": "dist/types/index.d.ts",
|
|
95
|
-
"version": "2.56.
|
|
95
|
+
"version": "2.56.4"
|
|
96
96
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ModuleDescription, ModuleWrapper } from '@xyo-network/module'
|
|
2
|
-
import { NodeWrapper } from '@xyo-network/node'
|
|
2
|
+
import { NodeModule, NodeWrapper } from '@xyo-network/node'
|
|
3
3
|
import { ElementDefinition } from 'cytoscape'
|
|
4
4
|
|
|
5
5
|
import { parseModuleType } from './lib'
|
|
@@ -7,9 +7,10 @@ import { parseModuleType } from './lib'
|
|
|
7
7
|
export class CytoscapeElements {
|
|
8
8
|
static MaxNameLength = 20
|
|
9
9
|
|
|
10
|
-
static async buildChild(
|
|
11
|
-
const [result] = await
|
|
12
|
-
const
|
|
10
|
+
static async buildChild(node: NodeModule, address: string) {
|
|
11
|
+
const [result] = await node.downResolver.resolve({ address: [address] })
|
|
12
|
+
const wrapper = ModuleWrapper.wrap(result)
|
|
13
|
+
const description = await wrapper.describe()
|
|
13
14
|
return CytoscapeElements.buildNode(description)
|
|
14
15
|
}
|
|
15
16
|
|
|
@@ -23,16 +24,16 @@ export class CytoscapeElements {
|
|
|
23
24
|
}
|
|
24
25
|
}
|
|
25
26
|
|
|
26
|
-
static async buildElements(
|
|
27
|
+
static async buildElements(node: NodeModule) {
|
|
27
28
|
try {
|
|
28
|
-
const [description, newRootNode] = await CytoscapeElements.buildRootNode(
|
|
29
|
+
const [description, newRootNode] = await CytoscapeElements.buildRootNode(node)
|
|
29
30
|
const newElements: ElementDefinition[] = [newRootNode]
|
|
30
31
|
|
|
31
32
|
const children = description.children
|
|
32
33
|
await Promise.allSettled(
|
|
33
34
|
(children ?? [])?.map(async (address) => {
|
|
34
35
|
try {
|
|
35
|
-
const newNode = await CytoscapeElements.buildChild(
|
|
36
|
+
const newNode = await CytoscapeElements.buildChild(node, address)
|
|
36
37
|
newElements.push(newNode)
|
|
37
38
|
|
|
38
39
|
const newEdge = CytoscapeElements.buildEdge(newRootNode, newNode)
|
|
@@ -59,8 +60,9 @@ export class CytoscapeElements {
|
|
|
59
60
|
}
|
|
60
61
|
}
|
|
61
62
|
|
|
62
|
-
static buildRootNode = async (
|
|
63
|
-
const
|
|
63
|
+
static buildRootNode = async (node: NodeModule): Promise<[ModuleDescription, ElementDefinition]> => {
|
|
64
|
+
const nodeWrapper = NodeWrapper.wrap(node)
|
|
65
|
+
const description = await nodeWrapper?.describe()
|
|
64
66
|
return [description, CytoscapeElements.buildNode(description)]
|
|
65
67
|
}
|
|
66
68
|
|
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
1
|
+
import { NodeModule } from '@xyo-network/node'
|
|
2
|
+
import { useWrappedProvidedNode } from '@xyo-network/react-node'
|
|
3
3
|
|
|
4
4
|
import { useCytoscapeElements, useCytoscapeOptions } from '../hooks'
|
|
5
5
|
import { NodeRelationalGraphProps } from './lib'
|
|
6
6
|
import { NodeRelationalGraph } from './RelationalGraph'
|
|
7
7
|
|
|
8
8
|
export interface ProvidedNodeRendererProps extends NodeRelationalGraphProps {
|
|
9
|
-
node?:
|
|
9
|
+
node?: NodeModule
|
|
10
10
|
}
|
|
11
11
|
|
|
12
12
|
export const ProvidedNodeRenderer: React.FC<ProvidedNodeRendererProps> = ({ node, ...props }) => {
|
|
13
|
-
const [providedNode] =
|
|
13
|
+
const [providedNode] = useWrappedProvidedNode()
|
|
14
14
|
const elements = useCytoscapeElements(node ?? providedNode)
|
|
15
15
|
const options = useCytoscapeOptions(elements)
|
|
16
16
|
|
|
@@ -4,12 +4,12 @@ import { useAsyncEffect } from '@xylabs/react-async-effect'
|
|
|
4
4
|
import { MemoryArchivist, MemoryArchivistConfigSchema } from '@xyo-network/archivist'
|
|
5
5
|
import { HttpBridge, HttpBridgeConfigSchema } from '@xyo-network/bridge'
|
|
6
6
|
import { IdWitness, IdWitnessConfigSchema } from '@xyo-network/id-plugin'
|
|
7
|
-
import { MemoryNode, NodeConfigSchema
|
|
8
|
-
import { NodeProvider,
|
|
7
|
+
import { MemoryNode, NodeConfigSchema } from '@xyo-network/node'
|
|
8
|
+
import { NodeProvider, useNodeFromNode, useWrappedProvidedNode } from '@xyo-network/react-node'
|
|
9
9
|
import { DefaultSeedPhrase } from '@xyo-network/react-storybook'
|
|
10
10
|
import { useWallet, WalletProvider } from '@xyo-network/react-wallet'
|
|
11
11
|
import { MemorySentinel, SentinelConfigSchema } from '@xyo-network/sentinel'
|
|
12
|
-
import {
|
|
12
|
+
import { useState } from 'react'
|
|
13
13
|
|
|
14
14
|
import { useCytoscapeElements, useCytoscapeOptions } from '../hooks'
|
|
15
15
|
import { ProvidedNodeRenderer } from './ProvidedNodeRenderer'
|
|
@@ -76,16 +76,15 @@ export default {
|
|
|
76
76
|
const Template: StoryFn<typeof NodeRelationalGraph> = (props) => <NodeRelationalGraph {...props} />
|
|
77
77
|
|
|
78
78
|
const TemplateDescribe: StoryFn<typeof NodeRelationalGraph> = (props) => {
|
|
79
|
-
const [node] =
|
|
79
|
+
const [node] = useWrappedProvidedNode()
|
|
80
80
|
const elements = useCytoscapeElements(node)
|
|
81
81
|
const options = useCytoscapeOptions(elements)
|
|
82
82
|
return <NodeRelationalGraph options={options} {...props} />
|
|
83
83
|
}
|
|
84
84
|
|
|
85
85
|
const TemplateCustomAddress: StoryFn<typeof NodeRelationalGraph> = (props) => {
|
|
86
|
-
const [node] =
|
|
87
|
-
const
|
|
88
|
-
const elements = useCytoscapeElements(wrappedNode)
|
|
86
|
+
const [node] = useNodeFromNode('ChildNode')
|
|
87
|
+
const elements = useCytoscapeElements(node)
|
|
89
88
|
const options = useCytoscapeOptions(elements)
|
|
90
89
|
return <NodeRelationalGraph options={options} {...props} />
|
|
91
90
|
}
|
|
@@ -93,9 +92,8 @@ const TemplateCustomAddress: StoryFn<typeof NodeRelationalGraph> = (props) => {
|
|
|
93
92
|
const TemplateProvidedNodeRenderer: StoryFn<typeof ProvidedNodeRenderer> = (props) => <ProvidedNodeRenderer {...props} />
|
|
94
93
|
|
|
95
94
|
const TemplateAttachDetach: StoryFn<typeof NodeRelationalGraph> = (props) => {
|
|
96
|
-
const [node] =
|
|
97
|
-
const
|
|
98
|
-
const elements = useCytoscapeElements(wrappedNode)
|
|
95
|
+
const [node] = useNodeFromNode('ChildNode')
|
|
96
|
+
const elements = useCytoscapeElements(node)
|
|
99
97
|
const options = useCytoscapeOptions(elements)
|
|
100
98
|
const [idWitness, setIdWitness] = useState<IdWitness>()
|
|
101
99
|
|
|
@@ -109,18 +107,18 @@ const TemplateAttachDetach: StoryFn<typeof NodeRelationalGraph> = (props) => {
|
|
|
109
107
|
)
|
|
110
108
|
|
|
111
109
|
const handleAddWitness = async () => {
|
|
112
|
-
if (
|
|
113
|
-
const memoryNode =
|
|
114
|
-
await memoryNode.
|
|
110
|
+
if (node && idWitness) {
|
|
111
|
+
const memoryNode = node as MemoryNode
|
|
112
|
+
await memoryNode.register(idWitness)
|
|
115
113
|
await memoryNode.attach(idWitness.address, true)
|
|
116
114
|
}
|
|
117
115
|
}
|
|
118
116
|
|
|
119
117
|
const handleRemoveWitness = async () => {
|
|
120
|
-
if (
|
|
121
|
-
const memoryNode =
|
|
122
|
-
if (
|
|
123
|
-
await memoryNode.
|
|
118
|
+
if (node && idWitness) {
|
|
119
|
+
const memoryNode = node as MemoryNode
|
|
120
|
+
if (memoryNode.registered().includes(idWitness.address)) {
|
|
121
|
+
await memoryNode.unregister(idWitness)
|
|
124
122
|
}
|
|
125
123
|
}
|
|
126
124
|
}
|
|
@@ -2,7 +2,7 @@ import { Decorator, Meta, StoryFn } from '@storybook/react'
|
|
|
2
2
|
import { useAsyncEffect } from '@xylabs/react-async-effect'
|
|
3
3
|
import { ArchivistConfigSchema, MemoryArchivist } from '@xyo-network/archivist'
|
|
4
4
|
import { MemoryNode, NodeConfigSchema } from '@xyo-network/node'
|
|
5
|
-
import { NodeProvider,
|
|
5
|
+
import { NodeProvider, useWrappedProvidedNode } from '@xyo-network/react-node'
|
|
6
6
|
import { DefaultSeedPhrase } from '@xyo-network/react-storybook'
|
|
7
7
|
import { useWallet, WalletProvider } from '@xyo-network/react-wallet'
|
|
8
8
|
import { EventObject } from 'cytoscape'
|
|
@@ -49,7 +49,7 @@ export default {
|
|
|
49
49
|
} as Meta
|
|
50
50
|
|
|
51
51
|
const Template: StoryFn<typeof NodeRelationalGraph> = (props) => {
|
|
52
|
-
const [node] =
|
|
52
|
+
const [node] = useWrappedProvidedNode()
|
|
53
53
|
const elements = useCytoscapeElements(node)
|
|
54
54
|
const options = useCytoscapeOptions(elements)
|
|
55
55
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { useAsyncEffect } from '@xylabs/react-async-effect'
|
|
2
2
|
import { EventUnsubscribeFunction } from '@xyo-network/module'
|
|
3
|
-
import {
|
|
3
|
+
import { NodeModule } from '@xyo-network/node'
|
|
4
4
|
import { ElementDefinition } from 'cytoscape'
|
|
5
5
|
import { useEffect, useState } from 'react'
|
|
6
6
|
|
|
@@ -10,7 +10,7 @@ import { CytoscapeElements } from '../../Cytoscape'
|
|
|
10
10
|
* Note: Relies on describe but could eventually be converted to a discover call
|
|
11
11
|
* Logic would be similar to what the bridge does
|
|
12
12
|
*/
|
|
13
|
-
export const useCytoscapeElements = (targetNode?:
|
|
13
|
+
export const useCytoscapeElements = (targetNode?: NodeModule | null) => {
|
|
14
14
|
const [elements, setElements] = useState<ElementDefinition[]>([])
|
|
15
15
|
|
|
16
16
|
useAsyncEffect(
|