diff --git a/webapp/package-lock.json b/webapp/package-lock.json
index 1dc71e5..f99464c 100644
--- a/webapp/package-lock.json
+++ b/webapp/package-lock.json
@@ -8,7 +8,9 @@
"name": "a_main_gdbui",
"version": "0.0.0",
"dependencies": {
+ "@monaco-editor/react": "^4.6.0",
"axios": "^1.7.2",
+ "monaco-themes": "^0.4.4",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-icons": "^5.2.1",
@@ -2843,6 +2845,30 @@
"@jridgewell/sourcemap-codec": "^1.4.14"
}
},
+ "node_modules/@monaco-editor/loader": {
+ "version": "1.4.0",
+ "resolved": "https://registry.npmjs.org/@monaco-editor/loader/-/loader-1.4.0.tgz",
+ "integrity": "sha512-00ioBig0x642hytVspPl7DbQyaSWRaolYie/UFNjoTdvoKPzo6xrXLhTk9ixgIKcLH5b5vDOjVNiGyY+uDCUlg==",
+ "dependencies": {
+ "state-local": "^1.0.6"
+ },
+ "peerDependencies": {
+ "monaco-editor": ">= 0.21.0 < 1"
+ }
+ },
+ "node_modules/@monaco-editor/react": {
+ "version": "4.6.0",
+ "resolved": "https://registry.npmjs.org/@monaco-editor/react/-/react-4.6.0.tgz",
+ "integrity": "sha512-RFkU9/i7cN2bsq/iTkurMWOEErmYcY6JiQI3Jn+WeR/FGISH8JbHERjpS9oRuSOPvDMJI0Z8nJeKkbOs9sBYQw==",
+ "dependencies": {
+ "@monaco-editor/loader": "^1.4.0"
+ },
+ "peerDependencies": {
+ "monaco-editor": ">= 0.25.0 < 1",
+ "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
+ "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
+ }
+ },
"node_modules/@nodelib/fs.scandir": {
"version": "2.1.5",
"resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -8286,6 +8312,11 @@
"integrity": "sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==",
"dev": true
},
+ "node_modules/fast-plist": {
+ "version": "0.1.3",
+ "resolved": "https://registry.npmjs.org/fast-plist/-/fast-plist-0.1.3.tgz",
+ "integrity": "sha512-d9cEfo/WcOezgPLAC/8t8wGb6YOD6JTCPMw2QcG2nAdFmyY+9rTUizCTaGjIZAloWENTEUMAPpkUAIJJJ0i96A=="
+ },
"node_modules/fast-xml-parser": {
"version": "4.4.0",
"resolved": "https://registry.npmjs.org/fast-xml-parser/-/fast-xml-parser-4.4.0.tgz",
@@ -11472,6 +11503,20 @@
"ufo": "^1.5.3"
}
},
+ "node_modules/monaco-editor": {
+ "version": "0.50.0",
+ "resolved": "https://registry.npmjs.org/monaco-editor/-/monaco-editor-0.50.0.tgz",
+ "integrity": "sha512-8CclLCmrRRh+sul7C08BmPBP3P8wVWfBHomsTcndxg5NRCEPfu/mc2AGU8k37ajjDVXcXFc12ORAMUkmk+lkFA==",
+ "peer": true
+ },
+ "node_modules/monaco-themes": {
+ "version": "0.4.4",
+ "resolved": "https://registry.npmjs.org/monaco-themes/-/monaco-themes-0.4.4.tgz",
+ "integrity": "sha512-Hbb9pvRrpSi0rZezcB/IOdQnpx10o55Lx4zFdRAAVpFMa1HP7FgaqEZdKffb4ovd90fETCixeFO9JPYFMAq+TQ==",
+ "dependencies": {
+ "fast-plist": "^0.1.3"
+ }
+ },
"node_modules/mrmime": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/mrmime/-/mrmime-2.0.0.tgz",
@@ -13723,6 +13768,11 @@
"node": ">=8"
}
},
+ "node_modules/state-local": {
+ "version": "1.0.7",
+ "resolved": "https://registry.npmjs.org/state-local/-/state-local-1.0.7.tgz",
+ "integrity": "sha512-HTEHMNieakEnoe33shBYcZ7NX83ACUjCu8c40iOGEZsngj9zRnkqS9j1pqQPXwobB0ZcVTk27REb7COQ0UR59w=="
+ },
"node_modules/statuses": {
"version": "1.5.0",
"resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz",
@@ -17038,6 +17088,22 @@
"@jridgewell/sourcemap-codec": "^1.4.14"
}
},
+ "@monaco-editor/loader": {
+ "version": "1.4.0",
+ "resolved": "https://registry.npmjs.org/@monaco-editor/loader/-/loader-1.4.0.tgz",
+ "integrity": "sha512-00ioBig0x642hytVspPl7DbQyaSWRaolYie/UFNjoTdvoKPzo6xrXLhTk9ixgIKcLH5b5vDOjVNiGyY+uDCUlg==",
+ "requires": {
+ "state-local": "^1.0.6"
+ }
+ },
+ "@monaco-editor/react": {
+ "version": "4.6.0",
+ "resolved": "https://registry.npmjs.org/@monaco-editor/react/-/react-4.6.0.tgz",
+ "integrity": "sha512-RFkU9/i7cN2bsq/iTkurMWOEErmYcY6JiQI3Jn+WeR/FGISH8JbHERjpS9oRuSOPvDMJI0Z8nJeKkbOs9sBYQw==",
+ "requires": {
+ "@monaco-editor/loader": "^1.4.0"
+ }
+ },
"@nodelib/fs.scandir": {
"version": "2.1.5",
"resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -21052,6 +21118,11 @@
"integrity": "sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==",
"dev": true
},
+ "fast-plist": {
+ "version": "0.1.3",
+ "resolved": "https://registry.npmjs.org/fast-plist/-/fast-plist-0.1.3.tgz",
+ "integrity": "sha512-d9cEfo/WcOezgPLAC/8t8wGb6YOD6JTCPMw2QcG2nAdFmyY+9rTUizCTaGjIZAloWENTEUMAPpkUAIJJJ0i96A=="
+ },
"fast-xml-parser": {
"version": "4.4.0",
"resolved": "https://registry.npmjs.org/fast-xml-parser/-/fast-xml-parser-4.4.0.tgz",
@@ -23434,6 +23505,20 @@
"ufo": "^1.5.3"
}
},
+ "monaco-editor": {
+ "version": "0.50.0",
+ "resolved": "https://registry.npmjs.org/monaco-editor/-/monaco-editor-0.50.0.tgz",
+ "integrity": "sha512-8CclLCmrRRh+sul7C08BmPBP3P8wVWfBHomsTcndxg5NRCEPfu/mc2AGU8k37ajjDVXcXFc12ORAMUkmk+lkFA==",
+ "peer": true
+ },
+ "monaco-themes": {
+ "version": "0.4.4",
+ "resolved": "https://registry.npmjs.org/monaco-themes/-/monaco-themes-0.4.4.tgz",
+ "integrity": "sha512-Hbb9pvRrpSi0rZezcB/IOdQnpx10o55Lx4zFdRAAVpFMa1HP7FgaqEZdKffb4ovd90fETCixeFO9JPYFMAq+TQ==",
+ "requires": {
+ "fast-plist": "^0.1.3"
+ }
+ },
"mrmime": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/mrmime/-/mrmime-2.0.0.tgz",
@@ -25101,6 +25186,11 @@
}
}
},
+ "state-local": {
+ "version": "1.0.7",
+ "resolved": "https://registry.npmjs.org/state-local/-/state-local-1.0.7.tgz",
+ "integrity": "sha512-HTEHMNieakEnoe33shBYcZ7NX83ACUjCu8c40iOGEZsngj9zRnkqS9j1pqQPXwobB0ZcVTk27REb7COQ0UR59w=="
+ },
"statuses": {
"version": "1.5.0",
"resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz",
diff --git a/webapp/package.json b/webapp/package.json
index b9b5dd6..1839b38 100644
--- a/webapp/package.json
+++ b/webapp/package.json
@@ -13,7 +13,9 @@
"coverage": "vitest run --coverage"
},
"dependencies": {
+ "@monaco-editor/react": "^4.6.0",
"axios": "^1.7.2",
+ "monaco-themes": "^0.4.4",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-icons": "^5.2.1",
diff --git a/webapp/src/App.jsx b/webapp/src/App.jsx
index 2177c0f..4145449 100644
--- a/webapp/src/App.jsx
+++ b/webapp/src/App.jsx
@@ -8,10 +8,10 @@ import MemoryMap from "./components/GdbComponents/MemoryMap/MemoryMap";
import BreakPoints from "./components/GdbComponents/BreakPoints/BreakPoints";
import Footer from "./components/Footer/Footer";
import Header from "./components/Header/Header";
+import { DataState } from "./context/DataContext";
const App = () => {
- const [isDarkMode, setDarkMode] = useState("dark");
- const [dark, setDark] = useState(false);
+ const { setDark, dark, isDarkMode, setDarkMode } = DataState();
const toggleDarkMode = () => {
setDarkMode((isDarkMode) => (isDarkMode === "dark" ? "light" : "dark"));
diff --git a/webapp/src/components/MainScreen/MainScreen.jsx b/webapp/src/components/MainScreen/MainScreen.jsx
index 7efe08c..b06b112 100644
--- a/webapp/src/components/MainScreen/MainScreen.jsx
+++ b/webapp/src/components/MainScreen/MainScreen.jsx
@@ -1,11 +1,22 @@
import React from "react";
import "./MainScreen.css";
+import Editor from "@monaco-editor/react";
+import { DataState } from "../../context/DataContext";
const MainScreen = () => {
+ const { isDarkMode } = DataState();
return (
);
};
diff --git a/webapp/src/components/Terminal/TerminalComp.jsx b/webapp/src/components/Terminal/TerminalComp.jsx
index 7fa2b1f..6b1c745 100644
--- a/webapp/src/components/Terminal/TerminalComp.jsx
+++ b/webapp/src/components/Terminal/TerminalComp.jsx
@@ -1,22 +1,43 @@
-import React from "react";
+import React, { useState } from "react";
import { ReactTerminal } from "react-terminal";
-
+import axios from "axios";
import "./Terminal.css";
const TerminalComp = () => {
+ const [output, setOutput] = useState("");
+
+ const handleCommand = async (command) => {
+ try {
+ const { data } = await axios.post("http://127.0.0.1:10000/gdb_command", {
+ command: command,
+ name: "program",
+ });
+ return data["result"];
+ } catch (error) {
+ return "Error executing command";
+ }
+ };
+
return (
- TerminalComp
{
+ return await handleCommand(command);
+ },
+ }}
+ defaultHandler={async (command) => {
+ return await handleCommand(command);
+ }}
/>
);
diff --git a/webapp/src/context/DataContext.jsx b/webapp/src/context/DataContext.jsx
index ae79b43..fd4df8e 100644
--- a/webapp/src/context/DataContext.jsx
+++ b/webapp/src/context/DataContext.jsx
@@ -10,6 +10,8 @@ import axios from "axios";
export const DataContext = createContext();
export const DataProvider = ({ children }) => {
+ const [isDarkMode, setDarkMode] = useState("dark");
+ const [dark, setDark] = useState(false);
const [refresh, setRefresh] = useState(false);
const [stack, setStack] = useState([]);
const [functions, setFunctions] = useState([]);
@@ -44,6 +46,10 @@ export const DataProvider = ({ children }) => {
setInfoBreakpointData,
memoryMap,
setMemoryMap,
+ isDarkMode,
+ setDarkMode,
+ dark,
+ setDark,
}}
>
{children}
diff --git a/webapp/src/main.jsx b/webapp/src/main.jsx
index 446bd5f..76403de 100644
--- a/webapp/src/main.jsx
+++ b/webapp/src/main.jsx
@@ -3,15 +3,18 @@ import React from "react";
import ReactDOM from "react-dom";
import { BrowserRouter } from "react-router-dom";
import { DataProvider } from "./context/DataContext";
+import { TerminalContextProvider } from "react-terminal";
import App from "./App";
import "./index.css";
ReactDOM.render(
-
-
-
+
+
+
+
+
,
document.getElementById("root")
diff --git a/webapp/src/pages/Debug/Debug.jsx b/webapp/src/pages/Debug/Debug.jsx
index 43cf1b4..053fedd 100644
--- a/webapp/src/pages/Debug/Debug.jsx
+++ b/webapp/src/pages/Debug/Debug.jsx
@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useState, useEffect } from "react";
import "./Debug.css";
import Header from "../../components/Header/Header";
import DebugHeader from "../../components/DebugHeader/DebugHeader";