Skip to content

Commit a57e054

Browse files
authored
Merge pull request #176 from ControlCore-Project/main
Attempt ot merge main to dev
2 parents 23d3c1b + 5e6f511 commit a57e054

21 files changed

Lines changed: 2267 additions & 45 deletions

package-lock.json

Lines changed: 1550 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,9 +28,11 @@
2828
"react-dom": "^17.0.2",
2929
"react-icons": "^4.2.0",
3030
"react-keyed-file-browser": "^1.14.0",
31+
"react-markdown": "^8.0.7",
3132
"react-modal": "^3.13.1",
3233
"react-scripts": "4.0.3",
3334
"react-simple-code-editor": "^0.13.0",
35+
"react-spinners": "^0.13.8",
3436
"react-toastify": "^8.0.0",
3537
"react-tooltip": "^4.2.21",
3638
"web-vitals": "^0.2.4",

src/App.jsx

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,9 @@ import FileDragDrop from './component/File-drag-drop';
1414
import HistoryModal from './component/modals/History';
1515
import LocalFileBrowser from './component/fileBrowser';
1616
import FileEditModal from './component/modals/FileEdit';
17+
import MarkDown from './component/modals/markDown';
18+
import OptionsModal from './component/modals/OptionsModal';
19+
import Logs from './component/Logs';
1720
import ContributeDetails from './component/modals/ContributeDetails';
1821

