Implement MainContainer

src/App.tsx

@@ -3,13 +3,14 @@ import './App.scss';
 import Sidebar from './Components/Sidebar/Sidebar';
 import { IAvailableContainerModel } from './Interfaces/IAvailableContainerModel';
 import { IConfigurationResponseModel } from './Interfaces/IConfigurationResponseModel';
+import { SVG } from './SVG/SVG';
 
 interface IAppProps {
 }
 
 interface IAppState {
-  componentOptions: IAvailableContainerModel[]
-  isSidebarOpen: boolean
+  isSidebarOpen: boolean,
+  configuration: IConfigurationResponseModel
 }
 
 class App extends React.Component<IAppProps> {
@@ -19,7 +20,11 @@ class App extends React.Component<IAppProps> {
     super(props);
     this.state = {
       isSidebarOpen: true,
-      componentOptions: []
+      configuration: {
+        AvailableContainers: [],
+        AvailableSymbols: [],
+        MainContainer: {} as IAvailableContainerModel
+      }
     };
   }
 
@@ -27,7 +32,7 @@ class App extends React.Component<IAppProps> {
     fetchConfiguration().then((configuration: IConfigurationResponseModel) => {
       this.setState({
         isSidebarOpen: this.state.isSidebarOpen,
-        componentOptions: configuration.AvailableContainers
+        configuration
       });
     });
   }
@@ -35,15 +40,16 @@ class App extends React.Component<IAppProps> {
   public ToggleMenu() {
     this.setState({
       isSidebarOpen: !this.state.isSidebarOpen,
-      componentOptions: this.state.componentOptions
+      configuration: this.state.configuration
     });
   }
 
   render() {
     return (
       <div className="App font-sans h-full">
-        <Sidebar componentOptions={this.state.componentOptions} isOpen={this.state.isSidebarOpen} onClick={() => this.ToggleMenu()} />
+        <Sidebar componentOptions={this.state.configuration.AvailableContainers} isOpen={this.state.isSidebarOpen} onClick={() => this.ToggleMenu()} />
         <button className='fixed z-0 top-4 left-4 text-lg' onClick={() => this.ToggleMenu()}>&#9776; Menu</button>
+        <SVG MainContainer={this.state.configuration.MainContainer} />
       </div>
     );
   }