ADD: added function for the dynamic creation of entities

webapp/src/App.jsx

@@ -0,0 +1,93 @@
+// App.js
+import React, { Component } from "react";
+import "./App.css";
+import { connect, sendMsg } from "./components/api/index";
+import Header from './components/Header';
+import Controls from "./components/control/controls";
+// import ChatHistory from "./components/ChatHistory/ChatHistory.jsx";
+
+import OpenSeaMap from "./components/OpenSeaMap/OpenSeaMap";
+
+
+
+class App extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      Entities: [
+            // { id: 1, name: "Apple", position: [51.505, -0.10],Type: "Friend" },
+            // { id: 2, name: "Oranges", position: [51.505, -0.11],Type: "Hostile"},
+            // { id: 3, name: "Grapes", position: [51.505, -0.12],Type: "Friend"}
+          ],
+    
+        
+    }
+  }
+  componentDidMount() {
+    
+
+
+
+      connect((msg) => {
+          console.log("New Message")
+          console.log(msg.data)
+          var jsonMSG;
+          try {
+            jsonMSG = JSON.parse(msg.data);
+          } catch (error) {
+            console.log(error);
+          }
+          if(jsonMSG["Type"] == "COP"){
+            var Entities =  Array.from(jsonMSG["Entities"])
+            if(Array.isArray(Entities))
+            {
+              this.setState({
+                Entities:Entities
+              });
+            }
+          }
+          // this.state.Entities = jsonMSG
+        	// var jsonmsg = JSON.parse(msg);
+      this.setState(prevState => ({
+        // chatHistory: [...this.state.History, msg]
+        // chatHistory: [...this.state.History, msg]
+         
+      }))
+  
+      console.log(this.state.Entities);
+    });
+    
+
+  }
+  // send() {
+    //   console.log("hello");
+    //   // sendMsg("hello world");
+    // }
+
+    handleCallback = (ChildData) => {
+      this.setState({name: ChildData})
+      console.log(ChildData);
+    }
+    
+    render() {
+    const {name} = this.state;
+    return (
+      <div className="App">
+        <Header />
+        <Controls />
+        {/* <ChatHistory History={this.state.History} /> */}
+        <div>
+        {name}
+
+        </div>
+        <OpenSeaMap Entities= {this.state.Entities} parentCallback = {this.handleCallback}/>
+        
+
+        <button onClick={this.send}>Hit</button>
+      
+      </div>
+    );
+  }
+}
+
+export default App;