1922
const app = () => {
@@ -36,10 +39,14 @@ const app = () => {
3639
<HistoryModal superState={superState} dispatcher={dispatcher} />
3740
<ContributeDetails superState={superState} dispatcher={dispatcher} />
3841
<FileEditModal superState={superState} dispatcher={dispatcher} />
42+
<OptionsModal superState={superState} dispatcher={dispatcher} />
3943
<GraphCompDetails
4044
closeModal={() => dispatcher({ type: T.Model_Close })}
4145
superState={superState}
46+
dispatcher={dispatcher}
4247
/>
48+
<Logs superState={superState} dispatcher={dispatcher} />
49+
<MarkDown superState={superState} dispatcher={dispatcher} />
4350
<FileDragDrop dispatcher={dispatcher} />
4451
<Header superState={superState} dispatcher={dispatcher} />
4552
<section className="body" style={{ display: 'flex', overflow: 'hidden' }}>

src/component/Logs.jsx

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
import React, { useState, useEffect } from 'react';
2+
import './logs.css';
3+
import { actionType as T } from '../reducer';
4+
5+
const Logs = ({ superState, dispatcher }) => {
6+
const [output, setOutput] = useState('');
7+
8+
const clearTerminal = () => {
9+
setOutput('');
10+
dispatcher({ type: T.SET_LOGS_MESSAGE, payload: '' });
11+
};
12+
13+
const closeTerminal = () => {
14+
dispatcher({ type: T.SET_LOGS, payload: false });
15+
};
16+
17+
useEffect(() => {
18+
if (superState.logs) {
19+
document.getElementById('terminal').style.display = 'block';
20+
setOutput(superState.logsmessage);
21+
} else {
22+
document.getElementById('terminal').style.display = 'none';
23+
setOutput(superState.logsmessage);
24+
}
25+
}, [superState.logs]);
26+
27+
return (
28+
<>
29+
<div className="terminal" id="terminal">
30+
<div className="terminal-header">
31+
Logs
32+
<button type="button" className="clear" onClick={clearTerminal}>Clear</button>
33+
<button type="button" className="closelogs" onClick={closeTerminal}>X</button>
34+
</div>
35+
<div className="terminal-body">
36+
{output.split('\n').map((line) => (
37+
<div className="terminal-line">
38+
{line}
39+
</div>
40+
))}
41+
</div>
42+
</div>
43+
</>
44+
);
45+
};
46+
47+
export default Logs;

src/component/TabBar.jsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ const TabBar = ({ superState, dispatcher }) => {
1818
dispatcher({ type: T.REMOVE_GRAPH, payload: i });
1919
if (!superState.curGraphIndex && superState.graphs.length === 1) {
2020
dispatcher({ type: T.SET_CUR_INSTANCE, payload: null });
21+
dispatcher({ type: T.SET_CUR_INDEX, payload: -1 });
2122
}
2223
};
2324
const editCur = (e) => {

src/component/fileBrowser.jsx

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,10 @@ const LocalFileBrowser = ({ superState, dispatcher }) => {
3030
window.localStorage.setItem('fileList', JSON.stringify(fileState));
3131
}, [fileState]);
3232

33+
useEffect(() => {
34+
setFileState(superState.fileState);
35+
}, [superState.fileState]);
36+
3337
const handleSelectFile = (data) => {
3438
const fileExtensions = ['jpeg', 'jpg', 'png', 'exe'];
3539
if (fileExtensions.includes(data.fileObj.name.split('.').pop())) {
@@ -67,7 +71,7 @@ const LocalFileBrowser = ({ superState, dispatcher }) => {
6771
modified: fileData.lastModified,
6872
size: fileData.size,
6973
fileObj: fileData,
70-
fileHandle: value,
74+
fileHandle: valueSubDir,
7175
}]);
7276
} else if (valueSubDir.kind === 'directory') {
7377
topLevel = `${topKey}/${value.name}`;
@@ -100,6 +104,7 @@ const LocalFileBrowser = ({ superState, dispatcher }) => {
100104
setFileState([]);
101105
setFileState(state);
102106
dispatcher({ type: T.SET_DIR_NAME, payload: state[0].key.split('/')[0] });
107+
dispatcher({ type: T.SET_FILE_STATE, payload: state });
103108
};
104109

105110
const newFeatureFile = async () => {

src/component/logs.css

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
.terminal {
2+
display: none;
3+
position: absolute;
4+
top: 10%;
5+
left: 50%;
6+
right: auto;
7+
bottom: auto;
8+
margin-right: -50%;
9+
transform: translateX(-50%);
10+
width: 500px;
11+
height: 350px;
12+
border: 1px solid #ccc;
13+
background-color: #000;
14+
color: #fff;
15+
font-family: monospace;
16+
margin: 20px auto;
17+
z-index: 10000;
18+
}
19+
20+
.terminal-header {
21+
padding: 5px;
22+
background-color: #333;
23+
text-align: center;
24+
}
25+
26+
.clear {
27+
background-color: rgb(187, 184, 184);
28+
border-radius: 20px;
29+
position: absolute;
30+
right: 30px;
31+
}
32+
33+
.closelogs {
34+
background-color: rgba(249, 37, 37, 0.575);
35+
color: white;
36+
position: absolute;
37+
right: 1px;
38+
}
39+
40+
.terminal-body {
41+
padding: 10px;
42+
height: 300px;
43+
overflow-y: auto;
44+
}
45+
46+
.terminal-line {
47+
padding: 5px 0;
48+
}

src/component/modals/FileEdit.jsx

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,16 @@ const FileEditModal = ({ superState, dispatcher }) => {
4949
const stream = await handle.createWritable();
5050
await stream.write(codeStuff);
5151
await stream.close();
52+
const fileData = await handle.getFile();
53+
let fS = superState.fileState;
54+
fS = fS.concat([{
55+
key: `${superState.uploadedDirName}/${handle.name}`,
56+
modified: fileData.lastModified,
57+
size: fileData.size,
58+
fileObj: fileData,
59+
fileHandle: handle,
60+
}]);
61+
dispatcher({ type: T.SET_FILE_STATE, payload: fS });
5262
// dispatcher({ type: T.EDIT_TEXTFILE, payload: { show: false } });
5363
}
5464

@@ -105,7 +115,10 @@ const FileEditModal = ({ superState, dispatcher }) => {
105115
<button type="submit" className="btn btn-primary" onClick={submit}>Save</button>
106116
)}
107117
{dirButton && (
108-
<button type="submit" className="btn btn-primary" onClick={saveAsSubmit}>Save As</button>
118+
<button type="submit" className="btn btn-primary" onClick={saveAsSubmit}>
119+
Save
120+
{fileName ? ' As' : ''}
121+
</button>
109122
)}
110123
{!dirButton && (
111124
<button type="submit" className="btn btn-primary" onClick={saveSubmit}>Save As</button>

src/component/modals/GraphCompDetails.jsx

Lines changed: 132 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,20 @@
1+
import { toast } from 'react-toastify';
12
import React, { useState, useEffect } from 'react';
23
import './graph-comp-details.css';
34
import ParentModal from './ParentModal';
5+
import { readTextFile, createFile } from '../../toolbarActions/toolbarFunctions';
6+
import { actionType as T } from '../../reducer';
47

5-
const ModalComp = ({ closeModal, superState }) => {
8+
const ModalComp = ({ closeModal, superState, dispatcher }) => {
69
const [data, setData] = useState({});
710
const [errorMessage, setErrorMessage] = useState('');
11+
const [element, setElement] = useState(null);
12+
const [editSourceClicked, setEditSourceClicked] = useState(false);
13+
const [createSourceClicked, setCreateSourceClicked] = useState(false);
14+
const [createHelpClicked, setCreateHelpClicked] = useState(false);
815
const { modalPayload, ModelOpen } = superState;
916
const {
10-
cb, title, submitText, Children, defaultStyle, defaultLabel, labelAllowed,
17+
cb, title, submitText, Children, defaultStyle, defaultLabel, labelAllowed, type,
1118
} = modalPayload;
1219

1320
useEffect(() => {
@@ -29,15 +36,137 @@ const ModalComp = ({ closeModal, superState }) => {
2936
} else setErrorMessage(message.err);
3037
};
3138

39+
useEffect(() => {
40+
if (createSourceClicked) {
41+
createFile(superState, dispatcher);
42+
}
43+
if (editSourceClicked && element === null) {
44+
toast.error('Respective file is not present in same directory');
45+
} else if (element !== null) {
46+
readTextFile(superState, dispatcher, element.fileObj, element.fileHandle);
47+
}
48+
setEditSourceClicked(false);
49+
setCreateSourceClicked(false);
50+
}, [createSourceClicked, editSourceClicked]);
51+
52+
useEffect(() => {
53+
if (createHelpClicked) {
54+
createFile(superState, dispatcher);
55+
}
56+
setCreateHelpClicked(false);
57+
}, [createHelpClicked]);
58+
59+
const openFile = () => {
60+
setElement(null);
61+
if (superState.fileState !== undefined && data.label !== '') {
62+
const fname = data.label.split(':')[1];
63+
superState.fileState.forEach((ele) => {
64+
if (ele.key.split('/')[1] === fname || ele.key.split('/')[2] === fname) {
65+
setElement(ele);
66+
}
67+
});
68+
}
69+
if (submitText === 'Edit Node') {
70+
setEditSourceClicked(true);
71+
} else if (submitText === 'Create Node') {
72+
setCreateSourceClicked(true);
73+
}
74+
};
75+
76+
const openDoc = () => {
77+
setElement(null);
78+
if (superState.fileState !== undefined && data.label !== '') {
79+
const docname1 = data.label.split(':')[1].split('.')[0].concat('.md');
80+
const docname2 = data.label.split(':')[1].split('.')[0].concat('.txt');
81+
superState.fileState.forEach((ele) => {
82+
if (ele.key.split('/')[1] === docname1 || ele.key.split('/')[1] === docname2) {
83+
setElement(ele);
84+
}
85+
});
86+
}
87+
setCreateHelpClicked(true);
88+
};
89+
90+
const openMarkDownDoc = async () => {
91+
dispatcher({ type: T.SET_MARKDOWN_MODAL, payload: true });
92+
setElement(null);
93+
if (superState.fileState !== undefined && data.label !== '') {
94+
const docname1 = data.label.split(':')[1].split('.')[0].concat('.md');
95+
const matchingElement = superState.fileState.find((ele) => ele.key.split('/')[1] === docname1);
96+
if (matchingElement) {
97+
const fr = new FileReader();
98+
fr.onload = (x) => {
99+
// eslint-disable-next-line max-len
100+
dispatcher({ type: T.SET_INPUT_FILE, payload: { content: x.target.result, fname: matchingElement.key.split('/')[1] } });
101+
};
102+
if (matchingElement.fileHandle) {
103+
fr.readAsText(await matchingElement.fileHandle.getFile());
104+
} else if (matchingElement.fileObj) {
105+
fr.readAsText(matchingElement.fileObj);
106+
}
107+
setElement(matchingElement);
108+
}
109+
}
110+
};
111+
112+
const createLibrary = () => {
113+
const fileName = data.label.split(':')[1];
114+
if (fileName === undefined || fileName === '') {
115+
toast.error('Enter File Name');
116+
return;
117+
}
118+
superState.curGraphInstance.library(fileName);
119+
};
120+
32121
return (
33122
<ParentModal closeModal={closeModal} ModelOpen={ModelOpen} title={title}>
34123
<form onSubmit={submit}>
35124
<div className="modal-content-body">
36-
<Children data={data} setData={setData} labelAllowed={labelAllowed} />
125+
<Children data={data} setData={setData} labelAllowed={labelAllowed} state={superState} />
37126
{errorMessage ? <div className="err">{errorMessage}</div> : <></>}
38127
</div>
39128
<div className="modal-footer">
40129
<button type="submit" className="btn btn-primary">{submitText}</button>
130+
{ type === 'Node' ? (
131+
<>
132+
<button
133+
className="btn btn-primary"
134+
type="button"
135+
onClick={openFile}
136+
>
137+
{ submitText === 'Edit Node' ? 'Edit Source' : 'Create Source' }
138+
</button>
139+
{ title === 'Edit Node'
140+
? (
141+
<button
142+
className="btn btn-primary"
143+
type="button"
144+
onClick={openMarkDownDoc}
145+
>
146+
Help
147+
</button>
148+
) : (
149+
<button
150+
className="btn btn-primary"
151+
type="button"
152+
onClick={openDoc}
153+
>
154+
Create Help
155+
</button>
156+
)}
157+
{ title === 'Edit Node'
158+
? ''
159+
: (
160+
<button
161+
className="btn btn-primary"
162+
type="button"
163+
onClick={createLibrary}
164+
>
165+
Create Library
166+
</button>
167+
)}
168+
</>
169+
) : '' }
41170
</div>
42171
</form>
43172
</ParentModal>

0 commit comments

Comments
 (0)