@stratumn/react-map-explorer - npm Package Compare versions

Comparing version 0.1.2 to 0.1.3

lib/mapExplorer.d.ts

@@ -46,2 +46,3 @@ import { Segment } from '@stratumn/js-chainscript';
     state: State;
+    private node?;
     componentDidMount(): Promise<void>;
@@ -48,0 +49,0 @@ componentDidUpdate(prevProps: Props): Promise<void>;

lib/mapExplorer.js

@@ -34,3 +34,4 @@ "use strict";
 const react_1 = __importStar(require("react"));
-const segment_1 = require("./segment");
+const hash_1 = require("./hash");
+const mapExplorerDisplay_1 = require("./mapExplorerDisplay");
 /**
@@ -55,3 +56,3 @@ * A component to load and display Chainscript process maps.
                 }
-                if (!this.state.segments.find((s) => Buffer.from(s.linkHash()).toString('hex') === this.props.includeHash)) {
+                if (!this.state.segments.some((s) => hash_1.hashToString(s.linkHash()) === this.props.includeHash)) {
                     return true;
@@ -81,2 +82,9 @@ }
             yield this.loadMap();
+            if (this.node && this.state.segments) {
+                mapExplorerDisplay_1.displayMap(this.node, this.state.segments, {
+                    mapId: this.props.mapId,
+                    onSegmentSelected: this.props.onSegmentSelected,
+                    process: this.props.process
+                });
+            }
         });
@@ -88,2 +96,9 @@ }
                 yield this.loadMap();
+                if (this.node && this.state.segments) {
+                    mapExplorerDisplay_1.displayMap(this.node, this.state.segments, {
+                        mapId: this.props.mapId,
+                        onSegmentSelected: this.props.onSegmentSelected,
+                        process: this.props.process
+                    });
+                }
             }
@@ -93,6 +108,4 @@ });
     render() {
-        const { mapId } = this.props;
         if (!this.state.isLoaded) {
             return (react_1.default.createElement("div", null,
-                react_1.default.createElement("h1", null, mapId),
                 react_1.default.createElement("p", null, "Loading...")));
@@ -102,18 +115,10 @@ }
             return (react_1.default.createElement("div", null,
-                react_1.default.createElement("h1", null, mapId),
                 react_1.default.createElement("p", null, this.state.error.message)));
         }
-        const segments = this.state.segments;
-        const segmentItems = segments.map((s) => (react_1.default.createElement("li", { key: Buffer.from(s.linkHash()).toString('hex'), onClick: () => {
-                if (this.props.onSegmentSelected) {
-                    this.props.onSegmentSelected(s);
-                }
-            } },
-            react_1.default.createElement(segment_1.MapSegment, { segment: s }))));
         return (react_1.default.createElement("div", null,
-            react_1.default.createElement("h1", null, mapId),
-            react_1.default.createElement("h2", null,
-                this.state.segments.length,
-                " segments found"),
-            react_1.default.createElement("ul", null, segmentItems)));
+            react_1.default.createElement("svg", { ref: node => {
+                    if (node) {
+                        this.node = node;
+                    }
+                }, width: '800px', height: '600px' })));
     }
@@ -120,0 +125,0 @@ }

lib/mapLoader.js

@@ -27,3 +27,3 @@ "use strict";
 const store_client_1 = require("@stratumn/store-client");
-const buffer_1 = require("buffer");
+const hash_1 = require("./hash");
 /**
@@ -52,3 +52,9 @@ * An implementation of IMapLoader from a store client.
                 for (const ref of mapSegment.link().refs()) {
-                    const refSegment = yield this.store.getSegment(buffer_1.Buffer.from(ref.linkHash).toString('hex'));
+                    const refHash = hash_1.hashToString(ref.linkHash);
+                    // If we already loaded that reference, continue.
+                    if (refs.some(r => hash_1.hashToString(r.linkHash()) === refHash) ||
+                        results.some(s => hash_1.hashToString(s.linkHash()) === refHash)) {
+                        continue;
+                    }
+                    const refSegment = yield this.store.getSegment(refHash);
                     if (refSegment) {
@@ -55,0 +61,0 @@ refs.push(refSegment);

package.json

 {
   "name": "@stratumn/react-map-explorer",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "description": "A React component to load and display Chainscript process maps.",
@@ -49,4 +49,6 @@ "keywords": [
     "@stratumn/js-chainscript": "^1.0.3",
-    "@stratumn/store-client": "^0.1.2",
+    "@stratumn/store-client": "^0.1.3",
     "buffer": "^5.2.1",
+    "d3-hierarchy": "^1.1.8",
+    "d3-selection": "^1.3.2",
     "react": "^16.6.0",
@@ -56,2 +58,4 @@ "react-dom": "^16.6.0"
   "devDependencies": {
+    "@types/d3-hierarchy": "^1.1.4",
+    "@types/d3-selection": "^1.3.3",
     "@types/enzyme": "^3.1.14",
@@ -58,0 +62,0 @@ "@types/enzyme-adapter-react-16": "^1.0.3",

No alert changes

Improved metrics

Total package byte prevSize

35501

increased by67.43%

Number of package files

22

increased by22.22%

Lines of code

534

increased by68.45%

Worsened metrics

Dependency count

7

increased by40%

Dev dependency count

11

increased by22.22%

Dependency changes

• + Addedd3-hierarchy@^1.1.8

• + Addedd3-selection@^1.3.2

• + Addedd3-hierarchy@1.1.9(transitive)

• + Addedd3-selection@1.4.2(transitive)

• Updated@stratumn/store-client@^0.1.3