Merge the recent fixes since March 31st

package.json

@@ -19,6 +19,7 @@
     "hotkeys-js": "^3.8.7",
     "jquery": "^3.0.0",
     "konva": "^7.0.3",
+    "lucide-react": "^0.487.0",
     "md5": "^2.3.0",
     "moment": "^2.29.4",
     "prismjs": "^1.30.0",
@@ -31,7 +32,7 @@
     "react-keyed-file-browser": "^1.14.0",
     "react-markdown": "^8.0.7",
     "react-modal": "^3.16.3",
-    "react-scripts": "4.0.3",
+    "react-scripts": "5.0.1",
     "react-simple-code-editor": "^0.13.0",
     "react-spinners": "^0.13.8",
     "react-toastify": "^8.0.0",
@@ -49,7 +50,7 @@
     "workbox-routing": "^5.1.3",
     "workbox-strategies": "^5.1.3",
     "workbox-streams": "^5.1.3",
-    "xml2js": "^0.4.23",
+    "xml2js": "^0.5.0",
     "zealit": "^2.4.1"
   },
   "scripts": {

server/model/workflows.py

@@ -7,7 +7,8 @@
 import xml.etree.ElementTree as ET
 import random
 import string
-
+from dotenv import load_dotenv
+load_dotenv()
 
 class WorkFlowModel:
     def __init__(self) -> None:

server/requirements.txt

@@ -1,7 +1,7 @@
-dnspython==2.1.0
-Flask==2.0.1
+dnspython==2.6.1
+Flask==2.2.5
 python-dotenv==0.19.0
-pymongo==3.12.0
-gunicorn==20.0.4
-flask-cors==3.0.10
+pymongo==4.6.3
+gunicorn==23.0.0
+flask-cors==6.0.0
 defusedxml==0.7.1

src/GraphArea.jsx

@@ -27,6 +27,9 @@ function Graph({
         }
         if (graphML) myGraph.setGraphML(graphML);
         myGraph.setCurStatus();
+        myGraph.cy.on('zoom', () => {
+            dispatcher({ type: T.SET_ZOOM_LEVEL, payload: (myGraph.cy.zoom() * 100).toFixed(0) });
+        });
         return myGraph;
     };
     // Remote server implementation - Not being used.

src/GraphWorkspace.jsx

@@ -1,9 +1,9 @@
-import React, { useEffect } from 'react';
+import React from 'react';
 import ZoomComp from './component/ZoomSetter';
 
-import { actionType as T } from './reducer';
+// import { actionType as T } from './reducer';
 import './graphWorkspace.css';
-import localStorageManager from './graph-builder/local-storage-manager';
+// import localStorageManager from './graph-builder/local-storage-manager';
 import TabBar from './component/TabBar';
 import Graph from './GraphArea';
 
@@ -12,16 +12,17 @@ const GraphComp = (props) => {
     const { dispatcher, superState } = props;
     // const [loadedFromStorage, setLoadedFromStorage] = React.useState(false);
 
-    useEffect(() => {
-        const allSavedGs = localStorageManager.getAllGraphs().map((graphID) => ({
-            graphID,
-        }));
-        dispatcher({
-            type: T.ADD_GRAPH_BULK,
-            payload: allSavedGs,
-        });
-        // setLoadedFromStorage(true);
-    }, []);
+    // The functionality for loading graphs from previous sessions is currently on hold.
+    // useEffect(() => {
+    //     const allSavedGs = localStorageManager.getAllGraphs().map((graphID) => ({
+    //         graphID,
+    //     }));
+    //     dispatcher({
+    //         type: T.ADD_GRAPH_BULK,
+    //         payload: allSavedGs,
+    //     });
+    //     // setLoadedFromStorage(true);
+    // }, []);
 
     // Remote server implementation - Not being used.
     // useEffect(() => {

src/component/FullScreenButton.jsx

@@ -0,0 +1,22 @@
+import React, { useState } from 'react';
+import { Maximize, Minimize } from 'lucide-react';
+
+export default function FullScreenButton() {
+    const [isFullscreen, setIsFullscreen] = useState(false);
+
+    const toggleFullscreen = () => {
+        if (!document.fullscreenElement) {
+            document.documentElement.requestFullscreen();
+            setIsFullscreen(true);
+        } else {
+            document.exitFullscreen();
+            setIsFullscreen(false);
+        }
+    };
+
+    return (
+        <button type="button" onClick={toggleFullscreen}>
+            {isFullscreen ? <Minimize size={20} /> : <Maximize size={20} />}
+        </button>
+    );
+}

src/component/Header.jsx

@@ -8,6 +8,7 @@ import {
     ActionButton, Vsep, Hsep, Space, TextBox, Switcher, DropDown, FileUploader,
 } from './HeaderComps';
 import 'rc-switch/assets/index.css';
+import FullScreenButton from './FullScreenButton';
 // import ServerActions from './serverActions/ServerActions';
 
 const setHotKeys = (actions) => {
@@ -38,13 +39,15 @@ const Header = ({ superState, dispatcher }) => {
 
     return (
         <header className="header">
-            <section className="middle titlebar">
-                {
-                    superState.curGraphInstance ? `${
-                        superState.curGraphInstance.projectName
-                    } - concore Editor` : 'untitled'
-                }
-            </section>
+            <div style={{ display: 'flex' }}>
+                <section className="middle titlebar">
+                    {
+                        superState.curGraphInstance ? `${superState.curGraphInstance.projectName
+                        } - concore Editor` : 'untitled'
+                    }
+                </section>
+                <FullScreenButton />
+            </div>
             <section className="toolbar">
                 {
                     actions.map(({
@@ -67,7 +70,7 @@ const Header = ({ superState, dispatcher }) => {
                         case 'menu': return <DropDown {...props} />;
                         case 'file-upload': return <FileUploader {...props} superState={superState} />;
                         case 'action': return <ActionButton {...props} />;
-                        // case 'serverActions': return <ServerActions superState={superState} />;
+                            // case 'serverActions': return <ServerActions superState={superState} />;
                         default: return <></>;
                         }
                     })