Skip to content

Commit 39b609f

Browse files
authored
Merge pull request #35 from Aviral09/dev
Fixes critical bugs
2 parents a147888 + aecea0f commit 39b609f

16 files changed

Lines changed: 102 additions & 82 deletions

File tree

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "concore-editor",
33
"version": "0.1.0",
44
"private": true,
5-
"homepage": "https://controlcore-project.github.io/concore-editor/",
5+
"homepage": "https://controlcore-project.github.io/concore-editor",
66
"dependencies": {
77
"@szhsin/react-menu": "^1.10.0",
88
"@testing-library/jest-dom": "^5.11.4",

src/GraphArea.jsx

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,10 @@
11
import React, { useEffect, useRef, useState } from 'react';
2-
import path from 'path';
32
import { edgeValidator, nodeValidator } from './config/defaultValidators';
43
import MyGraph from './graph-builder';
54
import { actionType as T } from './reducer';
65

76
function Graph({
8-
el, superState, dispatcher, graphID, serverID, graphML, projectName, graphContainerRef, active, loaded,
7+
el, superState, dispatcher, graphID, serverID, graphML, projectName, graphContainerRef, active,
98
}) {
109
const [instance, setInstance] = useState(null);
1110
const ref = useRef();
@@ -28,13 +27,14 @@ function Graph({
2827
myGraph.setCurStatus();
2928
return myGraph;
3029
};
31-
useEffect(() => {
32-
if (active && loaded && serverID) {
33-
window.history.pushState(null, null, path.join(process.env.PUBLIC_URL, 's', serverID));
34-
} else if (active && loaded && graphID) {
35-
window.history.pushState(null, null, path.join(process.env.PUBLIC_URL, 'l', graphID));
36-
}
37-
}, [active, serverID, loaded, graphID]);
30+
// Remote server implementation - Not being used.
31+
// useEffect(() => {
32+
// if (active && loaded && serverID) {
33+
// window.history.pushState(null, null, path.join(process.env.PUBLIC_URL, 's', serverID));
34+
// } else if (active && loaded && graphID) {
35+
// window.history.pushState(null, null, path.join(process.env.PUBLIC_URL, 'l', graphID));
36+
// }
37+
// }, [active, serverID, loaded, graphID]);
3838
useEffect(() => instance && instance.set({ superState }), [instance, superState]);
3939
useEffect(() => active && instance && instance.setCurStatus(), [active && instance]);
4040
useEffect(() => {

src/GraphWorkspace.jsx

Lines changed: 28 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,7 @@ import Graph from './GraphArea';
1010
const GraphComp = (props) => {
1111
const graphContainerRef = React.useRef();
1212
const { dispatcher, superState } = props;
13-
const [loadedFromStorage, setLoadedFromStorage] = React.useState(false);
14-
const [loadedFromURL, setLoadedFromURL] = React.useState(false);
13+
// const [loadedFromStorage, setLoadedFromStorage] = React.useState(false);
1514

1615
useEffect(() => {
1716
const allSavedGs = localStorageManager.getAllGraphs().map((graphID) => ({
@@ -21,33 +20,33 @@ const GraphComp = (props) => {
2120
type: T.ADD_GRAPH_BULK,
2221
payload: allSavedGs,
2322
});
24-
setLoadedFromStorage(true);
23+
// setLoadedFromStorage(true);
2524
}, []);
2625

27-
useEffect(() => {
28-
if (!loadedFromStorage) return;
29-
const graphFromParams = Object.fromEntries(new URLSearchParams(window.location.search).entries()).g;
30-
if (graphFromParams) {
31-
const graphContent = JSON.parse(window.atob(graphFromParams));
32-
const gid = new Date().getTime().toString();
33-
localStorageManager.addToFront(gid);
34-
localStorageManager.save(gid, graphContent);
35-
window.history.replaceState({}, document.title, window.location.pathname);
36-
dispatcher({ type: T.ADD_GRAPH, payload: { graphID: gid } });
37-
}
38-
const urlParms = window.location.pathname.split('/');
39-
const serverIDIndex = urlParms.indexOf('s');
40-
const localIDIndex = urlParms.indexOf('l');
41-
if (serverIDIndex !== -1 && serverIDIndex + 1 < urlParms.length) {
42-
const serverID = urlParms[serverIDIndex + 1];
43-
dispatcher({ type: T.ADD_GRAPH, payload: { serverID } });
44-
}
45-
if (localIDIndex !== -1 && localIDIndex + 1 < urlParms.length) {
46-
const graphID = urlParms[localIDIndex + 1];
47-
dispatcher({ type: T.ADD_GRAPH, payload: { graphID } });
48-
}
49-
setLoadedFromURL(true);
50-
}, [loadedFromStorage]);
26+
// Remote server implementation - Not being used.
27+
// useEffect(() => {
28+
// if (!loadedFromStorage) return;
29+
// const graphFromParams = Object.fromEntries(new URLSearchParams(window.location.search).entries()).g;
30+
// if (graphFromParams) {
31+
// const graphContent = JSON.parse(window.atob(graphFromParams));
32+
// const gid = new Date().getTime().toString();
33+
// localStorageManager.addToFront(gid);
34+
// localStorageManager.save(gid, graphContent);
35+
// window.history.replaceState({}, document.title, window.location.pathname);
36+
// dispatcher({ type: T.ADD_GRAPH, payload: { graphID: gid } });
37+
// }
38+
// const urlParms = window.location.pathname.split('/');
39+
// const serverIDIndex = urlParms.indexOf('s');
40+
// const localIDIndex = urlParms.indexOf('l');
41+
// if (serverIDIndex !== -1 && serverIDIndex + 1 < urlParms.length) {
42+
// const serverID = urlParms[serverIDIndex + 1];
43+
// dispatcher({ type: T.ADD_GRAPH, payload: { serverID } });
44+
// }
45+
// if (localIDIndex !== -1 && localIDIndex + 1 < urlParms.length) {
46+
// const graphID = urlParms[localIDIndex + 1];
47+
// dispatcher({ type: T.ADD_GRAPH, payload: { graphID } });
48+
// }
49+
// }, [loadedFromStorage]);
5150

5251
return (
5352
<div
@@ -73,7 +72,8 @@ const GraphComp = (props) => {
7372
serverID={el.serverID}
7473
graphML={el.graphML}
7574
projectName={el.projectName}
76-
loaded={loadedFromURL}
75+
fileHandle={el.fileHandle}
76+
fileName={el.fileName}
7777
/>
7878
))}
7979
<ZoomComp dispatcher={dispatcher} superState={superState} />

src/component/Header.jsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import {
88
ActionButton, Vsep, Hsep, Space, TextBox, Switcher, DropDown, FileUploader,
99
} from './HeaderComps';
1010
import 'rc-switch/assets/index.css';
11-
import ServerActions from './serverActions/ServerActions';
11+
// import ServerActions from './serverActions/ServerActions';
1212

1313
const setHotKeys = (actions) => {
1414
let keys = '';
@@ -65,7 +65,7 @@ const Header = ({ superState, dispatcher }) => {
6565
case 'menu': return <DropDown {...props} />;
6666
case 'file-upload': return <FileUploader {...props} superState={superState} />;
6767
case 'action': return <ActionButton {...props} />;
68-
case 'serverActions': return <ServerActions superState={superState} />;
68+
// case 'serverActions': return <ServerActions superState={superState} />;
6969
default: return <></>;
7070
}
7171
})

src/component/TabBar.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,7 @@ const TabBar = ({ superState, dispatcher }) => {
6060
id={`tab_${i}`}
6161
>
6262
<span className="tab-text">
63-
{el.projectName}
63+
{el.fileName || el.projectName}
6464
</span>
6565

6666
{superState.curGraphIndex === i ? (

src/component/fileBrowser.jsx

Lines changed: 5 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -21,19 +21,9 @@ const LocalFileBrowser = ({ superState, dispatcher }) => {
2121
}, []);
2222

2323
const [fileState, setFileState] = useState([]);
24-
// const [fileState, setFileState] = useState(() => {
25-
// let files = [];
26-
// files = [];
27-
// // if (window.localStorage.getItem('fileList')) {
28-
// // files = JSON.parse(window.localStorage.getItem('fileList'));
29-
// // console.log(files);
30-
// // return files;
31-
// // }
32-
// return { files };
33-
// });
3424

35-
// TODO
3625
useEffect(() => {
26+
// TODO - Loading file list from localStorage. Not supported by browsers.
3727
// if(window.localStorage.getItem('fileList')) {
3828
// const allFiles = window.localStorage.getItem('fileList');
3929
// setFileState({ files: allFiles });
@@ -50,20 +40,22 @@ const LocalFileBrowser = ({ superState, dispatcher }) => {
5040
};
5141

5242
const handleFileInDirs = async (topKey, value) => {
43+
let topLevel = topKey;
5344
let state = [];
5445
// eslint-disable-next-line no-restricted-syntax
5546
for await (const [key, valueSubDir] of value.entries()) {
5647
if (valueSubDir.kind === 'file') {
5748
const fileData = await valueSubDir.getFile();
5849
state = state.concat([{
59-
key: `${topKey}/${value.name}/${key}`,
50+
key: `${topLevel}/${value.name}/${key}`,
6051
modified: fileData.lastModified,
6152
size: fileData.size,
6253
fileObj: fileData,
6354
fileHandle: value,
6455
}]);
6556
} else if (valueSubDir.kind === 'directory') {
66-
const res = await handleFileInDirs();
57+
topLevel = `${topKey}/${value.name}`;
58+
const res = await handleFileInDirs(topLevel, valueSubDir);
6759
state = state.concat(res);
6860
}
6961
}

src/graph-builder/graph-core/1-core.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ class CoreGraph {
4141
this.bendNode = this.cy.add(
4242
{ group: 'nodes', data: { type: 'bend' }, classes: ['hidden'] },
4343
);
44-
this.regesterEvents();
44+
this.registerEvents();
4545
this.cy.emit('graph-modified');
4646
this.initizialize();
4747
}
@@ -137,7 +137,7 @@ class CoreGraph {
137137
});
138138
}
139139

140-
regesterEvents() {
140+
registerEvents() {
141141
this.cy.on('select unselect', () => this.selectDeselectEventHandler());
142142
this.cy.on('grab', 'node[type = "ordin"]', (e) => {
143143
e.target.forEach((node) => {

src/graph-builder/graph-core/4-undo-redo.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -145,8 +145,8 @@ class GraphUndoRedo extends GraphComponent {
145145
this.informUI();
146146
}
147147

148-
regesterEvents() {
149-
super.regesterEvents();
148+
registerEvents() {
149+
super.registerEvents();
150150
this.cy.on('dragfree', 'node[type = "ordin"]', (e) => {
151151
e.target.forEach((node) => {
152152
this.addPositionChange(node.id(), node.scratch('position'), { ...node.position() });

src/graph-builder/graph-core/5-load-save.js

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,8 @@ class GraphLoadSave extends GraphUndoRedo {
1313
this.autoSaveIntervalId = null;
1414
}
1515

16-
regesterEvents() {
17-
super.regesterEvents();
16+
registerEvents() {
17+
super.registerEvents();
1818
this.cy.on('add remove data dragfreeon', 'node[type="ordin"]', () => this.saveLocalStorage());
1919
this.cy.on('add remove data', 'edge[type="ordin"]', () => this.saveLocalStorage());
2020
this.cy.on('nodeediting.resizeend graph-modified', () => this.saveLocalStorage());
@@ -56,6 +56,8 @@ class GraphLoadSave extends GraphUndoRedo {
5656
projectName: this.projectName,
5757
id: this.id,
5858
serverID: this.serverID,
59+
fileName: null,
60+
fileHandle: null,
5961
};
6062
this.cy.nodes().forEach((node) => {
6163
if (this.shouldNodeBeSaved(node.id())) {
@@ -102,7 +104,14 @@ class GraphLoadSave extends GraphUndoRedo {
102104
const str = graphmlBuilder(this.jsonifyGraph());
103105
const bytes = new TextEncoder().encode(str);
104106
const blob = new Blob([bytes], { type: 'application/json;charset=utf-8' });
105-
saveAs(blob, `${fileName || `${this.getName()}-DHGWorkflow`}.graphml`);
107+
saveAs(blob, `${fileName || `${this.getName()}-concore`}.graphml`);
108+
}
109+
110+
saveToFolder() {
111+
const str = graphmlBuilder(this.jsonifyGraph());
112+
const bytes = new TextEncoder().encode(str);
113+
const blob = new Blob([bytes], { type: 'application/json;charset=utf-8' });
114+
return blob;
106115
}
107116

108117
getGraphML() {
@@ -111,7 +120,7 @@ class GraphLoadSave extends GraphUndoRedo {
111120

112121
loadJson(content) {
113122
content.nodes.forEach((node) => {
114-
this.addNode(node.label, node.style, 'ordin', node.position, { }, node.id, 0);
123+
this.addNode(node.label, node.style, 'ordin', node.position, {}, node.id, 0);
115124
});
116125
content.edges.forEach((edge) => {
117126
this.addEdge({ ...edge, sourceID: edge.source, targetID: edge.target }, 0);

src/graph-builder/graphml/builder/graphML.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
const graphML = ({
2-
nodes, edges, id, projectName, actionHistory, serverID,
2+
nodes, edges, id, projectName, actionHistory, serverID, fileHandle, fileName,
33
}) => ({
44
graphml: {
55
$: {
@@ -31,6 +31,8 @@ const graphML = ({
3131
id,
3232
projectName,
3333
serverID,
34+
fileHandle,
35+
fileName,
3436
},
3537
node: nodes,
3638
edge: edges,

0 commit comments

Comments
 (0)